[CHORES] resolving conflicts

.gitlab-ci.yml

@@ -10,6 +10,7 @@ before_script:
       API_MAIN_URL=$PRODUCTION_API_MAIN_URL
     fi
   - echo -e "API_MAIN_URL=${API_MAIN_URL}" >> .env
+  - echo -e "GOOGLE_CLIENT_ID=${GOOGLE_CLIENT_ID}" >> .env
   - export ANDROID_SDK_ROOT=/usr/lib/android-sdk
   - echo "${API_MAIN_URL}"
 

__mocks__/react-native-modules.ts

+import { NativeModules } from 'react-native'
+
+NativeModules.RNGoogleSignin = {
+  SIGN_IN_CANCELLED: '0',
+  IN_PROGRESS: '1',
+  PLAY_SERVICES_NOT_AVAILABLE: '2',
+  SIGN_IN_REQUIRED: '3',
+  BUTTON_SIZE_ICON: 0,
+  BUTTON_SIZE_STANDARD: 0,
+  BUTTON_SIZE_WIDE: 0,
+  BUTTON_COLOR_AUTO: 0,
+  BUTTON_COLOR_LIGHT: 0,
+  BUTTON_COLOR_DARK: 0,
+  configure: jest.fn(),
+}
+
+export { NativeModules }
\ No newline at end of file

android/app/build.gradle

