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

package/src/screens/Automate/MultiUnits.js

@@ -17,20 +17,17 @@ import { AUTOMATE_TABS, AUTOMATE_TYPE } from '../../configs/Constants';
 import ItemOneTap from '../../commons/SubUnit/OneTap/ItemOneTap';
 import Routes from '../../utils/Route';
 import ItemAddNew from '../../commons/Device/ItemAddNew';
+import { ToastBottomHelper } from '../../utils/Utils';
+import { useBackendPermission } from '../../utils/Permission/backend';
 
 const MultiUnits = () => {
   const t = useTranslations();
   const isFocused = useIsFocused();
   const { navigate } = useNavigation();
   const { params = {}, name: currentRouteName } = useRoute();
-  const {
-    isMultiUnits = false,
-    unitName = '',
-    unit,
-    isOwner,
-    newAutomate,
-  } = params;
+  const { unit, newAutomate } = params;
   const [data, setData] = useState([]);
+  const permissions = useBackendPermission();
 
   const [tabActive, setTabActive] = useState(AUTOMATE_TABS.SCENARIO);
 
@@ -40,20 +37,20 @@ const MultiUnits = () => {
 
   const getData = useCallback(
     async (fetchParams) => {
-      if (isMultiUnits) {
+      if (unit?.id) {
+        await fetchWithCache(API.UNIT.AUTOMATE(unit?.id), {}, (response) => {
+          const { success, data: automateData } = response;
+          success && setData(automateData);
+        });
+      } else {
         const { success, data: automateData } = await axiosGet(
           API.AUTOMATE.GET_MULTI_UNITS(),
           fetchParams
         );
         success && setData(automateData);
-      } else {
-        await fetchWithCache(API.UNIT.AUTOMATE(unit?.id), {}, (response) => {
-          const { success, data: automateData } = response;
-          success && setData(automateData);
-        });
       }
     },
-    [isMultiUnits, unit?.id]
+    [unit?.id]
   );
 
   const onPressTabName = (tab) => () => {
@@ -79,6 +76,15 @@ const MultiUnits = () => {
   }, [newAutomate, onPressItem]);
 
   const handleOnAddNew = useCallback(() => {
+    if (unit?.id) {
+      if (permissions?.max_automations_per_unit <= data.length) {
+        ToastBottomHelper.error(t('reach_max_automations_per_unit'));
+        return;
+      }
+    } else if (!permissions?.smart_script_for_multi_unit) {
+      ToastBottomHelper.error(t('no_permission_smart_script_for_multi_unit'));
+      return;
+    }
     if (tabActive === AUTOMATE_TABS.SCENARIO) {
       navigate(Routes.UnitStack, {
         screen: Routes.ScenarioName,
@@ -97,7 +103,16 @@ const MultiUnits = () => {
         closeScreen: currentRouteName,
       },
     });
-  }, [currentRouteName, navigate, tabActive, unit?.id]);
+  }, [
+    currentRouteName,
+    data.length,
+    navigate,
+    permissions?.max_automations_per_unit,
+    permissions?.smart_script_for_multi_unit,
+    t,
+    tabActive,
+    unit?.id,
+  ]);
 
   const renderContent = useMemo(() => {
     const listItems = data.filter((item) =>
@@ -116,11 +131,10 @@ const MultiUnits = () => {
         {sortedListItems.map((item, index) => (
           <ItemOneTap
             key={(item?.id || index).toString()}
-            isOwner={isOwner}
             automate={item}
             wrapSyles={[
               styles.wrapAutomateItem,
-              index % 2 === 0 && styles.marginRigt8,
+              index % 2 === 0 && styles.itemOneTapMargin,
             ]}
             onPressItem={() => onPressItem(item)}
           />
@@ -142,7 +156,7 @@ const MultiUnits = () => {
   return (
     <View style={styles.wrap}>
       <WrapHeaderScrollable
-        title={isMultiUnits ? t('multi_units_automate') : unitName}
+        title={unit?.id ? unit?.name : t('multi_units_automate')}
         headerAniStyle={styles.headerAniStyle}
       >
         <View style={styles.wrapContent}>

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

@@ -24,8 +24,8 @@ import Text from '../../../../commons/Text';
 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>
 );
@@ -241,6 +241,40 @@ 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);

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);
 
@@ -122,9 +123,9 @@ 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]);
 
@@ -296,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,
@@ -309,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 () => {
@@ -78,7 +80,19 @@ describe('Test MultiUnits', () => {
       },
     });
     await act(async () => {
-      tree = await create(wrapComponent());
+      tree = await create(
+        wrapComponent({
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  smart_script_for_multi_unit: true,
+                },
+              },
+            },
+          },
+        })
+      );
     });
     const instance = tree.root;
     const WrapHeaderScrollables = instance.findAllByType(WrapHeaderScrollable);
@@ -151,13 +165,23 @@ 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 () => {
-      tree = await create(wrapComponent());
+      tree = await create(
+        wrapComponent({
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  smart_script_for_multi_unit: true,
+                },
+              },
+            },
+          },
+        })
+      );
     });
     const instance = tree.root;
     const WrapHeaderScrollables = instance.findAllByType(WrapHeaderScrollable);
