Fix internet and request header config for API request

android/app/build.gradle

@@ -187,7 +187,6 @@ dependencies {
     //noinspection GradleDynamicVersion
     implementation "com.facebook.react:react-native:+"  // From node_modules
 
-    implementation "androidx.appcompat:appcompat:1.1.0"
     implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
 
     debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {

android/app/src/main/AndroidManifest.xml

+<?xml version="1.0" encoding="utf-8"?>
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.dietela_mobile">
 
@@ -9,7 +10,9 @@
       android:icon="@mipmap/ic_launcher"
       android:roundIcon="@mipmap/ic_launcher_round"
       android:allowBackup="false"
-      android:theme="@style/AppTheme">
+      android:theme="@style/AppTheme"
+      android:usesCleartextTraffic="true"
+      android:networkSecurityConfig="@xml/network_security_config">
       <activity
         android:name=".MainActivity"
         android:label="@string/app_name"

android/app/src/main/res/xml/network_security_config.xml

+<?xml version="1.0" encoding="utf-8"?>
+<network-security-config>
+    <base-config cleartextTrafficPermitted="true">
+        <trust-anchors>
+            <certificates src="system" />
+        </trust-anchors>
+    </base-config>
+</network-security-config>

package.json

@@ -17,7 +17,6 @@
     "@react-navigation/native": "^5.9.3",
     "@react-navigation/stack": "^5.14.3",
     "@testing-library/react-native": "^7.2.0",
-    "@types/react-native-snap-carousel": "^3.8.2",
     "axios": "^0.21.1",
     "formik": "^2.2.6",
     "react": "16.13.1",
@@ -40,6 +39,7 @@
     "@react-native-community/eslint-config": "^1.1.0",
     "@types/jest": "^25.2.3",
     "@types/react-native": "^0.63.2",
+    "@types/react-native-snap-carousel": "^3.8.2",
     "@types/react-native-vector-icons": "^6.4.6",
     "@types/react-test-renderer": "^16.9.2",
     "babel-jest": "^25.1.0",

src/components/form/MultipleCheckbox/index.tsx

@@ -30,7 +30,7 @@ const MultipleCheckbox: FC<Props> = ({
         Pertanyaan {questionNumber} / {totalQuestions}
       </Text>
       <Text style={[typographyStyles.headingLarge, styles.spacing]}>
-        {questionLabel} <Text style={styles.red}>*</Text>
+        {questionLabel}
       </Text>
       <Text
         style={[
@@ -38,7 +38,7 @@ const MultipleCheckbox: FC<Props> = ({
           styles.bigSpacing,
           errorMessage ? styles.red : null,
         ]}>
-        {helperText || 'Pilih semua yang berlaku'}
+        {helperText || 'Pilih semua yang berlaku (opsional)'}
       </Text>
       {choices.map((choice) => (
         <CheckBox

src/scenes/questionnaire/AllAccessQuestionnaire/schema.ts

@@ -242,10 +242,8 @@ export const allAccessQuestions = [
   {
     fieldName: 'health_problem',
     questionLabel: 'Masalah kesehatan yang kamu miliki?',
-    helperText: 'Pilih semua yang berlaku',
     multiple: true,
     choiceList: [
-      'Tidak ada yang perlu dikhawatirkan',
       'Diabetes Tipe 2',
       'Diabetes Tipe 1',
       'PCOS (Polycystic Ovary Syndrome)',
@@ -275,10 +273,12 @@ export const fieldValidations: FieldValidation[] = [
     label: field.label,
     type: FieldType.RADIO_BUTTON,
   })),
-  ...allAccessQuestions.map((field) => ({
-    name: field.fieldName,
-    type: field.multiple ? FieldType.CHECKBOX : FieldType.RADIO_BUTTON,
-  })),
+  ...allAccessQuestions
+    .filter((field) => !field.multiple)
+    .map((field) => ({
+      name: field.fieldName,
+      type: FieldType.RADIO_BUTTON,
+    })),
 ];
 
 export const convertPayload = (
@@ -288,4 +288,6 @@ export const convertPayload = (
   age: parseInt(values.age, 10),
   height: parseInt(values.age, 10),
   weight: parseInt(values.age, 10),
+  health_problem:
+    values.health_problem.length === 0 ? [1] : values.health_problem,
 });

src/services/api.ts

@@ -25,7 +25,11 @@ export async function api<T>(
     url: `https://dietela-backend.herokuapp.com/${url}`,
     method,
     data: JSON.stringify(body),
-    headers,
+    headers: {
+      Accept: 'application/json',
+      'Content-Type': 'application/json;charset=UTF-8',
+      ...headers,
+    },
   };
 
   return await axios