@eohjsc/react-native-smart-city 0.7.3-rc9 → 0.7.4

package/src/screens/Automate/AddNewAction/__test__/SetupConfigCondition.test.js

@@ -1,18 +1,17 @@
+import { useRoute } from '@react-navigation/native';
 import React from 'react';
+import { TouchableWithoutFeedback } from 'react-native';
 import { act, create } from 'react-test-renderer';
-import { SCProvider } from '../../../../context';
-import { mockSCStore } from '../../../../context/mockStore';
-import SetupConfigCondition from '../SetupConfigCondition';
-import { useRoute } from '@react-navigation/native';
-import { ToastBottomHelper } from '../../../../utils/Utils';
 import { Text } from '../../../../commons';
-import GridItem from '../../../../commons/Grid/GridItem';
-import { TouchableWithoutFeedback } from 'react-native';
-import Routes from '../../../../utils/Route';
-import { ModalCustom } from '../../../../commons/Modal';
 import { showAllGridItems } from '../../../../commons/ActionTemplate/__test__/utils';
 import TextInput from '../../../../commons/Form/TextInput';
-import CheckBox from '@react-native-community/checkbox';
+import GridItem from '../../../../commons/Grid/GridItem';
+import { ModalCustom } from '../../../../commons/Modal';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import Routes from '../../../../utils/Route';
+import { ToastBottomHelper } from '../../../../utils/Utils';
+import SetupConfigCondition from '../SetupConfigCondition';
 
 jest.mock('react', () => {
   return {
@@ -57,7 +56,6 @@ describe('Test SetupConfigCondition', () => {
           name: 'config name',
           decimal_behind: 0,
           title: 'is below (<)',
-          sensor_type: 'air_quality',
           value_evaluations: [
             {
               id: 1,
@@ -108,6 +106,7 @@ describe('Test SetupConfigCondition', () => {
             },
           ],
         },
+        automate: {},
         sensorData: [],
       },
     });
@@ -130,9 +129,9 @@ describe('Test SetupConfigCondition', () => {
           id: 1,
           name: 'config name',
           title: 'is below (<)',
-          sensor_type: 'air_quality',
           value_evaluations: [BOOLEAN_VALUE_EVALUATION_CONFIGURATION],
         },
+        automate: {},
         sensorData: [],
       },
     });
@@ -158,7 +157,6 @@ describe('Test SetupConfigCondition', () => {
           id: 1,
           name: 'config name',
           title: 'is below (<)',
-          sensor_type: 'air_quality',
           value_evaluations: [BOOLEAN_VALUE_EVALUATION_CONFIGURATION],
         },
         sensorData: [],
@@ -214,8 +212,10 @@ describe('Test SetupConfigCondition', () => {
     });
     expect(modal.props.isVisible).toBeFalsy();
 
+    const modalGridItems = instance.findAllByType(GridItem);
+
     await act(async () => {
-      instance.findAllByType(CheckBox)[0].props.onChange();
+      modalGridItems[1].findByType(TouchableWithoutFeedback).props.onPress();
     });
 
     const input = instance.findByType(TextInput);
@@ -249,7 +249,6 @@ describe('Test SetupConfigCondition', () => {
           name: 'config name',
           decimal_behind: 0,
           title: 'is below (<)',
-          sensor_type: 'air_quality',
         },
         automate: {},
       },
@@ -286,4 +285,44 @@ describe('Test SetupConfigCondition', () => {
       'Please enter a number and select a condition'
     );
   });
+
+  it('Test render when have input number but not select condition', async () => {
+    await testConditionValue(
+      '123',
+      'Please enter a number and select a condition'
+    );
+  });
+
+  it('Test render when have input empty', async () => {
+    await testConditionValue(
+      '',
+      'Please enter a number and select a condition'
+    );
+  });
+
+  it('Test render when no value evaluations', async () => {
+    useRoute.mockReturnValue({
+      params: {
+        config: {
+          id: 1,
+          name: 'config name',
+          title: 'is below (<)',
+          sensor_type: 'air_quality',
+          value_evaluations: [],
+        },
+        automate: {},
+        sensorData: [],
+      },
+    });
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+
+    const gridItems = instance.findAllByType(GridItem);
+    expect(gridItems).toHaveLength(1);
+    expect(gridItems[0].findByType(Text).props.children).toEqual(
+      'Customize conditions'
+    );
+  });
 });

package/src/screens/Automate/AddNewAction/__test__/SetupScriptNotify.test.js

@@ -69,6 +69,35 @@ describe('Test SetupScriptNotify', () => {
     expect(spyToast).toHaveBeenCalled();
   });
 
