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

package/src/screens/Automate/ScriptDetail/__test__/index.test.js

@@ -1,8 +1,10 @@
 import React from 'react';
 import { create, act } from 'react-test-renderer';
 import Toast from 'react-native-toast-message';
-
+import { useNavigation } from '@react-navigation/native';
+import { TouchableOpacity } from 'react-native';
 import MockAdapter from 'axios-mock-adapter';
+
 import { SCProvider } from '../../../../context';
 import { mockSCStore } from '../../../../context/mockStore';
 import ScriptDetail from '../index';
@@ -14,16 +16,16 @@ import {
   AccessibilityLabel,
 } from '../../../../configs/Constants';
 import { API } from '../../../../configs';
-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 Text from '../../../../commons/Text';
-import { useNavigation } from '@react-navigation/native';
+import { ToastBottomHelper } from '../../../../utils/Utils';
+import { getTranslate } from '../../../../utils/I18n';
 
-const wrapComponent = (route) => (
-  <SCProvider initState={mockSCStore({})}>
+const wrapComponent = (route, storeData = {}) => (
+  <SCProvider initState={mockSCStore(storeData)}>
     <ScriptDetail route={route} />
   </SCProvider>
 );
@@ -48,6 +50,7 @@ describe('Test ScriptDetail', () => {
           unit: 2,
           author: 'Le Minh Tam',
           id: 1,
+          can_edit: true,
           type: 'value_change',
           value_change: {
             condition: '<',
@@ -123,6 +126,26 @@ 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));
@@ -218,6 +241,56 @@ describe('Test ScriptDetail', () => {
     });
   });
 
