@eohjsc/react-native-smart-city 0.5.8 → 0.6.0-rc1

package/src/commons/ActionGroup/TimerActionTemplate.js

@@ -1,9 +1,8 @@
 import React, { useCallback, useMemo, useState } from 'react';
 import { Switch, TouchableOpacity, View } from 'react-native';
-import { Icon } from '@ant-design/react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 import DateTimePickerModal from 'react-native-modal-datetime-picker';
 import moment from 'moment';
-import { IconOutline } from '@ant-design/icons-react-native';
 import { watchMultiConfigs } from '../../iot/Monitor';
 
 import { useTranslations } from '../../hooks/Common/useTranslations';
@@ -184,7 +183,7 @@ const TimerActionTemplate = ({ item = {}, doAction, sensor = {} }) => {
           <Text>{title}</Text>
           {configuration.config_hour && configuration.config_minute && (
             <View style={styles.wrapTimer}>
-              <Icon style={styles.iconClockCircle} name={'clock-circle'} />
+              <AntDesign style={styles.iconClockCircle} name={'clock-circle'} />
               <Text type="Label" color={Colors.Gray7}>
                 {textTimer ? textTimer : t('set_time')}
               </Text>
@@ -194,7 +193,7 @@ const TimerActionTemplate = ({ item = {}, doAction, sensor = {} }) => {
         {configuration.config_hour && !configuration.config_minute && (
           <View style={styles.timerButton}>
             <Text style={styles.textTimerEndLine}>{textTimer}</Text>
-            <IconOutline name="right" size={20} />
+            <AntDesign name="right" size={20} />
           </View>
         )}
       </TouchableOpacity>

package/src/commons/ActionGroup/TwoButtonTemplate/index.js

@@ -1,4 +1,4 @@
-import { Icon } from '@ant-design/react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 import React, { memo, useState, useCallback, useEffect } from 'react';
 import { TouchableOpacity, View } from 'react-native';
 
@@ -122,7 +122,7 @@ const TwoButtonTemplate = memo(({ item = {}, doAction, sensor = {} }) => {
             key={index}
           >
             <View style={styles.smallCircle}>
-              <Icon
+              <AntDesign
                 name={button?.isCheckOnOff ? button?.icon_on : button?.icon_off}
                 size={44}
                 color={button?.isCheckOnOff ? Colors.Green7 : Colors.Gray6}

package/src/commons/ActionGroup/__test__/NumberUpDownTemplate.test.js

@@ -13,13 +13,6 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: () => [{ 5: { value: 25 } }, null],
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test NumberUpDownTemplate', () => {
   const actionData = {
     color: '#00979D',
@@ -27,7 +20,7 @@ describe('Test NumberUpDownTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };
@@ -396,7 +389,7 @@ describe('Test NumberUpDownTemplate', () => {
         command_prefer_over_googlehome: false,
         command_prefer_over_internet: false,
         googlehome_actions: [],
-        icon: 'caret-up',
+        icon: 'caretup',
         id: 20,
         key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
       },

package/src/commons/ActionGroup/__test__/OnOffButtonTemplate.test.js

@@ -18,13 +18,6 @@ const wrapComponent = (item, mockDoAction) => (
   </SCProvider>
 );
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test OneBigButtonTemplate', () => {
   const actionOnData = {
     color: '#00979D',
@@ -32,7 +25,7 @@ describe('Test OneBigButtonTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };
@@ -43,7 +36,7 @@ describe('Test OneBigButtonTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };
@@ -51,11 +44,11 @@ describe('Test OneBigButtonTemplate', () => {
     configuration: {
       action_on: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
       action_on_data: actionOnData,
-      icon_on: 'caret-up',
+      icon_on: 'caretup',
       text_on: 'ON',
       action_off: '5ed1d4dc-a905-47cd-b0c9-f979644bd21b',
       action_off_data: actionOffData,
-      icon_off: 'caret-up',
+      icon_off: 'caretup',
       text_off: 'OFF',
       config: 1,
     },

package/src/commons/ActionGroup/__test__/OnOffSmartLock.test.js

@@ -13,13 +13,6 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: jest.fn(),
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 const wrapComponent = (item, doAction, sensor) => (
   <SCProvider initState={mockSCStore({})}>
     <OnOffSmartLock item={item} doAction={doAction} sensor={sensor} />
@@ -36,7 +29,7 @@ describe('Test OnOffTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: 'key-2',
   };
@@ -46,7 +39,7 @@ describe('Test OnOffTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: 'key-3',
   };

package/src/commons/ActionGroup/__test__/OnOffTemplate.test.js

@@ -1,8 +1,7 @@
 import React from 'react';
-import { View } from 'react-native';
 import { act, create } from 'react-test-renderer';
 
-import { DEVICE_TYPE, AccessibilityLabel } from '../../../configs/Constants';
+import { DEVICE_TYPE } from '../../../configs/Constants';
 import { watchMultiConfigs } from '../../../iot/Monitor';
 import OnOffTemplate from '../OnOffTemplate';
 import OnOffButtonTemplate from '../OnOffTemplate/OnOffButtonTemplate';
@@ -22,13 +21,6 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: () => [{ 5: { value: 2 } }, null],
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test OnOffTemplate', () => {
   let displayItem;
   let tree;
@@ -40,7 +32,7 @@ describe('Test OnOffTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: 'key-1',
   };
@@ -50,7 +42,7 @@ describe('Test OnOffTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: 'key-2',
   };
@@ -60,7 +52,7 @@ describe('Test OnOffTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: 'key-3',
   };
@@ -113,14 +105,8 @@ describe('Test OnOffTemplate', () => {
     });
     const instance = tree.root;
 
-    const templateOnOffButton = instance.findAll(
-      (el) =>
-        el.props.accessibilityLabel ===
-          AccessibilityLabel.ON_OFF_BUTTON_ACTION_TEMPLATE && el.type === View
-    );
     const templateOnOffSimple = instance.findAllByType(OnOffSimpleTemplate);
 
-    expect(templateOnOffButton).not.toHaveLength(1);
     expect(templateOnOffSimple).not.toHaveLength(1);
   });
 

package/src/commons/ActionGroup/__test__/OneBigButtonTemplate.test.js

@@ -30,7 +30,7 @@ describe('Test OneBigButtonTemplate', () => {
       command_prefer_over_googlehome: false,
       command_prefer_over_internet: false,
       googlehome_actions: [],
-      icon: 'caret-up',
+      icon: 'caretup',
       id: 20,
       key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
     };
@@ -38,7 +38,7 @@ describe('Test OneBigButtonTemplate', () => {
       configuration: {
         action: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
         action_data: actionData,
-        icon: 'caret-up',
+        icon: 'caretup',
         text: 'UP',
       },
     };

package/src/commons/ActionGroup/__test__/OptionsDropdownTemplate.test.js

@@ -30,13 +30,6 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: () => [{ 5: { value: 2 } }, null],
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test OptionsDropdownActionTemplate', () => {
   const actionData = {
     color: '#00979D',
@@ -44,7 +37,7 @@ describe('Test OptionsDropdownActionTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };

package/src/commons/ActionGroup/__test__/StatesGridActionTemplate.test.js

@@ -8,13 +8,6 @@ import { DEVICE_TYPE } from '../../../configs/Constants';
 const mockDoAction = jest.fn();
 const mockActionData = jest.fn();
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test StatesGridActionTemplate', () => {
   let tree;
   let displayItem;

package/src/commons/ActionGroup/__test__/SwitchButtonTemplate.test.js

@@ -17,13 +17,6 @@ const wrapComponent = (item, mockDoAction, isOn) => (
   </SCProvider>
 );
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test SwitchButtonTemplate', () => {
   const actionOnData = {
     color: '#00979D',
@@ -31,7 +24,7 @@ describe('Test SwitchButtonTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };
@@ -42,7 +35,7 @@ describe('Test SwitchButtonTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };
@@ -50,11 +43,11 @@ describe('Test SwitchButtonTemplate', () => {
     configuration: {
       action_on: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
       action_on_data: actionOnData,
-      icon_on: 'caret-up',
+      icon_on: 'caretup',
       text_on: 'ON',
       action_off: '5ed1d4dc-a905-47cd-b0c9-f979644bd21b',
       action_off_data: actionOffData,
-      icon_off: 'caret-up',
+      icon_off: 'caretup',
       text_off: 'OFF',
       config: 1,
     },
@@ -67,12 +60,8 @@ describe('Test SwitchButtonTemplate', () => {
     await act(async () => {
       wrapper = await create(wrapComponent(displayItem, mockDoAction));
     });
-
-    const renderJson = wrapper.toJSON();
     const switchButton = wrapper.root.findByType(Switch);
 
-    expect(renderJson[1].props?.visible).toEqual(false);
-    expect(renderJson[1]?.type).toEqual('Modal');
     expect(switchButton.props.value).toEqual(state);
   };
 

package/src/commons/ActionGroup/__test__/TerminalBoxTemplate.test.js

@@ -30,13 +30,6 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: () => [{ 5: { value: 2 } }, null],
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test TerminalBoxTemplate', () => {
   let displayItem;
   let sensor;

package/src/commons/ActionGroup/__test__/TextBoxTemplate.test.js

@@ -27,13 +27,6 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: () => [{ 5: { value: 2 } }, null],
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test TextBoxTemplate', () => {
   const actionData = {
     color: '#00979D',
@@ -41,7 +34,7 @@ describe('Test TextBoxTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };

package/src/commons/ActionGroup/__test__/TimerActionTemplate.test.js

@@ -17,13 +17,6 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: () => [{ 5: { value: 18 }, 6: { value: 30 } }, null],
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 const mockDoAction = jest.fn();
 
 const wrapComponent = (item, sensor) => (
@@ -39,7 +32,7 @@ describe('Test TimerActionTemplate success with config value', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };

package/src/commons/ActionGroup/__test__/TimerActionTemplateWithutConfigValue.test.js

@@ -16,13 +16,6 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: () => [{}, null],
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 const wrapComponent = (item, mockDoAction, is_managed_by_backend) => (
   <SCProvider initState={mockSCStore({})}>
     <TimerActionTemplate
@@ -40,7 +33,7 @@ describe('Test TimerActionTemplate without config value', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };

package/src/commons/ActionGroup/__test__/TwoButtonTemplate.test.js

@@ -9,13 +9,6 @@ jest.mock('react', () => ({
   useState: jest.fn(),
 }));
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test TwoButtonTemplate', () => {
   const actionOnData = {
     color: '#00979D',
@@ -23,7 +16,7 @@ describe('Test TwoButtonTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };
@@ -34,7 +27,7 @@ describe('Test TwoButtonTemplate', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };

package/src/commons/ActionGroup/__test__/index.test.js

@@ -25,13 +25,6 @@ const wrapComponent = (item, mockDoAction, sensor) => (
   </SCProvider>
 );
 
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useFocusEffect: jest.fn(),
-  };
-});
-
 describe('Test ActionGroup', () => {
   const configurationWithNoneActionOnOff = {
     action1: '2b949045-8e03-4c07-a855-7794ade2e69c',
@@ -41,7 +34,7 @@ describe('Test ActionGroup', () => {
       command_prefer_over_googlehome: false,
       command_prefer_over_internet: false,
       googlehome_actions: [],
-      icon: 'caret-up',
+      icon: 'caretup',
       id: 9,
       key: '2b949045-8e03-4c07-a855-7794ade2e69c',
     },
@@ -63,13 +56,13 @@ describe('Test ActionGroup', () => {
       command_prefer_over_googlehome: false,
       command_prefer_over_internet: false,
       googlehome_actions: [],
-      icon: 'caret-down',
+      icon: 'caretdown',
       id: 10,
       key: 'a492e08c-8cb1-44ee-8ea0-46aaca4e5141',
     },
-    icon1: 'caret-up',
+    icon1: 'caretup',
     icon2: 'stop',
-    icon3: 'caret-down',
+    icon3: 'caretdown',
     text_door_lock: 'Door lock',
     text1: 'UP',
     text2: 'STOP',
@@ -82,7 +75,7 @@ describe('Test ActionGroup', () => {
     command_prefer_over_googlehome: false,
     command_prefer_over_internet: false,
     googlehome_actions: [],
-    icon: 'caret-up',
+    icon: 'caretup',
     id: 20,
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };
@@ -104,7 +97,7 @@ describe('Test ActionGroup', () => {
           command_prefer_over_googlehome: false,
           command_prefer_over_internet: false,
           googlehome_actions: [],
-          icon: 'caret-up',
+          icon: 'caretup',
           id: 9,
           key: '2b949045-8e03-4c07-a855-7794ade2e69c',
         },
@@ -126,7 +119,7 @@ describe('Test ActionGroup', () => {
           command_prefer_over_googlehome: false,
           command_prefer_over_internet: false,
           googlehome_actions: [],
-          icon: 'caret-down',
+          icon: 'caretdown',
           id: 10,
           key: 'a492e08c-8cb1-44ee-8ea0-46aaca4e5141',
         },
@@ -152,9 +145,9 @@ describe('Test ActionGroup', () => {
           id: 12,
           key: '09bc3472-e1e7-4bba-ac5a-d0d140a919d9',
         },
-        icon1: 'caret-up',
+        icon1: 'caretup',
         icon2: 'stop',
-        icon3: 'caret-down',
+        icon3: 'caretdown',
         text_door_lock: 'Door lock',
         text1: 'UP',
         text2: 'STOP',
@@ -300,7 +293,7 @@ describe('Test ActionGroup', () => {
       configuration: {
         action: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
         action_data: actionData,
-        icon: 'caret-up',
+        icon: 'caretup',
         text: 'UP',
       },
     };
@@ -326,9 +319,9 @@ describe('Test ActionGroup', () => {
       configuration: {
         action_on_data: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
         action_off_data: '5ed1d4dc-a905-47cd-b0c9-f979644bd21b',
-        icon_on: 'caret-up',
+        icon_on: 'caretup',
         text_on: 'ON',
-        icon_off: 'caret-up',
+        icon_off: 'caretup',
         text_off: 'OFF',
       },
       title: 'Power',
@@ -354,9 +347,9 @@ describe('Test ActionGroup', () => {
       configuration: {
         action_on_data: 'action_on_data',
         action_off_data: 'action_off_data',
-        icon_on: 'caret-up',
+        icon_on: 'caretup',
         text_on: 'ON',
-        icon_off: 'caret-up',
+        icon_off: 'caretup',
         text_off: 'OFF',
         button_type: BUTTON_TYPE.PUSH_BUTTON,
       },

package/src/commons/ActionTemplate/__test__/index.test.js

@@ -9,6 +9,7 @@ import Modal from 'react-native-modal';
 import ThreeButtonAction from '../ThreeButtonAction';
 import AccessibilityLabel from '../../../configs/AccessibilityLabel';
 import Text from '../../Text';
+import { showAllCards } from './utils';
 
 const mockOnSelectAction = jest.fn();
 
@@ -92,6 +93,7 @@ describe('Test ActionTemplate', () => {
       tree = await renderer.create(wrapComponent(switchTemplate));
     });
     const instance = tree.root;
+    await showAllCards(instance);
     const textTitle = instance.findAll(
       (el) =>
         el.props.accessibilityLabel ===

package/src/commons/ActionTemplate/__test__/utils.js

@@ -0,0 +1,21 @@
+import { act } from 'react-test-renderer';
+import SelectActionCard from '../../SelectActionCard';
+import GridItem from '../../Grid/GridItem';
+
+export const showAllCards = async (instance) => {
+  const items = instance.findAllByType(SelectActionCard);
+  for (let i = 0; i < items.length; i++) {
+    await act(async () => {
+      items[i].props.onPress();
+    });
+  }
+};
+
+export const showAllGridItems = async (instance) => {
+  const items = instance.findAllByType(GridItem);
+  for (let i = 0; i < items.length; i++) {
+    await act(async () => {
+      items[i].props.onPress();
+    });
+  }
+};

package/src/commons/ActionTemplate/index.js

@@ -18,7 +18,6 @@ const ActionTemplate = memo(({ device, item, onSelectAction }) => {
   const t = useTranslations();
   const [visible, setVisible] = useState(false);
   const onClose = () => setVisible(false);
-  const onPress = () => setVisible(true);
   const [actionName, setActionName] = useState();
 
   const onPressSelectAction = useCallback(
@@ -72,7 +71,7 @@ const ActionTemplate = memo(({ device, item, onSelectAction }) => {
   return (
     <>
       <SelectActionCard
-        onPress={onPress}
+        onPress={() => setVisible(true)}
         action={actionName}
         title={t(item?.title === 'Power' ? 'power' : 'action')}
       />

package/src/commons/BackDefault/index.js

@@ -1,6 +1,6 @@
 import React, { memo } 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 { AccessibilityLabel } from '../../configs/Constants';
 
 const BackDefault = memo(({ goBack, color, fixedHeight }) => {
@@ -10,7 +10,7 @@ const BackDefault = memo(({ goBack, color, fixedHeight }) => {
       onPress={goBack}
       style={[styles.wrap, fixedHeight && styles.noPaddingVertical]}
     >
-      <IconOutline name="left" size={27} color={color} />
+      <AntDesign name="left" size={27} color={color} />
     </TouchableOpacity>
   );
 });

package/src/commons/ButtonPopup/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
-import { Icon } from '@ant-design/react-native';
+import AntDesign from 'react-native-vector-icons/AntDesign';
 
 import { Colors, Device } from '../../configs';
 import { AccessibilityLabel } from '../../configs/Constants';
@@ -42,7 +42,7 @@ const ButtonPopup = ({
       <View style={styles.popoverStyle}>
         <View style={styles.modalWrapper}>
           {!hideClose && (
-            <Icon
+            <AntDesign
               name={'close'}
               color={Colors.Gray8}
               style={styles.close}