@eohjsc/react-native-smart-city 0.6.2 → 0.7.0

package/src/screens/Unit/Summaries.js

@@ -10,6 +10,7 @@ import { AccessibilityLabel } from '../../configs/Constants';
 import { useSCContextSelector } from '../../context';
 
 const Summaries = memo(({ unit }) => {
+  const { id } = unit;
   const [unitSummaries, setUnitSummaries] = useState([]);
   const isFocused = useIsFocused();
   const navigation = useNavigation();
@@ -17,31 +18,32 @@ const Summaries = memo(({ unit }) => {
   const timeoutId = useRef(null);
 
   const fetchUnitSummary = useCallback(async () => {
-    if (!unit.id) {
+    if (!id) {
       return false;
     }
 
     const { success, data } = await axiosGet(
-      API.UNIT.UNIT_SUMMARY(unit.id),
+      API.UNIT.UNIT_SUMMARY(id),
       {},
       true
     );
-    if (success && data.length) {
+    if (success && data?.length) {
       setUnitSummaries(data);
+      return true;
     }
-    return success && data.length > 0;
-  }, [unit.id]);
+    return false;
+  }, [id]);
 
   const goToSummary = useCallback(
     (summary) => {
       navigation.navigate(Routes.UnitSummary, {
         summaryId: summary.id,
-        unitId: unit.id,
+        unitId: id,
         summaryData: summary,
         unitData: unit,
       });
     },
-    [navigation, unit]
+    [navigation, unit, id]
   );
 
   const continuousFetchSummary = useCallback(async () => {
@@ -79,32 +81,25 @@ const Summaries = memo(({ unit }) => {
   const { dataNotification } = useReceiveNotifications();
 
   useEffect(() => {
-    if (dataNotification) {
-      const { summary_id } = dataNotification.params || {};
-      if (summary_id) {
-        fetchUnitSummary();
-      }
+    if (dataNotification?.params?.summary_id) {
+      fetchUnitSummary();
     }
   }, [dataNotification, fetchUnitSummary]);
 
+  if (unitSummaries.length === 0) {
+    return null;
+  }
+
   return (
-    <>
-      {unitSummaries.length > 0 && (
-        <ScrollView
-          horizontal
-          scrollIndicatorInsets={{ right: 1 }}
-          accessibilityLabel={AccessibilityLabel.UNIT_DETAIL_UNIT_SUMMARY_VIEW}
-        >
-          {unitSummaries.map((item, index) => (
-            <SummaryItem
-              key={(item?.id || index).toString()}
-              item={item}
-              goToSummary={goToSummary}
-            />
-          ))}
-        </ScrollView>
-      )}
-    </>
+    <ScrollView
+      horizontal
+      scrollIndicatorInsets={{ right: 1 }}
+      accessibilityLabel={AccessibilityLabel.UNIT_DETAIL_UNIT_SUMMARY_VIEW}
+    >
+      {unitSummaries.map((item) => (
+        <SummaryItem key={item.id} item={item} goToSummary={goToSummary} />
+      ))}
+    </ScrollView>
   );
 });
 

package/src/screens/Unit/__test__/AddMenu.test.js

@@ -77,7 +77,10 @@ describe('Test AddMenu Unit', () => {
 
     expect(menuActionAddnew.props.visible).toBe(true);
     expect(mockedAfterItemClick).toHaveBeenCalled();
-    expect(mockedNavigate).toHaveBeenCalledWith('route test', 'data test');
+    expect(global.mockedNavigate).toHaveBeenCalledWith(
+      'route test',
+      'data test'
+    );
   });
 
   it('add new device but have no permission', async () => {
@@ -201,7 +204,7 @@ describe('Test AddMenu Unit', () => {
     await act(async () => {
       menuActionAddnew.props.onItemClick(menuActionAddnew.props.dataActions[3]);
     });
-    expect(mockedNavigate).toBeCalledWith(Routes.SmartAccountStack, {
+    expect(global.mockedNavigate).toBeCalledWith(Routes.SmartAccountStack, {
       params: { unitId: 1, unitName: 'Unit 1' },
       screen: 'SmartAccount',
     });

package/src/screens/Unit/__test__/CheckSendEmail.test.js

@@ -34,18 +34,6 @@ jest.mock('react-native-onesignal', () => {
   };
 });
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      navigate: jest.fn(),
-      goBack: jest.fn(),
-    }),
-    useFocusEffect: jest.fn(),
-    useIsFocused: () => true,
-  };
-});
-
 const wrapComponent = (route, unitData, account) => (
   <SCProvider initState={mockSCStore({})}>
     <UnitDetail

package/src/screens/Unit/__test__/ChooseLocation.test.js

@@ -9,7 +9,6 @@ import ChooseLocation from '../ChooseLocation';
 import { API } from '../../../configs';
 import BottomButtonView from '../../../commons/BottomButtonView';
 import api from '../../../utils/Apis/axios';
-import { useNavigation } from '@react-navigation/native';
 
 const wrapComponent = (route) => (
   <SCProvider initState={mockSCStore({})}>
@@ -72,8 +71,6 @@ describe('Test ChooseLocation', () => {
   });
 
   it('test done choose location', async () => {
-    const mockGoBack = useNavigation().goBack;
-
     await act(async () => {
       tree = await create(wrapComponent(route));
     });
@@ -108,6 +105,6 @@ describe('Test ChooseLocation', () => {
       latitude: 20,
       longitude: 20,
     });
-    expect(mockGoBack).toBeCalled();
+    expect(global.mockedGoBack).toBeCalled();
   });
 });

package/src/screens/Unit/__test__/Detail.test.js

@@ -8,8 +8,9 @@ import {
   useIsFocused,
   useNavigation,
   useFocusEffect,
+  useRoute,
 } from '@react-navigation/native';
-import AsyncStorage from '@react-native-community/async-storage';
+import AsyncStorage from '@react-native-async-storage/async-storage';
 import UnitDetail from '../Detail';
 import { API } from '../../../configs';
 import { AccessibilityLabel } from '../../../configs/Constants';
@@ -108,7 +109,7 @@ describe('Test UnitDetail', () => {
     await act(async () => {
       CameraDeviceViews[0].props.goToPlayBack();
     });
-    expect(mockedNavigate).toBeCalledWith(Routes.PlaybackCamera, {
+    expect(global.mockedNavigate).toBeCalledWith(Routes.PlaybackCamera, {
       item: undefined,
       thumbnail: undefined,
     });
@@ -430,7 +431,7 @@ describe('Test UnitDetail', () => {
     await act(async () => {
       await goDetailButton[1].props.onPress();
     });
-    expect(mockedNavigate).toHaveBeenCalled();
+    expect(global.mockedNavigate).toHaveBeenCalled();
   });
 
   it('render subunit favorites', async () => {
@@ -497,8 +498,9 @@ describe('Test UnitDetail', () => {
 
   it('test get automate onPress goBack', async () => {
     Platform.OS = 'ios';
-    route.params.isSuccessfullyConnected = true;
+    route.params.routeName = Routes.Dashboard;
     jest.useFakeTimers();
+
     mock.onGet(getAutomates).reply(200, [{}]);
     await act(async () => {
       tree = await renderer.create(wrapComponent(route, account));
@@ -509,24 +511,24 @@ describe('Test UnitDetail', () => {
     const instance = tree.root;
     const preventAccess = instance.findByType(PreventAccess);
     expect(preventAccess).toBeDefined();
-    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
+
+    const touchableOpacities = instance.findAllByType(TouchableOpacity);
     await act(async () => {
-      await TouchableOpacities[0].props.onPress();
+      await touchableOpacities[0].props.onPress();
     });
-    expect(mockedNavigate).toBeCalled();
+    expect(global.mockedGoBack).toBeCalled();
   });
 
   it('test onPress goBack with routeName', async () => {
-    route.params.routeName = 'test';
-    route.params.isSuccessfullyConnected = false;
+    useRoute.mockReturnValue({ params: { routeName: Routes.Dashboard } });
     await act(async () => {
       tree = await renderer.create(wrapComponent(route, account));
     });
     const instance = tree.root;
-    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
+    const touchableOpacities = instance.findAllByType(TouchableOpacity);
     await act(async () => {
-      await TouchableOpacities[0].props.onPress();
+      await touchableOpacities[0].props.onPress();
     });
-    expect(mockedNavigate).toBeCalled();
+    expect(global.mockedNavigate).toBeCalled();
   });
 });

package/src/screens/Unit/__test__/ManageUnit.test.js

@@ -16,17 +16,6 @@ import { AlertAction } from '../../../commons';
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const mockNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useRoute: jest.fn(),
-    useNavigation: () => ({
-      navigate: mockNavigate,
-    }),
-  };
-});
-
 jest.mock('../../../hooks/Common', () => {
   return {
     useIsOwnerOfUnit: () => ({ isOwner: true }),
@@ -52,10 +41,6 @@ describe('Test Manage Unit', () => {
     },
   };
 
-  beforeEach(() => {
-    mockNavigate.mockClear();
-  });
-
   const getElement = async (instance) => {
     const changeName = instance.findAll(
       (item) =>
@@ -241,7 +226,7 @@ describe('Test Manage Unit', () => {
     await act(async () => {
       buttonWrapper.props.onPress();
     });
-    expect(mockNavigate).toBeCalled();
+    expect(global.mockedNavigate).toBeCalled();
   });
 
   it('test onPress goToManageSubUnit', async () => {
@@ -259,6 +244,6 @@ describe('Test Manage Unit', () => {
     await act(async () => {
       buttonWrapper.props.onPress();
     });
-    expect(mockNavigate).toBeCalled();
+    expect(global.mockedNavigate).toBeCalled();
   });
 });

package/src/screens/Unit/__test__/MoreMenu.test.js

@@ -7,16 +7,6 @@ import MoreMenu from '../MoreMenu';
 
 const mockHidePopover = jest.fn();
 
-const mockNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      navigate: mockNavigate,
-    }),
-  };
-});
-
 const wrapComponent = (showingPopover) => (
   <SCProvider initState={mockSCStore({})}>
     <MoreMenu showingPopover={showingPopover} hidePopover={mockHidePopover} />
@@ -54,6 +44,6 @@ describe('Test MoreMenu', () => {
       await menuActionMore.props.onItemClick({ route: 'DeviceDetail' });
     });
     expect(mockHidePopover).toBeCalled();
-    expect(mockNavigate).toBeCalledWith('DeviceDetail', undefined);
+    expect(global.mockedNavigate).toBeCalledWith('DeviceDetail', undefined);
   });
 });

package/src/screens/Unit/__test__/SelectAddToFavorites.test.js

@@ -20,16 +20,6 @@ const wrapComponent = (route) => (
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const mockGoBack = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      goBack: mockGoBack,
-    }),
-  };
-});
-
 describe('Test SelectAddToFavorites', () => {
   let tree, route;
   let dataDevice = [
@@ -101,7 +91,6 @@ describe('Test SelectAddToFavorites', () => {
   ];
 
   beforeEach(() => {
-    mockGoBack.mockClear();
     mock.resetHistory();
     route = {
       params: {
@@ -165,7 +154,7 @@ describe('Test SelectAddToFavorites', () => {
       await bottomButton.props.onPressMain();
     });
     expect(mock.history.post).toHaveLength(2);
-    expect(mockGoBack).toBeCalled();
+    expect(global.mockedGoBack).toBeCalled();
   });
 
   it('test select only devices then click done', async () => {
@@ -198,7 +187,7 @@ describe('Test SelectAddToFavorites', () => {
       await bottomButton.props.onPressMain();
     });
     expect(mock.history.post).toHaveLength(1);
-    expect(mockGoBack).toBeCalled();
+    expect(global.mockedGoBack).toBeCalled();
   });
 
   it('test select only scripts then click done', async () => {
@@ -227,7 +216,7 @@ describe('Test SelectAddToFavorites', () => {
       await bottomButton.props.onPressMain();
     });
     expect(mock.history.post).toHaveLength(1);
-    expect(mockGoBack).toBeCalled();
+    expect(global.mockedGoBack).toBeCalled();
   });
 
   it('test click done call api fail not goBack', async () => {

package/src/screens/Unit/__test__/SelectAddress.test.js

@@ -28,18 +28,6 @@ const wrapComponent = (route) => (
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const mockNavigate = jest.fn();
-const mockGoBack = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      navigate: mockNavigate,
-      goBack: mockGoBack,
-    }),
-  };
-});
-
 jest.mock('react-native-maps', () => {
   const { forwardRef } = require('react');
   const { View } = require('react-native');
@@ -105,7 +93,6 @@ describe('Test SelectAddress', () => {
       },
     };
     mockUpdateLocation.mockClear();
-    mockGoBack.mockClear();
     mock.resetHistory();
   });
 
@@ -119,7 +106,7 @@ describe('Test SelectAddress', () => {
       await bottomButton.props.onPressMain();
     });
     expect(mockUpdateLocation).not.toBeCalled();
-    expect(mockGoBack).not.toBeCalled();
+    expect(global.mockedGoBack).not.toBeCalled();
   });
 
   it('test search location', async () => {
@@ -176,7 +163,7 @@ describe('Test SelectAddress', () => {
       await bottomButton.props.onPressMain();
     });
     expect(mockUpdateLocation).toBeCalledWith('1');
-    expect(mockGoBack).toBeCalled();
+    expect(global.mockedGoBack).toBeCalled();
   });
 
   it('test chose search result will center map', async () => {
@@ -336,7 +323,7 @@ describe('Test SelectAddress', () => {
     await act(async () => {
       await bottomButton.props.onPressMain();
     });
-    expect(mockGoBack).toBeCalled();
+    expect(global.mockedGoBack).not.toBeCalled();
   });
 
   it('test get current location failed permission denied', async () => {
@@ -469,6 +456,6 @@ describe('Test SelectAddress', () => {
     await act(async () => {
       await button.props.onPress();
     });
-    expect(mockNavigate).toBeCalled();
+    expect(global.mockedNavigate).toBeCalled();
   });
 });

package/src/screens/Unit/__test__/SmartAccount.test.js

@@ -50,9 +50,9 @@ describe('Test SmartAccount', () => {
       },
     ],
   };
-  const mockNavigate = useNavigation().navigate;
+  const mockedNavigate = useNavigation().navigate;
   beforeEach(() => {
-    mockNavigate.mockReset();
+    mockedNavigate.mockReset();
     mock.resetHistory();
   });
 
@@ -79,15 +79,18 @@ describe('Test SmartAccount', () => {
     await act(async () => {
       await alertAction[0].props.leftButtonClick();
     });
-    expect(mockNavigate).toHaveBeenCalledWith(Routes.SmartAccountStack, {
-      screen: Routes.ListDeviceSmartAccount,
-      params: {
-        username: response.data[0].username,
-        brand: response.data[0].brand,
-        smart_account_id: response.data[0].id,
-        unit_id: route.params.unitId,
-      },
-    });
+    expect(global.mockedNavigate).toHaveBeenCalledWith(
+      Routes.SmartAccountStack,
+      {
+        screen: Routes.ListDeviceSmartAccount,
+        params: {
+          username: response.data[0].username,
+          brand: response.data[0].brand,
+          smart_account_id: response.data[0].id,
+          unit_id: route.params.unitId,
+        },
+      }
+    );
     const menuActionMore = instance.findByType(MenuActionMore);
     await act(async () => {
       menuActionMore.props.onItemClick({ action: 'remove' });

package/src/screens/Unit/__test__/SmartAccountItem.test.js

@@ -19,17 +19,6 @@ const wrapComponent = (route) => (
   </SCProvider>
 );
 
-const mockedNavigate = jest.fn();
-
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      goBack: mockedNavigate,
-    }),
-  };
-});
-
 describe('Test SmartAccountItem', () => {
   let tree;
   it('test render SmartAccountItem', async () => {

package/src/screens/Unit/__test__/Summaries.test.js

@@ -19,17 +19,6 @@ const wrapComponent = (props) => (
   </SCProvider>
 );
 
-const mockedNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useIsFocused: jest.fn(),
-    useNavigation: () => ({
-      navigate: mockedNavigate,
-    }),
-  };
-});
-
 jest.mock('react-native-onesignal', () => {
   return {
     setNotificationWillShowInForegroundHandler: jest.fn(),
@@ -52,7 +41,6 @@ describe('Test Summaries', () => {
         id: 1,
       },
     };
-    mockedNavigate.mockReset();
     mock.reset();
   });
 
@@ -76,7 +64,7 @@ describe('Test Summaries', () => {
     await act(async () => {
       items[0].props.goToSummary({ id: 1 });
     });
-    expect(mockedNavigate).toBeCalled();
+    expect(global.mockedNavigate).toBeCalled();
   });
 
   it('render Summaries receive noti with summary_id then not reload', async () => {
@@ -92,7 +80,7 @@ describe('Test Summaries', () => {
     await act(async () => {
       tree = await renderer.create(wrapComponent(props));
     });
-    expect(mockedNavigate).not.toBeCalled();
+    expect(global.mockedNavigate).not.toBeCalled();
   });
 
   it('fetch data non-stop', async () => {

package/src/screens/Unit/components/AutomateScript/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { View, TouchableWithoutFeedback } from 'react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 import { useTranslations } from '../../../../hooks/Common/useTranslations';
 import Text from '../../../../commons/Text';
 import FImage from '../../../../commons/FImage';
@@ -61,7 +61,7 @@ const AutomateScript = ({ automate, onPress, isSelected }) => {
             <Text numberOfLines={1} type={'Label'} color={Colors.Gray7}>
               {t('created_by', { name: author })}
             </Text>
-            <IconOutline name="right" size={12} />
+            <AntDesign name="right" size={12} />
           </View>
         </View>
       </View>

package/src/screens/Unit/components/ButtonWrapper/index.js

@@ -2,8 +2,7 @@ import React, { memo } from 'react';
 import { View, TouchableOpacity, Image } from 'react-native';
 import Text from '../../../../commons/Text';
 import { Colors } from '../../../../configs';
-import { Icon } from '@ant-design/react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 import { AccessibilityLabel } from '../../../../configs/Constants';
 import styles from './styles';
 
@@ -47,10 +46,10 @@ const ButtonWrapper = ({
             <Image source={{ uri: value }} style={styles.avatar} />
           ) : (
             <View style={styles.avatar}>
-              <Icon name={'user'} size={27} />
+              <AntDesign name={'user'} size={27} />
             </View>
           )}
-          <IconOutline name="right" size={20} color={Colors.Gray7} />
+          <AntDesign name="right" size={20} color={Colors.Gray7} />
         </View>
       </View>
       {children}

package/src/screens/Unit/components/Header/index.js

@@ -1,7 +1,8 @@
 import React, { useCallback, useRef, useState } from 'react';
 import { Dimensions, View, TouchableOpacity, StyleSheet } from 'react-native';
 import Popover from '../../../../commons/Popover';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
+import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
 import { useTranslations } from '../../../../hooks/Common/useTranslations';
 
 import { Colors } from '../../../../configs';
@@ -97,7 +98,7 @@ const HeaderComponent = ({ title, goBack, dark, hideRight, style }) => {
                 onPress={() => setShowModal(true)}
                 style={styles.rightHeader}
               >
-                <IconOutline
+                <AntDesign
                   name="plus"
                   size={32}
                   color={dark ? Colors.Black : Colors.White}
@@ -107,8 +108,8 @@ const HeaderComponent = ({ title, goBack, dark, hideRight, style }) => {
                 onPress={() => setMenu(true)}
                 style={styles.rightHeader}
               >
-                <IconOutline
-                  name="more"
+                <MaterialIcons
+                  name="more-vert"
                   size={30}
                   color={dark ? Colors.Black : Colors.White}
                 />

package/src/screens/Unit/components/SharedUnit/index.js

@@ -1,7 +1,7 @@
 import React, { Fragment, useCallback } from 'react';
 import { View, Image, TouchableOpacity } from 'react-native';
 import { useTranslations } from '../../../../hooks/Common/useTranslations';
-import { IconOutline, IconFill } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 
 import { API, Colors, Images } from '../../../../configs';
 import Text from '../../../../commons/Text';
@@ -88,7 +88,7 @@ const SharedUnit = ({
         {isOptions && (
           <Fragment>
             {item.is_pin ? (
-              <IconFill
+              <AntDesign
                 name="pushpin"
                 size={20}
                 color={Colors.Blue10}
@@ -98,7 +98,7 @@ const SharedUnit = ({
                 }
               />
             ) : (
-              <IconOutline
+              <AntDesign
                 name="pushpin"
                 size={20}
                 onPress={addPinSharedUnit}
@@ -106,7 +106,7 @@ const SharedUnit = ({
               />
             )}
             {item.is_star ? (
-              <IconFill
+              <AntDesign
                 name="star"
                 size={20}
                 color={Colors.Yellow6}
@@ -116,7 +116,7 @@ const SharedUnit = ({
                 }
               />
             ) : (
-              <IconOutline
+              <AntDesign
                 name="star"
                 size={20}
                 onPress={addStarSharedUnit}

package/src/screens/Unit/components/__test__/Header.test.js

@@ -17,19 +17,6 @@ const wrapComponent = (title, goBack, dark, hideRight) => (
   </SCProvider>
 );
 
-const mockedNavigate = jest.fn();
-const mockedGoBack = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      navigate: mockedNavigate,
-      goBack: mockedGoBack,
-    }),
-    useIsFocused: () => true,
-  };
-});
-
 describe('Test Header', () => {
   let tree;
   it('test hideModal', async () => {
@@ -97,6 +84,6 @@ describe('Test Header', () => {
     await act(async () => {
       touchableOpacity[0].props.onPress();
     });
-    expect(mockedGoBack).toHaveBeenCalled();
+    expect(global.mockedGoBack).toHaveBeenCalled();
   });
 });