+  it('test press add action reach limit', async () => {
+    mock.onGet(API.AUTOMATE.SCRIPT(1)).reply(200, data);
+    await act(async () => {
+      tree = await create(
+        wrapComponent(route, {
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  max_actions_per_automation: 0,
+                },
+              },
+            },
+          },
+        })
+      );
+    });
+    const instance = tree.root;
+    const button = instance.find(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.BUTTON_ADD_SCRIPT_ACTION &&
+        el.type === TouchableOpacity
+    );
+    const spyToastError = jest.spyOn(ToastBottomHelper, 'error');
+    await act(async () => {
+      await button.props.onPress();
+    });
+    expect(mockNavigate).not.toBeCalled();
+    expect(spyToastError).toBeCalledWith(
+      getTranslate('en', 'reach_max_actions_per_automation')
+    );
+  });
+
+  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 () => {
     await act(async () => {
       tree = await create(wrapComponent(route));

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

@@ -30,6 +30,7 @@ import { AccessibilityLabel, AUTOMATE_TYPE } from '../../../configs/Constants';
 import RenameScript from './Components/RenameScript';
 import DeleteScript from './Components/DeleteScript';
 import Images from '../../../configs/Images';
+import { useBackendPermission } from '../../../utils/Permission/backend';
 
 const PreventDoubleTouch = withPreventDoubleClick(TouchableOpacity);
 
@@ -45,7 +46,9 @@ const ScriptDetail = ({ route }) => {
     saveAt,
     preAutomate = {}, // pre-loaded automate data
     newAutomate, // updated automate data
+    newActionsList, // updated actions list
   } = params;
+
   const [automate, setAutomate] = useState(preAutomate);
   const [data, setData] = useState([]);
   const [isShowRename, setIsShowRename] = useState(false);
@@ -81,10 +84,15 @@ const ScriptDetail = ({ route }) => {
     [t, onShowActivityLog]
   );
 
-  const handleShowMenuAction = useCallback(
-    () => showPopoverWithRef(refMenuAction),
-    [showPopoverWithRef]
-  );
+  const handleShowMenuAction = useCallback(() => {
+    if (!automate?.can_edit) {
+      ToastBottomHelper.error(
+        t('only_owner_has_permission_to_edit_this_script')
+      );
+      return;
+    }
+    showPopoverWithRef(refMenuAction);
+  }, [automate?.can_edit, showPopoverWithRef, t]);
 
   const onItemClick = useCallback((item) => {
     item.doAction();
@@ -115,14 +123,14 @@ const ScriptDetail = ({ route }) => {
   const handleScriptAction = useCallback(async () => {
     const { success } = await axiosPost(API.AUTOMATE.ACTION_ONE_TAP(id));
     if (success) {
-      ToastBottomHelper.success(t('Activated successfully.'));
+      ToastBottomHelper.success(t('activated_successfully'));
     } else {
-      ToastBottomHelper.error(t('Activation failed.'));
+      ToastBottomHelper.error(t('activation_failed'));
     }
   }, [id, t]);
 
   const handleUpdateAutomate = useCallback(async () => {
-    navigate(Routes.AddNewAutoSmart, {
+    navigate(Routes.AddUnknownTypeSmart, {
       automate,
       closeScreen: route.name,
     });
@@ -132,6 +140,10 @@ const ScriptDetail = ({ route }) => {
     fetchAutomate();
   }, [fetchAutomate]);
 
+  useEffect(() => {
+    newActionsList && setData(newActionsList);
+  }, [newActionsList]);
+
   const rightComponent = useMemo(
     () => (
       <View style={styles.rightComponent}>
@@ -140,6 +152,7 @@ const ScriptDetail = ({ route }) => {
           onPress={handleShowMenuAction}
           ref={refMenuAction}
           style={[styles.headerButton, styles.moreButton]}
+          accessibilityLabel={AccessibilityLabel.ICON_MORE}
         >
           <Icon name={'more'} size={27} color={Colors.Black} />
         </TouchableOpacity>
@@ -187,7 +200,7 @@ const ScriptDetail = ({ route }) => {
             <Text type="H3" color={Colors.Gray9} semibold>
               {t('active_list')}
             </Text>
-            {data.length > 0 && (
+            {data.length > 0 && !!automate?.can_edit && (
               <TouchableOpacity
                 onPress={onPressEdit}
                 style={styles.editButton}
@@ -204,7 +217,9 @@ const ScriptDetail = ({ route }) => {
           {data.map((item, index) => (
             <Item key={item?.id} item={item} index={index} />
           ))}
-          <ItemAdd automate={automate} index={data.length} />
+          {!!automate?.can_edit && (
+            <ItemAdd automate={automate} index={data.length} />
+          )}
         </View>
       </WrapHeaderScrollable>
       <MenuActionMore
@@ -282,9 +297,14 @@ const Item = ({ item, index }) => {
 const ItemAdd = ({ automate, index }) => {
   const t = useTranslations();
   const { navigate } = useNavigation();
+  const permissions = useBackendPermission();
   const { name: currentScreenName } = useRoute();
 
   const onPressAddAction = useCallback(() => {
+    if (permissions?.max_actions_per_automation <= index) {
+      ToastBottomHelper.error(t('reach_max_actions_per_automation'));
+      return;
+    }
     const navParams = {
       unitId: automate.unit,
       automateId: automate.id,
@@ -295,7 +315,15 @@ const ItemAdd = ({ automate, index }) => {
       automate.unit ? Routes.SelectControlDevices : Routes.SelectUnit,
       navParams
     );
-  }, [automate.unit, automate.id, currentScreenName, navigate]);
+  }, [
+    permissions?.max_actions_per_automation,
+    index,
+    automate.unit,
+    automate.id,
+    currentScreenName,
+    navigate,
+    t,
+  ]);
 
   return (
     <View style={styles.wrapItem}>

package/src/screens/Automate/Styles/MultiUnitsStyles.js

@@ -45,7 +45,7 @@ export default StyleSheet.create({
     flexDirection: 'row',
     flexWrap: 'wrap',
   },
-  marginRigt8: {
+  itemOneTapMargin: {
     marginRight: 8,
   },
   addNewItem: {

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

@@ -15,11 +15,12 @@ import { getTranslate } from '../../../utils/I18n';
 import { AUTOMATE_TYPE } from '../../../configs/Constants';
 import api from '../../../utils/Apis/axios';
 import { API } from '../../../configs';
+import { ToastBottomHelper } from '../../../utils/Utils';
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const wrapComponent = () => (
-  <SCProvider initState={mockSCStore({})}>
+const wrapComponent = (storeData = {}) => (
+  <SCProvider initState={mockSCStore(storeData)}>
     <MultiUnits />
   </SCProvider>
 );
@@ -31,6 +32,7 @@ describe('Test MultiUnits', () => {
   beforeEach(() => {
     mockedNavigate.mockClear();
     useRoute.mockClear();
+    mock.reset();
   });
 
   it('Test is multi unit and current is Automation tab', async () => {
@@ -106,7 +108,7 @@ describe('Test MultiUnits', () => {
       ItemAddNews[0].props.onAddNew();
     });
     expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.AddNewAutoSmart,
+      screen: Routes.AddUnknownTypeSmart,
       params: {
         automate: { unit: undefined },
         closeScreen: undefined,
@@ -151,9 +153,7 @@ describe('Test MultiUnits', () => {
     mock.onGet(API.AUTOMATE.GET_MULTI_UNITS()).reply(200, response);
     useRoute.mockReturnValue({
       params: {
-        isMultiUnits: true,
-        unitName: null,
-        unit: null,
+        unit: {},
       },
     });
     await act(async () => {
@@ -180,9 +180,66 @@ describe('Test MultiUnits', () => {
     });
   });
 
+  it('create new smart but reach max', async () => {
+    const response = [
+      {
+        id: 1,
+        user: 223,
+        type: 'one_tap',
+        config: null,
+        value: null,
+        activate_at: '2021-09-22T14:16:54Z',
+        condition: null,
+        script: {
+          id: 1,
+          name: 'Tap to up down up down coc coc coc coc coc',
+          icon: null,
+          icon_kit:
+            'https://eoh-gateway-backend.eoh.io/_Category_Sensors_Type_Garage_door_StyleC_olorful.png',
+        },
+      },
+    ];
+    mock.onGet(API.UNIT.AUTOMATE(1)).reply(200, response);
+    useRoute.mockReturnValue({
+      params: {
+        unit: { id: 1 },
+      },
+    });
+    await act(async () => {
+      tree = await create(
+        wrapComponent({
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  max_automations_per_unit: 0,
+                },
+              },
+            },
+          },
+        })
+      );
+    });
+    const instance = tree.root;
+    const itemAddNews = instance.findAllByType(ItemAddNew);
+    const spyToastError = jest.spyOn(ToastBottomHelper, 'error');
+    await act(async () => {
+      itemAddNews[0].props.onAddNew();
+    });
+    expect(mockedNavigate).not.toBeCalled();
+    expect(spyToastError).toBeCalledWith(
+      getTranslate('en', 'reach_max_automations_per_unit')
+    );
+  });
+
   it('Test is not multi unit', async () => {
     useRoute.mockReturnValue({
-      params: {},
+      params: {
+        unit: {
+          id: 1,
+          name: '',
+        },
+      },
     });
     await act(async () => {
       tree = await create(wrapComponent());

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

@@ -13,11 +13,13 @@ import { AccessibilityLabel } from '../../../configs/Constants';
 import api from '../../../utils/Apis/axios';
 import { API } from '../../../configs';
 import { useNavigation } from '@react-navigation/native';
+import { getTranslate } from '../../../utils/I18n';
+import { ToastBottomHelper } from '../../../utils/Utils';
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const wrapComponent = () => (
-  <SCProvider initState={mockSCStore({})}>
+const wrapComponent = (storeData = {}) => (
+  <SCProvider initState={mockSCStore(storeData)}>
     <Automate />
   </SCProvider>
 );
@@ -92,7 +94,7 @@ describe('Test Automate', () => {
       ItemAddNews[0].props.onAddNew('MultiUnit');
     });
     expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.AddNewAutoSmart,
+      screen: Routes.AddUnknownTypeSmart,
       params: {
         closeScreen: undefined,
         automate: { unit: undefined },
@@ -100,6 +102,44 @@ describe('Test Automate', () => {
     });
   });
 
+  it('onPress onAddNew but reach limit', async () => {
+    mock.onGet(API.AUTOMATE.GET_SMART()).reply(200, [
+      {
+        type: 'MultiUnit',
+        unit_id: 1,
+        automates: [],
+      },
+    ]);
+
+    await act(async () => {
+      tree = await create(
+        wrapComponent({
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  max_automations_per_unit: 0,
+                },
+              },
+            },
+          },
+        })
+      );
+    });
+
+    const instance = tree.root;
+
+    const itemAddNew = instance.findByType(ItemAddNew);
+    const spyToastError = jest.spyOn(ToastBottomHelper, 'error');
+    await act(async () => {
+      itemAddNew.props.onAddNew(1, []);
+    });
+    expect(mockedNavigate).not.toBeCalled();
+    expect(spyToastError).toBeCalledWith(
+      getTranslate('en', 'reach_max_automations_per_unit')
+    );
+  });
+
   it('Test success get Automate onPressItem to ScriptDetail', async () => {
     const response = {
       status: 200,
@@ -193,10 +233,7 @@ describe('Test Automate', () => {
     });
 
     expect(mockedNavigate).toBeCalledWith(Routes.MultiUnits, {
-      isMultiUnits: true,
-      unitName: '',
-      unit: { id: undefined },
-      isOwner: true,
+      unit: { id: undefined, name: '' },
     });
 
     mockedNavigate.mockClear();
@@ -205,10 +242,7 @@ describe('Test Automate', () => {
     });
 
     expect(mockedNavigate).toBeCalledWith(Routes.MultiUnits, {
-      isMultiUnits: false,
-      unitName: 'La Vida',
-      unit: { id: 3 },
-      isOwner: false,
+      unit: { id: 3, name: 'La Vida' },
     });
   });
 });

package/src/screens/Automate/index.js

@@ -25,7 +25,8 @@ import ItemAddNew from '../../commons/Device/ItemAddNew';
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import { useGetIdUser } from '../../hooks/Common';
 import { AccessibilityLabel, UNIT_TYPES } from '../../configs/Constants';
-import { keyExtractor } from '../../utils/Utils';
+import { keyExtractor, ToastBottomHelper } from '../../utils/Utils';
+import { useBackendPermission } from '../../utils/Permission/backend';
 
 const Automate = () => {
   const t = useTranslations();
@@ -38,6 +39,7 @@ const Automate = () => {
   const starredScriptIds = useSCContextSelector(
     (state) => state.automate.starredScriptIds
   );
+  const permissions = useBackendPermission();
 
   const sortedAutomateData = useMemo(() => {
     return automatesData.map((unit) => {
@@ -64,35 +66,48 @@ const Automate = () => {
     }, 1000);
   }, []);
 
-  const onPressItem = (item, unitId, type, isOwner) => () => {
-    navigate(Routes.UnitStack, {
-      screen: Routes.ScriptDetail,
-      params: {
-        id: item?.id,
-        closeScreen: currentRouteName,
-        preAutomate: item, // pre-loaded automate data
-      },
-    });
-  };
+  const onPressItem = useCallback(
+    (item) => {
+      navigate(Routes.UnitStack, {
+        screen: Routes.ScriptDetail,
+        params: {
+          id: item?.id,
+          closeScreen: currentRouteName,
+          preAutomate: item, // pre-loaded automate data
+        },
+      });
+    },
+    [currentRouteName, navigate]
+  );
 
-  const handleOnAddNew = (id) => () => {
-    navigate(Routes.UnitStack, {
-      screen: Routes.AddNewAutoSmart,
-      params: {
-        automate: { unit: id },
-        closeScreen: currentRouteName,
-      },
-    });
-  };
+  const handleOnAddNew = useCallback(
+    (id, automates) => {
+      if (id) {
+        // only limit per unit
+        if (permissions.max_automations_per_unit <= automates.length) {
+          ToastBottomHelper.error(t('reach_max_automations_per_unit'));
+          return;
+        }
+      }
+      navigate(Routes.UnitStack, {
+        screen: Routes.AddUnknownTypeSmart,
+        params: {
+          automate: { unit: id },
+          closeScreen: currentRouteName,
+        },
+      });
+    },
+    [currentRouteName, navigate, permissions?.max_automations_per_unit, t]
+  );
 
-  const onPressArrowRight = (isMultiUnits, unitName, unitId, isOwner) => () => {
-    navigate(Routes.MultiUnits, {
-      isMultiUnits,
-      unitName,
-      unit: { id: unitId },
-      isOwner,
-    });
-  };
+  const onPressArrowRight = useCallback(
+    (unit) => {
+      navigate(Routes.MultiUnits, {
+        unit,
+      });
+    },
+    [navigate]
+  );
 
   const renderItem = useCallback(
     ({ item = {} }) => {
@@ -112,7 +127,7 @@ const Automate = () => {
             isOwner={isOwner}
             automate={automate}
             wrapSyles={styles.wrapAutomateItem}
-            onPressItem={onPressItem(automate, unit_id, type, isOwner)}
+            onPressItem={() => onPressItem(automate, unit_id, type, isOwner)}
           />
         );
       };
@@ -124,12 +139,12 @@ const Automate = () => {
               {type === UNIT_TYPES.MULTI ? t('multi_unit') : unit_name}
             </Text>
             <TouchableOpacity
-              onPress={onPressArrowRight(
-                type === UNIT_TYPES.MULTI,
-                unit_name,
-                unit_id,
-                isOwner
-              )}
+              onPress={() =>
+                onPressArrowRight({
+                  name: unit_name,
+                  id: unit_id,
+                })
+              }
               style={styles.arrowRightButton}
               accessibilityLabel={AccessibilityLabel.ICON_ARROW_RIGHT}
             >
@@ -143,7 +158,7 @@ const Automate = () => {
             renderItem={renderItemAutomate}
             showsHorizontalScrollIndicator={false}
             contentContainerStyle={styles.contentContainerStyle2}
-            ListFooterComponent={renderListFooterComponent(unit_id)}
+            ListFooterComponent={renderListFooterComponent(unit_id, automates)}
             scrollIndicatorInsets={{ right: 1 }}
           />
         </View>
@@ -153,10 +168,10 @@ const Automate = () => {
     [sortedAutomateData]
   );
 
-  const renderListFooterComponent = (unitId) => (
+  const renderListFooterComponent = (unitId, automates) => (
     <ItemAddNew
       title={t('add_new')}
-      onAddNew={handleOnAddNew(unitId)}
+      onAddNew={() => handleOnAddNew(unitId, automates)}
       wrapStyle={styles.addNewItem}
     />
   );

package/src/screens/Device/__test__/detail.test.js

@@ -755,7 +755,7 @@ describe('test DeviceDetail', () => {
       await create(
         wrapComponent(store, account, {
           ...route,
-          params: { ...route.params, unitData: null, unitId },
+          params: { ...route.params, unitData: null, unitId: unitId },
         })
       );
     });