@eohjsc/react-native-smart-city 0.3.91 → 0.3.92

package/src/screens/{AddNewAction → Automate/AddNewAction}/SetupConfigCondition.js

@@ -3,35 +3,26 @@ import { Image, TouchableOpacity, View } from 'react-native';
 import { useNavigation, useRoute } from '@react-navigation/native';
 
 import styles from './Styles/SetupSensorStyles';
-import { Colors, Images } from '../../configs';
-import { useTranslations } from '../../hooks/Common/useTranslations';
-import { ModalCustom } from '../../commons/Modal';
-import Text from '../../commons/Text';
-import { HorizontalPicker } from '../../commons';
-import { useStatusBarPreview } from '../../hooks/Common/useStatusBar';
-import Routes from '../../utils/Route';
-import { getAutomationData } from '../ScriptDetail/utils';
+import { Colors, Images } from '../../../configs';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+import { ModalCustom } from '../../../commons/Modal';
+import Text from '../../../commons/Text';
+import { HorizontalPicker } from '../../../commons';
+import { setStatusBarPreview } from '../../../hooks/Common/useStatusBar';
+import Routes from '../../../utils/Route';
 import NewActionWrapper from './NewActionWrapper';
+import _TextInput from '../../../commons/Form/TextInput';
 
 const SetupConfigCondition = () => {
   const t = useTranslations();
 
   const { navigate } = useNavigation();
   const { params = {} } = useRoute();
-  const { item, sensorData, type, automate } = params;
+  const { item, defaultCondition = {} } = params;
 
-  const hasLimit = useMemo(() => !!item?.range_max, [item]);
   const [isShowModal, setIsShowModal] = useState(false);
-  const [itemActiveModal, setItemActiveModal] = useState(null);
-  const [value, setValue] = useState(null);
-  const [minimum] = useState(hasLimit ? parseInt(item?.range_min, 10) : 0);
-  const [maximum, setMaximum] = useState(
-    value === 0
-      ? 100
-      : hasLimit
-      ? (parseInt(item?.range_max, 10) - minimum) * 10 + minimum
-      : (parseInt(item?.value, 10) + 20 - minimum) * 10 + minimum
-  );
+  const [itemActiveModal, setItemActiveModal] = useState(defaultCondition);
+  const [value, setValue] = useState(defaultCondition?.value);
 
   const hasNoValueEvaluation = !item?.evaluate_configuration;
 
@@ -63,35 +54,6 @@ const SetupConfigCondition = () => {
     return [];
   }, [item.evaluate_configuration, item.id, t]);
 
-  useEffect(() => {
-    let defaultCondition = null;
-    if (sensorData) {
-      const index = sensorData.findIndex((i) => i?.id === item?.id);
-      if (index !== -1 && sensorData[index].condition) {
-        defaultCondition = sensorData[index];
-      }
-    }
-
-    if (automate && !defaultCondition) {
-      const automationData = getAutomationData(type, automate);
-
-      const index = conditionOptions.findIndex(
-        (i) =>
-          i.condition === automationData?.condition &&
-          i.value === automationData?.value
-      );
-      if (index !== -1) {
-        defaultCondition = conditionOptions[index];
-      }
-    }
-
-    if (!defaultCondition) {
-      defaultCondition = conditionOptions[0];
-    }
-
-    setItemActiveModal(defaultCondition);
-  }, [conditionOptions, item, sensorData, automate, type]);
-
   const onOpenModal = useCallback(() => {
     setIsShowModal(true);
   }, []);
@@ -101,67 +63,27 @@ const SetupConfigCondition = () => {
   }, []);
 
   const onChooseCondition = (selectedItem) => () => {
-    setItemActiveModal(selectedItem);
+    setItemActiveModal((prev) => ({ ...prev, ...selectedItem }));
     onCloseModal();
   };
 
