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

package/src/screens/{AddNewOneTap → Automate/Scenario}/__test__/AddNewOneTap.test.js

@@ -3,20 +3,23 @@ import MockAdapter from 'axios-mock-adapter';
 import { Platform, TextInput, TouchableOpacity } from 'react-native';
 import { act, create } from 'react-test-renderer';
 
-import AddNewOneTap from '..';
-import { AccessibilityLabel } from '../../../configs/Constants';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
-import Routes from '../../../utils/Route';
-import { HeaderCustom } from '../../../commons/Header';
-import api from '../../../utils/Apis/axios';
-import { API } from '../../../configs';
-
-const wrapComponent = (route) => (
-  <SCProvider initState={mockSCStore({})}>
-    <AddNewOneTap route={route} />
-  </SCProvider>
-);
+import ScenarioName from '../ScenarioName';
+import { AccessibilityLabel } from '../../../../configs/Constants';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import Routes from '../../../../utils/Route';
+import api from '../../../../utils/Apis/axios';
+import { API } from '../../../../configs';
+import { useNavigation, useRoute } from '@react-navigation/native';
+
+const wrapComponent = (route) => {
+  useRoute.mockReturnValue(route);
+  return (
+    <SCProvider initState={mockSCStore({})}>
+      <ScenarioName route={route} />
+    </SCProvider>
+  );
+};
 const mock = new MockAdapter(api.axiosInstance);
 
 jest.mock('react-redux', () => {
@@ -26,24 +29,15 @@ jest.mock('react-redux', () => {
   };
 });
 
-const mockedNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      navigate: mockedNavigate,
-    }),
-  };
-});
-
 let tree;
 