@@ -180,9 +204,102 @@ 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('create new smart multi unit but missing permission', async () => {
+    mock.onGet(API.UNIT.AUTOMATE(1)).reply(200, []);
+    useRoute.mockReturnValue({
+      params: {
+        isMultiUnits: true,
+        unitName: null,
+        unit: null,
+      },
+    });
+    await act(async () => {
+      tree = await create(
+        wrapComponent({
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  smart_script_for_multi_unit: false,
+                },
+              },
+            },
+          },
+        })
+      );
+    });
+    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', 'no_permission_smart_script_for_multi_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>
 );
@@ -79,7 +81,19 @@ describe('Test Automate', () => {
     mock.onGet(API.AUTOMATE.GET_SMART()).reply(200, response.data);
 
     await act(async () => {
-      tree = await create(wrapComponent());
+      tree = await create(
+        wrapComponent({
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  smart_script_for_multi_unit: true,
+                },
+              },
+            },
+          },
+        })
+      );
     });
 
     const instance = tree.root;
@@ -100,6 +114,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 +245,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 +254,45 @@ describe('Test Automate', () => {
     });
 
     expect(mockedNavigate).toBeCalledWith(Routes.MultiUnits, {
-      isMultiUnits: false,
-      unitName: 'La Vida',
-      unit: { id: 3 },
-      isOwner: false,
+      unit: { id: 3, name: 'La Vida' },
     });
   });
+
+  it('onPress onAddNew multi unit script but missing permission', async () => {
+    mock.onGet(API.AUTOMATE.GET_SMART()).reply(200, [
+      {
+        type: 'MultiUnit',
+        unit_id: null,
+        automates: [],
+      },
+    ]);
+
+    await act(async () => {
+      tree = await create(
+        wrapComponent({
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  smart_script_for_multi_unit: false,
+                },
+              },
+            },
+          },
+        })
+      );
+    });
+
+    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', 'no_permission_smart_script_for_multi_unit')
+    );
+  });
 });

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,57 @@ 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.AddUnknownTypeSmart,
-      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;
+        }
+      } else if (!permissions?.smart_script_for_multi_unit) {
+        ToastBottomHelper.error(t('no_permission_smart_script_for_multi_unit'));
+        return;
+      }
+      navigate(Routes.UnitStack, {
+        screen: Routes.AddUnknownTypeSmart,
+        params: {
+          automate: { unit: id },
+          closeScreen: currentRouteName,
+        },
+      });
+    },
+    [
+      currentRouteName,
+      navigate,
+      permissions?.max_automations_per_unit,
+      permissions?.smart_script_for_multi_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 +136,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 +148,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 +167,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 +177,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}
     />
   );