@eohjsc/react-native-smart-city 0.2.84 → 0.2.85

package/src/screens/AddCommon/__test__/SelectUnit.test.js

@@ -35,13 +35,21 @@ describe('Test SelectUnit container', () => {
     mockedGoBack.mockClear();
   });
   let tree;
-  const list_type = ['AddSubUnit', 'AddDevice', 'AddMember', 'AddLGDevice', ''];
+  const list_type = [
+    'AddSubUnit',
+    'AddDevice',
+    'AddMember',
+    'AddLGDevice',
+    '',
+    'AddDeviceNewFlow',
+  ];
   const result = [
     'Add new sub-unit',
     'Add new device',
     'Select a unit',
     'Select a unit',
     'Add new sub-unit',
+    'Select a unit',
   ];
   list_type.forEach(function (type, i) {
     test(`create SelectUnit ${type} container`, () => {
@@ -126,6 +134,13 @@ describe('Test SelectUnit container', () => {
             unit_id: 1,
           });
           break;
+        case 'AddDeviceNewFlow':
+          expect(mockedNavigate).toBeCalledWith('AddGatewaySelectGateway', {
+            unit_id: 1,
+            addType: 'AddDeviceNewFlow',
+            scan_sensor_data: undefined,
+          });
+          break;
         default:
           break;
       }

package/src/screens/AddNewGateway/PlugAndPlay/ConnectWifiWarning.js

@@ -1,4 +1,10 @@
-import React, { memo, useEffect, useState, useCallback } from 'react';
+import React, {
+  memo,
+  useEffect,
+  useState,
+  useCallback,
+  useContext,
+} from 'react';
 import {
   View,
   StyleSheet,
@@ -16,15 +22,18 @@ import ScanQrGateway from '../../../../assets/images/scan-qr-gateway.svg';
 import { useTranslations } from '../../../hooks/Common/useTranslations';
 import { getBottomSpace } from 'react-native-iphone-x-helper';
 import BottomButtonView from '../../../commons/BottomButtonView';
-import { Colors, API } from '../../../configs';
-import { axiosPost } from '../../../utils/Apis/axios';
+import { Colors } from '../../../configs';
 import Routes from '../../../utils/Route';
+import { SCContext } from '../../../context';
+import { Action } from '../../../context/actionType';
 
 const ConnectWifiWarning = memo(({ route }) => {
-  const { wifi_ssid, wifi_pass, unit_id, chip_id } = route.params;
+  const { wifi_ssid, wifi_pass, unit_id, chip_id, devicePrefixName, body } =
+    route.params;
   const t = useTranslations();
   const { navigate, goBack } = useNavigation();
   const [isLoading, setIsLoading] = useState(false);
+  const { setAction } = useContext(SCContext);
 
   const getPermissionWifiAndroid = useCallback(async () => {
     const granted = await PermissionsAndroid.request(
@@ -70,22 +79,42 @@ const ConnectWifiWarning = memo(({ route }) => {
           socket: socket,
         });
       }
+    });
+    socket.on('message', (msg, rinfo) => {
+      const data = JSON.parse(msg.toString());
       if (data.hasOwnProperty('gateway')) {
         const checkWifiInterval = setInterval(() => {
           // eslint-disable-next-line promise/prefer-await-to-then
           WifiManager.getCurrentWifiSSID().then(async (ssid) => {
             if (ssid !== wifi_ssid) {
-              const { success } = await axiosPost(
-                API.UNIT.ADD_GATEWAY(unit_id),
-                {
-                  chip: chip_id,
-                  imei: data.gateway.imei,
-                  chip_name: data.gateway.model,
-                }
-              );
-              if (success) {
-                navigate(Routes.Dashboard);
-                ToastBottomHelper.success(t('add_gateway_success'));
+              const IsRobot = devicePrefixName === 'ROBOT';
+              if (IsRobot) {
+                setAction(Action.IS_CONNECT_WIFI_GATEWAY, false);
+                navigate(Routes.AddDeviceStack, {
+                  screen: Routes.AddCommonSelectSubUnit,
+                  params: {
+                    scan_sensor_data: { ...body },
+                    addType: 'AddDeviceNewFlow',
+                    gateway: data?.gateway,
+                    unit_id: unit_id,
+                    devicePrefixName: devicePrefixName,
+                    wifi_ssid: wifi_ssid,
+                    wifi_pass: wifi_pass,
+                  },
+                });
+                clearInterval(checkWifiInterval);
+              } else {
+                setAction(Action.IS_CONNECT_WIFI_GATEWAY, false);
+                navigate(Routes.AddDeviceStack, {
+                  screen: Routes.ConnectingProcess,
+                  params: {
+                    unit_id: unit_id,
+                    scan_sensor_data: { ...body },
+                    gateway: data?.gateway,
+                    devicePrefixName: devicePrefixName,
+                    chip_id: chip_id,
+                  },
+                });
                 clearInterval(checkWifiInterval);
               }
             }
@@ -95,6 +124,7 @@ const ConnectWifiWarning = memo(({ route }) => {
     });
     socket.on('error', () => {
       ToastBottomHelper.error(t('server_error'));
+      setAction(Action.IS_CONNECT_WIFI_GATEWAY, false);
       goBack();
     });
   };

package/src/screens/AddNewGateway/PlugAndPlay/GatewayWifiList.js

@@ -1,10 +1,16 @@
-import React, { memo, useState, useCallback } from 'react';
+import React, {
+  memo,
+  useState,
+  useCallback,
+  useContext,
+  useEffect,
+} from 'react';
 import {
   View,
   StyleSheet,
   TouchableOpacity,
   ScrollView,
-  TextInput,
+  ActivityIndicator,
 } from 'react-native';
 import { HeaderCustom } from '../../../commons/Header';
 import { Colors } from '../../../configs';
@@ -12,6 +18,9 @@ import Text from '../../../commons/Text';
 import { useTranslations } from '../../../hooks/Common/useTranslations';
 import WifiIcon from '../../../../assets/images/wifi.svg';
 import ButtonPopup from '../../../commons/ButtonPopup';
+import TextInputPassword from '../../../commons/Form/TextInputPassword';
+import { SCContext, useSCContextSelector } from '../../../context';
+import { Action } from '../../../context/actionType';
 
 const GatewayWifiList = memo(({ route }) => {
   const { list_wifi, socket } = route.params;
@@ -20,6 +29,11 @@ const GatewayWifiList = memo(({ route }) => {
   const [isShowPopupPassword, setIsShowPopupPassword] = useState(false);
   const [password, setPassword] = useState('');
   const [selectedWifi, setSelectedWifi] = useState('');
+  const { setAction } = useContext(SCContext);
+
+  const isConnectWifiGateway = useSCContextSelector(
+    (state) => state.app.isConnectWifiGateway
+  );
 
   const showPopupPassword = (ssid) => {
     setIsShowPopupPassword(true);
@@ -32,21 +46,27 @@ const GatewayWifiList = memo(({ route }) => {
     },
     [setPassword]
   );
-
-  const connectWifi = async () => {
-    await socket.send(
-      JSON.stringify({
-        type: 'connect',
-        data: { wifi: { ssid: selectedWifi, pass: password } },
-      }),
-      undefined,
-      undefined,
-      54321,
-      '192.168.27.1',
-      undefined
-    );
-  };
-
+  const connectWifi = useCallback(async () => {
+    if (!isConnectWifiGateway) {
+      await socket.send(
+        JSON.stringify({
+          type: 'connect',
+          data: { wifi: { ssid: selectedWifi, pass: password } },
+        }),
+        undefined,
+        undefined,
+        54321,
+        '192.168.27.1',
+        undefined
+      );
+      setAction(Action.IS_CONNECT_WIFI_GATEWAY, true);
+    }
+  }, [isConnectWifiGateway, password, selectedWifi, setAction, socket]);
+  useEffect(() => {
+    if (!isConnectWifiGateway) {
+      setIsShowPopupPassword(false);
+    }
+  }, [isConnectWifiGateway]);
   return (
     <View style={styles.screen}>
       <HeaderCustom title={t('connect_device')} isShowSeparator />
@@ -79,19 +99,28 @@ const GatewayWifiList = memo(({ route }) => {
 
       <ButtonPopup
         visible={isShowPopupPassword}
-        mainTitle={t('connect')}
-        onPressMain={() => connectWifi()}
+        mainTitle={
+          isConnectWifiGateway ? (
+            <ActivityIndicator color={Colors.White} size={'small'} />
+          ) : (
+            t('connect')
+          )
+        }
+        onPressMain={connectWifi}
         secondaryTitle={t('cancel')}
+        typeSecondary={isConnectWifiGateway ? 'disabled' : 'cancel'}
         onPressSecondary={() => setIsShowPopupPassword(false)}
         hideClose={true}
       >
         <>
           <Text>{t('enter_wifi_password')}</Text>
-          <TextInput
-            secureTextEntry={true}
-            style={styles.input}
-            onChangeText={onPasswordChange}
+          <TextInputPassword
+            secureTextEntry
+            placeholder={t('password')}
+            onChange={onPasswordChange}
             value={password}
+            textInputStyle={styles.input}
+            selectionColor={Colors.Primary}
           />
         </>
       </ButtonPopup>

package/src/screens/AddNewGateway/SelectGateway.js

@@ -0,0 +1,132 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { useIsFocused, useNavigation } from '@react-navigation/native';
+import { useTranslations } from '../../hooks/Common/useTranslations';
+import { SafeAreaView, ScrollView, TouchableOpacity, View } from 'react-native';
+
+import { API } from '../../configs';
+import { Section, RadioCircle, ViewButtonBottom } from '../../commons';
+import { axiosGet } from '../../utils/Apis/axios';
+import Text from '../../commons/Text';
+import Routes from '../../utils/Route';
+import { TESTID } from '../../configs/Constants';
+import styles from './SelectGatewayStyles';
+
+const AddNewGatewaySelectGateway = ({ route }) => {
+  const t = useTranslations();
+  const navigation = useNavigation();
+  const isFocused = useIsFocused();
+  const { addType, unit_id, scan_sensor_data, devicePrefixName } = route.params;
+  const [selectedIndex, setSelectedIndex] = useState(-1);
+
+  const [gateways, setGateways] = useState([]);
+  const [title, setTitle] = useState('');
+  const [subTitle, setSubTitle] = useState('');
+  const [gateway, setGateway] = useState({});
+
+  useEffect(() => {
+    switch (addType) {
+      case 'AddDeviceNewFlow':
+        setTitle(t('text_select_a_gateway'));
+        setSubTitle(t('text_select_a_gateway'));
+        break;
+      default:
+        setTitle(t('text_select_a_gateway'));
+        setSubTitle(t('text_select_a_gateway'));
+        break;
+    }
+  }, [title, subTitle, addType, t]);
+
+  const fetchDetails = useCallback(async () => {
+    const { success, data } = await axiosGet(
+      API.CHIP.GET_CHIPS_FROM_UNIT(unit_id)
+    );
+    if (success) {
+      setGateways(data);
+    }
+  }, [unit_id]);
+
+  useEffect(() => {
+    isFocused && fetchDetails();
+  }, [fetchDetails, isFocused]);
+
+  const onPressNext = useCallback(() => {
+    switch (addType) {
+      case 'AddDeviceNewFlow':
+        navigation.navigate(Routes.AddCommonSelectSubUnit, {
+          unit_id: unit_id,
+          addType: 'AddDeviceNewFlow',
+          scan_sensor_data,
+          gateway,
+          devicePrefixName,
+        });
+        break;
+      default:
+        break;
+    }
+  }, [
+    addType,
+    devicePrefixName,
+    gateway,
+    navigation,
+    scan_sensor_data,
+    unit_id,
+  ]);
+
+  const handleSelectIndex = (index) => {
+    setGateway(gateways[index]);
+    if (index !== selectedIndex) {
+      setSelectedIndex(index);
+    } else {
+      setSelectedIndex(-1);
+    }
+  };
+
+  return (
+    <SafeAreaView style={styles.container}>
+      <Text semibold style={styles.title}>
+        {title}
+      </Text>
+      <Text style={styles.subtitle}>{subTitle}</Text>
+      <View style={styles.contentContainer}>
+        <ScrollView
+          style={styles.scrollContainer}
+          showsVerticalScrollIndicator={false}
+        >
+          <Section type={'border'}>
+            {gateways.map((item, index) => (
+              <TouchableOpacity
+                key={index}
+                style={styles.rowContainer}
+                onPress={() => handleSelectIndex(index)}
+              >
+                <RadioCircle
+                  active={selectedIndex === index}
+                  testID={TESTID.SELECT_GATEWAY_RADIO_BUTTON}
+                />
+                <TouchableOpacity
+                  style={styles.row}
+                  onPress={() => handleSelectIndex(index)}
+                  testID={TESTID.SELECT_GATEWAY_NAME}
+                >
+                  <Text style={styles.text} testID={TESTID.SELECT_GATEWAY_NAME}>
+                    {item.name}
+                  </Text>
+                </TouchableOpacity>
+              </TouchableOpacity>
+            ))}
+          </Section>
+        </ScrollView>
+        <ViewButtonBottom
+          leftTitle={t('cancel')}
+          onLeftClick={() => navigation.goBack()}
+          rightTitle={t('next')}
+          rightDisabled={selectedIndex === -1}
+          onRightClick={onPressNext}
+          testIDPrefix={TESTID.PREFIX.SELECT_UNIT}
+        />
+      </View>
+    </SafeAreaView>
+  );
+};
+
+export default AddNewGatewaySelectGateway;

package/src/screens/AddNewGateway/SelectGatewayStyles.js

@@ -0,0 +1,55 @@
+import { Colors } from '../../configs';
+
+import { StyleSheet, StatusBar, Platform } from 'react-native';
+
+export default StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: Colors.Gray2,
+    paddingTop: Platform.OS === 'android' ? StatusBar.currentHeight : 0,
+  },
+  contentContainer: {
+    flex: 1,
+    justifyContent: 'space-between',
+  },
+  scrollContainer: {
+    width: '100%',
+    flex: 1,
+  },
+  title: {
+    color: Colors.Gray9,
+    fontSize: 20,
+    lineHeight: 28,
+    marginTop: 8,
+    marginBottom: 4,
+    marginLeft: 16,
+  },
+  subtitle: {
+    color: Colors.Gray8,
+    fontSize: 14,
+    lineHeight: 22,
+    marginLeft: 16,
+    marginBottom: 16,
+  },
+  row: {
+    flex: 1,
+    paddingVertical: 16,
+    borderBottomColor: Colors.Gray4,
+    borderBottomWidth: 1,
+    marginRight: 24,
+    marginLeft: 16,
+  },
+  rowContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingLeft: 16,
+  },
+  text: {
+    fontSize: 16,
+    lineHeight: 24,
+    color: Colors.Gray9,
+  },
+  buttonAdd: {
+    marginHorizontal: 16,
+  },
+});

package/src/screens/Device/detail.js

@@ -58,11 +58,6 @@ const DeviceDetail = ({ route }) => {
   const [controlOptions, setControlOptions] = useState({
     internet: {},
   });
-  // eslint-disable-next-line no-unused-vars
-  const [loading, setLoading] = useState({
-    isConnected: true,
-    displayTemplate: true,
-  });
   const [isConnected, setConnected] = useState(false);
   const [lastUpdated, setLastUpdated] = useState(null);
   const [lastEvent, setLastEvent] = useState({ id: 0, reportedAt: 0 });
@@ -80,6 +75,10 @@ const DeviceDetail = ({ route }) => {
   const [sensorName, setSensorName] = useState(sensor?.name);
   const [lockShowing, acquireLockShowing, releaseLockShowing] = useBoolean();
   const [showWindDirection, setShowWindDirection] = useState(false);
+  const [loading, setLoading] = useState({
+    isConnected: true,
+    displayTemplate: true,
+  });
 
   const isDeviceConnectedViaBle = useMemo(
     () => isDeviceConnected(sensor?.remote_control_options?.bluetooth?.address),
@@ -408,7 +407,8 @@ const DeviceDetail = ({ route }) => {
       fetchValues();
       return () => clearInterval(updateInterval);
     } else {
-      setLoading((preState) => ({ ...preState, isConnected: false }));
+      Object.keys(sensor).length > 1 &&
+        setLoading((preState) => ({ ...preState, isConnected: false }));
     }
   }, [sensor, display]);
 

package/src/screens/Notification/__test__/NotificationItem.test.js

@@ -36,7 +36,7 @@ describe('test NotificationItem', () => {
       id: 1,
       content_code: '',
       is_read: true,
-      params: JSON.stringify({ booking_id: 1 }),
+      params: JSON.stringify({ booking_id: 1, booking_id_new: 1 }),
       created_at: '',
       icon: '',
     };
@@ -96,6 +96,16 @@ describe('test NotificationItem', () => {
       screen: Routes.SmartParkingBookingDetails,
       params: { id: 1 },
     },
+    {
+      content_code: NOTIFICATION_TYPES.STOP_VIOLATION_FREE_PARKING_ZONE,
+      screen: Routes.SmartParkingBookingDetails,
+      params: { id: 1 },
+    },
+    {
+      content_code: NOTIFICATION_TYPES.PAY_FINE_AND_EXTEND_SUCCESSFULLY,
+      screen: Routes.SmartParkingBookingDetails,
+      params: { id: 1 },
+    },
   ];
 
   for (const notify of listCase) {
@@ -110,7 +120,7 @@ describe('test NotificationItem', () => {
         button.props.onPress();
       });
       expect(mockNavigate).toHaveBeenCalledWith(Routes.SmartParkingStack, {
-        screens: notify.screen,
+        screen: notify.screen,
         params: notify.params,
       });
     });

package/src/screens/Notification/components/NotificationItem.js

@@ -80,7 +80,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: booking_id },
             }),
         };
@@ -93,7 +93,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: booking_id },
             }),
         };
@@ -105,7 +105,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: booking_id },
             }),
         };
@@ -117,7 +117,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.MyBookingList,
+              screen: Routes.MyBookingList,
               params: { tab: 1 },
             }),
         };
@@ -129,7 +129,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.MyBookingList,
+              screen: Routes.MyBookingList,
               params: { tab: 1 },
             }),
         };