-describe('test AddNewOneTap', () => {
+describe('test OneTap', () => {
+  const mockedNavigate = useNavigation().navigate;
   beforeEach(() => {
     mockedNavigate.mockClear();
   });
 
-  it('create AddNewOneTap success', async () => {
+  it('create OneTap success', async () => {
     Platform.OS = 'ios';
     let route = {
       params: {
@@ -94,7 +88,7 @@ describe('test AddNewOneTap', () => {
     });
   });
 
-  it('create AddNewOneTap fail', async () => {
+  it('create OneTap fail', async () => {
     Platform.OS = 'android';
     let route = {
       params: { type: 'one_tap' },
@@ -123,13 +117,7 @@ describe('test AddNewOneTap', () => {
     Platform.OS = 'android';
     let route = {
       params: {
-        automateId: 1,
-        scriptName: 'script test',
-        type: 'one_tap',
-        havePermission: true,
-        unit: { id: 1 },
-        isMultiUnits: false,
-        isAutomateTab: false,
+        closeScreen: Routes.ScriptDetail,
       },
     };
     mock.onPost(API.AUTOMATE.CREATE_AUTOMATE()).reply(400);
@@ -137,19 +125,13 @@ describe('test AddNewOneTap', () => {
       tree = await create(wrapComponent(route));
     });
 
-    const header = tree.root.findByType(HeaderCustom);
+    const header = tree.root.findByProps({
+      accessibilityLabel: AccessibilityLabel.ICON_CLOSE,
+    });
 
     await act(async () => {
-      header.props.onClose();
-    });
-    expect(mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
-      id: 1,
-      name: 'script test',
-      type: undefined,
-      havePermission: true,
-      unit: { id: 1 },
-      isMultiUnits: false,
-      isAutomateTab: false,
+      header.props.onPress();
     });
+    expect(mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail);
   });
 });

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

@@ -0,0 +1,45 @@
+import React, { useCallback } from 'react';
+import { API, Colors } from '../../../../configs';
+import AlertAction from '../../../../commons/AlertAction';
+import { axiosDelete } from '../../../../utils/Apis/axios';
+import { ToastBottomHelper } from '../../../../utils/Utils';
+import { useTranslations } from '../../../../hooks/Common/useTranslations';
+import { useNavigation } from '@react-navigation/native';
+
+const RenameScript = ({ automate, isVisible, setIsVisible }) => {
+  const t = useTranslations();
+  const { goBack } = useNavigation();
+
+  const deleteScript = useCallback(async () => {
+    const { success } = await axiosDelete(API.AUTOMATE.SCRIPT(automate.id));
+    if (success) {
+      setIsVisible(false);
+      goBack();
+      ToastBottomHelper.success(t('removed_successfully'));
+    } else {
+      ToastBottomHelper.error(t('remove_failed'));
+    }
+  }, [automate.id, goBack, setIsVisible, t]);
+
+  const hidePopup = () => setIsVisible(false);
+
+  return (
+    <AlertAction
+      visible={isVisible}
+      hideModal={hidePopup}
+      title={t('title_delete_script', {
+        scriptName: automate?.name,
+      })}
+      message={t('message_delete_script', {
+        scriptName: automate?.name,
+      })}
+      leftButtonTitle={t('cancel')}
+      leftButtonClick={hidePopup}
+      rightButtonTitle={t('remove')}
+      rightButtonClick={deleteScript}
+      rightButtonStyle={{ color: Colors.Red6 }}
+    />
+  );
+};
+
+export default RenameScript;

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

@@ -0,0 +1,58 @@
+import React, { useCallback, useState } from 'react';
+import { API, Colors } from '../../../../configs';
+import _TextInput from '../../../../commons/Form/TextInput';
+import styles from '../Styles/indexStyles';
+import AlertAction from '../../../../commons/AlertAction';
+import { axiosPatch } from '../../../../utils/Apis/axios';
+import { ToastBottomHelper } from '../../../../utils/Utils';
+import { useTranslations } from '../../../../hooks/Common/useTranslations';
+import useKeyboardAnimated from '../../../../hooks/Explore/useKeyboardAnimated';
+
+const RenameScript = ({ automate, setAutomate, isVisible, setIsVisible }) => {
+  const t = useTranslations();
+  const [inputName, setInputName] = useState(automate.name);
+  const transY = useKeyboardAnimated();
+
+  const renameScript = useCallback(async () => {
+    const { success, data: script } = await axiosPatch(
+      API.AUTOMATE.SCRIPT(automate.id),
+      {
+        name: inputName,
+      }
+    );
+    if (success) {
+      setAutomate((prev) => ({ ...prev, name: script.name }));
+      ToastBottomHelper.success(t('rename_successfully'));
+    } else {
+      ToastBottomHelper.error(t('rename_failed'));
+    }
+    setIsVisible(false);
+  }, [automate.id, inputName, setAutomate, setIsVisible, t]);
+
+  const hidePopup = () => setIsVisible(false);
+
+  return (
+    <AlertAction
+      visible={isVisible}
+      hideModal={hidePopup}
+      title={t('rename_automate')}
+      message=""
+      leftButtonTitle={t('cancel')}
+      leftButtonClick={hidePopup}
+      rightButtonTitle={t('rename')}
+      rightButtonClick={renameScript}
+      rightButtonStyle={{ color: Colors.Primary }}
+      transY={transY}
+    >
+      <_TextInput
+        onChange={setInputName}
+        value={inputName}
+        defaultValue={automate?.name}
+        textInputStyle={styles.textInput}
+        maxLength={64}
+      />
+    </AlertAction>
+  );
+};
+
+export default RenameScript;

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

@@ -1,4 +1,4 @@
-import { Colors } from '../../../configs';
+import { Colors } from '../../../../configs';
 import { Platform, StyleSheet } from 'react-native';
 import { getBottomSpace } from 'react-native-iphone-x-helper';
 

package/src/screens/{ScriptDetail → Automate/ScriptDetail}/__test__/index.test.js

@@ -1,21 +1,28 @@
 import React from 'react';
 import { create, act } from 'react-test-renderer';
 import Toast from 'react-native-toast-message';
-
-import MockAdapter from 'axios-mock-adapter';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
-import ScriptDetail from '..';
-import MenuActionMore from '../../../commons/MenuActionMore';
-import AlertAction from '../../../commons/AlertAction';
-import _TextInput from '../../../commons/Form/TextInput';
-import { AUTOMATE_TYPE, AccessibilityLabel } from '../../../configs/Constants';
-import { API } from '../../../configs';
+import { useNavigation } from '@react-navigation/native';
 import { TouchableOpacity } from 'react-native';
-import Routes from '../../../utils/Route';
-import WrapHeaderScrollable from '../../../commons/Sharing/WrapHeaderScrollable';
-import ItemAutomate from '../../../commons/Automate/ItemAutomate';
-import api from '../../../utils/Apis/axios';
+import MockAdapter from 'axios-mock-adapter';
+
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import ScriptDetail from '../index';
+import MenuActionMore from '../../../../commons/MenuActionMore';
+import AlertAction from '../../../../commons/AlertAction';
+import _TextInput from '../../../../commons/Form/TextInput';
+import {
+  AUTOMATE_TYPE,
+  AccessibilityLabel,
+} from '../../../../configs/Constants';
+import { API } from '../../../../configs';
+import Routes from '../../../../utils/Route';
+import WrapHeaderScrollable from '../../../../commons/Sharing/WrapHeaderScrollable';
+import ItemAutomate from '../../../../commons/Automate/ItemAutomate';
+import api from '../../../../utils/Apis/axios';
+import Text from '../../../../commons/Text';
+import { ToastBottomHelper } from '../../../../utils/Utils';
+import { getTranslate } from '../../../../utils/I18n';
 
 const wrapComponent = (route) => (
   <SCProvider initState={mockSCStore({})}>
@@ -23,18 +30,6 @@ const wrapComponent = (route) => (
   </SCProvider>
 );
 
-const mockGoBack = jest.fn();
-const mockNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      goBack: mockGoBack,
-      navigate: mockNavigate,
-    }),
-  };
-});
-
 const mock = new MockAdapter(api.axiosInstance);
 
 describe('Test ScriptDetail', () => {
@@ -42,18 +37,20 @@ describe('Test ScriptDetail', () => {
   let data;
   let tree;
 
+  const mockGoBack = useNavigation().goBack;
+  const mockNavigate = useNavigation().navigate;
   beforeEach(() => {
     mockGoBack.mockClear();
+    mockNavigate.mockClear();
+    mock.reset();
     route = {
       params: {
         id: 1,
-        name: 'script',
-        unit: { id: 2 },
-        type: AUTOMATE_TYPE.ONE_TAP,
-        havePermission: true,
-        automate: {
+        preAutomate: {
+          unit: 2,
           author: 'Le Minh Tam',
-          id: 1009,
+          id: 1,
+          can_edit: true,
           type: 'value_change',
           value_change: {
             condition: '<',
@@ -63,9 +60,6 @@ describe('Test ScriptDetail', () => {
             sensor_id: 73,
             value: 35,
           },
-          script: {
-            id: 1,
-          },
         },
       },
     };
@@ -89,7 +83,7 @@ describe('Test ScriptDetail', () => {
     });
     const instance = tree.root;
     const menu = instance.findByType(MenuActionMore);
-    const alertAction = instance.findByType(AlertAction);
+    const alertAction = instance.findAllByType(AlertAction)[0];
     const rename = menu.props.listMenuItem[0];
 
     await act(async () => {
@@ -115,7 +109,7 @@ describe('Test ScriptDetail', () => {
     });
     const instance = tree.root;
     const menu = instance.findByType(MenuActionMore);
-    const alertAction = instance.findByType(AlertAction);
+    const alertAction = instance.findAllByType(AlertAction)[0];
     const rename = menu.props.listMenuItem[0];
 
     await act(async () => {
@@ -124,7 +118,7 @@ describe('Test ScriptDetail', () => {
     expect(menu.props.isVisible).toBeFalsy();
     expect(alertAction.props.visible).toBeTruthy();
 
-    mock.onPatch(API.AUTOMATE.SCRIPT(1)).reply(500, { name: 'new_name' });
+    mock.onPatch(API.AUTOMATE.SCRIPT(1)).reply(500);
     await act(async () => {
       await alertAction.props.rightButtonClick();
     });
@@ -132,14 +126,34 @@ describe('Test ScriptDetail', () => {
     expect(Toast.show).toHaveBeenCalled();
   });
 
+  it('test cannot rename script', async () => {
+    route.params.preAutomate.can_edit = false;
+    const spyToastError = jest.spyOn(ToastBottomHelper, 'error');
+
+    await act(async () => {
+      tree = await create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const menu = instance.findByProps({
+      accessibilityLabel: AccessibilityLabel.ICON_MORE,
+    });
+
+    await act(async () => {
+      await menu.props.onPress();
+    });
+    expect(spyToastError).toBeCalledWith(
+      getTranslate('en', 'only_owner_has_permission_to_edit_this_script')
+    );
+  });
+
   it('test delete script', async () => {
     await act(async () => {
       tree = await create(wrapComponent(route));
     });
     const instance = tree.root;
     const menu = instance.findByType(MenuActionMore);
-    const alertAction = instance.findByType(AlertAction);
-    const deleteItem = menu.props.listMenuItem[3];
+    const alertAction = instance.findAllByType(AlertAction)[1];
+    const deleteItem = menu.props.listMenuItem[2];
 
     await act(async () => {
       await menu.props.onItemClick(deleteItem);
@@ -187,6 +201,8 @@ describe('Test ScriptDetail', () => {
 
   it('test activate one tap', async () => {
     mock.onGet(API.AUTOMATE.SCRIPT(1)).reply(200, data);
+    route.params.preAutomate.type = AUTOMATE_TYPE.ONE_TAP;
+
     await act(async () => {
       tree = await create(wrapComponent(route));
     });
@@ -220,13 +236,25 @@ describe('Test ScriptDetail', () => {
       await button.props.onPress();
     });
     expect(mockNavigate).toHaveBeenCalledWith(Routes.SelectControlDevices, {
-      unit: route.params.unit,
-      automateId: route.params.id,
-      scriptName: route.params.name,
-      type: AUTOMATE_TYPE.ONE_TAP,
-      oldType: AUTOMATE_TYPE.ONE_TAP,
-      automate: route.params.automate,
+      unitId: route.params.preAutomate.unit,
+      automateId: route.params.preAutomate.id,
+    });
+  });
+
+  it('test not see add action', async () => {
+    route.params.preAutomate.can_edit = false;
+    mock.onGet(API.AUTOMATE.SCRIPT(1)).reply(200, data);
+    await act(async () => {
+      tree = await create(wrapComponent(route));
     });
+    const instance = tree.root;
+    const buttons = instance.findAll(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.BUTTON_ADD_SCRIPT_ACTION &&
+        el.type === TouchableOpacity
+    );
+    expect(buttons).toHaveLength(0);
   });
 
   it('test onPress onGoBack', async () => {
@@ -240,21 +268,24 @@ describe('Test ScriptDetail', () => {
     await act(async () => {
       await WrapHeaderScrollables[0].props.onGoBack();
     });
-    expect(mockNavigate).toBeCalled();
+    expect(mockGoBack).toBeCalled();
   });
 
-  const _testGoToActivityLog = (automateType, activityLogType, isMultiUnit) => {
-    it('test go to activity log', async () => {
-      route.params.type = automateType;
-      if (isMultiUnit) {
-        route.params.unit.id = undefined;
-      }
+  const _testGoToActivityLog = (
+    count,
+    automateType,
+    activityLogType,
+    unitId
+  ) => {
+    it(`test go to activity log ${count}`, async () => {
+      route.params.preAutomate.type = automateType;
+      route.params.preAutomate.unit = unitId;
       await act(async () => {
         tree = await create(wrapComponent(route));
       });
       const instance = tree.root;
       const menu = instance.findByType(MenuActionMore);
-      const gotoActivityLog = menu.props.listMenuItem[2];
+      const gotoActivityLog = menu.props.listMenuItem[1];
 
       await act(async () => {
         await menu.props.onItemClick(gotoActivityLog);
@@ -262,9 +293,9 @@ describe('Test ScriptDetail', () => {
       expect(mockNavigate).toHaveBeenCalledWith(Routes.ActivityLog, {
         id: route.params.id,
         type: activityLogType,
-        share: route.params.unit,
+        share: unitId,
         filterEnabled: {
-          user: !isMultiUnit,
+          user: !!unitId,
           date: true,
         },
       });
@@ -272,18 +303,19 @@ describe('Test ScriptDetail', () => {
   };
 
   _testGoToActivityLog(
+    1,
     AUTOMATE_TYPE.ONE_TAP,
     `automate.${AUTOMATE_TYPE.ONE_TAP}`,
-    false
+    2
   );
-  _testGoToActivityLog(AUTOMATE_TYPE.VALUE_CHANGE, 'automate', false);
-  _testGoToActivityLog(AUTOMATE_TYPE.VALUE_CHANGE, 'automate', true);
+  _testGoToActivityLog(2, AUTOMATE_TYPE.VALUE_CHANGE, 'automate', 2);
+  _testGoToActivityLog(3, AUTOMATE_TYPE.VALUE_CHANGE, 'automate', undefined);
 
   it('Test render textCondition value change >', async () => {
     route.params = {
       ...route.params,
-      type: AUTOMATE_TYPE.VALUE_CHANGE,
-      automate: {
+      preAutomate: {
+        type: AUTOMATE_TYPE.VALUE_CHANGE,
         value_change: {
           config_name: 'Light Value',
           value: 3,
@@ -296,7 +328,7 @@ describe('Test ScriptDetail', () => {
     });
     const instance = tree.root;
     const itemAutomate = instance.findByType(ItemAutomate);
-    expect(itemAutomate.props.textCondition).toEqual(
+    expect(itemAutomate.findAllByType(Text)[1].props.children).toEqual(
       'Light Value higher than 3'
     );
 
@@ -309,8 +341,8 @@ describe('Test ScriptDetail', () => {
   it('Test render textCondition value change =', async () => {
     route.params = {
       ...route.params,
-      type: AUTOMATE_TYPE.VALUE_CHANGE,
-      automate: {
+      preAutomate: {
+        type: AUTOMATE_TYPE.VALUE_CHANGE,
         value_change: { config_name: 'Light Value', value: 3, condition: '=' },
       },
     };
@@ -319,14 +351,16 @@ describe('Test ScriptDetail', () => {
     });
     const instance = tree.root;
     const itemAutomate = instance.findByType(ItemAutomate);
-    expect(itemAutomate.props.textCondition).toEqual('Light Value equal 3');
+    expect(itemAutomate.findAllByType(Text)[1].props.children).toEqual(
+      'Light Value equal 3'
+    );
   });
 
   it('Test render textCondition value change <', async () => {
     route.params = {
       ...route.params,
-      type: AUTOMATE_TYPE.VALUE_CHANGE,
-      automate: {
+      preAutomate: {
+        type: AUTOMATE_TYPE.VALUE_CHANGE,
         value_change: {
           config_name: 'Light Value',
           value: 3,
@@ -339,7 +373,7 @@ describe('Test ScriptDetail', () => {
     });
     const instance = tree.root;
     const itemAutomate = instance.findByType(ItemAutomate);
-    expect(itemAutomate.props.textCondition).toEqual(
+    expect(itemAutomate.findAllByType(Text)[1].props.children).toEqual(
       'Light Value lower than 3'
     );
   });
@@ -347,8 +381,8 @@ describe('Test ScriptDetail', () => {
   it('Test render textCondition schedule repeat everyday', async () => {
     route.params = {
       ...route.params,
-      type: AUTOMATE_TYPE.SCHEDULE,
-      automate: {
+      preAutomate: {
+        type: AUTOMATE_TYPE.SCHEDULE,
         schedule: {
           repeat: 'every_day',
           date_repeat: '2022-01-02',
@@ -361,14 +395,16 @@ describe('Test ScriptDetail', () => {
     });
     const instance = tree.root;
     const itemAutomate = instance.findByType(ItemAutomate);
-    expect(itemAutomate.props.textCondition).toEqual('Every day at 19:00');
+    expect(itemAutomate.findAllByType(Text)[1].props.children).toEqual(
+      'Every day at 19:00'
+    );
   });
 
   it('Test render textCondition schedule repeat weekday', async () => {
     route.params = {
       ...route.params,
-      type: AUTOMATE_TYPE.SCHEDULE,
-      automate: {
+      preAutomate: {
+        type: AUTOMATE_TYPE.SCHEDULE,
         schedule: {
           repeat: 'every_week',
           date_repeat: '2022-01-02',
@@ -382,7 +418,7 @@ describe('Test ScriptDetail', () => {
     });
     const instance = tree.root;
     const itemAutomate = instance.findByType(ItemAutomate);
-    expect(itemAutomate.props.textCondition).toEqual(
+    expect(itemAutomate.findAllByType(Text)[1].props.children).toEqual(
       'Mon, Tue, Thu, Sat at 19:00'
     );
   });

package/src/screens/{ScriptDetail → Automate/ScriptDetail}/__test__/useStarredScript.test.js

@@ -1,12 +1,12 @@
 import React from 'react';
 import { act, renderHook } from '@testing-library/react-hooks';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
 import { useStarredScript } from '../hooks/useStarredScript';
 import MockAdapter from 'axios-mock-adapter';
-import api from '../../../utils/Apis/axios';
-import { API } from '../../../configs';
-import { Action } from '../../../context/actionType';
+import api from '../../../../utils/Apis/axios';
+import { API } from '../../../../configs';
+import { Action } from '../../../../context/actionType';
 
 const mockedSetAction = jest.fn();
 const mock = new MockAdapter(api.axiosInstance);
@@ -22,8 +22,9 @@ React.useContext = mockUseContext;
 
 jest.mock('react-native-deep-linking');
 
-describe('Test useStarredScript', async () => {
+describe('Test useStarredScript', () => {
   let props;
+
   beforeEach(() => {
     mockedSetAction.mockClear();
     props = {

package/src/screens/{ScriptDetail → Automate/ScriptDetail}/hooks/useStarredScript.js

@@ -1,8 +1,8 @@
 import { useCallback, useContext } from 'react';
-import { SCContext, useSCContextSelector } from '../../../context';
-import { Action } from '../../../context/actionType';
-import { axiosPost } from '../../../utils/Apis/axios';
-import { API } from '../../../configs';
+import { SCContext, useSCContextSelector } from '../../../../context';
+import { Action } from '../../../../context/actionType';
+import { axiosPost } from '../../../../utils/Apis/axios';
+import { API } from '../../../../configs';
 
 export const useStarredScript = (automate) => {
   const { setAction } = useContext(SCContext);