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

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eohjsc/react-native-smart-city",
   "title": "React Native Smart Home",
-  "version": "0.3.93",
+  "version": "0.3.95",
   "description": "TODO",
   "main": "index.js",
   "files": [

package/src/commons/ActionGroup/OnOffTemplate/index.js

@@ -22,7 +22,7 @@ const getComponent = (template) => {
   }
 };
 
-const OnOffTemplate = memo(({ actionGroup = {}, doAction, sensor }) => {
+const OnOffTemplate = memo(({ actionGroup = {}, doAction, sensor = {} }) => {
   const { configuration = {} } = actionGroup;
   const {
     action_on_data,
@@ -41,6 +41,7 @@ const OnOffTemplate = memo(({ actionGroup = {}, doAction, sensor }) => {
 
   // eslint-disable-next-line no-unused-vars
   const [configValues, _] = useConfigGlobalState('configValues');
+  const { device_type, is_managed_by_backend } = sensor;
 
   const getIsOnValue = useCallback(() => {
     const configValue = configValues[config];
@@ -65,34 +66,36 @@ const OnOffTemplate = memo(({ actionGroup = {}, doAction, sensor }) => {
       return;
     }
     let data;
-    if (sensor?.device_type === DEVICE_TYPE.GOOGLE_HOME) {
-      data = null;
-    } else {
+    if (
+      allow_config_store_value &&
+      config &&
+      device_type !== DEVICE_TYPE.GOOGLE_HOME
+    ) {
       data = {
-        value: isOn ? 0 : 1,
-        state: isOn ? 0 : 1, // todo Bang remove this for Zigbee
+        config_id: config,
+        config_value: isOn ? 0 : 1,
       };
-      if (allow_config_store_value && config) {
-        data.config_id = config;
-        data.config_value = data.value;
-      }
     }
-    if (sensor?.device_type === DEVICE_TYPE.LG_THINQ) {
+
+    if (device_type === DEVICE_TYPE.LG_THINQ) {
       setTempIsOn((prev) => !prev);
     }
     await doAction(action_data, data);
     updateStatusFromPusher(); // todo Bang read about this magic
 
-    sensor?.is_managed_by_backend &&
+    if (
+      is_managed_by_backend &&
       config &&
-      sensor.device_type === DEVICE_TYPE.LG_THINQ &&
+      device_type === DEVICE_TYPE.LG_THINQ
+    ) {
       watchMultiConfigs([config]);
+    }
   }, [
     isOn,
     action_off_data,
     action_on_data,
-    sensor?.device_type,
-    sensor?.is_managed_by_backend,
+    device_type,
+    is_managed_by_backend,
     allow_config_store_value,
     config,
     doAction,
@@ -110,10 +113,10 @@ const OnOffTemplate = memo(({ actionGroup = {}, doAction, sensor }) => {
   }, [isOn]);
 
   useEffect(() => {
-    if (sensor?.device_type !== DEVICE_TYPE.LG_THINQ) {
+    if (device_type !== DEVICE_TYPE.LG_THINQ) {
       setTempIsOn(getIsOnValue());
     }
-  }, [getIsOnValue, sensor?.device_type]);
+  }, [getIsOnValue, device_type]);
 
   const Component = useMemo(() => {
     return getComponent(actionGroup.template);

package/src/commons/ActionGroup/__test__/OnOffButtonTemplate.test.js

@@ -122,7 +122,7 @@ describe('Test OneBigButtonTemplate', () => {
     await act(async () => {
       await button.props.onPress();
     });
-    expect(mockDoAction).toHaveBeenCalledWith(action_data, data2);
+    expect(mockDoAction).toHaveBeenCalledWith(action_data, undefined);
   };
 
   it('action state on', async () => {

package/src/commons/ActionGroup/__test__/OnOffTemplate.test.js

@@ -163,10 +163,7 @@ describe('Test OnOffTemplate', () => {
     await act(async () => {
       await template.props.triggerAction();
     });
-    expect(mockDoAction).toHaveBeenCalledWith(action_off_data, {
-      value: 0,
-      state: 0,
-    });
+    expect(mockDoAction).toHaveBeenCalledWith(action_off_data, undefined);
     expect(watchMultiConfigs).toBeCalledTimes(0);
   });
 
@@ -183,10 +180,7 @@ describe('Test OnOffTemplate', () => {
     await act(async () => {
       await template.props.triggerAction();
     });
-    expect(mockDoAction).toHaveBeenCalledWith(action_on_data, {
-      value: 1,
-      state: 1,
-    });
+    expect(mockDoAction).toHaveBeenCalledWith(action_on_data, undefined);
   });
 
   it('template OnOffSimpleActionTemplate doAction with is_on_value and is_managed_by_backend', async () => {
@@ -201,10 +195,7 @@ describe('Test OnOffTemplate', () => {
     await act(async () => {
       await template.props.triggerAction();
     });
-    expect(mockDoAction).toHaveBeenCalledWith(action_off_data, {
-      value: 0,
-      state: 0,
-    });
+    expect(mockDoAction).toHaveBeenCalledWith(action_off_data, undefined);
     expect(watchMultiConfigs).toBeCalledTimes(0);
   });
 
@@ -231,10 +222,7 @@ describe('Test OnOffTemplate', () => {
     await act(async () => {
       await template[0].props.triggerAction();
     });
-    expect(mockDoAction).toHaveBeenCalledWith(action_data, {
-      state: 0,
-      value: 0,
-    });
+    expect(mockDoAction).toHaveBeenCalledWith(action_data, undefined);
   });
 
   it('render with template OnOffSimpleActionTemplate with just action_data lg_thinq', async () => {
@@ -269,10 +257,7 @@ describe('Test OnOffTemplate', () => {
     await act(async () => {
       jest.runAllTimers();
     });
-    expect(mockDoAction).toHaveBeenCalledWith(action_data, {
-      value: 0,
-      state: 0,
-    });
+    expect(mockDoAction).toHaveBeenCalledWith(action_data, undefined);
   });
 
   it('render with template OnOffSimpleActionTemplate with action_data zigbee trigger off', async () => {
@@ -303,10 +288,8 @@ describe('Test OnOffTemplate', () => {
       await template[0].props.triggerAction();
     });
     expect(mockDoAction).toHaveBeenCalledWith(action_off_data, {
-      state: 0,
       config_id: 5,
       config_value: 0,
-      value: 0,
     });
   });
 
@@ -338,10 +321,8 @@ describe('Test OnOffTemplate', () => {
       await template[0].props.triggerAction();
     });
     expect(mockDoAction).toHaveBeenCalledWith(action_on_data, {
-      state: 1, // todo Bang remove this after production
       config_id: 5,
       config_value: 1,
-      value: 1, // this is correct
     });
   });
 

package/src/commons/SubUnit/OneTap/ItemOneTap.js

@@ -19,99 +19,97 @@ import { useNavigation } from '@react-navigation/native';
 import Routes from '../../../utils/Route';
 import { AccessibilityLabel, AUTOMATE_TYPE } from '../../../configs/Constants';
 
-const ItemOneTap = memo(
-  ({ isOwner, automate = {}, unit, wrapSyles, onPressItem }) => {
-    const { navigate } = useNavigation();
-    const { id, type, script, activate_at, author = '' } = automate;
-    const t = useTranslations();
+const ItemOneTap = memo(({ automate = {}, wrapSyles, onPressItem }) => {
+  const { navigate } = useNavigation();
+  const { id, type, script, activate_at, author = '' } = automate;
+  const t = useTranslations();
 
-    const goToDetail = useCallback(() => {
-      navigate(Routes.ScriptDetail, {
-        id,
-        preAutomate: automate,
-      });
-    }, [automate, navigate, id]);
+  const goToDetail = useCallback(() => {
+    navigate(Routes.ScriptDetail, {
+      id,
+      preAutomate: automate,
+    });
+  }, [automate, navigate, id]);
 
-    const handleScriptAction = useCallback(async () => {
-      const { success } = await axiosPost(API.AUTOMATE.ACTION_ONE_TAP(id));
-      if (success) {
-        ToastBottomHelper.success(t('Activated successfully.'));
-      } else {
-        ToastBottomHelper.error(t('Activation failed.'));
-      }
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [id]);
+  const handleScriptAction = useCallback(async () => {
+    const { success } = await axiosPost(API.AUTOMATE.ACTION_ONE_TAP(id));
+    if (success) {
+      ToastBottomHelper.success(t('activated_successfully'));
+    } else {
+      ToastBottomHelper.error(t('activation_failed'));
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [id]);
 
-    const displayIcon = () => {
-      const iconKit = script?.icon_kit;
-      if (iconKit) {
-        return <FImage source={{ uri: iconKit }} style={styles.iconSensor} />;
-      }
-      if (type === AUTOMATE_TYPE.ONE_TAP) {
-        return <OneTap />;
-      }
-      if (type === AUTOMATE_TYPE.VALUE_CHANGE) {
-        return <ValueChange />;
-      }
-      if ([AUTOMATE_TYPE.EVENT].includes(type)) {
-        return <Event />;
-      }
-      return <Schedule />;
-    };
-    const activateAt = activate_at
-      ? timeDifference(new Date(), moment(activate_at), true)
-      : null;
-    return (
-      <TouchableWithoutFeedback
-        onPress={onPressItem || goToDetail}
-        accessibilityLabel={`${AccessibilityLabel.AUTOMATE_SCRIPT_NAME}-${id}`}
-      >
-        <View style={[styles.container, wrapSyles]}>
-          <View style={styles.boxIcon}>
-            {displayIcon()}
-            {type === AUTOMATE_TYPE.ONE_TAP && (
-              <TouchableOpacity
-                accessibilityLabel={AccessibilityLabel.AUTOMATE_SCRIPT_ACTION}
-                onPress={handleScriptAction}
-              >
-                <CheckCircle />
-              </TouchableOpacity>
-            )}
-          </View>
-          <TouchableOpacity
-            accessibilityLabel={AccessibilityLabel.GO_DETAIL}
-            onPress={onPressItem || goToDetail}
+  const displayIcon = () => {
+    const iconKit = script?.icon_kit;
+    if (iconKit) {
+      return <FImage source={{ uri: iconKit }} style={styles.iconSensor} />;
+    }
+    if (type === AUTOMATE_TYPE.ONE_TAP) {
+      return <OneTap />;
+    }
+    if (type === AUTOMATE_TYPE.VALUE_CHANGE) {
+      return <ValueChange />;
+    }
+    if ([AUTOMATE_TYPE.EVENT].includes(type)) {
+      return <Event />;
+    }
+    return <Schedule />;
+  };
+  const activateAt = activate_at
+    ? timeDifference(new Date(), moment(activate_at), true)
+    : null;
+  return (
+    <TouchableWithoutFeedback
+      onPress={onPressItem || goToDetail}
+      accessibilityLabel={`${AccessibilityLabel.AUTOMATE_SCRIPT_NAME}-${id}`}
+    >
+      <View style={[styles.container, wrapSyles]}>
+        <View style={styles.boxIcon}>
+          {displayIcon()}
+          {type === AUTOMATE_TYPE.ONE_TAP && (
+            <TouchableOpacity
+              accessibilityLabel={AccessibilityLabel.AUTOMATE_SCRIPT_ACTION}
+              onPress={handleScriptAction}
+            >
+              <CheckCircle />
+            </TouchableOpacity>
+          )}
+        </View>
+        <TouchableOpacity
+          accessibilityLabel={AccessibilityLabel.GO_DETAIL}
+          onPress={onPressItem || goToDetail}
+        >
+          <Text
+            numberOfLines={1}
+            semibold
+            size={14}
+            color={Colors.Gray9}
+            type="Body"
+            style={styles.name}
           >
+            {script?.name}
+          </Text>
+          <Text numberOfLines={1} type={'Label'} color={Colors.Gray7}>
+            {t('created_by', { name: author })}
+          </Text>
+          <View style={styles.descriptionContainer}>
             <Text
               numberOfLines={1}
               semibold
-              size={14}
-              color={Colors.Gray9}
-              type="Body"
-              style={styles.name}
+              size={12}
+              color={Colors.Gray8}
+              type="Label"
             >
-              {script?.name}
+              {activateAt && t('activated_time', { time: activateAt })}
             </Text>
-            <Text numberOfLines={1} type={'Label'} color={Colors.Gray7}>
-              {`${t('create_by')} ${author}`}
-            </Text>
-            <View style={styles.descriptionContainer}>
-              <Text
-                numberOfLines={1}
-                semibold
-                size={12}
-                color={Colors.Gray8}
-                type="Label"
-              >
-                {activateAt && t('activated_time', { time: activateAt })}
-              </Text>
-              <IconOutline name="right" size={12} />
-            </View>
-          </TouchableOpacity>
-        </View>
-      </TouchableWithoutFeedback>
-    );
-  }
-);
+            <IconOutline name="right" size={12} />
+          </View>
+        </TouchableOpacity>
+      </View>
+    </TouchableWithoutFeedback>
+  );
+});
 
 export default ItemOneTap;

package/src/commons/SubUnit/OneTap/__test__/SubUnitAutomate.test.js

@@ -16,11 +16,13 @@ import Routes from '../../../../utils/Route';
 import api from '../../../../utils/Apis/axios';
 import { API } from '../../../../configs';
 import { useNavigation } from '@react-navigation/native';
+import { ToastBottomHelper } from '../../../../utils/Utils';
+import { getTranslate } from '../../../../utils/I18n';
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const wrapComponent = (data) => (
-  <SCProvider initState={mockSCStore({})}>
+const wrapComponent = (data, storeData = {}) => (
+  <SCProvider initState={mockSCStore(storeData)}>
     <SubUnitAutomate {...data} />
   </SCProvider>
 );
@@ -33,33 +35,34 @@ jest.mock('react-redux', () => {
 });
 
 let tree;
-let data = {
-  isOwner: true,
-  listAutomate: [
-    {
-      text: 'Scenario',
-      data: [
-        {
-          id: 1,
-          user: 6,
-          type: 'one_tap',
-          activate_at: '2021-09-17T05:30:00Z',
-          script: {
-            name: 'Joshua Ray',
-            icon: '',
-            icon_kit: '',
-          },
-        },
-      ],
-      type: AUTOMATE_TABS.SCENARIO,
-    },
-  ],
-};
+let data;
 
 describe('test Item', () => {
   const mockedNavigate = useNavigation().navigate;
   beforeEach(() => {
     mockedNavigate.mockClear();
+    data = {
+      isOwner: true,
+      listAutomate: [
+        {
+          text: 'Scenario',
+          data: [
+            {
+              id: 1,
+              user: 6,
+              type: 'one_tap',
+              activate_at: '2021-09-17T05:30:00Z',
+              script: {
+                name: 'Joshua Ray',
+                icon: '',
+                icon_kit: '',
+              },
+            },
+          ],
+          type: AUTOMATE_TABS.SCENARIO,
+        },
+      ],
+    };
   });
 
   it('render SubUnitAutomate isOwner and handleOnAddNew', async () => {
@@ -189,6 +192,7 @@ describe('test Item', () => {
       preAutomate: data.listAutomate[0].data[0],
     });
   });
+
   it('render SubUnitAutomate script schedule and handleOnAddNew item automate', async () => {
     data.isOwner = false;
     data.type = 'schedule';
@@ -242,6 +246,46 @@ describe('test Item', () => {
     expect(goDetail).toHaveLength(1);
   });
 
+  it('add new automate when reach maximum', async () => {
+    data.isOwner = false;
+    data.type = 'schedule';
+    data.unit = { id: 1 };
+
+    await act(async () => {
+      tree = await create(
+        wrapComponent(data, {
+          auth: {
+            account: {
+              user: {
+                permissions: {
+                  max_automations_per_unit: 0,
+                },
+              },
+            },
+          },
+        })
+      );
+    });
+
+    const instance = tree.root;
+    const item = instance.findAll(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.SUB_UNIT_ADD_DEVICE &&
+        el.type === TouchableWithoutFeedback
+    );
+
+    expect(item).toHaveLength(1);
+    const spyToastError = jest.spyOn(ToastBottomHelper, 'error');
+    await act(async () => {
+      await item[0].props.onPress();
+    });
+    expect(mockedNavigate).not.toBeCalled();
+    expect(spyToastError).toBeCalledWith(
+      getTranslate('en', 'reach_max_automations_per_unit')
+    );
+  });
+
   it('render click select option by automation', async () => {
     await act(async () => {
       tree = await create(wrapComponent(data));

package/src/commons/SubUnit/OneTap/index.js

@@ -1,4 +1,10 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
 import { TouchableOpacity, View } from 'react-native';
 
 import { Section } from '../..';
@@ -15,15 +21,29 @@ import {
 import Text from '../../Text/index.js';
 
 import styles from './OneTapStyles.js';
+import { ToastBottomHelper } from '../../../utils/Utils';
+import { useBackendPermission } from '../../../utils/Permission/backend';
 
 const SubUnitAutomate = ({ isOwner, listAutomate, unit, wrapItemStyle }) => {
   const t = useTranslations();
   const { navigate } = useNavigation();
   const [automates, setAutomates] = useState(listAutomate[0]);
   const [indexAutomate, setIndexAutomate] = useState(0);
+  const permissions = useBackendPermission();
   const { name: currentScreen } = useRoute();
 
+  const totalAutomates = useMemo(
+    () => listAutomate.reduce((acc, item) => item.data.length + acc, 0),
+    [listAutomate]
+  );
+
   const handleOnAddNew = () => {
+    if (unit?.id) {
+      if (permissions.max_automations_per_unit <= totalAutomates) {
+        ToastBottomHelper.error(t('reach_max_automations_per_unit'));
+        return;
+      }
+    }
     switch (automates.type) {
       case AUTOMATE_TABS.SCENARIO:
         navigate(Routes.ScenarioName, {

package/src/configs/API.js

@@ -215,6 +215,7 @@ const API = {
     },
     GATEWAY: {
       LIST: () => '/chip_manager/developer_mode_chips/',
+      COUNT: () => '/chip_manager/developer_mode_chips/count/',
       DETAIL: (id) => `/chip_manager/developer_mode_chips/${id}/`,
       REBOOT: (id) => `/chip_manager/developer_mode_chips/${id}/reboot_chip/`,
     },

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

@@ -33,8 +33,8 @@ jest.mock('react', () => {
 
 const mock = new MockAdapter(api.axiosInstance);
 
-const wrapComponent = (route) => (
-  <SCProvider initState={mockSCStore({})}>
+const wrapComponent = (route, storeData = {}) => (
+  <SCProvider initState={mockSCStore(storeData)}>
     <ActivityLog route={route} />
   </SCProvider>
 );
@@ -149,4 +149,62 @@ describe('Test Activity log', () => {
     expect(filterPopup[0].props.isVisible).toBeTruthy();
     expect(datePicker.props.isVisible).toBeFalsy();
   });
+
+  const setUpActionLogScreen = () => {
+    route = {
+      params: {
+        id: 1,
+        type: 'action',
+        filterEnabled: {},
+      },
+    };
+
+    mock.onGet(API.DEVICE.ACTIVITY_LOG(1)).reply(200, {
+      results: [
+        {
+          id: 1,
+          content_code: 'ACTIVATED_BY',
+          params: { username: 'name' },
+          created_at: '2021-07-01T15:48:24.917932Z',
+        },
+      ],
+      count: 1,
+    });
+    global.URLSearchParams = jest.fn(() => ({
+      append: jest.fn(),
+    }));
+  };
+
+  it('render action log has permission', async () => {
+    const storeData = {
+      auth: {
+        account: {
+          user: {
+            permissions: {
+              view_action_log: true,
+            },
+          },
+        },
+      },
+    };
+    setUpActionLogScreen();
+
+    await act(async () => {
+      tree = await create(wrapComponent(route, storeData));
+    });
+    const instance = tree.root;
+    const items = instance.findAllByType(ItemLog);
+    expect(items).toHaveLength(1);
+  });
+
+  it('render action log no permission', async () => {
+    setUpActionLogScreen();
+
+    await act(async () => {
+      tree = await create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const items = instance.findAllByType(ItemLog);
+    expect(items).toHaveLength(0);
+  });
 });

package/src/screens/ActivityLog/hooks/__test__/index.test.js

@@ -7,6 +7,11 @@ import api from '../../../../utils/Apis/axios';
 import { getDataForList, getEmergencyEventDataForList } from '../../utils';
 
 const mock = new MockAdapter(api.axiosInstance);
+jest.mock('../../../../utils/Permission/backend', () => ({
+  useBackendPermission: jest.fn(() => ({
+    view_action_log: true,
+  })),
+}));
 
 describe('Test useActivityLog', () => {
   let props;

package/src/screens/ActivityLog/hooks/index.js

@@ -6,6 +6,8 @@ import API from '../../../configs/API';
 import t from '../../../hooks/Common/useTranslations';
 import { AUTOMATE_TYPE } from '../../../configs/Constants';
 import { getDataForList, getEmergencyEventDataForList } from '../utils';
+import { useBackendPermission } from '../../../utils/Permission/backend';
+import { ToastBottomHelper } from '../../../utils/Utils';
 
 const apiMaps = {
   ['action']: {
@@ -13,6 +15,7 @@ const apiMaps = {
     params: (id) => ({ id: id }),
     standardizeData: getDataForList,
     memberUrl: (id) => API.SHARE.UNITS_MEMBERS(id),
+    needPermission: 'view_action_log',
   },
   ['emergency_event']: {
     url: () => API.EMERGENCY_BUTTON.ACTIVITY_LOG(),
@@ -54,7 +57,15 @@ export default ({ id, type, share, filterEnabled }) => {
   });
   const api = apiMaps[type];
 
+  const permissions = useBackendPermission();
   const fetchData = async (filters) => {
+    if (api?.needPermission && !permissions?.[api?.needPermission]) {
+      setIsLoading(false);
+      setIsRefreshing(false);
+      ToastBottomHelper.error(t(`no_permission_${api?.needPermission}`));
+      return;
+    }
+
     const { page } = filters;
     setPage(page);
     if (page === 1) {

package/src/screens/AddLocationMaps/index.js

@@ -287,7 +287,7 @@ const AddLocationMaps = memo(() => {
         onPressMain={onDone}
         secondaryTitle={t('cancel')}
         onPressSecondary={goBack}
-        typeMain={input?.description ? 'primaryText' : 'disabled'}
+        typeMain={searchedLocation?.description ? 'primaryText' : 'disabled'}
         typeSecondary="primaryText"
         accessibilityLabelPrefix="LOCATION_"
         disableBackgroundMainButton