+  it('SetupScriptNotify onPress create script notify success with multi unit', async () => {
+    route.params.unitId = null;
+    route.params.multiUnit = { id: 1 };
+    const spyToast = jest.spyOn(ToastBottomHelper, 'success');
+    mock.onPost(API.AUTOMATE.ADD_SCRIPT_NOTIFY(1)).reply(200);
+    await act(async () => {
+      tree = await renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const inputs = instance.findAllByType(_TextInput);
+    expect(inputs).toHaveLength(2);
+
+    await act(async () => {
+      inputs[0].props.onChange('Title');
+    });
+    const touchable = instance.findAllByType(TouchableWithoutFeedback);
+    await act(async () => {
+      touchable[0].props.onPress();
+    });
+    await act(async () => {
+      inputs[1].props.onChange('Message');
+    });
+    const button = instance.findByType(BottomButtonView);
+    await act(async () => {
+      button.props.onPressMain();
+    });
+    expect(spyToast).toHaveBeenCalled();
+  });
+
   it('SetupScriptNotify onPress create script notify error', async () => {
     const spyToast = jest.spyOn(ToastBottomHelper, 'error');
     mock.onPost(API.AUTOMATE.ADD_SCRIPT_NOTIFY(1)).reply(400);

package/src/screens/Automate/AddNewAutoSmart/AddTypeSmart.js

@@ -1,22 +1,22 @@
+import { useNavigation } from '@react-navigation/native';
 import React, { useCallback, useState } from 'react';
 import { View } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
+import ItemAutomate from '../../../commons/Automate/ItemAutomate';
 import { HeaderCustom } from '../../../commons/Header';
-import styles from './styles/AddNewAutoSmartStyles';
 import Text from '../../../commons/Text';
-import ItemAutomate from '../../../commons/Automate/ItemAutomate';
 import { useTranslations } from '../../../hooks/Common/useTranslations';
 import Routes from '../../../utils/Route';
+import styles from './styles/AddNewAutoSmartStyles';
+import { AUTOMATE_TYPE } from '../../../configs/Constants';
 
 const AddTypeSmart = ({ smartTypes, route }) => {
   const t = useTranslations();
   const { navigate, goBack } = useNavigation();
   const { automate = {}, closeScreen } = route?.params || {};
+  const { id, unit, type } = automate;
 
   const [selectedIndex, setSelectedIndex] = useState(
-    automate?.id
-      ? smartTypes.findIndex((obj) => obj.type === automate.type)
-      : -1
+    id ? smartTypes.findIndex((obj) => obj.type === type) : -1
   );
 
   const handleOnContinue = useCallback(
@@ -27,17 +27,18 @@ const AddTypeSmart = ({ smartTypes, route }) => {
           ...automate,
           type: dataAutomate?.type,
         },
+        unitId: unit,
         closeScreen: closeScreen,
       };
 
-      if (!automate?.unit) {
+      if (!unit && dataAutomate.type === AUTOMATE_TYPE.VALUE_CHANGE) {
         navigate(Routes.SelectUnit, params);
         return;
       }
 
       navigate(dataAutomate.route, params);
     },
-    [smartTypes, automate, closeScreen, navigate]
+    [smartTypes, automate, unit, closeScreen, navigate]
   );
 
   const onSelectType = (index) => {
@@ -50,7 +51,7 @@ const AddTypeSmart = ({ smartTypes, route }) => {
       <HeaderCustom isShowClose onClose={goBack} />
       <View style={styles.container}>
         <Text semibold type={'H2'} style={styles.titleCreate}>
-          {automate?.id ? t('update_smart') : t('create_smart')}
+          {id ? t('update_smart') : t('create_smart')}
         </Text>
         <Text type={'Body'} style={styles.titleChoose}>
           {t('choose_the_automation_method_you_want')}
@@ -62,7 +63,6 @@ const AddTypeSmart = ({ smartTypes, route }) => {
               isSelected={selectedIndex === index}
               key={item?.type?.toString()}
               index={index}
-              selectedIndex={selectedIndex}
               setSelectedIndex={onSelectType}
             />
           ))}

package/src/screens/Automate/AddNewAutoSmart/__test__/AddNewAutoSmart.test.js

@@ -46,6 +46,7 @@ describe('test AddNewAutoSmart', () => {
       {
         automate: { unit: 1, type: 'value_change' },
         closeScreen: undefined,
+        unitId: 1,
       }
     );
   });
@@ -65,6 +66,7 @@ describe('test AddNewAutoSmart', () => {
     expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.SetSchedule, {
       automate: { type: 'schedule', unit: 1 },
       closeScreen: undefined,
+      unitId: 1,
     });
   });
 });

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