@@ -141,7 +141,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: booking_id },
             }),
         };
@@ -153,7 +153,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.MyBookingList,
+              screen: Routes.MyBookingList,
               params: { tab: 1 },
             }),
         };
@@ -168,7 +168,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: violated_booking_id || booking_id },
             }),
         };
@@ -180,7 +180,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: booking_id },
             }),
         };
@@ -192,7 +192,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: booking_id },
             }),
         };
@@ -205,7 +205,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: new_booking_id },
             }),
         };
@@ -217,7 +217,7 @@ const NotificationItem = memo(({ item }) => {
           ),
           redirect: () =>
             navigation.navigate(Routes.SmartParkingStack, {
-              screens: Routes.SmartParkingBookingDetails,
+              screen: Routes.SmartParkingBookingDetails,
               params: { id: booking_id },
             }),
         };
@@ -398,6 +398,54 @@ const NotificationItem = memo(({ item }) => {
             <IconComponent icon={'home'} style={styles.backgroundSummer} />
           ),
         };
+      case NOTIFICATION_TYPES.NOTIFY_DEVICE_DISCONNECT:
+        return {
+          content: customColorText(
+            t('text_notification_content_divice_disconnect'),
+            arrParams
+          ),
+          redirect: () => {
+            navigation.navigate(Routes.UnitStack, {
+              screen: Routes.DeviceDetail,
+              params: {
+                unitId,
+                sensorId,
+              },
+            });
+          },
+        };
+      case NOTIFICATION_TYPES.NOTIFY_UPDATE_ADDRESS:
+        return {
+          content: customColorText(
+            t('text_notification_content_update_address'),
+            arrParams
+          ),
+          redirect: () => {
+            navigation.navigate(Routes.UnitStack, {
+              screen: Routes.UnitDetail,
+              params: {
+                unitId,
+              },
+            });
+          },
+        };
+      case NOTIFICATION_TYPES.NOTIFY_RENAME_SUB_UNIT:
+        const stationId = paramsJSON?.sub_unit_id;
+        return {
+          content: customColorText(
+            t('text_notification_content_rename_sub_unit'),
+            arrParams
+          ),
+          redirect: () => {
+            navigation.navigate(Routes.UnitStack, {
+              screen: Routes.UnitDetail,
+              params: {
+                unitId,
+                stationId,
+              },
+            });
+          },
+        };
       default:
         return {
           content: customColorText(t('this_notification_will_be_updated_soon')),