@eohjsc/react-native-smart-city 0.6.2 → 0.7.3-rc1

package/src/commons/IconComponent/index.js

@@ -1,4 +1,4 @@
-import { IconOutline, IconFill } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 import React, { memo, useMemo } from 'react';
 import { StyleSheet } from 'react-native';
 import { Colors } from '../../configs';
@@ -62,7 +62,7 @@ const IconComponent = memo(
       );
     } else if (icon.includes('Filled')) {
       return (
-        <IconFill
+        <AntDesign
           name={displayIcon}
           color={colorIcon}
           size={size}
@@ -76,7 +76,7 @@ const IconComponent = memo(
           ? 'poweroff'
           : displayIcon;
       return (
-        <IconOutline
+        <AntDesign
           name={iconCT}
           color={colorIcon}
           size={size}

package/src/commons/MediaPlayerDetail/MediaPlayerFull.js

@@ -93,7 +93,7 @@ const MediaPlayerFull = ({
     <TouchableOpacity
       activeOpacity={1}
       onPress={onPause}
-      style={[isFullScreen ? styles.wrapFull : styles.wrap]}
+      style={isFullScreen ? styles.wrapFull : styles.wrap}
     >
       <Animated.View
         style={[

package/src/commons/MediaPlayerDetail/__test__/MediaPlayerFull.test.js

@@ -1,17 +1,10 @@
-import React, { useState } from 'react';
+import React from 'react';
 import { TouchableOpacity } from 'react-native';
 import { act, create } from 'react-test-renderer';
 import { SCProvider } from '../../../context';
 import { mockSCStore } from '../../../context/mockStore';
 import MediaPlayerFull from '../MediaPlayerFull';
-
-const mockSetState = jest.fn();
-jest.mock('react', () => {
-  return {
-    ...jest.requireActual('react'),
-    useState: jest.fn((init) => [init, mockSetState]),
-  };
-});
+import FImage from '../../FImage';
 
 const wrapComponent = (props) => (
   <SCProvider initState={mockSCStore({})}>
@@ -22,14 +15,7 @@ const wrapComponent = (props) => (
 describe('Test MediaPlayerFull', () => {
   let tree;
 
-  afterEach(() => {
-    useState.mockClear();
-  });
-
   it('Test render', async () => {
-    useState.mockImplementationOnce((init) => [false, mockSetState]);
-    useState.mockImplementationOnce((init) => [false, mockSetState]);
-    useState.mockImplementationOnce((init) => [init, mockSetState]);
     await act(async () => {
       tree = await create(
         wrapComponent({
@@ -39,44 +25,22 @@ describe('Test MediaPlayerFull', () => {
       );
     });
     const instance = tree.root;
-    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
-    expect(TouchableOpacities).toHaveLength(3);
+    const touchableOpacities = instance.findAllByType(TouchableOpacity);
+    expect(touchableOpacities).toHaveLength(3);
+    expect(instance.findAllByType(FImage)).toHaveLength(1);
     await act(async () => {
-      TouchableOpacities[0].props.onPress();
+      touchableOpacities[0].props.onPress();
     });
-    expect(mockSetState).toBeCalledWith(false);
+    expect(instance.findAllByType(FImage)).toHaveLength(2); // paused
     await act(async () => {
-      TouchableOpacities[1].props.onPress();
-      TouchableOpacities[2].props.onPress();
+      touchableOpacities[1].props.onPress();
     });
-    expect(mockSetState).toBeCalledWith(true);
-  });
+    expect(instance.findAllByType(FImage)).toHaveLength(1); // unpaused
 
-  it('Test render 2', async () => {
-    useState.mockImplementationOnce((init) => [true, mockSetState]);
-    useState.mockImplementationOnce((init) => [true, mockSetState]);
-    useState.mockImplementationOnce((init) => [init, mockSetState]);
-    await act(async () => {
-      tree = await create(
-        wrapComponent({
-          isShowFullScreenIcon: true,
-          cameraName: 'test',
-          isPaused: true,
-          amount: 1,
-        })
-      );
-    });
-    const instance = tree.root;
-    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
-    expect(TouchableOpacities).toHaveLength(3);
-    await act(async () => {
-      TouchableOpacities[0].props.onPress();
-    });
-    expect(mockSetState).toBeCalledWith(false);
+    // full screen
     await act(async () => {
-      TouchableOpacities[1].props.onPress();
-      TouchableOpacities[2].props.onPress();
+      touchableOpacities[2].props.onPress();
     });
-    expect(mockSetState).toBeCalledWith(true);
+    expect(touchableOpacities[0].props.style?.position).toEqual('absolute');
   });
 });

package/src/commons/MenuActionAddnew/__test__/MenuActionAddNew.test.js

@@ -6,7 +6,7 @@ import { ImageButton, MenuActionAddnew } from '../../index';
 
 const wrapComponent = (dataActions) => (
   <SCProvider initState={mockSCStore({})}>
-    <MenuActionAddnew dataActions={dataActions} />
+    <MenuActionAddnew dataActions={dataActions} visible />
   </SCProvider>
 );
 

package/src/commons/MenuActionList/__test__/MenuActionList.test.js

@@ -20,6 +20,7 @@ describe('Test MenuActionList', () => {
           listItem={listItem}
           hideModal={mockHideModal}
           onItemClick={mockOnItemClick}
+          visible
         />
       );
     });

package/src/commons/MenuActionMore/MenuActionMoreStyles.js

@@ -3,7 +3,8 @@ import { Colors } from '../../configs';
 
 export default StyleSheet.create({
   wrap: {
-    backgroundColor: Colors.TextTransparent,
+    width: 0,
+    height: 0,
   },
   menuStyle: {
     marginTop: -25,

package/src/commons/MenuActionMore/index.js

@@ -50,7 +50,7 @@ const MenuActionMore = memo(
         from={childRef}
         onRequestClose={hideMore}
         isVisible={isVisible}
-        arrowStyle={styles.wrap}
+        arrowSize={styles.wrap}
         accessibilityLabel={idLabelPopover}
         mode={mode}
       >

package/src/commons/NavBar/NavBarStyles.js

@@ -47,7 +47,7 @@ export default StyleSheet.create({
   wrapStyle: {
     marginTop: Platform.select({
       ios: 0,
-      android: -30,
+      android: -15,
     }),
   },
 });

package/src/commons/NavBar/index.js

@@ -1,5 +1,5 @@
 import React, { useRef } from 'react';
-import { Icon } from '@ant-design/react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 import { View, TouchableOpacity } from 'react-native';
 
 import styles from './NavBarStyles';
@@ -40,7 +40,7 @@ const NavBar = ({
           ref={refMenuAction}
           accessibilityLabel={idLabelIconBars}
         >
-          <Icon name={'bars'} size={19} color={Colors.Black} />
+          <AntDesign name={'bars'} size={19} color={Colors.Black} />
         </TouchableOpacity>
       </View>
       <MenuActionMore

package/src/commons/OneTapTemplate/NumberUpDownActionTemplate.js

@@ -1,6 +1,6 @@
 import React, { memo, useState, useCallback, useEffect } from 'react';
 import { View, TouchableOpacity } 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 styles from './NumberUpDownActionTemplateStyles';
@@ -118,7 +118,7 @@ const NumberUpDownActionTemplate = ({ device, item = {}, onSelectAction }) => {
                   AccessibilityLabel.NUMBER_UP_DOWN_ACTION_DOWN
                 }
               >
-                <IconOutline name="down" size={32} color={Colors.Primary} />
+                <AntDesign name="down" size={32} color={Colors.Primary} />
               </TouchableOpacity>
               <Text
                 type="H2"
@@ -134,7 +134,7 @@ const NumberUpDownActionTemplate = ({ device, item = {}, onSelectAction }) => {
                 onPress={onPressUp}
                 accessibilityLabel={AccessibilityLabel.NUMBER_UP_DOWN_ACTION_UP}
               >
-                <IconOutline name="up" size={32} color={Colors.Primary} />
+                <AntDesign name="up" size={32} color={Colors.Primary} />
               </TouchableOpacity>
             </View>
             <View style={styles.wrapButton}>

package/src/commons/PreventAccess/__test__/PreventAccess.test.js

@@ -8,8 +8,6 @@ import { mockSCStore } from '../../../context/mockStore';
 import Text from '../../Text';
 import t from '../../../hooks/Common/useTranslations';
 
-const mockGoBack = jest.fn();
-
 const wrapComponent = (headerBodyText, visible, hidePreventAccess) => (
   <SCProvider initState={mockSCStore({})}>
     <PreventAccess
@@ -20,16 +18,6 @@ const wrapComponent = (headerBodyText, visible, hidePreventAccess) => (
   </SCProvider>
 );
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useRoute: jest.fn(),
-    useNavigation: () => ({
-      goBack: mockGoBack,
-    }),
-  };
-});
-
 describe('Test PreventAccess.test', () => {
   let tree;
   let headerBodyText = 'some header test';
@@ -61,6 +49,6 @@ describe('Test PreventAccess.test', () => {
     });
     expect(button1).toBeDefined();
     expect(button2).toBeDefined();
-    expect(mockGoBack).toHaveBeenCalled();
+    expect(global.mockedGoBack).toHaveBeenCalled();
   });
 });

package/src/commons/Processing/__test__/Connecting.test.js

@@ -8,21 +8,9 @@ import { mockSCStore } from '../../../context/mockStore';
 import { getPusher } from '../../../utils/Pusher';
 import ViewButtonBottom from '../../ViewButtonBottom';
 
-const wrapComponent = ({
-  onReady,
-  onMessage,
-  setHidePopupTurnOnGuide,
-  setIsRecallChipScan,
-  isChangeAddressSuccess,
-}) => (
+const wrapComponent = (props) => (
   <SCProvider initState={mockSCStore({})}>
-    <Processing
-      onReady={onReady}
-      onMessage={onMessage}
-      setHidePopupTurnOnGuide={setHidePopupTurnOnGuide}
-      setIsRecallChipScan={setIsRecallChipScan}
-      isChangeAddressSuccess={isChangeAddressSuccess}
-    />
+    <Processing {...props} />
   </SCProvider>
 );
 describe('Test Processing', () => {
@@ -98,6 +86,7 @@ describe('Test Processing', () => {
           setHidePopupTurnOnGuide: mockSetHidePopupTurnOnGuide,
           setIsRecallChipScan: mockSetIsRecallChipScan,
           isChangeAddressSuccess: true,
+          showPopupTurnOnGuide: true,
         })
       );
     });

package/src/commons/SearchLocation/index.js

@@ -1,6 +1,6 @@
 import React, { memo } from 'react';
 import { View, TextInput } 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 { Colors } from '../../configs';
@@ -10,8 +10,8 @@ const SearchBarLocation = memo(({ input, onTextInput }) => {
   const t = useTranslations();
   return (
     <View style={styles.container}>
-      <IconOutline
-        name="search"
+      <AntDesign
+        name="search1"
         size={24}
         color={Colors.Gray6}
         accessibilityLabel="icon-search"

package/src/commons/SelectActionCard/index.js

@@ -1,6 +1,6 @@
 import React, { memo } from 'react';
 import { View, TouchableOpacity } from 'react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 
 import { Card } from '../CardShadow';
 import Text from '../Text';
@@ -20,7 +20,7 @@ const SelectActionCard = memo(({ title, action, onPress }) => {
               {action}
             </Text>
           </View>
-          <IconOutline name="right" size={20} />
+          <AntDesign name="right" size={20} />
         </View>
       </TouchableOpacity>
     </Card>

package/src/commons/SelectSubUnit/__test__/SelectSubUnit.test.js

@@ -14,19 +14,6 @@ import api from '../../../utils/Apis/axios';
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const mockedGoBack = jest.fn();
-const mockedNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      navigate: mockedNavigate,
-      goBack: mockedGoBack,
-    }),
-    useIsFocused: () => true,
-  };
-});
-
 const wrapComponent = (unitId, title, subTitle, onPressNext) => (
   <SCProvider initState={mockSCStore({})}>
     <SelectSubUnit {...{ unitId, title, subTitle, onPressNext }} />
@@ -34,10 +21,6 @@ const wrapComponent = (unitId, title, subTitle, onPressNext) => (
 );
 
 describe('Test SelectSubUnit', () => {
-  beforeEach(() => {
-    mockedNavigate.mockClear();
-    mockedGoBack.mockClear();
-  });
   let tree;
 
   it('fetch sub-unit success', async () => {
@@ -101,6 +84,6 @@ describe('Test SelectSubUnit', () => {
     await act(async () => {
       viewButtonBottom.props.onLeftClick();
     });
-    expect(mockedGoBack).toHaveBeenCalled();
+    expect(global.mockedGoBack).toHaveBeenCalled();
   });
 });

package/src/commons/SelectSubUnit/index.js

@@ -2,7 +2,7 @@ import React, { memo, useCallback, useEffect, useMemo, useState } from 'react';
 import { useIsFocused, useNavigation } from '@react-navigation/native';
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import { ScrollView, TouchableOpacity, View } from 'react-native';
-import { IconFill } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 
 import { API, Colors } from '../../configs';
 import { RadioCircle, Section, ViewButtonBottom } from '../../commons';
@@ -98,7 +98,7 @@ const SelectSubUnit = ({ unitId, title, subTitle, onPressNext, route }) => {
               />
             ))}
             <TouchableOpacity style={styles.rowContainer} onPress={addSubUnit}>
-              <IconFill name="plus-circle" size={20} color={Colors.Primary} />
+              <AntDesign name="plus-circle" size={20} color={Colors.Primary} />
               <View style={styles.row}>
                 <Text type="H4" color={Colors.Primary}>
                   {t('add_new_sub_unit')}

package/src/commons/SelectUnit/__test__/SelectUnit.test.js

@@ -13,18 +13,6 @@ import { API } from '../../../configs';
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const mockedGoBack = jest.fn();
-const mockedNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      navigate: mockedNavigate,
-      goBack: mockedGoBack,
-    }),
-  };
-});
-
 const wrapComponent = (title, subTitle, onPressNext) => (
   <SCProvider initState={mockSCStore({})}>
     <SelectUnit {...{ title, subTitle, onPressNext }} />
@@ -115,6 +103,6 @@ describe('test single SelectUnit', () => {
     await act(async () => {
       goBack.props.onPress();
     });
-    expect(mockedGoBack).toBeCalled();
+    expect(global.mockedGoBack).toBeCalled();
   });
 });

package/src/commons/Sharing/BtnRemoveMember.js

@@ -1,6 +1,6 @@
 import React, { memo, useCallback } from 'react';
 import { TouchableOpacity, StyleSheet } from 'react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 import { Colors } from '../../configs';
 
 const BtnRemoveMember = memo(({ member, onPressRemove }) => {
@@ -9,7 +9,7 @@ const BtnRemoveMember = memo(({ member, onPressRemove }) => {
   }, [member, onPressRemove]);
   return (
     <TouchableOpacity style={styles.buttonRemove} onPress={onPress}>
-      <IconOutline name={'minus'} size={20} color={Colors.Gray8} />
+      <AntDesign name={'minus'} size={20} color={Colors.Gray8} />
     </TouchableOpacity>
   );
 });

package/src/commons/Sharing/StationDevicePermissions.js

@@ -1,6 +1,6 @@
 import React, { useState, useCallback } from 'react';
 import { View, StyleSheet, TouchableOpacity } 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 { Colors } from '../../configs';
 import Text from '../../commons/Text';
@@ -86,7 +86,7 @@ const StationDevicePermissions = ({ dataStation, onselectSensor }) => {
           <View style={styles.infoContainer}>
             <Text style={styles.text}>{sensor.name}</Text>
             <View style={styles.rightImage}>
-              <IconOutline
+              <AntDesign
                 name={expandedIndex === index ? 'up' : 'down'}
                 size={20}
                 color={Colors.Gray6}

package/src/commons/Sharing/WrapHeaderScrollable.js

@@ -1,12 +1,12 @@
 import React, { useCallback, useRef, useState } from 'react';
 import {
+  ActivityIndicator,
   Animated,
   Platform,
   RefreshControl,
   StyleSheet,
   View,
 } from 'react-native';
-import { ActivityIndicator } from '@ant-design/react-native';
 import { Colors, Theme } from '../../configs';
 import HeaderAni, { heightHeader } from '../../commons/HeaderAni';
 import Text from '../../commons/Text';

package/src/commons/Sharing/__test__/ButtonRemoveMember.test.js

@@ -12,7 +12,7 @@ describe('BtnRemoveMember', () => {
       tree = await renderer.create(component);
     });
     const instance = tree.root;
-    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
-    expect(TouchableOpacities).toHaveLength(1);
+    const touchableOpacities = instance.findAllByType(TouchableOpacity);
+    expect(touchableOpacities).toHaveLength(1);
   });
 });

package/src/commons/Sharing/__test__/DevicePermissionsCheckbox.test.js

@@ -18,7 +18,7 @@ const wrapComponent = (sensor, mockFunction) => (
 describe('Test DevicePermissionsCheckbox', () => {
   let tree;
   let sensor = {
-    icon: 'caret-down',
+    icon: 'caretdown',
     id: 10,
     read_configs: [{ id: 1 }],
     actions: [{ id: 13 }],

package/src/commons/SubUnit/DeviceTemplate/ConfigAndEvaluation/ConfigAndEvaluation.js

@@ -5,7 +5,7 @@ import Text from '../../../Text';
 import LastUpdatedText from '../../../Device/LastUpdatedText';
 import { EvaluationConfigWrapper } from '../EvaluationOverConfig/EvaluationOverConfig';
 import IconComponent from '../../../IconComponent';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 
 const ConfigAndEvaluationDisplay = memo(
   ({ device, valueEvaluation, stationItem, configValue }) => {
@@ -44,7 +44,7 @@ const ConfigAndEvaluationDisplay = memo(
               lastUpdated={configValue?.last_updated}
               format={'DDMMYYYY'}
             />
-            <IconOutline style={styles.marginTop10} name="right" size={12} />
+            <AntDesign style={styles.marginTop10} name="right" size={12} />
           </View>
         )}
       </>

package/src/commons/SubUnit/DeviceTemplate/ConfigValue/ConfigValue.js

@@ -5,7 +5,7 @@ import Text from '../../../Text';
 import { useConfigGlobalState } from '../../../../iot/states';
 import LastUpdatedText from '../../../Device/LastUpdatedText';
 import IconComponent from '../../../IconComponent';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 
 const ConfigValue = ({ device, stationItem }) => {
   const [configValues] = useConfigGlobalState('configValues');
@@ -40,7 +40,7 @@ const ConfigValue = ({ device, stationItem }) => {
               lastUpdated={configValue?.last_updated}
               format={'DDMMYYYY'}
             />
-            <IconOutline style={styles.marginTop10} name="right" size={12} />
+            <AntDesign style={styles.marginTop10} name="right" size={12} />
           </View>
         )}
       </View>

package/src/commons/SubUnit/DeviceTemplate/EvaluationOverConfig/EvaluationOverConfig.js

@@ -9,7 +9,7 @@ import {
 } from '../../../../screens/Device/hooks/useEvaluateValue';
 import LastUpdatedText from '../../../Device/LastUpdatedText';
 import IconComponent from '../../../IconComponent';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 
 export const EvaluationConfigWrapper = memo(
   ({ device, stationItem, Child }) => {
@@ -69,7 +69,7 @@ const EvaluationOverConfigDisplay = memo(
                 lastUpdated={configValue?.last_updated}
                 format={'DDMMYYYY'}
               />
-              <IconOutline style={styles.marginTop10} name="right" size={12} />
+              <AntDesign style={styles.marginTop10} name="right" size={12} />
             </View>
           )}
         </View>

package/src/commons/SubUnit/Item/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { View, StyleSheet, Image } from 'react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
+import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
 
 import { Colors, Images } from '../../../configs';
 import Text from '../../Text';
@@ -27,8 +27,8 @@ const SubUnitCard = ({ onPressItem, devices, name, id }) => {
           </Text>
           <Text style={[styles.subText]}>{devices + ' devices'}</Text>
         </View>
-        <IconOutline
-          name="more"
+        <MaterialIcons
+          name="more-vert"
           color={Colors.White}
           size={24}
           onPress={() => {}}

package/src/commons/SubUnit/OneTap/ItemOneTap.js

@@ -1,12 +1,12 @@
 import React, { memo, useCallback } from 'react';
 import { TouchableOpacity, TouchableWithoutFeedback, View } from 'react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 import moment from 'moment';
 import Text from '../../Text';
 import { API, Colors } from '../../../configs';
-import OneTap from '../../../../assets/images/OneTap.svg';
-import ValueChange from '../../../../assets/images/ValueChange.svg';
-import Schedule from '../../../../assets/images/Schedule.svg';
+import OneTap from '../../../../assets/images/Scenario-filled.svg';
+import ValueChange from '../../../../assets/images/Automation-fill.svg';
+import Schedule from '../../../../assets/images/schedule-fill.svg';
 import Event from '../../../../assets/images/Event.svg';
 import CheckCircle from '../../../../assets/images/CheckCircle.svg';
 import FImage from '../../FImage';
@@ -107,7 +107,7 @@ const ItemOneTap = memo(({ automate = {}, wrapSyles, onPressItem }) => {
             >
               {activateAt && t('activated_time', { time: activateAt })}
             </Text>
-            <IconOutline name="right" size={12} />
+            <AntDesign name="right" size={12} />
           </View>
         </TouchableOpacity>
       </View>

package/src/commons/SubUnit/OneTap/__test__/SubUnitAutomate.test.js

@@ -88,7 +88,7 @@ describe('test Item', () => {
     await act(async () => {
       await item[0].props.onPress();
     });
-    expect(mockedNavigate).toHaveBeenCalledWith(Routes.ScenarioName, {
+    expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScenarioName, {
       automate: {
         type: 'one_tap',
         unit: undefined,
@@ -106,7 +106,7 @@ describe('test Item', () => {
     await act(async () => {
       await goDetail[0].props.onPress();
     });
-    expect(mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
+    expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
       id: 1,
       preAutomate: data.listAutomate[0].data[0],
     });
@@ -193,7 +193,7 @@ describe('test Item', () => {
     await act(async () => {
       await goDetail[0].props.onPress();
     });
-    expect(mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
+    expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
       id: 1,
       preAutomate: data.listAutomate[0].data[0],
     });
@@ -238,10 +238,13 @@ describe('test Item', () => {
     await act(async () => {
       await item[0].props.onPress();
     });
-    expect(mockedNavigate).toHaveBeenCalledWith(Routes.AddAutomationTypeSmart, {
-      automate: { unit: undefined },
-      closeScreen: undefined,
-    });
+    expect(global.mockedNavigate).toHaveBeenCalledWith(
+      Routes.AddAutomationTypeSmart,
+      {
+        automate: { unit: undefined },
+        closeScreen: undefined,
+      }
+    );
     mockedNavigate.mockClear();
 
     const goDetail = tree.root.findAll(
@@ -286,7 +289,7 @@ describe('test Item', () => {
     await act(async () => {
       await item[0].props.onPress();
     });
-    expect(mockedNavigate).not.toBeCalled();
+    expect(global.mockedNavigate).not.toBeCalled();
     expect(spyToastError).toBeCalledWith(
       getTranslate('en', 'reach_max_automations_per_unit', { length: 0 }),
       '',