From 16ebe334884e76c407f86ea77bfd2d2263ad611f Mon Sep 17 00:00:00 2001
From: Jin Yi <jin12cc@gmail.com>
Date: Thu, 18 Sep 2025 13:14:20 +0900
Subject: [PATCH] fix: Add validation and consistent data structure for survey
 'Other' options (#5620)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary
- Added validation to prevent users from proceeding when "Other" is
selected but text input is empty
- Changed data structure to send consistent string values to database
instead of mixed objects
- Both useCase and industry now send user input directly when "Other" is
selected

## Changes
- Added `useCaseOther` field and input to survey form
- Updated `validStep2` to validate useCaseOther when useCase is 'other'
- Modified submit payload to send string values consistently for both
useCase and industry fields

## Test plan
- [x] Select "Other" for use case without filling input → Next button
disabled
- [x] Select "Other" for industry without filling input → Next button
disabled
- [x] Fill in "Other" text inputs → Next button enabled
- [x] Submit survey with "Other" selections → Payload sends user input
as string values

🤖 Generated with [Claude Code](https://claude.ai/code)

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5620-fix-Add-validation-and-consistent-data-structure-for-survey-Other-options-2716d73d3650811faa6efc547db14930)
by [Unito](https://www.unito.io)
---
 .../onboarding/cloud/CloudSurveyView.vue      | 28 +++++++++++++++----
 1 file changed, 23 insertions(+), 5 deletions(-)

diff --git a/src/platform/onboarding/cloud/CloudSurveyView.vue b/src/platform/onboarding/cloud/CloudSurveyView.vue
index 1ed601171..a87c285b3 100644
--- a/src/platform/onboarding/cloud/CloudSurveyView.vue
+++ b/src/platform/onboarding/cloud/CloudSurveyView.vue
@@ -80,6 +80,13 @@
                 >
               </div>
             </div>
+            <div v-if="surveyData.useCase === 'other'" class="mt-4 ml-8">
+              <InputText
+                v-model="surveyData.useCaseOther"
+                class="w-full"
+                placeholder="Please specify"
+              />
+            </div>
           </div>
 
           <div class="flex gap-6 pt-4">
@@ -243,6 +250,7 @@ const isSubmitting = ref(false)
 const surveyData = ref({
   familiarity: '',
   useCase: '',
+  useCaseOther: '',
   industry: '',
   industryOther: '',
   making: [] as string[]
@@ -265,7 +273,8 @@ const purposeOptions = [
   },
   { label: 'Client work (freelance)', value: 'client' },
   { label: 'My own workplace (in-house)', value: 'inhouse' },
-  { label: 'Academic research', value: 'research' }
+  { label: 'Academic research', value: 'research' },
+  { label: 'Other', value: 'other' }
 ]
 
 const industryOptions = [
@@ -290,7 +299,13 @@ const makingOptions = [
 
 // Validation per step
 const validStep1 = computed(() => !!surveyData.value.familiarity)
-const validStep2 = computed(() => !!surveyData.value.useCase)
+const validStep2 = computed(() => {
+  if (!surveyData.value.useCase) return false
+  if (surveyData.value.useCase === 'other') {
+    return !!surveyData.value.useCaseOther?.trim()
+  }
+  return true
+})
 const validStep3 = computed(() => {
   if (!surveyData.value.industry) return false
   if (surveyData.value.industry === 'other') {
@@ -314,13 +329,16 @@ const goTo = (step: number, activate: (val: string | number) => void) => {
 const onSubmitSurvey = async () => {
   try {
     isSubmitting.value = true
-    // prepare payload: collapse "other" field
+    // prepare payload with consistent structure
     const payload = {
       familiarity: surveyData.value.familiarity,
-      useCase: surveyData.value.useCase,
+      useCase:
+        surveyData.value.useCase === 'other'
+          ? surveyData.value.useCaseOther?.trim() || 'other'
+          : surveyData.value.useCase,
       industry:
         surveyData.value.industry === 'other'
-          ? { type: 'other', text: surveyData.value.industryOther }
+          ? surveyData.value.industryOther?.trim() || 'other'
           : surveyData.value.industry,
       making: surveyData.value.making
     }