@eohjsc/react-native-smart-city 0.2.92 → 0.2.93

package/src/screens/Device/__test__/detail.test.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ScrollView } from 'react-native';
+import { Alert, ScrollView } from 'react-native';
 import { act, create } from 'react-test-renderer';
 import DeviceDetail from '../detail';
 import axios from 'axios';
@@ -69,12 +69,17 @@ const mockAxios = (
   });
 };
 
-const wrapComponent = (account, route) => (
-  <SCProvider initState={mockSCStore({})}>
+let store = mockSCStore({});
+
+const wrapComponent = (store, account, route) => (
+  <SCProvider initState={store}>
     <DeviceDetail account={account} route={route} />
   </SCProvider>
 );
 
+const mockAlertShow = jest.fn();
+Alert.alert = mockAlertShow;
+
 describe('test DeviceDetail', () => {
   let tree;
   let route;
@@ -119,78 +124,79 @@ describe('test DeviceDetail', () => {
     mockedNavigate.mockClear();
   });
 
-  test('render DeviceDetail render SensorDisplayItem', async () => {
-    const responseDisplay = {
-      status: 200,
-      data: {
-        items: [
-          {
-            configuration: {
-              id: 2,
-              name: 'EoH Gate',
-              preview_uri:
-                'http://admin:admin123@203.205.32.86:10080/Streaming/Channels/2/picture',
-              uri: 'rtsp://admin:admin123@203.205.32.86:10554/Streaming/Channels/1/',
+  let data_sensor_display = {
+    items: [
+      {
+        configuration: {
+          id: 2,
+          name: 'EoH Gate',
+          preview_uri:
+            'http://admin:admin123@203.205.32.86:10080/Streaming/Channels/2/picture',
+          uri: 'rtsp://admin:admin123@203.205.32.86:10554/Streaming/Channels/1/',
+        },
+        id: 17,
+        order: 1,
+        template: 'camera',
+        type: 'camera',
+      },
+      {
+        configuration: {
+          id: 1,
+          template: 'three_button_action_template',
+          title: '',
+          configuration: {
+            action1: '2b949045-8e03-4c07-a855-7794ade2e69c',
+            action1_data: {
+              color: '#00979D',
+              command_prefer_over_bluetooth: false,
+              command_prefer_over_googlehome: false,
+              command_prefer_over_internet: true,
+              googlehome_actions: [],
+              icon: 'caret-up',
+              id: 9,
+              key: '2b949045-8e03-4c07-a855-7794ade2e69c',
             },
-            id: 17,
-            order: 1,
-            template: 'camera',
-            type: 'camera',
-          },
-          {
-            configuration: {
-              id: 1,
-              template: 'three_button_action_template',
-              title: '',
-              configuration: {
-                action1: '2b949045-8e03-4c07-a855-7794ade2e69c',
-                action1_data: {
-                  color: '#00979D',
-                  command_prefer_over_bluetooth: false,
-                  command_prefer_over_googlehome: false,
-                  command_prefer_over_internet: true,
-                  googlehome_actions: [],
-                  icon: 'caret-up',
-                  id: 9,
-                  key: '2b949045-8e03-4c07-a855-7794ade2e69c',
-                },
-                action2: '38347d5e-4418-4ab0-978c-c82f4c034897',
-                action2_data: {
-                  color: '#00979D',
-                  command_prefer_over_bluetooth: false,
-                  command_prefer_over_googlehome: false,
-                  command_prefer_over_internet: true,
-                  googlehome_actions: [],
-                  icon: 'stop',
-                  id: 11,
-                  key: '38347d5e-4418-4ab0-978c-c82f4c034897',
-                },
-                action3: 'a492e08c-8cb1-44ee-8ea0-46aaca4e5141',
-                action3_data: {
-                  color: '#00979D',
-                  command_prefer_over_bluetooth: false,
-                  command_prefer_over_googlehome: false,
-                  command_prefer_over_internet: true,
-                  googlehome_actions: [],
-                  icon: 'caret-down',
-                  id: 10,
-                  key: 'a492e08c-8cb1-44ee-8ea0-46aaca4e5141',
-                },
-                icon1: 'caret-up',
-                icon2: 'stop',
-                icon3: 'caret-down',
-                text1: 'UP',
-                text2: 'STOP/UNLOCK',
-                text3: 'DOWN',
-              },
+            action2: '38347d5e-4418-4ab0-978c-c82f4c034897',
+            action2_data: {
+              color: '#00979D',
+              command_prefer_over_bluetooth: false,
+              command_prefer_over_googlehome: false,
+              command_prefer_over_internet: true,
+              googlehome_actions: [],
+              icon: 'stop',
+              id: 11,
+              key: '38347d5e-4418-4ab0-978c-c82f4c034897',
             },
-            id: 18,
-            order: 2,
-            template: 'action',
-            type: 'action',
+            action3: 'a492e08c-8cb1-44ee-8ea0-46aaca4e5141',
+            action3_data: {
+              color: '#00979D',
+              command_prefer_over_bluetooth: false,
+              command_prefer_over_googlehome: false,
+              command_prefer_over_internet: true,
+              googlehome_actions: [],
+              icon: 'caret-down',
+              id: 10,
+              key: 'a492e08c-8cb1-44ee-8ea0-46aaca4e5141',
+            },
+            icon1: 'caret-up',
+            icon2: 'stop',
+            icon3: 'caret-down',
+            text1: 'UP',
+            text2: 'STOP/UNLOCK',
+            text3: 'DOWN',
           },
-        ],
+        },
+        id: 18,
+        order: 2,
+        template: 'action',
+        type: 'action',
       },
+    ],
+  };
+  test('render DeviceDetail render SensorDisplayItem', async () => {
+    const responseDisplay = {
+      status: 200,
+      data: data_sensor_display,
     };
 
     const responseRemoteControl = {
@@ -216,7 +222,7 @@ describe('test DeviceDetail', () => {
     mockAxios(responseDisplay, responseDisplayValueV2, responseRemoteControl);
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
     expect(axios.get).toHaveBeenCalledTimes(4);
@@ -277,7 +283,7 @@ describe('test DeviceDetail', () => {
 
   test('AlertSendConfirm onSendNowAlert', async () => {
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
     const alertSendConfirm = instance.findByType(AlertSendConfirm);
@@ -306,7 +312,7 @@ describe('test DeviceDetail', () => {
 
   test('ButtonPopup onClick', async () => {
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
     const buttonPopup = instance.find(
@@ -336,7 +342,7 @@ describe('test DeviceDetail', () => {
 
   test('ButtonPopup render', async () => {
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
     const buttonPopupTitle = instance.find(
@@ -359,7 +365,7 @@ describe('test DeviceDetail', () => {
 
   test('ScrollView onRefresh', async () => {
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
     const scrollView = instance.findByType(ScrollView);
@@ -499,7 +505,7 @@ describe('test DeviceDetail', () => {
     mockAxios(responseDisplay, responseDisplayValueV2);
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
 
     const instance = tree.root;
@@ -563,7 +569,7 @@ describe('test DeviceDetail', () => {
     mockAxios(responseDisplay, responseDisplayValueV2);
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
 
     const instance = tree.root;
@@ -611,7 +617,7 @@ describe('test DeviceDetail', () => {
     mockAxios(responseDisplay, responseDisplayValueV2);
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
 
     const instance = tree.root;
@@ -628,7 +634,7 @@ describe('test DeviceDetail', () => {
     route.params.sensorData.is_managed_by_backend = false;
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
 
     expect(axios.get).not.toBeCalledWith(API.SENSOR.DISPLAY_VALUES_V2(1));
@@ -675,7 +681,7 @@ describe('test DeviceDetail', () => {
     mockAxios(responseDisplay, responseDisplayValueV2);
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
 
     const instance = tree.root;
@@ -689,7 +695,7 @@ describe('test DeviceDetail', () => {
 
   test('HeaderDevice button more onClick', async () => {
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
     const menu = instance.findByType(MenuActionMore);
@@ -711,7 +717,7 @@ describe('test DeviceDetail', () => {
     sensor.is_favourite = false;
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
 
@@ -736,10 +742,10 @@ describe('test DeviceDetail', () => {
     const unit_id = route.params.unitData.id;
     const station_id = route.params.station.id;
     const sensor = route.params.sensorData;
-    sensor.is_favourite = true;
+    store.unit.favoriteDeviceIds = [sensor.id];
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
 
@@ -797,7 +803,7 @@ describe('test DeviceDetail', () => {
     mockAxios(responseDisplay, responseDisplayValueV2);
 
     await act(async () => {
-      tree = await create(wrapComponent(account, route));
+      tree = await create(wrapComponent(store, account, route));
     });
     const instance = tree.root;
     const menu = instance.findByType(MenuActionMore);
@@ -816,4 +822,31 @@ describe('test DeviceDetail', () => {
       },
     });
   });
+
+  test('Open popup ble when server down', async () => {
+    store.app.isBluetoothEnabled = false;
+    data_sensor_display.items[1].configuration.configuration.action1_data.command_prefer_over_bluetooth = true;
+    const responseDisplay = {
+      status: 200,
+      data: data_sensor_display,
+      resp_status: 503,
+    };
+
+    const responseDisplayValueV2 = {
+      status: 503,
+      resp_status: 503,
+      data: {
+        configs: [],
+        is_connected: true,
+        last_updated: '2021-01-24T12:00:00.000Z',
+      },
+    };
+
+    mockAxios(responseDisplay, responseDisplayValueV2);
+
+    await act(async () => {
+      await create(wrapComponent(store, account, route));
+    });
+    expect(mockAlertShow).toBeCalled();
+  });
 });

package/src/screens/Device/detail.js

@@ -16,7 +16,7 @@ import { Icon } from '@ant-design/react-native';
 import { useCountUp } from './hooks/useCountUp';
 import { getData as getLocalData } from '../../utils/Storage';
 import { API, Colors } from '../../configs';
-import { axiosGet, axiosPost } from '../../utils/Apis/axios';
+import { axiosGet } from '../../utils/Apis/axios';
 import {
   isDeviceConnected,
   scanBluetoothDevices,
@@ -29,6 +29,7 @@ import {
   useAlertResolveEmergency,
   useEmergencyButton,
 } from './hooks/useEmergencyButton';
+import { useFavoriteDevice } from './hooks/useFavoriteDevice';
 import BottomButtonView from '../../commons/BottomButtonView';
 import Text from '../../commons/Text';
 import { transformDatetime } from '../../utils/Converter/time';
@@ -69,7 +70,6 @@ const DeviceDetail = ({ route }) => {
   const [unit, setUnit] = useState(unitData || { id: unitId });
   const [sensor, setSensor] = useState(sensorData || { id: sensorId });
   const [station, setStation] = useState(sensor?.station);
-  const [isFavourite, setIsFavourite] = useState(sensor?.is_favourite);
   const { isOwner } = useIsOwnerOfUnit(unit?.user_id);
   const [sensorName, setSensorName] = useState(sensor?.name);
   const [lockShowing, acquireLockShowing, releaseLockShowing] = useBoolean();
@@ -83,9 +83,9 @@ const DeviceDetail = ({ route }) => {
   const isNetworkConnected = useSCContextSelector(
     (state) => state.app.isNetworkConnected
   );
-  const isBluetoothEnabled = useSCContextSelector(
-    (state) => state.app.isBluetoothEnabled
-  );
+  const isBluetoothEnabled = useSCContextSelector((state) => {
+    return state.app.isBluetoothEnabled;
+  });
 
   const isDeviceConnectedViaBle = useMemo(
     () =>
@@ -110,41 +110,28 @@ const DeviceDetail = ({ route }) => {
 
   useDisconnectedDevice(sensorName, isDeviceHasBle, serverDown);
 
-  const isShowSetupEmergencyContact = useMemo(() => {
-    display.items.filter(
-      (item) =>
-        item.type === 'emergency' && item.configuration.type === 'button'
-    ).length > 0;
-  }, [display.items]);
+  const isShowSetupEmergencyContact = useMemo(
+    () =>
+      display.items.filter(
+        (item) =>
+          item.type === 'emergency' && item.configuration.type === 'button'
+      ).length > 0,
+    [display.items]
+  );
 
-  const isShowSetUpSmartLock = useMemo(() => {
-    display.items.filter(
-      (item) =>
-        item.type === 'smartLock' && item.configuration.type === 'button'
-    ).length > 0;
-  }, [display.items]);
+  const isShowSetUpSmartLock = useMemo(
+    () =>
+      display.items.filter(
+        (item) =>
+          item.type === 'smartLock' && item.configuration.type === 'button'
+      ).length > 0,
+    [display.items]
+  );
 
-  const addToFavorites = useCallback(async () => {
-    const { success } = await axiosPost(
-      API.SENSOR.ADD_TO_FAVOURITES(unit?.id, sensor?.station?.id, sensor?.id)
-    );
-    if (success) {
-      setIsFavourite(true);
-    }
-  }, [unit, sensor]);
-
-  const removeFromFavorites = useCallback(async () => {
-    const { success } = await axiosPost(
-      API.SENSOR.REMOVE_FROM_FAVOURITES(
-        unit?.id,
-        sensor?.station.id,
-        sensor?.id
-      )
-    );
-    if (success) {
-      setIsFavourite(false);
-    }
-  }, [unit, sensor]);
+  const { isFavorite, addToFavorites, removeFromFavorites } = useFavoriteDevice(
+    unit,
+    sensor
+  );
 
   const currentUserId = useSelector((state) =>
     get(state, 'auth.account.user.id', 0)
@@ -162,10 +149,10 @@ const DeviceDetail = ({ route }) => {
   }, [unitId]);
 
   useEffect(() => {
-    if (unitId) {
+    if (unitId && !unitData) {
       fetchUnitDetail();
     }
-  }, [fetchUnitDetail, unitData, unitId]);
+  }, [fetchUnitDetail, unitId, unitData]);
 
   const fetchSensorDetail = useCallback(async () => {
     const { success, data } = await axiosGet(
@@ -179,10 +166,10 @@ const DeviceDetail = ({ route }) => {
   }, [sensorId]);
 
   useEffect(() => {
-    if (sensorId) {
+    if (sensorId && !sensorData) {
       fetchSensorDetail();
     }
-  }, [fetchSensorDetail, sensorData, sensorId]);
+  }, [fetchSensorDetail, sensorId, sensorData]);
 
   const fetchDataDeviceDetail = useCallback(async () => {
     if (!token) {
@@ -192,7 +179,7 @@ const DeviceDetail = ({ route }) => {
       return;
     }
 
-    const { success, data, resp_status } = await axiosGet(
+    const { success, data } = await axiosGet(
       API.SENSOR.DISPLAY(sensor?.id),
       {},
       true
@@ -216,8 +203,6 @@ const DeviceDetail = ({ route }) => {
           }
         }
       }
-    } else if (resp_status >= 500) {
-      setServerDown(true);
     }
     setLoading((preState) => ({ ...preState, displayTemplate: false }));
 
@@ -347,7 +332,7 @@ const DeviceDetail = ({ route }) => {
         text: t('passcode_list'),
       });
     }
-    if (!isFavourite) {
+    if (!isFavorite) {
       menuItems.unshift({
         doAction: addToFavorites,
         text: t('add_to_favorites'),
@@ -365,7 +350,7 @@ const DeviceDetail = ({ route }) => {
     isShowSetupEmergencyContact,
     isShowSetUpSmartLock,
     t,
-    isFavourite,
+    isFavorite,
     sensor,
     unit,
     sensorName,
@@ -434,7 +419,7 @@ const DeviceDetail = ({ route }) => {
     });
 
     const fetchValues = async () => {
-      const { success, data } = await axiosGet(
+      const { success, data, resp_status } = await axiosGet(
         API.SENSOR.DISPLAY_VALUES_V2(sensor?.id),
         {
           params: params,
@@ -445,6 +430,8 @@ const DeviceDetail = ({ route }) => {
         setConnected(data.is_connected);
         transformDatetime(data, ['last_updated']);
         setLastUpdated(data.last_updated);
+      } else if (resp_status >= 500) {
+        setServerDown(true);
       }
       setLoading((preState) => ({ ...preState, isConnected: false }));
     };
@@ -626,10 +613,10 @@ const DeviceDetail = ({ route }) => {
       <View style={styles.headerRight}>
         <TouchableOpacity
           style={styles.buttonStar}
-          onPress={isFavourite ? removeFromFavorites : addToFavorites}
+          onPress={isFavorite ? removeFromFavorites : addToFavorites}
           testID={TESTID.HEADER_DEVICE_BUTTON_STAR}
         >
-          {isFavourite ? (
+          {isFavorite ? (
             <IconFill name="star" size={25} color={Colors.Yellow6} />
           ) : (
             <IconOutline name="star" size={25} />
@@ -653,7 +640,7 @@ const DeviceDetail = ({ route }) => {
       </View>
     ),
     [
-      isFavourite,
+      isFavorite,
       removeFromFavorites,
       addToFavorites,
       isShowSetupEmergencyContact,

package/src/screens/Device/hooks/useFavoriteDevice.js

@@ -0,0 +1,38 @@
+import { useContext, useCallback } from 'react';
+import { API } from '../../../configs';
+import { SCContext, useSCContextSelector } from '../../../context';
+import { Action } from '../../../context/actionType';
+import { axiosPost } from '../../../utils/Apis/axios';
+
+export const useFavoriteDevice = (unit, device) => {
+  const { setAction } = useContext(SCContext);
+  const favoriteDeviceIds = useSCContextSelector(
+    (state) => state.unit.favoriteDeviceIds
+  );
+
+  const isFavorite = favoriteDeviceIds.includes(device.id);
+
+  const addToFavorites = useCallback(async () => {
+    const { success } = await axiosPost(
+      API.SENSOR.ADD_TO_FAVOURITES(unit?.id, device?.station?.id, device?.id)
+    );
+    success && setAction(Action.ADD_DEVICE_TO_FAVORITES, device.id);
+  }, [unit, device, setAction]);
+
+  const removeFromFavorites = useCallback(async () => {
+    const { success } = await axiosPost(
+      API.SENSOR.REMOVE_FROM_FAVOURITES(
+        unit?.id,
+        device?.station?.id,
+        device?.id
+      )
+    );
+    success && setAction(Action.REMOVE_DEVICE_FROM_FAVORITES, device.id);
+  }, [unit, device, setAction]);
+
+  return {
+    isFavorite,
+    addToFavorites,
+    removeFromFavorites,
+  };
+};

package/src/screens/EmergencyContacts/EmergencyContactsList.js

@@ -82,7 +82,7 @@ export const EmergencyContactsList = ({ route }) => {
       id: 2,
       text: t('select_unit_members'),
       route: Routes.EmergencyContactsSelectContacts,
-      data: { unitId },
+      data: { unitId, group },
     },
   ];