@@ -9,12 +9,14 @@ import styles from './InputNameStyles';
 import { useTranslations } from '../../../hooks/Common/useTranslations';
 import { axiosPost, axiosPut } from '../../../utils/Apis/axios';
 import NewActionWrapper from '../../Automate/AddNewAction/NewActionWrapper';
+import Routes from '../../../utils/Route';
 
 const InputName = ({ title, placeholder }) => {
-  const { automate, closeScreen } = useRoute().params;
+  const { automate = {}, closeScreen } = useRoute().params;
+  const { id: automateNameId, name: automateName } = automate;
   const t = useTranslations();
   const { navigate } = useNavigation();
-  const [name, setName] = useState(automate?.name);
+  const [name, setName] = useState(automateName);
   const [processing, setProcessing] = useState(false);
   const handleContinue = useCallback(async () => {
     if (processing) {
@@ -29,21 +31,22 @@ const InputName = ({ title, placeholder }) => {
       name: name,
     };
 
-    const { success, data } = automate?.id
-      ? await axiosPut(API.AUTOMATE.UPDATE_AUTOMATE(automate?.id), params)
+    const { success, data } = automateNameId
+      ? await axiosPut(API.AUTOMATE.UPDATE_AUTOMATE(automateNameId), params)
       : await axiosPost(API.AUTOMATE.CREATE_AUTOMATE(), params);
 
     if (success) {
       navigate({
-        name: closeScreen,
+        name: Routes.ScriptDetail,
         merge: true,
         params: {
-          newAutomate: data,
+          preAutomate: data,
+          closeScreen: closeScreen,
         },
       });
     }
     setProcessing(false);
-  }, [processing, automate, name, navigate, closeScreen]);
+  }, [processing, automate, name, automateNameId, navigate, closeScreen]);
 
   return (
     <NewActionWrapper

package/src/screens/Automate/EditActionsList/index.js

@@ -1,27 +1,28 @@
-import React, { useState, useCallback, useMemo, useEffect } from 'react';
-import { View, TouchableOpacity } from 'react-native';
-import DraggableFlatList from 'react-native-draggable-flatlist';
 import { useNavigation, useRoute } from '@react-navigation/native';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { TouchableOpacity, View } from 'react-native';
+import DraggableFlatList from 'react-native-draggable-flatlist';
 import ParsedText from 'react-native-parsed-text';
 
+import { GestureHandlerRootView } from 'react-native-gesture-handler';
+import Close from '../../../../assets/images/Close.svg';
+import Delay from '../../../../assets/images/Delay.svg';
+import Notify from '../../../../assets/images/Notify.svg';
+import Rearrange from '../../../../assets/images/Rearrange.svg';
+import { FullLoading } from '../../../commons';
+import FImage from '../../../commons/FImage';
 import { HeaderCustom } from '../../../commons/Header';
-import { useTranslations } from '../../../hooks/Common/useTranslations';
+import { ModalBottom, ModalCustom } from '../../../commons/Modal';
 import Text from '../../../commons/Text';
-import styles from './Styles/indexStyles';
 import { API, Colors } from '../../../configs';
-import FImage from '../../../commons/FImage';
-import Rearrange from '../../../../assets/images/Rearrange.svg';
-import Notify from '../../../../assets/images/Notify.svg';
-import Delay from '../../../../assets/images/Delay.svg';
-import Close from '../../../../assets/images/Close.svg';
-import { axiosDelete, axiosPut } from '../../../utils/Apis/axios';
-import { ModalBottom, ModalCustom } from '../../../commons/Modal';
-import { ToastBottomHelper } from '../../../utils/Utils';
 import { AccessibilityLabel } from '../../../configs/Constants';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+import { axiosDelete, axiosPut } from '../../../utils/Apis/axios';
 import Routes from '../../../utils/Route';
+import { ToastBottomHelper } from '../../../utils/Utils';
+import styles from './Styles/indexStyles';
 import UpdateDelayScript from './UpdateDelayScript';
 import UpdateNotifyScript from './UpdateNotifyScript';
-import { FullLoading } from '../../../commons';
 
 const EditActionsList = () => {
   const t = useTranslations();
@@ -134,7 +135,8 @@ const EditActionsList = () => {
     </View>
   );
   const renderItem = useCallback(
-    ({ item, index, drag, isActive }) => {
+    ({ item, getIndex, drag, isActive }) => {
+      const index = getIndex();
       const paddedIndex = (index + 1).toString().padStart(2, '0');
       const { action_script, notify_script, delay_script } = item;
       if (action_script) {
@@ -354,7 +356,7 @@ const EditActionsList = () => {
   }, [itemRemove, t]);
 
   return (
-    <View style={styles.wrap}>
+    <GestureHandlerRootView style={styles.wrap}>
       <HeaderCustom title={t('edit_actions_list')} onGoBack={onCancel} />
       <View style={styles.wrapContent}>
         <Text type="Body" color={Colors.Gray8}>
@@ -393,7 +395,7 @@ const EditActionsList = () => {
           <View style={styles.modalHeader}>{renderAction}</View>
         </View>
       </ModalCustom>
-    </View>
+    </GestureHandlerRootView>
   );
 };
 

package/src/screens/Automate/MultiUnits.js

@@ -25,9 +25,12 @@ const MultiUnits = () => {
   const isFocused = useIsFocused();
   const { navigate } = useNavigation();
   const { params = {}, name: currentRouteName } = useRoute();
-  const { unit, newAutomate } = params;
+  const { unit = {} } = params;
+  const { id: unitId, name } = unit;
   const [data, setData] = useState([]);
   const permissions = useBackendPermission();
+  const { smart_script_for_multi_unit, max_automations_per_unit } =
+    permissions || {};
 
   const [tabActive, setTabActive] = useState(AUTOMATE_TABS.SCENARIO);
 
@@ -37,8 +40,8 @@ const MultiUnits = () => {
 
   const getData = useCallback(
     async (fetchParams) => {
-      if (unit?.id) {
-        await fetchWithCache(API.UNIT.AUTOMATE(unit?.id), {}, (response) => {
+      if (unitId) {
+        await fetchWithCache(API.UNIT.AUTOMATE(unitId), {}, (response) => {
           const { success, data: automateData } = response;
           success && setData(automateData);
         });
@@ -50,7 +53,7 @@ const MultiUnits = () => {
         success && setData(automateData);
       }
     },
-    [unit?.id]
+    [unitId]
   );
 
   const onPressTabName = (tab) => () => {
@@ -62,32 +65,26 @@ const MultiUnits = () => {
       navigate(Routes.UnitStack, {
         screen: Routes.ScriptDetail,
         params: {
-          id: item?.id,
-          unitId: unit?.id,
           preAutomate: item,
         },
       });
     },
-    [navigate, unit?.id]
+    [navigate]
   );
 
-  useEffect(() => {
-    newAutomate && onPressItem(newAutomate);
-  }, [newAutomate, onPressItem]);
-
   const handleOnAddNew = useCallback(() => {
-    if (unit?.id) {
-      if (permissions?.max_automations_per_unit <= data.length) {
+    if (unitId) {
+      if (max_automations_per_unit <= data.length) {
         ToastBottomHelper.error(
           t('reach_max_automations_per_unit', {
-            length: permissions.max_automations_per_unit,
+            length: max_automations_per_unit,
           }),
           '',
           7000
         );
         return;
       }
-    } else if (!permissions?.smart_script_for_multi_unit) {
+    } else if (!smart_script_for_multi_unit) {
       ToastBottomHelper.error(
         t('no_permission_smart_script_for_multi_unit'),
         '',
@@ -99,7 +96,7 @@ const MultiUnits = () => {
       navigate(Routes.UnitStack, {
         screen: Routes.ScenarioName,
         params: {
-          automate: { type: AUTOMATE_TYPE.ONE_TAP, unit: unit?.id },
+          automate: { type: AUTOMATE_TYPE.ONE_TAP, unit: unitId },
           closeScreen: currentRouteName,
         },
       });
@@ -107,9 +104,9 @@ const MultiUnits = () => {
     }
 
     navigate(Routes.UnitStack, {
-      screen: Routes.AddUnknownTypeSmart,
+      screen: Routes.AddAutomationTypeSmart,
       params: {
-        automate: { unit: unit?.id },
+        automate: { unit: unitId },
         closeScreen: currentRouteName,
       },
     });
@@ -117,11 +114,11 @@ const MultiUnits = () => {
     currentRouteName,
     data.length,
     navigate,
-    permissions?.max_automations_per_unit,
-    permissions?.smart_script_for_multi_unit,
+    max_automations_per_unit,
+    smart_script_for_multi_unit,
     t,
     tabActive,
-    unit?.id,
+    unitId,
   ]);
 
   const renderContent = useMemo(() => {
@@ -166,7 +163,7 @@ const MultiUnits = () => {
   return (
     <View style={styles.wrap}>
       <WrapHeaderScrollable
-        title={unit?.id ? unit?.name : t('multi_units_automate')}
+        title={unitId ? name : t('multi_units_automate')}
         headerAniStyle={styles.headerAniStyle}
       >
         <View style={styles.wrapContent}>

package/src/screens/Automate/OneTap/__test__/AddNewOneTap.test.js

@@ -81,7 +81,8 @@ describe('test OneTap', () => {
       merge: true,
       name: Routes.ScriptDetail,
       params: {
-        newAutomate: {
+        closeScreen: Routes.ScriptDetail,
+        preAutomate: {
           id: 1,
           script: { id: 1, name: 'William Miller' },
           type: 'one_tap',
@@ -122,8 +123,13 @@ describe('test OneTap', () => {
     let route = {
       params: {
         closeScreen: Routes.ScriptDetail,
+        automate: {
+          unit: 1,
+        },
+        unitId: 1,
       },
     };
+
     mock.onPost(API.AUTOMATE.CREATE_AUTOMATE()).reply(400);
     await act(async () => {
       tree = await create(wrapComponent(route));
@@ -136,6 +142,10 @@ describe('test OneTap', () => {
     await act(async () => {
       header.props.onPress();
     });
-    expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail);
+    expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
+      unitId: 1,
+      automate: { unit: 1 },
+      closeScreen: Routes.ScriptDetail,
+    });
   });
 });

package/src/screens/Automate/Scenario/__test__/AddNewOneTap.test.js

@@ -111,6 +111,10 @@ describe('test OneTap', () => {
     let route = {
       params: {
         closeScreen: Routes.ScriptDetail,
+        automate: {
+          unit: 1,
+        },
+        unitId: 1,
       },
     };
     mock.onPost(API.AUTOMATE.CREATE_AUTOMATE()).reply(400);
@@ -125,6 +129,10 @@ describe('test OneTap', () => {
     await act(async () => {
       header.props.onPress();
     });
-    expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail);
+    expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
+      unitId: 1,
+      automate: { unit: 1 },
+      closeScreen: 'ScriptDetail',
+    });
   });
 });

package/src/screens/Automate/ScriptDetail/Components/AddActionScript.js

@@ -11,7 +11,7 @@ import Event from '../../../../../assets/images/Event.svg';
 import Notify from '../../../../../assets/images/Notify.svg';
 import Delay from '../../../../../assets/images/Delay.svg';
 import { TouchableOpacity } from 'react-native';
-import AntDesign from 'react-native-vector-icons/AntDesign';
+import { IconOutline } from '@ant-design/icons-react-native';
 import { Text } from '../../../../commons';
 import Routes from '../../../../utils/Route';
 import AccessibilityLabel from '../../../../configs/AccessibilityLabel';
@@ -40,6 +40,7 @@ const AddActionScript = memo(
               closeScreen: currentScreenName,
               numberActionCanAdd:
                 max_actions_per_automation - numberActionAdded,
+              routeName: unit ? null : Routes.SelectControlDevices,
             };
 
             navigate(
@@ -54,10 +55,17 @@ const AddActionScript = memo(
           image: <Notify />,
           onClick: () => {
             setIsVisible(false);
-            navigate(Routes.SetupScriptNotify, {
-              automate,
-              unitId: unit,
-            });
+            if (unit) {
+              navigate(Routes.SetupScriptNotify, {
+                automate,
+                unitId: unit,
+              });
+            } else {
+              navigate(Routes.SelectUnit, {
+                automate,
+                routeName: Routes.SetupScriptNotify,
+              });
+            }
           },
         },
         {
@@ -109,7 +117,7 @@ const AddActionScript = memo(
                   <View style={styles.wapItem}>
                     <View style={styles.imageItem}>{item.image}</View>
                     <Text style={styles.textItem}>{item.text}</Text>
-                    <AntDesign name="right" />
+                    <IconOutline name="right" />
                   </View>
                 </TouchableOpacity>
               </View>

package/src/screens/Automate/ScriptDetail/Components/RenameScript.js

@@ -14,14 +14,11 @@ const RenameScript = ({ automate, setAutomate, isVisible, setIsVisible }) => {
   const transY = useKeyboardAnimated();
 
   const renameScript = useCallback(async () => {
-    const { success, data: script } = await axiosPatch(
-      API.AUTOMATE.SCRIPT(automate.id),
-      {
-        name: inputName,
-      }
-    );
+    const { success } = await axiosPatch(API.AUTOMATE.SCRIPT(automate.id), {
+      name: inputName,
+    });
     if (success) {
-      setAutomate((prev) => ({ ...prev, name: script.name }));
+      setAutomate((prev) => ({ ...prev, name: inputName }));
       ToastBottomHelper.success(t('rename_successfully'));
     } else {
       ToastBottomHelper.error(t('rename_failed'));