@eohjsc/react-native-smart-city 0.7.3-rc9 → 0.7.4

package/src/hooks/IoT/useRemoteControl.js

@@ -26,13 +26,13 @@ const handleReconnectionDeviceBle = async (device, action, data, userId) => {
   return SEND_COMMAND_OVER_BLUETOOTH_FAIL;
 };
 
-const useRemoteControl = () => {
+const useRemoteControl = (bluetoothDevice) => {
   const homeAssistantConnections = useSCContextSelector(
     (state) => state.iot.homeassistant.connections
   );
 
   const sendRemoteCommand = useCallback(
-    async (device, action, data, userId) => {
+    async (device, action, data, userId, silent = false) => {
       // No action, raise not authorized
       let result = false;
       if (!action) {
@@ -41,9 +41,18 @@ const useRemoteControl = () => {
         );
         return result;
       }
-
       if (action.command_prefer_over_bluetooth) {
-        let res = await sendCommandOverBluetooth(device, action, data, userId);
+        // custom control for i/o pin over bluetooth
+        if (bluetoothDevice?.isConnected && action.arduino_action) {
+          return bluetoothDevice.control(action, data, silent);
+        }
+        let res = await sendCommandOverBluetooth(
+          device,
+          action,
+          data,
+          userId,
+          silent
+        );
         if (res === BLUETOOOH_DEVICE_UNSTABLE) {
           res = await handleReconnectionDeviceBle(device, action, data, userId);
         }
@@ -57,7 +66,8 @@ const useRemoteControl = () => {
                 device,
                 action,
                 data,
-                'bluetooth'
+                'bluetooth',
+                silent
               );
             }
             return result;
@@ -80,7 +90,8 @@ const useRemoteControl = () => {
           device,
           action,
           data,
-          action.command_prefer_over_bluetooth ? 'bluetooth' : 'internet'
+          action.command_prefer_over_bluetooth ? 'bluetooth' : 'internet',
+          silent
         );
       }
 
@@ -95,7 +106,7 @@ const useRemoteControl = () => {
 
       return await sendCommandOverInternet(device, action, data, 'internet');
     },
-    [homeAssistantConnections]
+    [bluetoothDevice, homeAssistantConnections]
   );
 
   return sendRemoteCommand;

package/src/hooks/useMqtt.js

@@ -1,9 +1,9 @@
 import mqtt from 'precompiled-mqtt/dist/mqtt.browser';
-import { useState, useEffect, useMemo, useRef } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
 
 import API from '../configs/API';
-import { axiosGet } from '../utils/Apis/axios';
 import { handleMqttMessage } from '../iot/mqtt';
+import { axiosGet } from '../utils/Apis/axios';
 
 const useChipJsonConfiguration = (dashboardId) => {
   const [chips, setChips] = useState([]);

package/src/iot/RemoteControl/Bluetooth.js

@@ -1,15 +1,15 @@
 /* eslint-disable promise/prefer-await-to-callbacks */
 import base64 from 'react-native-base64';
-import { BleManager, ScanMode } from 'react-native-ble-plx';
+import { ScanMode } from 'react-native-ble-plx';
 import CryptoAesCbc from 'react-native-crypto-aes-cbc';
 
 import { base64ToHex, ToastBottomHelper } from '../../utils/Utils';
 import { BLE } from '../../configs';
 import t from '../../hooks/Common/useTranslations';
+import { bleManager } from '../../utils/bluetooth';
 
 const bluetoothDevices = {};
 const needToScanDevices = [];
-const bleManager = new BleManager();
 
 let isScanning = false;
 
@@ -98,7 +98,8 @@ export const sendCommandOverBluetooth = async (
   sensor,
   action,
   data,
-  userID
+  userID,
+  silent
 ) => {
   const bluetooth = sensor?.remote_control_options?.bluetooth;
   let device = null;
@@ -115,7 +116,8 @@ export const sendCommandOverBluetooth = async (
       user: userID,
     },
     false,
-    bluetooth?.is_use_secret_key
+    bluetooth?.is_use_secret_key,
+    silent
   );
   return result;
 };
@@ -124,18 +126,6 @@ export const getDeviceByName = (name) => {
   return bluetoothDevices[name];
 };
 
-export const isDeviceConnected = (deviceName) => {
-  return !!bluetoothDevices[deviceName];
-};
-
-export const subcribeCharacteristicNotify = async (device, onListener) => {
-  return await device.monitorCharacteristicForService(
-    BLE.BLE_REMOTE_SERVICE_UUID,
-    BLE.BLE_REMOTE_CHARACTERISTIC_UUID_TX,
-    onListener
-  );
-};
-
 export const readCharacteristic = async (
   device,
   serviceUUID = BLE.BLE_REMOTE_SERVICE_UUID,
@@ -151,13 +141,16 @@ export const sendDataOverBluetooth = async (
   device = null,
   data,
   keepConnect = false,
-  isUseSecretKey = false
+  isUseSecretKey = false,
+  silent
 ) => {
   if (!device) {
     return SEND_COMMAND_OVER_BLUETOOTH_FAIL;
   }
 
-  ToastBottomHelper.error(t('Sending command via bluetooth'));
+  if (!silent) {
+    ToastBottomHelper.info(t('Sending command via bluetooth'));
+  }
 
   let connectedDevice = null;
   let fullDataDevice = null;
@@ -196,9 +189,11 @@ export const sendDataOverBluetooth = async (
         hasResponse = true;
         const notify = error ? '' : base64.decode(characteristic.value);
         if (notify === BLE.BLE_RESPONSE_OK) {
-          ToastBottomHelper.success(
-            t('control_device_via_bluetooth_successfully')
-          );
+          if (!silent) {
+            ToastBottomHelper.success(
+              t('control_device_via_bluetooth_successfully')
+            );
+          }
           if (!keepConnect) {
             await connectedDevice.cancelConnection();
           }
@@ -234,7 +229,9 @@ export const sendDataOverBluetooth = async (
         base64.encode(JSON.stringify(data))
       );
     }
-    ToastBottomHelper.error(t('command_is_sent_to_device_via_bluetooth'));
+    if (!silent) {
+      ToastBottomHelper.info(t('command_is_sent_to_device_via_bluetooth'));
+    }
   } catch (e) {
     await connectedDevice.cancelConnection();
     ToastBottomHelper.error(t('command_is_fail_to_send_via_bluetooth'));

package/src/iot/RemoteControl/Internet.js

@@ -4,7 +4,13 @@ import { API } from '../../configs';
 import { axiosPost } from '../../utils/Apis/axios';
 import { ToastBottomHelper } from '../../utils/Utils';
 
-export const sendCommandOverInternet = async (sensor, action, data, source) => {
+export const sendCommandOverInternet = async (
+  sensor,
+  action,
+  data,
+  source,
+  silent
+) => {
   if (data !== null) {
     if (Number.isInteger(data)) {
       data = data.toString(16).toUpperCase();
@@ -13,13 +19,15 @@ export const sendCommandOverInternet = async (sensor, action, data, source) => {
   if (typeof data === 'object') {
     data = JSON.stringify(data);
   }
-  ToastBottomHelper.success(t('Sending command via internet'));
+  if (!silent) {
+    ToastBottomHelper.info(t('Sending command via internet'));
+  }
   const { success } = await axiosPost(API.DEVICE.TRIGGER_ACTION(sensor.id), {
     key: action.key,
     data,
     source,
   });
-  if (success) {
+  if (success && !silent) {
     ToastBottomHelper.success(t('Command is sent to device via internet'));
   }
   return success;

package/src/navigations/EmergencyContactsStack.js

@@ -1,4 +1,4 @@
-import AntDesign from 'react-native-vector-icons/AntDesign';
+import { IconOutline } from '@ant-design/icons-react-native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import React, { memo } from 'react';
 import { StyleSheet } from 'react-native';
@@ -19,7 +19,7 @@ export const EmergencyContactsStack = memo(() => {
         ...screenOptions,
         headerTitleAlign: 'center',
         headerBackImage: () => (
-          <AntDesign
+          <IconOutline
             name="left"
             size={27}
             color={Colors.Black}
@@ -32,7 +32,8 @@ export const EmergencyContactsStack = memo(() => {
           borderBottomWidth: Device.isIOS === 'android' ? 1 : 0,
           borderColor: Colors.Gray4,
         },
-        headerBackTitle: true,
+        headerTintColor: Colors.Black,
+        headerBackTitleVisible: false,
       }}
     >
       <Stack.Screen

package/src/navigations/SharedStack.js

@@ -50,6 +50,8 @@ export default SharedStack;
 
 const styles = StyleSheet.create({
   btnMenu: {
+    paddingLeft: 0,
+    paddingRight: 10,
     paddingHorizontal: 16,
     height: '100%',
     justifyContent: 'center',

package/src/navigations/UnitStack.js

@@ -1,78 +1,76 @@
-import React, { memo, useContext, useEffect } from 'react';
-import { AppState, View } from 'react-native';
-import AntDesign from 'react-native-vector-icons/AntDesign';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { BleManager } from 'react-native-ble-plx';
+import { IconOutline } from '@ant-design/icons-react-native';
 import NetInfo from '@react-native-community/netinfo';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { get } from 'lodash';
+import React, { memo, useContext, useEffect } from 'react';
+import { AppState, View } from 'react-native';
 
 import Text from '../commons/Text';
+import { API, Colors, Device } from '../configs';
+import { SCContext } from '../context';
+import { Action } from '../context/actionType';
 import { useTranslations } from '../hooks/Common/useTranslations';
 import { unwatchAllConfigs } from '../iot/Monitor';
-import { API, Colors, Device } from '../configs';
-import Route from '../utils/Route';
 import ActivityLogScreen from '../screens/ActivityLog';
+import Route from '../utils/Route';
 import { screenOptions } from './utils';
-import { SCContext } from '../context';
-import { Action } from '../context/actionType';
 
+import { useBluetoothConnection } from '../hooks/IoT';
+import { realScanBluetoothDevices } from '../iot/RemoteControl/Bluetooth';
+import AllCamera from '../screens/AllCamera';
+import AllGateway from '../screens/AllGateway';
 import AQIGuide from '../screens/AQIGuide';
-import DeviceDetail from '../screens/Device/detail';
+import ChooseAction from '../screens/Automate/AddNewAction/ChooseAction';
+import ChooseConfig from '../screens/Automate/AddNewAction/ChooseConfig';
+import SelectControlDevices from '../screens/Automate/AddNewAction/SelectControlDevices';
+import SelectMonitorDevices from '../screens/Automate/AddNewAction/SelectMonitorDevices';
+import SetupConfigCondition from '../screens/Automate/AddNewAction/SetupConfigCondition';
+import SetupScriptDelay from '../screens/Automate/AddNewAction/SetupScriptDelay';
+import SetupScriptNotify from '../screens/Automate/AddNewAction/SetupScriptNotify';
+import AddAutomationTypeSmart from '../screens/Automate/AddNewAutoSmart/AddAutomationTypeSmart';
+import AddUnknownTypeSmart from '../screens/Automate/AddNewAutoSmart/AddUnknownTypeSmart';
+import EditActionsList from '../screens/Automate/EditActionsList';
+import UpdateActionScript from '../screens/Automate/EditActionsList/UpdateActionScript';
+import AddNewOneTap from '../screens/Automate/OneTap';
+import ScenarioName from '../screens/Automate/Scenario/ScenarioName';
+import ScriptDetail from '../screens/Automate/ScriptDetail';
+import SetSchedule from '../screens/Automate/SetSchedule';
+import ValueChangeName from '../screens/Automate/ValueChange/ValueChangeName';
 import ChangePosition from '../screens/ChangePosition';
+import ConfirmUnitDeletion from '../screens/ConfirmUnitDeletion';
+import DeviceDetail from '../screens/Device/detail';
+import EditDevice from '../screens/Device/EditDevice/index';
+import DeviceInfo from '../screens/DeviceInfo';
+import EmergencySetting from '../screens/EmergencySetting';
+import EnterPassword from '../screens/EnterPassword';
+import GuestInfo from '../screens/GuestInfo';
+import ManageAccessScreen from '../screens/ManageAccess';
+import MoveToAnotherSubUnit from '../screens/MoveToAnotherSubUnit';
+import PlaybackCamera from '../screens/PlayBackCamera';
+import SelectUnit from '../screens/SelectUnit';
+import InfoMemberUnit from '../screens/Sharing/InfoMemberUnit';
 import UnitMemberList from '../screens/Sharing/UnitMemberList';
+import SideMenuDetail from '../screens/SideMenuDetail';
+import EditSubUnit from '../screens/SubUnit/EditSubUnit';
 import ManageSubUnit from '../screens/SubUnit/ManageSubUnit';
-import SelectAddress from '../screens/Unit/SelectAddress';
+import TDSGuide from '../screens/TDSGuide';
 import ChooseLocation from '../screens/Unit/ChooseLocation';
+import UnitDetail from '../screens/Unit/Detail';
 import ManageUnit from '../screens/Unit/ManageUnit';
+import SelectAddress from '../screens/Unit/SelectAddress';
+import SelectAddToFavorites from '../screens/Unit/SelectAddToFavorites';
 import ListSmartAccount from '../screens/Unit/SmartAccount';
-import UnitDetail from '../screens/Unit/Detail';
 import UnitSummary from '../screens/UnitSummary';
 import UVIndexGuide from '../screens/UVIndexGuide';
-import TDSGuide from '../screens/TDSGuide';
 import WaterQualityGuide from '../screens/WaterQualityGuide';
-import DeviceInfo from '../screens/DeviceInfo';
-import AddNewOneTap from '../screens/Automate/OneTap';
-import AddUnknownTypeSmart from '../screens/Automate/AddNewAutoSmart/AddUnknownTypeSmart';
-import PlaybackCamera from '../screens/PlayBackCamera';
-import AllCamera from '../screens/AllCamera';
-import ManageAccessScreen from '../screens/ManageAccess';
-import MoveToAnotherSubUnit from '../screens/MoveToAnotherSubUnit';
-import GuestInfo from '../screens/GuestInfo';
-import ScriptDetail from '../screens/Automate/ScriptDetail';
-import EditActionsList from '../screens/Automate/EditActionsList';
-import SelectUnit from '../screens/SelectUnit';
-import SetSchedule from '../screens/Automate/SetSchedule';
-import SelectMonitorDevices from '../screens/Automate/AddNewAction/SelectMonitorDevices';
-import EditSubUnit from '../screens/SubUnit/EditSubUnit';
-import SetupConfigCondition from '../screens/Automate/AddNewAction/SetupConfigCondition';
-import EditDevice from '../screens/Device/EditDevice/index';
-import EmergencySetting from '../screens/EmergencySetting';
-import ConfirmUnitDeletion from '../screens/ConfirmUnitDeletion';
-import InfoMemberUnit from '../screens/Sharing/InfoMemberUnit';
-import EnterPassword from '../screens/EnterPassword';
-import AllGateway from '../screens/AllGateway';
-import SelectAddToFavorites from '../screens/Unit/SelectAddToFavorites';
-import { HanetCameraStack } from './HanetCameraStack';
 import { axiosGet, fetchWithCache } from '../utils/Apis/axios';
-import SideMenuDetail from '../screens/SideMenuDetail';
-import { styles } from './UnitStackStyles';
-import { useBluetoothConnection } from '../hooks/IoT';
-import { realScanBluetoothDevices } from '../iot/RemoteControl/Bluetooth';
 import { ToastBottomHelper } from '../utils/Utils';
-import ChooseConfig from '../screens/Automate/AddNewAction/ChooseConfig';
-import SelectControlDevices from '../screens/Automate/AddNewAction/SelectControlDevices';
-import ChooseAction from '../screens/Automate/AddNewAction/ChooseAction';
-import ScenarioName from '../screens/Automate/Scenario/ScenarioName';
-import ValueChangeName from '../screens/Automate/ValueChange/ValueChangeName';
-import AddAutomationTypeSmart from '../screens/Automate/AddNewAutoSmart/AddAutomationTypeSmart';
-import SetupScriptNotify from '../screens/Automate/AddNewAction/SetupScriptNotify';
-import SetupScriptDelay from '../screens/Automate/AddNewAction/SetupScriptDelay';
-import UpdateActionScript from '../screens/Automate/EditActionsList/UpdateActionScript';
+import { HanetCameraStack } from './HanetCameraStack';
+import { styles } from './UnitStackStyles';
+import { bleManager } from '../utils/bluetooth';
 
 const Stack = createNativeStackNavigator();
 
-const bleManager = new BleManager();
-
 export const UnitStack = memo((props) => {
   const t = useTranslations();
   const { setAction } = useContext(SCContext);
@@ -173,7 +171,7 @@ export const UnitStack = memo((props) => {
         ...screenOptions,
         headerTitleAlign: 'center',
         headerBackImage: () => (
-          <AntDesign
+          <IconOutline
             name="left"
             size={27}
             color={Colors.Black}
@@ -186,7 +184,8 @@ export const UnitStack = memo((props) => {
           borderBottomWidth: Device.isIOS === 'android' ? 1 : 0,
           borderColor: Colors.Gray4,
         },
-        headerBackTitle: true,
+        headerTintColor: Colors.Black,
+        headerBackTitleVisible: false,
       }}
     >
       <Stack.Screen
@@ -286,28 +285,28 @@ export const UnitStack = memo((props) => {
         name={Route.UVIndexGuide}
         component={UVIndexGuide}
         options={{
-          title: t('UV Index Guide'),
+          headerTitle: t('uv_index_guide'),
         }}
       />
       <Stack.Screen
         name={Route.TDSGuide}
         component={TDSGuide}
         options={{
-          title: t('tds_information'),
+          headerTitle: t('tds_information'),
         }}
       />
       <Stack.Screen
         name={Route.AQIGuide}
         component={AQIGuide}
         options={{
-          title: t('AQI Guide'),
+          headerTitle: t('aqi_guide'),
         }}
       />
       <Stack.Screen
         name={Route.WaterQualityGuide}
         component={WaterQualityGuide}
         options={{
-          title: t('water_quality_guide'),
+          headerTitle: t('water_quality_guide'),
         }}
       />
       <Stack.Screen

package/src/screens/AQIGuide/index.js

@@ -4,7 +4,6 @@ import { getBottomSpace } from 'react-native-iphone-x-helper';
 
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import { Colors, Theme } from '../../configs';
-import useTitleHeader from '../../hooks/Common/useTitleHeader';
 import { AccessibilityLabel } from '../../configs/Constants';
 import Text from '../../commons/Text';
 import SvgSmile from '../../../assets/images/Feeling/smile.svg';
@@ -16,7 +15,6 @@ import { useSCContextSelector } from '../../context';
 
 const AQIGuide = memo(() => {
   const t = useTranslations();
-  useTitleHeader(t('AQI Guide'));
   const language = useSCContextSelector((state) => state.language);
   const data = useMemo(
     () => ({

package/src/screens/ActivityLog/index.js

@@ -7,7 +7,7 @@ import {
   TouchableOpacity,
 } from 'react-native';
 import { useTranslations } from '../../hooks/Common/useTranslations';
-import AntDesign from 'react-native-vector-icons/AntDesign';
+import { IconOutline } from '@ant-design/icons-react-native';
 import { Colors } from '../../configs';
 import { HeaderCustom } from '../../commons/Header';
 import ItemLog from './ItemLog';
@@ -83,7 +83,7 @@ const ActivityLogScreen = ({ route }) => {
         onPress={setShowFilterPopup}
         accessibilityLabel={AccessibilityLabel.FILTER_BUTTON}
       >
-        <AntDesign name={'filter'} size={27} color={Colors.Black} />
+        <IconOutline name={'filter'} size={27} color={Colors.Black} />
       </TouchableOpacity>
     ),
     [setShowFilterPopup]

package/src/screens/AddLocationMaps/index.js

@@ -1,32 +1,32 @@
-import React, { memo, useState, useCallback, useRef, useEffect } from 'react';
-import { View, ScrollView, TouchableOpacity } from 'react-native';
-import MapView, { Marker, Circle, PROVIDER_GOOGLE } from 'react-native-maps';
+import { IconOutline } from '@ant-design/icons-react-native';
 import { useNavigation } from '@react-navigation/native';
-import AntDesign from 'react-native-vector-icons/AntDesign';
-import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
+import React, { memo, useCallback, useEffect, useRef, useState } from 'react';
+import { ScrollView, TouchableOpacity, View } from 'react-native';
+import MapView, { Circle, Marker, PROVIDER_GOOGLE } from 'react-native-maps';
 import { check, RESULTS } from 'react-native-permissions';
+import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
 import { useTranslations } from '../../hooks/Common/useTranslations';
 
-import Text from '../../commons/Text';
 import { FullLoading } from '../../commons';
+import BottomButtonView from '../../commons/BottomButtonView';
 import SearchBarLocation from '../../commons/SearchLocation';
 import RowLocation from '../../commons/SearchLocation/RowLocation';
-import { axiosGet } from '../../utils/Apis/axios';
+import Text from '../../commons/Text';
 import { API, Colors, SCConfig } from '../../configs';
 import {
   AccessibilityLabel,
-  MAP_INITIAL_REGION,
   EOH_LOCATION,
+  MAP_INITIAL_REGION,
 } from '../../configs/Constants';
-import styles from './indexStyle';
-import Routes from '../../utils/Route';
+import { axiosGet } from '../../utils/Apis/axios';
 import {
   GEOLOCATION_ERROR,
   keyPermission,
   OpenSetting,
 } from '../../utils/Permission/common';
+import Routes from '../../utils/Route';
 import { openPromptEnableLocation } from '../../utils/Setting/Location';
-import BottomButtonView from '../../commons/BottomButtonView';
+import styles from './indexStyle';
 
 navigator.geolocation = require('@react-native-community/geolocation');
 
@@ -180,12 +180,9 @@ const AddLocationMaps = memo(() => {
   return (
     <View style={styles.container}>
       <Text color={Colors.Gray9} size={24} semibold style={styles.textHeader}>
-        {t('geolocation')}
+        {t('location')}
       </Text>
       <View style={styles.content}>
-        <Text color={Colors.Gray8} size={12} style={styles.textExplain}>
-          {t('text_explain_add_geolocation')}
-        </Text>
         <View style={styles.searchLocation}>
           <SearchBarLocation
             input={input?.description || input}
@@ -225,8 +222,8 @@ const AddLocationMaps = memo(() => {
                   style={styles.button}
                   accessibilityLabel={AccessibilityLabel.BUTTON_CHOOSE_ON_MAP}
                 >
-                  <AntDesign
-                    name="enviroment"
+                  <IconOutline
+                    name="environment"
                     size={27}
                     color={Colors.Primary}
                   />
@@ -274,8 +271,8 @@ const AddLocationMaps = memo(() => {
                   }}
                   tracksViewChanges={false}
                 >
-                  <AntDesign
-                    name="enviroment"
+                  <IconOutline
+                    name="environment"
                     size={27}
                     color={Colors.Blue10}
                   />

package/src/screens/AddLocationMaps/indexStyle.js

@@ -10,6 +10,7 @@ export default StyleSheet.create({
     paddingTop: getStatusBarHeight() + 16,
   },
   textHeader: {
+    textAlign: 'center',
     marginHorizontal: 16,
   },
   content: {

package/src/screens/AddNewGateway/RenameNewDevices.js

@@ -1,6 +1,6 @@
 import React, { memo, useCallback, useEffect, useState, useMemo } from 'react';
 import { ScrollView, TouchableOpacity, View } from 'react-native';
-import AntDesign from 'react-native-vector-icons/AntDesign';
+import { IconOutline } from '@ant-design/icons-react-native';
 import { CommonActions, useNavigation } from '@react-navigation/native';
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import { Colors } from '../../configs';
@@ -357,7 +357,7 @@ const RenameNewDevices = memo(({ route }) => {
       />
       <View style={styles.content}>
         <View style={styles.viewIconSuccess}>
-          <AntDesign name="check-circle" size={28} color={Colors.Green6} />
+          <IconOutline name="check-circle" size={28} color={Colors.Green6} />
           <Text
             semibold
             color={Colors.Black}

package/src/screens/AddNewGateway/SelectDeviceType.js

@@ -192,7 +192,7 @@ const SelectDeviceType = ({ route }) => {
   useEffect(() => {
     const fetchCountSummary = async () => {
       const { success, data } = await axiosGet(API.DEV_MODE.GATEWAY.COUNT(), {
-        unit: unit?.id,
+        params: { unit: unit?.id },
       });
       if (success) {
         setUnitCountSummary(data);

package/src/screens/AllGateway/GatewayInfo/__test__/index.test.js

@@ -45,20 +45,20 @@ describe('Test GatewayInfo', () => {
     });
   });
 
+  afterEach(() => {
+    mock.reset();
+  });
+
   it('test render GatewayInfo', async () => {
     useRoute.mockReturnValue({
       params: { chipId: 1 },
     });
     mock.onGet(API.DEV_MODE.GATEWAY.DETAIL(1)).reply(200, {
-      results: [
-        {
-          id: 1,
-          name: 'device 1',
-          arduino_gateway: 1,
-          modbus_gateway: 1,
-          zigbee_gateway: 1,
-        },
-      ],
+      id: 1,
+      name: 'device 1',
+      arduino_gateway: 1,
+      modbus_gateway: 1,
+      zigbee_gateway: 1,
     });
     await act(async () => {
       tree = await create(wrapComponent());
@@ -118,4 +118,20 @@ describe('Test GatewayInfo', () => {
     });
     expect(global.mockedPop).toHaveBeenCalledWith(2);
   });
+
+  it('test render GatewayInfo onPress cancel delete gateway', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const btnDelete = buttonDelete(instance);
+    await act(async () => {
+      await btnDelete.props.onPress();
+    });
+    const modal = instance.findByType(ModalPopupCT);
+    await act(async () => {
+      await modal.props.onPressCancel();
+    });
+    expect(modal.props.isVisible).toBeFalsy();
+  });
 });