@@ -207,6 +207,8 @@ android {
 dependencies {
     implementation fileTree(dir: "libs", include: ["*.jar"])
     implementation "com.facebook.react:react-native:+"  // From node_modules
+    implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.0.0'
+    implementation 'com.google.android.gms:play-services-auth:19.0.0'
 
     if (enableHermes) {
         def hermesPath = "../../node_modules/hermes-engine/android/";
@@ -225,3 +227,4 @@ task copyDownloadableDepsToLibs(type: Copy) {
 }
 
 apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
+apply plugin: 'com.google.gms.google-services'

android/build.gradle

@@ -6,6 +6,7 @@ buildscript {
         minSdkVersion = 21
         compileSdkVersion = 28
         targetSdkVersion = 28
+        googlePlayServicesAuthVersion = "16.0.1"
     }
     repositories {
         google()
@@ -13,6 +14,7 @@ buildscript {
     }
     dependencies {
         classpath("com.android.tools.build:gradle:3.4.2")
+        classpath('com.google.gms:google-services:4.1.0')
 
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files

package-lock.json

@@ -3387,6 +3387,11 @@
       "resolved": "https://registry.npmjs.org/@react-native-community/masked-view/-/masked-view-0.1.7.tgz",
       "integrity": "sha512-9KbP7LTLFz9dx1heURJbO6nuVMdSjDez8znlrUzaB1nUwKVsTTwlKRuHxGUYIIkReLWrJQeCv9tidy+84z2eCw=="
     },
+    "@react-native-google-signin/google-signin": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@react-native-google-signin/google-signin/-/google-signin-6.0.0.tgz",
+      "integrity": "sha512-xmrrG2muhwmoPy9AdfP+ceLBZtnrXkZwgN/jR5u3xOHadyerJfvD76w2BSmm7zeoiMB1wwSkZkzFSa9+i1BdKA=="
+    },
     "@react-native/assets": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@react-native/assets/-/assets-1.0.0.tgz",

package.json

@@ -13,6 +13,7 @@
     "@react-native-community/async-storage": "^1.9.0",
     "@react-native-community/datetimepicker": "^2.3.2",
     "@react-native-community/masked-view": "^0.1.7",
+    "@react-native-google-signin/google-signin": "^6.0.0",
     "@react-navigation/native": "^5.0.9",
     "@react-navigation/stack": "^5.1.1",
     "@types/crypto-js": "^3.1.44",
@@ -66,7 +67,8 @@
       ".+\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.ts"
     },
     "setupFiles": [
-      "./node_modules/react-native-gesture-handler/jestSetup.js"
+      "./node_modules/react-native-gesture-handler/jestSetup.js",
+      "./__mocks__/react-native-modules.ts"
     ],
     "transformIgnorePatterns": [
       "node_modules/(?!react-native|react-navigation)/"

src/App/index.tsx

@@ -31,6 +31,9 @@ import initialCacheState, {
 } from 'contexts/AppContext/cache';
 import { useMainService } from 'services'
 import { Box, Text, Button, Gap } from 'components';
+import OfficerSignupFormGoogleSignin from 'scenes/OfficerSignupFormGoogleSignin';
+
+import WonderingIllustration from 'assets/illustrations/wondering.png';
 
 const StyledApp = styled.SafeAreaView`
   height: 100%;
@@ -178,7 +181,7 @@ const App = () => {
     if (token) {
       const getUser = async () => {
         const response = await mainService.me()
-        if (response.status === 200) {
+        if (response?.status === 200) {
           // Token is valid
           setUser(response.data)
           navigatorRef.current?.reset({
@@ -187,6 +190,10 @@ const App = () => {
           });
         } else {
           // Token is not valid
+          setAlert({
+            illustration: WonderingIllustration,
+            message: "Akun anda belum diaktifkan, silakan hubungi \nppticabangkotadepok@gmail.com",
+          })
           setToken('')
         }
       }
@@ -315,6 +322,10 @@ const App = () => {
                 name="officer-signup-form"
                 component={OfficerSignupForm}
               />
+              <Stack.Screen
+                name="officer-signup-form-google-signin"
+                component={OfficerSignupFormGoogleSignin}
+              />
               <Stack.Screen
                 name="officer-signup-finish"
                 component={OfficerSignupFormFinishPage}

src/components/CategoryButton/__snapshots__/index.test.tsx.snap

-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`CategoryButton tests Should change value after set value from outside 1`] = `
-<View
-  axis={2}
-  style={
-    Array [
-      Object {
-        "alignItems": "flex-start",
-        "backgroundColor": "transparent",
-        "borderBottomColor": "black",
-        "borderBottomWidth": 0,
-        "borderLeftColor": "black",
-        "borderLeftWidth": 0,
-        "borderRadius": 0,
-        "borderRightColor": "black",
-        "borderRightWidth": 0,
-        "borderTopColor": "black",
-        "borderTopWidth": 0,
-        "flexDirection": "column",
-        "flexGrow": 0,
-        "flexShrink": 0,
-        "flexWrap": "nowrap",
-        "height": "auto",
-        "justifyContent": "flex-start",
-        "paddingBottom": 0,
-        "paddingLeft": 0,
-        "paddingRight": 0,
-        "paddingTop": 0,
-        "width": "auto",
-      },
-    ]
-  }
->
-  <Text
-    fontSize="16px"
-    fontWeight="Bold"
-    style={
-      Array [
-        Object {
-          "color": "black",
-          "fontFamily": "Dosis-Bold",
-          "fontSize": 16,
-          "textAlign": "left",
-          "width": "auto",
-        },
-      ]
-    }
-  >
-    Jenis Kelamin
-  </Text>
-  <View
-    paddingBottom={6}
-    paddingLeft={0}
-    paddingRight={0}
-    paddingTop={6}
-    style={
-      Array [
-        Object {
-          "flexBasis": "auto",
-          "flexGrow": 0,
-          "flexShrink": 0,
-          "paddingBottom": 6,
-          "paddingLeft": 0,
-          "paddingRight": 0,
-          "paddingTop": 6,
-        },
-      ]
-    }
-  />
-  <View
-    style={
-      Array [
-        Object {
-          "flexDirection": "row",
-        },
-        Object {},
-      ]
-    }
-  >
-    <View
-      onMoveShouldSetResponder={[Function]}
-      onMoveShouldSetResponderCapture={[Function]}
-      onResponderEnd={[Function]}
-      onResponderGrant={[Function]}
-      onResponderMove={[Function]}
-      onResponderReject={[Function]}
-      onResponderRelease={[Function]}
-      onResponderStart={[Function]}
-      onResponderTerminate={[Function]}
-      onResponderTerminationRequest={[Function]}
-      onStartShouldSetResponder={[Function]}
-      onStartShouldSetResponderCapture={[Function]}
-      style={
-        Object {
-          "flex": 1,
-        }
-      }
-    >
-      <View
-        onLayout={[Function]}
-        style={
-          Object {
-            "backgroundColor": "#FAFAFA",
-            "borderRadius": 4,
-            "height": 30,
-          }
-        }
-      >
-        <View
-          style={
-            Object {
-              "borderColor": "#C9C9C9",
-              "borderRadius": 4,
-              "borderWidth": 0,
-              "flex": 1,
-              "flexDirection": "row",
-            }
-          }
-        >
-          <View
-            accessible={true}
-            focusable={true}
-            onClick={[Function]}
-            onResponderGrant={[Function]}
-            onResponderMove={[Function]}
-            onResponderRelease={[Function]}
-            onResponderTerminate={[Function]}
-            onResponderTerminationRequest={[Function]}
-            onStartShouldSetResponder={[Function]}
-            style={
-              Object {
-                "alignItems": "center",
-                "flex": 1,
-                "flexDirection": "row",
-                "justifyContent": "center",
-                "opacity": 1,
-              }
-            }
-          >
-            <Text
-              style={
-                Array [
-                  Object {
-                    "backgroundColor": "transparent",
-                    "color": "#5F5F5F",
-                    "fontSize": 14,
-                    "fontWeight": "bold",
-                    "textAlign": "center",
-                  },
-                  Object {},
-                ]
-              }
-            >
-              Laki-laki
-            </Text>
-          </View>
-          <View
-            accessible={true}
-            focusable={true}
-            onClick={[Function]}
-            onResponderGrant={[Function]}
-            onResponderMove={[Function]}
-            onResponderRelease={[Function]}
-            onResponderTerminate={[Function]}
-            onResponderTerminationRequest={[Function]}
-            onStartShouldSetResponder={[Function]}
-            style={
-              Object {
-                "alignItems": "center",
-                "flex": 1,
-                "flexDirection": "row",
-                "justifyContent": "center",
-                "opacity": 1,
-              }
-            }
-          >
-            <Text
-              style={
-                Array [
-                  Object {
-                    "backgroundColor": "transparent",
-                    "color": "#FFFFFF",
-                    "fontSize": 14,
-                    "fontWeight": "bold",
-                    "textAlign": "center",
-                  },
-                  Object {},
-                ]
-              }
-            >
-              Perempuan
-            </Text>
-          </View>
-        </View>
-      </View>
-    </View>
-  </View>
-</View>
-`;
-
-exports[`CategoryButton tests renders correctly 1`] = `
-<View
-  axis={2}
-  style={
-    Array [
-      Object {
-        "alignItems": "flex-start",
-        "backgroundColor": "transparent",
-        "borderBottomColor": "black",
-        "borderBottomWidth": 0,
-        "borderLeftColor": "black",
-        "borderLeftWidth": 0,
-        "borderRadius": 0,
-        "borderRightColor": "black",
-        "borderRightWidth": 0,
-        "borderTopColor": "black",
-        "borderTopWidth": 0,
-        "flexDirection": "column",
-        "flexGrow": 0,
-        "flexShrink": 0,
-        "flexWrap": "nowrap",
-        "height": "auto",
-        "justifyContent": "flex-start",
-        "paddingBottom": 0,
-        "paddingLeft": 0,
-        "paddingRight": 0,
-        "paddingTop": 0,
-        "width": "auto",
-      },
-    ]
-  }
->
-  <Text
-    fontSize="16px"
-    fontWeight="Bold"
-    style={
-      Array [
-        Object {
-          "color": "black",
-          "fontFamily": "Dosis-Bold",
-          "fontSize": 16,
-          "textAlign": "left",
-          "width": "auto",
-        },
-      ]
-    }
-  >
-    Jenis Kelamin
-  </Text>
-  <View
-    paddingBottom={6}
-    paddingLeft={0}
-    paddingRight={0}
-    paddingTop={6}
-    style={
-      Array [
-        Object {
-          "flexBasis": "auto",
-          "flexGrow": 0,
-          "flexShrink": 0,
-          "paddingBottom": 6,
-          "paddingLeft": 0,
-          "paddingRight": 0,
-          "paddingTop": 6,
-        },
-      ]
-    }
-  />
-  <View
-    style={
-      Array [
-        Object {
-          "flexDirection": "row",
-        },
-        Object {},
-      ]
-    }
-  >
-    <View
-      onMoveShouldSetResponder={[Function]}
-      onMoveShouldSetResponderCapture={[Function]}
-      onResponderEnd={[Function]}
-      onResponderGrant={[Function]}
-      onResponderMove={[Function]}
-      onResponderReject={[Function]}
-      onResponderRelease={[Function]}
-      onResponderStart={[Function]}
-      onResponderTerminate={[Function]}
-      onResponderTerminationRequest={[Function]}
-      onStartShouldSetResponder={[Function]}
-      onStartShouldSetResponderCapture={[Function]}
-      style={
-        Object {
-          "flex": 1,
-        }
-      }
-    >
-      <View
-        onLayout={[Function]}
-        style={
-          Object {
-            "backgroundColor": "#FAFAFA",
-            "borderRadius": 4,
-            "height": 30,
-          }
-        }
-      >
-        <View
-          style={
-            Object {
-              "borderColor": "#C9C9C9",
-              "borderRadius": 4,
-              "borderWidth": 0,
-              "flex": 1,
-              "flexDirection": "row",
-            }
-          }
-        >
-          <View
-            accessible={true}
-            focusable={true}
-            onClick={[Function]}
-            onResponderGrant={[Function]}
-            onResponderMove={[Function]}
-            onResponderRelease={[Function]}
-            onResponderTerminate={[Function]}
-            onResponderTerminationRequest={[Function]}
-            onStartShouldSetResponder={[Function]}
-            style={
-              Object {
-                "alignItems": "center",
-                "flex": 1,
-                "flexDirection": "row",
-                "justifyContent": "center",
-                "opacity": 1,
-              }
-            }
-          >
-            <Text
-              style={
-                Array [
-                  Object {
-                    "backgroundColor": "transparent",
-                    "color": "#FFFFFF",
-                    "fontSize": 14,
-                    "fontWeight": "bold",
-                    "textAlign": "center",
-                  },
-                  Object {},
-                ]
-              }
-            >
-              Laki-laki
-            </Text>
-          </View>
-          <View
-            accessible={true}
-            focusable={true}
-            onClick={[Function]}
-            onResponderGrant={[Function]}
-            onResponderMove={[Function]}
-            onResponderRelease={[Function]}
-            onResponderTerminate={[Function]}
-            onResponderTerminationRequest={[Function]}
-            onStartShouldSetResponder={[Function]}
-            style={
-              Object {
-                "alignItems": "center",
-                "flex": 1,
-                "flexDirection": "row",
-                "justifyContent": "center",
-                "opacity": 1,
-              }
-            }
-          >
-            <Text
-              style={
-                Array [
-                  Object {
-                    "backgroundColor": "transparent",
-                    "color": "#5F5F5F",
-                    "fontSize": 14,
-                    "fontWeight": "bold",
-                    "textAlign": "center",
-                  },
-                  Object {},
-                ]
-              }
-            >
-              Perempuan
-            </Text>
-          </View>
-        </View>
-      </View>
-    </View>
-  </View>
-</View>
-`;
-
-exports[`CategoryButton tests should be okay if there is not onClick function 1`] = `
-<View
-  axis={2}
-  style={
-    Array [
-      Object {
-        "alignItems": "flex-start",
-        "backgroundColor": "transparent",
-        "borderBottomColor": "black",
-        "borderBottomWidth": 0,
-        "borderLeftColor": "black",
-        "borderLeftWidth": 0,
-        "borderRadius": 0,
-        "borderRightColor": "black",
-        "borderRightWidth": 0,
-        "borderTopColor": "black",
-        "borderTopWidth": 0,
-        "flexDirection": "column",
-        "flexGrow": 0,
-        "flexShrink": 0,
-        "flexWrap": "nowrap",
-        "height": "auto",
-        "justifyContent": "flex-start",
-        "paddingBottom": 0,
-        "paddingLeft": 0,
-        "paddingRight": 0,
-        "paddingTop": 0,
-        "width": "auto",
-      },
-    ]
-  }
->
-  <Text
-    fontSize="16px"
-    fontWeight="Bold"
-    style={
-      Array [
-        Object {
-          "color": "black",
-          "fontFamily": "Dosis-Bold",
-          "fontSize": 16,
-          "textAlign": "left",
-          "width": "auto",
-        },
-      ]
-    }
-  >
-    Gender
-  </Text>
-  <View
-    paddingBottom={6}
-    paddingLeft={0}
-    paddingRight={0}
-    paddingTop={6}
-    style={
-      Array [
-        Object {
-          "flexBasis": "auto",
-          "flexGrow": 0,
-          "flexShrink": 0,
-          "paddingBottom": 6,
-          "paddingLeft": 0,
-          "paddingRight": 0,
-          "paddingTop": 6,
-        },
-      ]
-    }
-  />
-  <View
-    style={
-      Array [
-        Object {
-          "flexDirection": "row",
-        },
-        Object {},
-      ]
-    }
-  >
-    <View
-      onMoveShouldSetResponder={[Function]}