Finalized the destination country dropdown feature in step 2, sub-step 7 of the supporting document

src/screens/regularPassport/steps/Step2SupportingDocs/Step2SupportingDocsSubStep7.tsx

@@ -6,8 +6,8 @@ import styles from '../styles';
 import TextInputComponent from '../../../../components/TextInput';
 import RadioButtonOptionComponent from '../../../../components/RadioButtonOption';
 import destinationCountryOptions from '../../../../data/Options/DestinationCountryOptions';
-import destinationCountryData from '../../../../data/DropdownData/DestinationCountryData';
 import Colors from '../../../../../assets/styles/Colors';
+import countryData from '../../../../data/DropdownData/CountryData';
 
 type Step2SupportingDocsSubStep7Props = {
   setSubStep: (step: number) => void;
@@ -39,8 +39,8 @@ const Step2SupportingDocsSubStep7 = ({
           <TextInputComponent
             title="Negara mana yang akan Anda tuju?"
             placeholder="Masukkan negara tujuan"
-            isDropdown
-            dropdownItemData={destinationCountryData}
+            isDropdownCountry
+            dropdownCountryItemData={countryData}
           />
           {destinationCountryOptions.map(option => (
             <RadioButtonOptionComponent

src/screens/regularPassport/steps/Step4DataConfirmation/Step4DataConfirmationSubStep2.tsx

@@ -1,10 +1,12 @@
 import React from 'react';
-import { ScrollView, View, Text, Pressable } from 'react-native';
+import {ScrollView, View, Text, Pressable} from 'react-native';
 import Icon from 'react-native-vector-icons/MaterialIcons';
 import styles from '../styles';
 import TextInputComponent from '../../../../components/TextInput';
-import { Button } from 'react-native-paper';
+import {Button} from 'react-native-paper';
 import Colors from '../../../../../assets/styles/Colors';
+import jobData from '../../../../data/DropdownData/JobData';
+import nationalityData from '../../../../data/DropdownData/NationalityData';
 
 const Step4DataConfirmationSubStep2 = ({
   setStep,
@@ -21,32 +23,65 @@ const Step4DataConfirmationSubStep2 = ({
             setStep(4);
             setSubStep(1);
           }}
-          style={({ pressed }) => [
+          style={({pressed}) => [
             styles.subStepButtonBackWrapper,
             {
-              transform: [{ scale: pressed ? 0.99 : 1 }],
+              transform: [{scale: pressed ? 0.99 : 1}],
               marginBottom: 8,
             },
-          ]}
-        >
+          ]}>
           <Icon name="chevron-left" size={24} />
           <Text style={styles.subStepButtonBackText}>Kembali</Text>
         </Pressable>
         <Text style={styles.subStepDesc}>
-          Data di bawah ini harus sesuai dengan keterangan pada KTP pemohon. Data yang bertanda (
-          <Text style={{ color: Colors.indicatorRed.color }}>*</Text>) wajib diisi.
+          Data di bawah ini harus sesuai dengan keterangan pada KTP pemohon.
+          Data yang bertanda (
+          <Text style={{color: Colors.indicatorRed.color}}>*</Text>) wajib
+          diisi.
         </Text>
 
-        <View style={[styles.subStepQuestionnaireOptionContainer, { marginBottom: 0 }]}>
-          <Text style={styles.questionnaireDataSecondary}>Keterangan Pemohon</Text>
-          <TextInputComponent title="Pekerjaan" placeholder="Pilih pekerjaan" isRequired isDropdown />
-          <TextInputComponent title="Nomor Telepon" placeholder="Contoh: 08513456789" isRequired />
+        <View
+          style={[
+            styles.subStepQuestionnaireOptionContainer,
+            {marginBottom: 0},
+          ]}>
+          <Text style={styles.questionnaireDataSecondary}>
+            Keterangan Pemohon
+          </Text>
+          <TextInputComponent
+            title="Pekerjaan"
+            placeholder="Pilih pekerjaan"
+            isRequired
+            isDropdown
+            dropdownItemData={jobData}
+          />
+          <TextInputComponent
+            title="Nomor Telepon"
+            placeholder="Contoh: 08513456789"
+            isRequired
+          />
         </View>
 
-        <View style={[styles.subStepQuestionnaireOptionContainer, { marginBottom: 0 }]}>
-          <Text style={styles.questionnaireDataSecondary}>Keterangan Ibu Pemohon</Text>
-          <TextInputComponent title="Nama Ibu" placeholder="Masukkan nama lengkap ibu" isRequired />
-          <TextInputComponent title="Kewarganegaraan Ibu" placeholder="Pilih kewarganegaraan ibu" isRequired isDropdown />
+        <View
+          style={[
+            styles.subStepQuestionnaireOptionContainer,
+            {marginBottom: 0},
+          ]}>
+          <Text style={styles.questionnaireDataSecondary}>
+            Keterangan Ibu Pemohon
+          </Text>
+          <TextInputComponent
+            title="Nama Ibu"
+            placeholder="Masukkan nama lengkap ibu"
+            isRequired
+          />
+          <TextInputComponent
+            title="Kewarganegaraan Ibu"
+            placeholder="Pilih kewarganegaraan ibu"
+            isRequired
+            isDropdown
+            dropdownItemData={nationalityData}
+          />
           <TextInputComponent
             title="Alamat Ibu"
             placeholder="Masukkan alamat ibu"
@@ -57,10 +92,24 @@ const Step4DataConfirmationSubStep2 = ({
           />
         </View>
 
-        <View style={[styles.subStepQuestionnaireOptionContainer, { marginBottom: 0 }]}>
-          <Text style={styles.questionnaireDataSecondary}>Keterangan Ayah Pemohon (Opsional)</Text>
-          <TextInputComponent title="Nama Ayah" placeholder="Masukkan nama lengkap ayah" />
-          <TextInputComponent title="Kewarganegaraan Ayah" placeholder="Pilih kewarganegaraan ayah" isDropdown />
+        <View
+          style={[
+            styles.subStepQuestionnaireOptionContainer,
+            {marginBottom: 0},
+          ]}>
+          <Text style={styles.questionnaireDataSecondary}>
+            Keterangan Ayah Pemohon (Opsional)
+          </Text>
+          <TextInputComponent
+            title="Nama Ayah"
+            placeholder="Masukkan nama lengkap ayah"
+          />
+          <TextInputComponent
+            title="Kewarganegaraan Ayah"
+            placeholder="Pilih kewarganegaraan ayah"
+            isDropdown
+            dropdownItemData={nationalityData}
+          />
           <TextInputComponent
             title="Alamat Ayah"
             placeholder="Masukkan alamat ayah"
@@ -70,10 +119,24 @@ const Step4DataConfirmationSubStep2 = ({
           />
         </View>
 
-        <View style={[styles.subStepQuestionnaireOptionContainer, { marginBottom: 32 }]}>
-          <Text style={styles.questionnaireDataSecondary}>Keterangan Pasangan Pemohon (Opsional)</Text>
-          <TextInputComponent title="Nama Pasangan" placeholder="Masukkan nama lengkap pasangan" />
-          <TextInputComponent title="Kewarganegaraan Pasangan" placeholder="Pilih kewarganegaraan pasangan" isDropdown />
+        <View
+          style={[
+            styles.subStepQuestionnaireOptionContainer,
+            {marginBottom: 32},
+          ]}>
+          <Text style={styles.questionnaireDataSecondary}>
+            Keterangan Pasangan Pemohon (Opsional)
+          </Text>
+          <TextInputComponent
+            title="Nama Pasangan"
+            placeholder="Masukkan nama lengkap pasangan"
+          />
+          <TextInputComponent
+            title="Kewarganegaraan Pasangan"
+            placeholder="Pilih kewarganegaraan pasangan"
+            isDropdown
+            dropdownItemData={nationalityData}
+          />
           <TextInputComponent
             title="Alamat Pasangan"
             placeholder="Masukkan alamat pasangan"
@@ -86,9 +149,8 @@ const Step4DataConfirmationSubStep2 = ({
         <Button
           mode="contained"
           onPress={() => setStep(5)}
-          style={[styles.subStepButtonContained, { marginBottom: 8 }]}
-          textColor={Colors.neutral100.color}
-        >
+          style={[styles.subStepButtonContained, {marginBottom: 8}]}
+          textColor={Colors.neutral100.color}>
           Simpan Draft
         </Button>
       </View>