@eohjsc/react-native-smart-city 0.3.30 → 0.3.33

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eohjsc/react-native-smart-city",
   "title": "React Native Smart Home",
-  "version": "0.3.30",
+  "version": "0.3.33",
   "description": "TODO",
   "main": "index.js",
   "files": [
@@ -39,11 +39,12 @@
     "reset-cache": "react-native start --reset-cache",
     "merge_conflict": "yarn jest && yarn update_coverage_result && yarn check_coverage_config",
     "jest": "jest --detectOpenHandles",
+    "jest1": "jest --detectOpenHandles --coverage=0",
     "example": "yarn --cwd example",
     "pods": "cd example && pod-install --quiet",
     "bootstrap": "yarn example && yarn && yarn pods",
-    "build": "sync-files ./src ../EohMobile/node_modules/@eohjsc/react-native-smart-city/src",
-    "watch": "sync-files --watch ./src ../EohMobile/node_modules/@eohjsc/react-native-smart-city/src"
+    "build": "syncdir ./src ../EohMobile/node_modules/@eohjsc/react-native-smart-city/src",
+    "watch": "syncdir ./src ../EohMobile/node_modules/@eohjsc/react-native-smart-city/src --watch"
   },
   "repository": {
     "type": "git",
@@ -139,7 +140,7 @@
     "patch-package": "^6.2.2",
     "pluralize": "^8.0.0",
     "postinstall": "^0.7.0",
-    "pusher-js": "^7.0.3",
+    "pusher-js": "^7.4.0",
     "pusher-js-auth": "^4.0.1",
     "querystring": "^0.2.0",
     "react-content-loader": "^6.0.3",
@@ -207,9 +208,10 @@
     "redux-persist": "^6.0.0",
     "redux-saga": "^1.1.3",
     "string-format": "^2.0.0",
-    "sync-files": "^1.0.3",
+    "sync-directory": "^5.1.7",
     "timezone-mock": "^1.1.3",
     "uuid-by-string": "^3.0.2",
+    "uuidv4": "^6.2.13",
     "validator": "^13.1.1",
     "victory-native": "^35.0.1"
   },

package/src/commons/Action/ItemQuickAction.js

@@ -1,6 +1,6 @@
 import React, { memo, useCallback, useEffect, useState } from 'react';
 import { TouchableOpacity, View } from 'react-native';
-import { TESTID } from '../../configs/Constants';
+import { AccessibilityLabel } from '../../configs/Constants';
 import { useSCContextSelector } from '../../context';
 import { useRemoteControl } from '../../hooks/IoT';
 import { useConfigGlobalState } from '../../iot/states';