-  const onChangeValue = useCallback(
-    (newValue) => {
-      setValue(
-        (parseFloat(newValue / 128) + parseFloat(minimum)).toFixed(
-          item?.decimal_behind || 1
-        )
-      );
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [value]
-  );
-
   const onSave = useCallback(() => {
-    const dataTemp = [...sensorData];
-    const index = dataTemp.findIndex((i) => i?.id === item?.id);
-    dataTemp.splice(index, 1, { ...item, ...itemActiveModal });
     navigate({
       name: Routes.ChooseConfig,
       merge: true,
       params: {
-        newSensorData: dataTemp,
+        newCondition: {
+          ...itemActiveModal,
+          config: item.id,
+        },
       },
     });
-  }, [sensorData, item, itemActiveModal, navigate]);
-
-  const renderScroll = useMemo(() => {
-    return (
-      <HorizontalPicker
-        minimum={minimum}
-        maximum={maximum}
-        segmentSpacing={8}
-        segmentWidth={8}
-        step={10}
-        normalHeight={4}
-        normalWidth={4}
-        stepHeight={12}
-        stepWidth={12}
-        stepColor={Colors.Gray6}
-        normalColor={Colors.Gray6}
-        onChangeValue={onChangeValue}
-        value={value - minimum}
-      />
-    );
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [minimum, maximum, value]);
+  }, [item.id, itemActiveModal, navigate]);
 
   useEffect(() => {
     !hasNoValueEvaluation && setValue(1);
   }, [hasNoValueEvaluation]);
 
