support survey choices in array format

awx/ui/src/screens/Template/Survey/SurveyQuestionAdd.js

@@ -19,17 +19,17 @@ export default function SurveyQuestionAdd({ survey, updateSurvey }) {
         );
         return;
       }
-      let choices = '';
-      let defaultAnswers = '';
       if (
         formData.type === 'multiselect' ||
         formData.type === 'multiplechoice'
       ) {
+        const choices = [];
+        let defaultAnswers = '';
         formData.formattedChoices.forEach(({ choice, isDefault }, i) => {
-          choices =
-            i === formData.formattedChoices.length - 1
-              ? choices.concat(`${choice}`)
-              : choices.concat(`${choice}\n`);
+          choices.push(choice);
+          // i === formData.formattedChoices.length - 1
+          //   ? choices.concat(`${choice}`)
+          //   : choices.concat(`${choice}\n`);
           if (isDefault) {
             defaultAnswers =
               i === formData.formattedChoices.length - 1
@@ -38,7 +38,7 @@ export default function SurveyQuestionAdd({ survey, updateSurvey }) {
           }
         });
         formData.default = defaultAnswers.trim();
-        formData.choices = choices.trim();
+        formData.choices = choices;
       }
       delete formData.formattedChoices;
       const newSpec = survey?.spec ? survey.spec.concat(formData) : [formData];

awx/ui/src/screens/Template/Survey/SurveyQuestionEdit.js

@@ -58,17 +58,14 @@ export default function SurveyQuestionEdit({ survey, updateSurvey }) {
       if (questionIndex === -1) {
         throw new Error('Question not found in spec');
       }
-      let choices = '';
-      let defaultAnswers = '';
       if (
         submittedData.type === 'multiselect' ||
         submittedData.type === 'multiplechoice'
       ) {
+        const choices = [];
+        let defaultAnswers = '';
         submittedData.formattedChoices.forEach(({ choice, isDefault }, i) => {
-          choices =
-            i === submittedData.formattedChoices.length - 1
-              ? choices.concat(`${choice}`)
-              : choices.concat(`${choice}\n`);
+          choices.push(choice);
           if (isDefault) {
             defaultAnswers =
               i === submittedData.formattedChoices.length - 1
@@ -77,8 +74,9 @@ export default function SurveyQuestionEdit({ survey, updateSurvey }) {
           }
         });
         submittedData.default = defaultAnswers.trim();
-        submittedData.choices = choices.trim();
+        submittedData.choices = choices;
       }
+      delete submittedData.formattedChoices;
 
       await updateSurvey([
         ...survey.spec.slice(0, questionIndex),

awx/ui/src/screens/Template/Survey/SurveyQuestionForm.js

@@ -120,8 +120,14 @@ function SurveyQuestionForm({
     new_question: !question,
   };
   if (question?.type === 'multiselect' || question?.type === 'multiplechoice') {
-    const newQuestions = question.choices.split('\n').map((c, i) => {
-      if (question.default.split('\n').includes(c)) {
+    const choices = Array.isArray(question.choices)
+      ? question.choices
+      : question.choices.split('\n');
+    const defaults = Array.isArray(question.default)
+      ? question.default
+      : question.default.split('\n');
+    const formattedChoices = choices.map((c, i) => {
+      if (defaults.includes(c)) {
         return { choice: c, isDefault: true, id: i };
       }
 
@@ -136,7 +142,7 @@ function SurveyQuestionForm({
       variable: question?.variable || '',
       min: question?.min || 0,
       max: question?.max || 1024,
-      formattedChoices: newQuestions,
+      formattedChoices,
       new_question: !question,
     };
   }

awx/ui/src/screens/Template/Survey/SurveyReorderModal.js

@@ -115,6 +115,9 @@ function SurveyReorderModal({
 
   const defaultAnswer = (q) => {
     let component = null;
+    const choices = Array.isArray(q.choices)
+      ? q.choices
+      : q.choices.split('\n');
     switch (q.type) {
       case 'password':
         component = (
@@ -162,10 +165,10 @@ function SurveyReorderModal({
             ouiaId={`survey-preview-multiSelect-${q.variable}`}
             noResultsFoundText={t`No results found`}
           >
-            {q.choices.length > 0 &&
-              q.choices
-                .split('\n')
-                .map((option) => <SelectOption key={option} value={option} />)}
+            {choices.length > 0 &&
+              choices.map((option) => (
+                <SelectOption key={option} value={option} />
+              ))}
           </Select>
         );
         break;