@@ -53,7 +53,24 @@ const ItemQuickAction = memo(({ sensor, wrapperStyle, setStatus }) => {
   }, [sensor, configValues, statusCallback]);
   const userId = useSCContextSelector((state) => state?.auth.account.user.id);
   const onActionPress = useCallback(() => {
-    sendRemoteCommand(sensor, action, null, userId);
+    let data = null;
+    if (
+      action?.allow_config_store_value_id === sensor?.quick_action?.config_id
+    ) {
+      if (action?.name?.toLowerCase().includes('off')) {
+        data = {
+          config_id: action?.allow_config_store_value_id,
+          config_value: 0,
+        };
+      } else {
+        data = {
+          config_id: action?.allow_config_store_value_id,
+          config_value: 1,
+        };
+      }
+      data = JSON.stringify(data);
+    }
+    sendRemoteCommand(sensor, action, data, userId);
     setIsSendingCommand(true);
 
     if (!sensor.quick_action) {
@@ -87,8 +104,7 @@ const ItemQuickAction = memo(({ sensor, wrapperStyle, setStatus }) => {
 
   return (
     <TouchableOpacity
-      testID={TESTID.ITEM_QUICK_ACTION_PRESS}
-      accessibilityLabel={`${TESTID.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}`}
+      accessibilityLabel={`${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}`}
       onPress={onActionPress}
     >
       <View style={wrapperStyle}>

package/src/commons/Action/__test__/ItemQuickAction.test.js

@@ -3,7 +3,7 @@ import { TouchableOpacity } from 'react-native';
 import { act, create } from 'react-test-renderer';
 import ItemQuickAction from '../ItemQuickAction';
 import { Colors } from '../../../configs';
-import { TESTID } from '../../../configs/Constants';
+import { AccessibilityLabel } from '../../../configs/Constants';
 import { factory } from 'factory-girl';
 
 class Sensor {}
@@ -41,10 +41,12 @@ describe('Test ItemQuickAction', () => {
 
   const sensor = {
     action: {
+      name: 'off',
       color: '#00979D',
       command_prefer_over_bluetooth: true,
       command_prefer_over_googlehome: false,
       command_prefer_over_internet: false,
+      allow_config_store_value_id: 51,
       id: 9,
     },
     quick_action: {
@@ -73,6 +75,7 @@ describe('Test ItemQuickAction', () => {
       command_prefer_over_bluetooth: true,
       command_prefer_over_googlehome: false,
       command_prefer_over_internet: false,
+      allow_config_store_value_id: 51,
       id: 10,
     },
     status: 'OFF',
@@ -95,7 +98,8 @@ describe('Test ItemQuickAction', () => {
     const instance = tree.root;
     const buttonOnActionPress = instance.findAll(
       (el) =>
-        el.props.testID === TESTID.ITEM_QUICK_ACTION_PRESS &&
+        el.props.accessibilityLabel ===
+          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
     expect(buttonOnActionPress).toHaveLength(0);
@@ -117,7 +121,8 @@ describe('Test ItemQuickAction', () => {
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
       (el) =>
-        el.props.testID === TESTID.ITEM_QUICK_ACTION_PRESS &&
+        el.props.accessibilityLabel ===
+          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
     expect(buttonOnActionPress).toBeDefined();
@@ -134,7 +139,7 @@ describe('Test ItemQuickAction', () => {
     expect(mockSetState).toBeCalledWith(sensor.quick_action.off_action);
   });
 
-  test('render with icon_outlined poweroff', () => {
+  test('render with icon_outlined poweroff and action have allow_config_store_value_id', () => {
     const mockSetStatus = jest.fn();
     sensor.action.icon = null;
     act(() => {
@@ -150,7 +155,8 @@ describe('Test ItemQuickAction', () => {
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
       (el) =>
-        el.props.testID === TESTID.ITEM_QUICK_ACTION_PRESS &&
+        el.props.accessibilityLabel ===
+          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
     expect(buttonOnActionPress).toBeDefined();
@@ -159,7 +165,12 @@ describe('Test ItemQuickAction', () => {
     act(() => {
       buttonOnActionPress.props.onPress();
     });
-    expect(mockSendRemoteControl).toBeCalled();
+    expect(mockSendRemoteControl).toBeCalledWith(
+      sensor,
+      sensor.action,
+      JSON.stringify({ config_id: 51, config_value: 0 }),
+      undefined
+    );
     expect(mockSetState).toBeCalledTimes(1);
 
     jest.runAllTimers();
@@ -196,7 +207,8 @@ describe('Test ItemQuickAction', () => {
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
       (el) =>
-        el.props.testID === TESTID.ITEM_QUICK_ACTION_PRESS &&
+        el.props.accessibilityLabel ===
+          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
 
@@ -219,7 +231,8 @@ describe('Test ItemQuickAction', () => {
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
       (el) =>
-        el.props.testID === TESTID.ITEM_QUICK_ACTION_PRESS &&
+        el.props.accessibilityLabel ===
+          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
     expect(buttonOnActionPress).toBeDefined();
@@ -235,7 +248,8 @@ describe('Test ItemQuickAction', () => {
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
       (el) =>
-        el.props.testID === TESTID.ITEM_QUICK_ACTION_PRESS &&
+        el.props.accessibilityLabel ===
+          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
     expect(buttonOnActionPress).toBeDefined();
@@ -243,10 +257,12 @@ describe('Test ItemQuickAction', () => {
   test('trigger action with quick action no auto update', () => {
     const noAutoUpdateSensor = {
       action: {
+        name: 'on',
         color: '#00979D',
         command_prefer_over_bluetooth: true,
         command_prefer_over_googlehome: false,
         command_prefer_over_internet: false,
+        allow_config_store_value_id: 51,
         id: 9,
         icon: 'caret-up',
       },
@@ -282,7 +298,8 @@ describe('Test ItemQuickAction', () => {
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
       (el) =>
-        el.props.testID === TESTID.ITEM_QUICK_ACTION_PRESS &&
+        el.props.accessibilityLabel ===
+          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
 
@@ -290,6 +307,12 @@ describe('Test ItemQuickAction', () => {
     act(() => {
       buttonOnActionPress.props.onPress();
     });
+    expect(mockSendRemoteControl).toBeCalledWith(
+      noAutoUpdateSensor,
+      noAutoUpdateSensor.action,
+      JSON.stringify({ config_id: 51, config_value: 1 }),
+      undefined
+    );
     expect(mockSetState).toBeCalledTimes(1);
 
     jest.runAllTimers();
@@ -313,7 +336,8 @@ describe('Test ItemQuickAction', () => {
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
       (el) =>
-        el.props.testID === TESTID.ITEM_QUICK_ACTION_PRESS &&
+        el.props.accessibilityLabel ===
+          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
 

package/src/commons/ActionGroup/ColorPickerTemplate.js

@@ -1,41 +1,55 @@
-import React, { memo, useState, useEffect } from 'react';
+import React, {
+  memo,
+  useState,
+  useEffect,
+  useContext,
+  useCallback,
+} from 'react';
 import { View } from 'react-native';
 import styles from './ColorPickerTemplateStyles';
 import ColorPicker from 'react-native-wheel-color-picker';
 import { useConfigGlobalState } from '../../iot/states';
+import { SCContext } from '../../context';
+import { Action } from '../../context/actionType';
 
-let isFirstTime = true;
-
-const WheelColorPicker = ({ valueColor, onChangeColor }) => {
+const WheelColorPicker = ({ valueColor, onChangeColor, onStart }) => {
   return (
     <ColorPicker
       style={styles.colorPicker}
       sliderHidden={true}
       swatches={false}
       color={valueColor}
+      onInteractionStart={onStart}
       onColorChangeComplete={onChangeColor}
       thumbSize={16}
     />
   );
 };
 
-const ColorPickerTemplate = memo(({ actionGroup, doAction, sensor }) => {
-  const { configuration } = actionGroup;
+let isFirstTime = true;
+const ColorPickerTemplate = memo(({ actionGroup = {}, doAction, sensor }) => {
+  const { configuration = {} } = actionGroup;
   const [valueColorComplete, setValueColorComplete] = useState('');
   const [configValues] = useConfigGlobalState('configValues');
+  const { setAction } = useContext(SCContext);
 
-  const onChangeColor = (color) => {
-    const to = setTimeout(() => {
-      isFirstTime = false;
-      clearTimeout(to);
-    }, 1000);
+  const onChangeColor = useCallback(
+    (color) => {
+      setAction(Action.SET_LOCK_VIEW_PICK_COLOR, false);
+      const to = setTimeout(() => {
+        isFirstTime = false;
+        clearTimeout(to);
+      }, 1000);
 
-    !isFirstTime &&
-      doAction(
-        configuration?.action_color_data,
-        JSON.stringify({ value: color })
-      );
-  };
+      !isFirstTime &&
+        doAction(
+          configuration?.action_color_data,
+          JSON.stringify({ value: color })
+        );
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [configuration?.action_color_data, doAction]
+  );
 
   useEffect(() => {
     const { config } = configuration;
@@ -50,11 +64,16 @@ const ColorPickerTemplate = memo(({ actionGroup, doAction, sensor }) => {
     return () => (isFirstTime = true);
   }, []);
 
+  const onStartPickColor = useCallback(() => {
+    setAction(Action.SET_LOCK_VIEW_PICK_COLOR, true);
+  }, [setAction]);
+
   return (
     <View style={styles.viewPickColor}>
       <WheelColorPicker
         valueColor={valueColorComplete}
         onChangeColor={onChangeColor}
+        onStart={onStartPickColor}
       />
     </View>
   );

package/src/commons/ActionGroup/CurtainButtonTemplate.js

@@ -3,7 +3,7 @@ import { TouchableOpacity, View, Switch, Image } from 'react-native';
 import { Icon } from '@ant-design/react-native';
 import styles from './CurtainButtonTemplateStyle';
 import Text from '../Text';
-import { TESTID } from '../../configs/Constants';
+import { AccessibilityLabel } from '../../configs/Constants';
 import { Colors, Images } from '../../configs';
 
 const CurtainButtonTemplate = memo(({ actionGroup, doAction, sensor }) => {
@@ -50,21 +50,21 @@ const CurtainButtonTemplate = memo(({ actionGroup, doAction, sensor }) => {
         icon: Images.buttonLeftCurtain,
         text: text1,
         onPress: onButtonClosePress,
-        testID: TESTID.BUTTON_TEMPLATE_1,
+        accessibilityLabel: AccessibilityLabel.BUTTON_TEMPLATE_1,
       },
       {
         style: styles.buttonActionCurtainCenter,
         icon: Images.buttonPauseCurtain,
         text: '',
         onPress: onButtonStopPress,
-        testID: TESTID.BUTTON_TEMPLATE_2,
+        accessibilityLabel: AccessibilityLabel.BUTTON_TEMPLATE_2,
       },
       {
         style: styles.buttonActionCurtain,
         icon: Images.buttonRightCurtain,
         text: text3,
         onPress: onButtonOpenPress,
-        testID: TESTID.BUTTON_TEMPLATE_3,
+        accessibilityLabel: AccessibilityLabel.BUTTON_TEMPLATE_3,
       },
     ];
 
@@ -72,7 +72,7 @@ const CurtainButtonTemplate = memo(({ actionGroup, doAction, sensor }) => {
       <>
         {buttons.map((item, index) => (
           <TouchableOpacity
-            testID={item.testID}
+            accessibilityLabel={item.accessibilityLabel}
             style={item?.style}
             onPress={item.onPress}
             underlayColor={Colors.Gray2}
@@ -91,7 +91,7 @@ const CurtainButtonTemplate = memo(({ actionGroup, doAction, sensor }) => {
           <Icon name={icon} size={15} color={color} style={styles.iconLock} />
           <Text
             style={styles.textLockDoor}
-            testID={TESTID.TEXT_DOOR_LOOK_ON_OFF}
+            accessibilityLabel={AccessibilityLabel.TEXT_DOOR_LOOK_ON_OFF}
           >
             {text_door_lock}{' '}
           </Text>

package/src/commons/ActionGroup/NumberUpDownActionTemplate.js

@@ -8,32 +8,40 @@ import { useConfigGlobalState } from '../../iot/states';
 import { useUnwatchLGDeviceConfigControl } from '../../hooks/IoT';
 import styles from './NumberUpDownActionTemplateStyle';
 import { watchMultiConfigs } from '../../iot/Monitor';
-import { DEVICE_TYPE, TESTID } from '../../configs/Constants';
-
-const NumberUpDownActionTemplate = ({ actionGroup, doAction, sensor }) => {
-  const { configuration, title } = actionGroup;
+import { DEVICE_TYPE, AccessibilityLabel } from '../../configs/Constants';
+
+const NumberUpDownActionTemplate = ({
+  actionGroup = {},
+  doAction,
+  sensor = {},
+}) => {
+  const { configuration = {}, title } = actionGroup;
   const {
     action_data,
     max_value,
     min_value,
-    text_format,
+    text_format = '',
     config,
     allow_config_store_value,
   } = configuration;
+  const { device_type, is_managed_by_backend } = sensor;
 
   // eslint-disable-next-line no-unused-vars
   const [configValues, setConfigValues] = useConfigGlobalState('configValues');
   const valueDefault = 28;
-  const [value, setValue] = useState(valueDefault);
+  const [value, setValue] = useState();
 
   useEffect(() => {
     if (!config) {
+      setValue(valueDefault);
       return;
     }
 
     const configValue = configValues[config];
     if (configValue?.value !== null && configValue?.value !== undefined) {
       setValue(configValue.value);
+    } else {
+      setValue(valueDefault);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [JSON.stringify(configValues)]);
@@ -41,16 +49,16 @@ const NumberUpDownActionTemplate = ({ actionGroup, doAction, sensor }) => {
   const doActionAndWatchConfig = useCallback(
     async (actionData, actionValue) => {
       let data = actionValue;
-      if (sensor.device_type !== DEVICE_TYPE.GOOGLE_HOME) {
+      if (device_type !== DEVICE_TYPE.GOOGLE_HOME) {
         data = { temperature: actionValue };
         if (allow_config_store_value && config) {
           data.config_id = config;
-          data.value = actionValue;
+          data.config_value = actionValue;
         }
         data = JSON.stringify(data);
       }
       await doAction(actionData, data);
-      if (!sensor?.is_managed_by_backend) {
+      if (!is_managed_by_backend) {
         return;
       }
       if (!config) {
@@ -58,13 +66,13 @@ const NumberUpDownActionTemplate = ({ actionGroup, doAction, sensor }) => {
       }
 
       config &&
-        sensor.device_type === DEVICE_TYPE.LG_THINQ &&
+        device_type === DEVICE_TYPE.LG_THINQ &&
         watchMultiConfigs([config]);
     },
     [
       doAction,
-      sensor?.is_managed_by_backend,
-      sensor.device_type,
+      is_managed_by_backend,
+      device_type,
       allow_config_store_value,
       config,
     ]
@@ -109,12 +117,12 @@ const NumberUpDownActionTemplate = ({ actionGroup, doAction, sensor }) => {
         <TouchableOpacity
           style={styles.downButton}
           onPress={doActionDown}
-          testID={TESTID.NUMBER_ACTION_DOWN}
+          accessibilityLabel={AccessibilityLabel.NUMBER_ACTION_DOWN}
         >
           <IconOutline name="down" size={32} color={Colors.Primary} />
         </TouchableOpacity>
 
-        <Text testID={'abcd'} type="H2">
+        <Text accessibilityLabel={'abcd'} type="H2">
           {value !== undefined ? (
             text_format.replace('{number}', value)
           ) : (
@@ -125,7 +133,7 @@ const NumberUpDownActionTemplate = ({ actionGroup, doAction, sensor }) => {
         <TouchableOpacity
           style={styles.upButton}
           onPress={doActionUp}
-          testID={TESTID.NUMBER_ACTION_UP}
+          accessibilityLabel={AccessibilityLabel.NUMBER_ACTION_UP}
         >
           <IconOutline name="up" size={32} color={Colors.Primary} />
         </TouchableOpacity>

package/src/commons/ActionGroup/OnOffSmartLock/AutoLock/ButtonWrapper.js

@@ -14,10 +14,13 @@ const ButtonWrapper = memo(
     isButtonReLockTiming,
     toggleSwitch,
     isEnabled,
-    testID,
+    accessibilityLabel,
   }) => {
     return (
-      <View style={styles.buttonWrapper} testID={testID}>
+      <View
+        style={styles.buttonWrapper}
+        accessibilityLabel={accessibilityLabel}
+      >
         {isButtonReLockTiming ? (
           <View style={styles.wrapHeadline}>
             <SvgBrightnessBlack />

package/src/commons/ActionGroup/OnOffSmartLock/AutoLock/__test__/index.test.js

@@ -4,7 +4,7 @@ import { Switch } from 'react-native';
 
 import AutoLock from '../index';
 import { mockSCStore } from '../../../../../context/mockStore';
-import { TESTID } from '../../../../../configs/Constants';
+import { AccessibilityLabel } from '../../../../../configs/Constants';
 import { SCProvider } from '../../../../../context';
 
 const wrapComponent = () => (
@@ -18,13 +18,19 @@ describe('Test AutoLock', () => {
 
   const getElement = (instance) => {
     const buttonEnable = instance.findAll(
-      (item) => item.props.testID === TESTID.AUTO_LOCK_BUTTON_ENABLE
+      (item) =>
+        item.props.accessibilityLabel ===
+        AccessibilityLabel.AUTO_LOCK_BUTTON_ENABLE
     );
     const buttonInstant = instance.findAll(
-      (item) => item.props.testID === TESTID.AUTO_LOCK_BUTTON_INSTANT
+      (item) =>
+        item.props.accessibilityLabel ===
+        AccessibilityLabel.AUTO_LOCK_BUTTON_INSTANT
     );
     const buttonRelockTiming = instance.findAll(
-      (item) => item.props.testID === TESTID.AUTO_LOCK_BUTTON_RELOCK_TIMING
+      (item) =>
+        item.props.accessibilityLabel ===
+        AccessibilityLabel.AUTO_LOCK_BUTTON_RELOCK_TIMING
     );
     return {
       buttonEnable,

package/src/commons/ActionGroup/OnOffSmartLock/AutoLock/index.js

@@ -4,7 +4,7 @@ import Slider from 'react-native-slider';
 import Text from '../../../Text';
 import { HeaderCustom } from '../../../Header';
 import ButtonWrapper from './ButtonWrapper';
-import { TESTID } from '../../../../configs/Constants';
+import { AccessibilityLabel } from '../../../../configs/Constants';
 import styles from './AutoLockStyles';
 import t from '../../../../hooks/Common/useTranslations';
 import { Colors } from '../../../../configs';
@@ -25,16 +25,16 @@ const AutoLock = memo(() => {
           isButtonEnable
           toggleSwitch={handleToggleSwitch}
           isEnabled={isEnabled}
-          testID={TESTID.AUTO_LOCK_BUTTON_ENABLE}
+          accessibilityLabel={AccessibilityLabel.AUTO_LOCK_BUTTON_ENABLE}
         />
         <ButtonWrapper
           isButtonInstant
-          testID={TESTID.AUTO_LOCK_BUTTON_INSTANT}
+          accessibilityLabel={AccessibilityLabel.AUTO_LOCK_BUTTON_INSTANT}
         />
         <ButtonWrapper
           isButtonReLockTiming
           isEnabled={isEnabled}
-          testID={TESTID.AUTO_LOCK_BUTTON_RELOCK_TIMING}
+          accessibilityLabel={AccessibilityLabel.AUTO_LOCK_BUTTON_RELOCK_TIMING}
         />
         <View style={styles.slider}>
           <Slider