-  useEffect(() => {
-    if (!hasLimit && maximum - 150 <= value * 10) {
-      setMaximum(maximum + 200);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [value]);
-
   useEffect(() => {
     if (item?.title) {
       const itemTemp = conditionOptions.find((i) => i.title === item.title);
@@ -171,19 +93,26 @@ const SetupConfigCondition = () => {
   }, [item]);
 
   useEffect(() => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    useStatusBarPreview(
+    setStatusBarPreview(
       isShowModal ? Colors.BlackTransparent4 : Colors.TextTransparent
     );
   }, [isShowModal]);
 
+  const onChangeValue = useCallback((v) => {
+    const newValue = parseInt(v, 10);
+    if (!isNaN(newValue)) {
+      setValue(newValue);
+      setItemActiveModal((prev) => ({ ...prev, value: newValue }));
+    }
+  }, []);
+
   return (
     <>
       <NewActionWrapper
         name={t('set_up {name}', { name: item?.name })}
         nextTitle={t('save')}
         onNext={onSave}
-        canNext={true}
+        canNext={itemActiveModal?.condition}
       >
         <TouchableOpacity
           onPress={onOpenModal}
@@ -204,14 +133,36 @@ const SetupConfigCondition = () => {
             </Text>
             <View style={[styles.flexRow, styles.center]}>
               <View>
-                <Text style={styles.value}>{value}</Text>
-                <View style={styles.underline} />
+                <_TextInput
+                  textInputStyle={styles.value}
+                  wrapStyle={styles.wrapValue}
+                  value={value?.toString()}
+                  onChange={onChangeValue}
+                />
               </View>
               <Text type="H2" style={styles.unit}>
                 {item?.unit}
               </Text>
             </View>
-            {renderScroll}
+            <HorizontalPicker
+              minimum={item?.range_min}
+              maximum={item?.range_max}
+              segmentSpacing={8}
+              segmentWidth={8}
+              step={
+                item?.decimal_behind
+                  ? 1 / Math.pow(10, item?.decimal_behind)
+                  : 1
+              }
+              normalHeight={4}
+              normalWidth={4}
+              stepHeight={12}
+              stepWidth={12}
+              stepColor={Colors.Gray6}
+              normalColor={Colors.Gray6}
+              onChangeValue={onChangeValue}
+              value={value}
+            />
           </>
         )}
       </NewActionWrapper>

package/src/screens/{AddNewAction → Automate/AddNewAction}/Styles/SelectActionStyles.js

@@ -1,6 +1,6 @@
 import { StyleSheet } from 'react-native';
 import { getBottomSpace } from 'react-native-iphone-x-helper';
-import { Colors, Constants, Theme } from '../../../configs';
+import { Colors, Constants, Theme } from '../../../../configs';
 
 export default StyleSheet.create({
   ...Theme,

package/src/screens/{AddNewAction → Automate/AddNewAction}/Styles/SelectSensorDevicesStyles.js

@@ -1,6 +1,6 @@
 import { StyleSheet } from 'react-native';
 import { getBottomSpace } from 'react-native-iphone-x-helper';
-import { Colors, Constants } from '../../../configs';
+import { Colors, Constants } from '../../../../configs';
 
 export default StyleSheet.create({
   wrap: {

package/src/screens/{AddNewAction → Automate/AddNewAction}/Styles/SetupSensorStyles.js

@@ -1,5 +1,5 @@
 import { StyleSheet } from 'react-native';
-import { Theme, Colors } from '../../../configs';
+import { Theme, Colors } from '../../../../configs';
 
 export default StyleSheet.create({
   ...Theme,
@@ -46,8 +46,10 @@ export default StyleSheet.create({
     fontSize: 48,
     fontWeight: 'bold',
     textAlign: 'center',
-    marginLeft: 15,
+    borderBottomWidth: 1,
+    borderBottomColor: Colors.Black,
   },
+  wrapValue: { marginTop: 0, margin: 0 },
   unit: {
     marginTop: -30,
   },

package/src/screens/{AddNewAction → Automate/AddNewAction}/__test__/ChooseAction.test.js

@@ -3,14 +3,14 @@ import renderer, { act } from 'react-test-renderer';
 import MockAdapter from 'axios-mock-adapter';
 
 import ChooseAction from '../ChooseAction';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
-import BottomButtonView from '../../../commons/BottomButtonView';
-import { AccessibilityLabel, DEVICE_TYPE } from '../../../configs/Constants';
-import api from '../../../utils/Apis/axios';
-import { API } from '../../../configs';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import BottomButtonView from '../../../../commons/BottomButtonView';
+import { AccessibilityLabel, DEVICE_TYPE } from '../../../../configs/Constants';
+import api from '../../../../utils/Apis/axios';
+import { API } from '../../../../configs';
 import { TouchableOpacity } from 'react-native';
-import SelectActionCard from '../../../commons/SelectActionCard';
+import SelectActionCard from '../../../../commons/SelectActionCard';
 import { useNavigation } from '@react-navigation/native';
 
 const mock = new MockAdapter(api.axiosInstance);
@@ -68,9 +68,9 @@ describe('Test ChooseAction', () => {
 
   it('test fetchData', async () => {
     const response = [
-      { template: 'on_off_button_action_template' },
-      { template: 'one_button_action_template' },
-      { template: 'three_button_action_template' },
+      { template: 'on_off_button_action_template', id: 1, configuration: {} },
+      { template: 'one_button_action_template', id: 2, configuration: {} },
+      { template: 'three_button_action_template', id: 3, configuration: {} },
     ];
     mock.onGet(API.DEVICE.DISPLAY_ACTIONS(1)).reply(200, response);
     await act(async () => {
@@ -291,7 +291,6 @@ describe('Test ChooseAction', () => {
             data: { config_id: config5, config_value: 1 },
           },
         ],
-        unit: 1,
       })
     );
   });

package/src/screens/{AddNewAction → Automate/AddNewAction}/__test__/ChooseConfig.test.js

@@ -3,18 +3,18 @@ import renderer, { act } from 'react-test-renderer';
 import MockAdapter from 'axios-mock-adapter';
 
 import ChooseConfig from '../ChooseConfig';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
-import { DEVICE_TYPE } from '../../../configs/Constants';
-import api from '../../../utils/Apis/axios';
-import { API } from '../../../configs';
-import TitleCheckBox from '../../Sharing/Components/TitleCheckBox';
-import Text from '../../../commons/Text';
-import t from '../../../hooks/Common/useTranslations';
-import Routes from '../../../utils/Route';
-import CheckBoxCustom from '../../Sharing/Components/CheckBoxCustom';
-import BottomButtonView from '../../../commons/BottomButtonView';
-import { ToastBottomHelper } from '../../../utils/Utils';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import { DEVICE_TYPE } from '../../../../configs/Constants';
+import api from '../../../../utils/Apis/axios';
+import { API } from '../../../../configs';
+import TitleCheckBox from '../../../Sharing/Components/TitleCheckBox';
+import Text from '../../../../commons/Text';
+import t from '../../../../hooks/Common/useTranslations';
+import Routes from '../../../../utils/Route';
+import CheckBoxCustom from '../../../Sharing/Components/CheckBoxCustom';
+import BottomButtonView from '../../../../commons/BottomButtonView';
+import { ToastBottomHelper } from '../../../../utils/Utils';
 import { useNavigation } from '@react-navigation/native';
 
 const mock = new MockAdapter(api.axiosInstance);
@@ -138,22 +138,27 @@ describe('Test ChooseConfig', () => {
     });
     expect(mockedNavigate).toHaveBeenCalledWith(Routes.SetupConfigCondition, {
       item: { id: 1 },
-      sensorData: [{ id: 1 }],
-      isAutomateTab: undefined,
-      type: undefined,
-      automate: {},
+      closeScreen: undefined,
+      defaultCondition: undefined,
     });
   });
 
   it('render condition from setup', async () => {
-    mock.onGet(API.AUTOMATE.DISPLAY_CONFIGS(1)).reply(400); // hack test to fail api data
+    mock.onGet(API.AUTOMATE.DISPLAY_CONFIGS(1)).reply(200, [
+      {
+        id: 1,
+      },
+      {
+        id: 2,
+      },
+    ]);
     await act(async () => {
       tree = await renderer.create(
         wrapComponent({
           ...route,
           params: {
             ...route.params,
-            newSensorData: [{ id: 1 }, { id: 2, value: 1 }],
+            newCondition: { config: 2, value: 1 }, // condition from setup
           },
         })
       );
@@ -197,15 +202,9 @@ describe('Test ChooseConfig', () => {
     await act(async () => {
       await button.props.onPressMain();
     });
-    expect(mockedNavigate).toHaveBeenCalledWith(Routes.AddNewOneTap, {
-      automate: { config_id: 1, id: 1, value: 1 },
-      automateData: { id: 1, value: 1 },
-      automateId: undefined,
-      isAutomateTab: undefined,
-      isMultiUnits: undefined,
-      scriptName: undefined,
-      type: undefined,
-      unit: route.params.unit,
+    expect(mockedNavigate).toHaveBeenCalledWith(Routes.ValueChangeName, {
+      automate: { config_id: 1 },
+      closeScreen: undefined,
     });
   });
 });

package/src/screens/{AddNewAction → Automate/AddNewAction}/__test__/SelectControlDevices.test.js

@@ -1,16 +1,16 @@
 import React from 'react';
 import renderer, { act } from 'react-test-renderer';
 import MockAdapter from 'axios-mock-adapter';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
 import Device from '../Device';
-import BottomButtonView from '../../../commons/BottomButtonView';
-import NavBar from '../../../commons/NavBar';
-import API from '../../../configs/API';
-import { AccessibilityLabel } from '../../../configs/Constants';
+import BottomButtonView from '../../../../commons/BottomButtonView';
+import NavBar from '../../../../commons/NavBar';
+import API from '../../../../configs/API';
+import { AccessibilityLabel } from '../../../../configs/Constants';
 import { TouchableOpacity } from 'react-native';
-import Routes from '../../../utils/Route';
-import api from '../../../utils/Apis/axios';
+import Routes from '../../../../utils/Route';
+import api from '../../../../utils/Apis/axios';
 import SelectControlDevices from '../SelectControlDevices';
 import { useNavigation, useRoute } from '@react-navigation/native';
 
@@ -28,7 +28,7 @@ describe('Test SelectMonitorDevices', () => {
   let tree;
   const route = {
     params: {
-      unit: { id: 1, name: 'Unit test' },
+      unitId: 1,
       automateId: 1,
       scriptName: 'scriptName test',
       automate: {

package/src/screens/{AddNewAction → Automate/AddNewAction}/__test__/SelectMonitorDevices.test.js

@@ -3,12 +3,12 @@ import renderer, { act } from 'react-test-renderer';
 import MockAdapter from 'axios-mock-adapter';
 
 import SelectMonitorDevices from '../SelectMonitorDevices';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
-import API from '../../../configs/API';
-import { AccessibilityLabel } from '../../../configs/Constants';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import API from '../../../../configs/API';
+import { AccessibilityLabel } from '../../../../configs/Constants';
 import { TouchableOpacity } from 'react-native';
-import api from '../../../utils/Apis/axios';
+import api from '../../../../utils/Apis/axios';
 import { useRoute } from '@react-navigation/native';
 
 const mock = new MockAdapter(api.axiosInstance);

package/src/screens/{AddNewAction → Automate/AddNewAction}/__test__/SetupSensor.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { TouchableOpacity } from 'react-native';
+import { Animated, TouchableOpacity, View } from 'react-native';
 import { act, create } from 'react-test-renderer';
-import { HorizontalPicker } from '../../../commons';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
-import BottomButtonView from '../../../commons/BottomButtonView';
+import { HorizontalPicker } from '../../../../commons';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import BottomButtonView from '../../../../commons/BottomButtonView';
 import SetupConfigCondition from '../SetupConfigCondition';
 import { useNavigation, useRoute } from '@react-navigation/native';
 
@@ -38,8 +38,8 @@ describe('Test SetupConfigCondition', () => {
           id: 1,
           value: 10,
           range_min: 0,
-          range_max: 100,
-          decimal_behind: 2,
+          range_max: 10,
+          decimal_behind: 0,
           title: 'is below (<)',
           sensor_type: 'air_quality',
         },
@@ -77,25 +77,55 @@ describe('Test SetupConfigCondition', () => {
     expect(mockGoBack).toBeCalled();
   });
 
-  it('Test change value and item', async () => {
+  it('Test render when have no maximum', async () => {
     useRoute.mockReturnValue({
       params: {
         item: {
           id: 1,
-          value: 10,
           range_min: 0,
-          decimal_behind: 2,
+          range_max: 0,
+          decimal_behind: 0,
           title: 'is below (<)',
           sensor_type: 'air_quality',
         },
-        sensorData: [],
       },
     });
     await act(async () => {
       tree = await create(wrapComponent());
     });
     const instance = tree.root;
-    const HorizontalPickers = instance.findAllByType(HorizontalPicker);
-    expect(HorizontalPickers).toHaveLength(1);
+    const picker = instance.findByType(HorizontalPicker);
+    const scroll = picker.findByType(Animated.ScrollView);
+    const views = scroll.findByType(View).findAll((el) => {
+      return el.type === View && el.props.accessibilityLabel?.includes('x-');
+    });
+    expect(views).toHaveLength(10 + 1);
+  });
+  it('Test render when have no maximum and value is near maximum', async () => {
+    useRoute.mockReturnValue({
+      params: {
+        item: {
+          id: 1,
+          range_min: 0,
+          range_max: 0,
+          decimal_behind: 1,
+          title: 'is below (<)',
+          sensor_type: 'air_quality',
+        },
+        defaultCondition: {
+          value: 0.9,
+        },
+      },
+    });
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const picker = instance.findByType(HorizontalPicker);
+    const scroll = picker.findByType(Animated.ScrollView);
+    const views = scroll.findByType(View).findAll((el) => {
+      return el.type === View && el.props.accessibilityLabel?.includes('x-');
+    });
+    expect(views).toHaveLength(20 - 1); // I don't know why
   });
 });

package/src/screens/Automate/Components/InputName.js

@@ -0,0 +1,64 @@
+import React, { useCallback, useState } from 'react';
+import { Keyboard, ScrollView } from 'react-native';
+import { useNavigation, useRoute } from '@react-navigation/native';
+
+import { API } from '../../../configs';
+import { AccessibilityLabel } from '../../../configs/Constants';
+import _TextInput from '../../../commons/Form/TextInput';
+import styles from './InputNameStyles';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+import { axiosPost, axiosPut } from '../../../utils/Apis/axios';
+import NewActionWrapper from '../../Automate/AddNewAction/NewActionWrapper';
+
+const InputName = ({ title, placeholder }) => {
+  const { automate, closeScreen } = useRoute().params;
+  const t = useTranslations();
+  const { navigate } = useNavigation();
+  const [name, setName] = useState(automate?.name);
+
+  const handleContinue = useCallback(async () => {
+    Keyboard.dismiss();
+
+    const params = {
+      ...automate,
+      name: name,
+    };
+
+    const { success, data } = automate?.id
+      ? await axiosPut(API.AUTOMATE.UPDATE_AUTOMATE(automate?.id), params)
+      : await axiosPost(API.AUTOMATE.CREATE_AUTOMATE(), params);
+
+    if (success) {
+      navigate({
+        name: closeScreen,
+        merge: true,
+        params: {
+          newAutomate: data,
+        },
+      });
+    }
+  }, [automate, name, navigate, closeScreen]);
+
+  return (
+    <NewActionWrapper
+      canNext={name}
+      onNext={handleContinue}
+      nextTitle={t('save')}
+      name={title}
+    >
+      <ScrollView scrollIndicatorInsets={{ right: 1 }}>
+        <_TextInput
+          placeholder={placeholder}
+          wrapStyle={styles.noMarginTop}
+          onChange={setName}
+          textInputStyle={styles.textInput}
+          value={name}
+          accessibilityLabel={AccessibilityLabel.NAME_YOUR_BUTTON}
+          autoFocus
+        />
+      </ScrollView>
+    </NewActionWrapper>
+  );
+};
+
+export default InputName;

package/src/screens/{AddNewOneTap/AddNewOneTapStyles.js → Automate/Components/InputNameStyles.js}

@@ -1,6 +1,6 @@
 import { StyleSheet } from 'react-native';
 import { getBottomSpace } from 'react-native-iphone-x-helper';
-import { Colors } from '../../configs';
+import { Colors } from '../../../configs';
 
 export default StyleSheet.create({
   wrap: {
@@ -29,7 +29,7 @@ export default StyleSheet.create({
     bottom: 0,
     left: 0,
     right: 0,
-    paddingBottom: getBottomSpace() > 0 ? getBottomSpace() : 32,
+    paddingBottom: getBottomSpace() || 32,
     paddingTop: 24,
     backgroundColor: Colors.White,
     borderColor: Colors.ShadownTransparent,

package/src/screens/{EditActionsList → Automate/EditActionsList}/Styles/indexStyles.js

@@ -1,4 +1,4 @@
-import { Colors } from '../../../configs';
+import { Colors } from '../../../../configs';
 import { StyleSheet } from 'react-native';
 
 export default StyleSheet.create({
@@ -18,6 +18,10 @@ export default StyleSheet.create({
     height: 100,
     marginBottom: 16,
   },
+  isDragging: {
+    borderBottomWidth: 1,
+    borderColor: Colors.Red,
+  },
   leftItem: {
     width: 41,
     height: '100%',

package/src/screens/{EditActionsList → Automate/EditActionsList}/__tests__/index.test.js

@@ -1,16 +1,16 @@
 import React from 'react';
 import DraggableFlatList from 'react-native-draggable-flatlist';
 import { create, act } from 'react-test-renderer';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
 import EditActionsList from '../index';
-import { AccessibilityLabel } from '../../../configs/Constants';
+import { AccessibilityLabel } from '../../../../configs/Constants';
 import { TouchableOpacity } from 'react-native';
-import api from '../../../utils/Apis/axios';
+import api from '../../../../utils/Apis/axios';
 import MockAdapter from 'axios-mock-adapter';
-import API from '../../../configs/API';
+import API from '../../../../configs/API';
 
-import { ModalBottom } from '../../../commons/Modal';
+import { ModalBottom } from '../../../../commons/Modal';
 
 const mockSetdata = jest.fn();
 const mockedNavigate = jest.fn();