@eohjsc/react-native-smart-city 0.3.44 → 0.3.46

package/package.json

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

package/src/commons/Action/ItemQuickAction.js

@@ -11,46 +11,32 @@ const ItemQuickAction = memo(({ sensor, wrapperStyle, setStatus }) => {
   const [action, setAction] = useState(sensor.action);
   // eslint-disable-next-line no-unused-vars
   const [configValues, _] = useConfigGlobalState('configValues');
+  const [isOn, setIsOn] = useState(false);
 
   const sendRemoteCommand = useRemoteControl();
 
-  const revertActionUpdate = useCallback(
-    (value, on_action, on_status, off_action, off_status) => {
-      setIsSendingCommand(false);
-      if (value) {
-        setAction(off_action);
-        setStatus && setStatus(on_status);
-      } else {
-        setAction(on_action);
-        setStatus && setStatus(off_status);
-      }
-    },
-    [setStatus]
-  );
-
-  const statusCallback = useCallback(
-    (value) => {
-      revertActionUpdate(
-        value,
-        sensor.quick_action.on_action,
-        sensor.quick_action.on_status,
-        sensor.quick_action.off_action,
-        sensor.quick_action.off_status
-      );
-    },
-    [sensor, revertActionUpdate]
-  );
+  useEffect(() => {
+    if (!(sensor.quick_action?.config_id in configValues)) {
+      return;
+    }
+    const configValue = configValues[sensor.quick_action.config_id];
+    setIsOn(configValue?.value);
+  }, [sensor, configValues]);
 
   useEffect(() => {
     if (!sensor.quick_action) {
       return;
     }
-    if (!(sensor.quick_action.config_id in configValues)) {
-      return;
+
+    if (isOn) {
+      setAction(sensor.quick_action.off_action);
+      setStatus && setStatus(sensor.quick_action.on_status);
+    } else {
+      setAction(sensor.quick_action.on_action);
+      setStatus && setStatus(sensor.quick_action.off_status);
     }
-    const configValue = configValues[sensor.quick_action.config_id];
-    statusCallback(configValue?.value);
-  }, [sensor, configValues, statusCallback]);
+  }, [isOn, setStatus, sensor.quick_action]);
+
   const userId = useSCContextSelector((state) => state?.auth.account.user.id);
   const onActionPress = useCallback(() => {
     let data = null;
@@ -73,30 +59,12 @@ const ItemQuickAction = memo(({ sensor, wrapperStyle, setStatus }) => {
     sendRemoteCommand(sensor, action, data, userId);
     setIsSendingCommand(true);
 
-    if (!sensor.quick_action) {
-      // old version
-      setTimeout(() => {
-        revertActionUpdate(
-          action.id === sensor.action.id,
-          sensor.action,
-          sensor.status,
-          sensor.action2,
-          sensor.status2
-        );
-      }, 5000);
-    } else if (!sensor.quick_action.will_auto_update_status) {
+    if (!sensor.quick_action.will_auto_update_status) {
       setTimeout(() => {
-        statusCallback(action.id === sensor.quick_action.on_action.id);
+        setIsOn(action.id === sensor.quick_action.on_action.id);
       }, sensor.quick_action.interval);
     }
-  }, [
-    sensor,
-    action,
-    userId,
-    revertActionUpdate,
-    statusCallback,
-    sendRemoteCommand,
-  ]);
+  }, [sensor, action, userId, sendRemoteCommand]);
 
   if (!action) {
     return <View />;

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

@@ -1,25 +1,24 @@
-import React, { useState } from 'react';
+import React from 'react';
 import { TouchableOpacity } from 'react-native';
 import { act, create } from 'react-test-renderer';
 import ItemQuickAction from '../ItemQuickAction';
 import { Colors } from '../../../configs';
 import { AccessibilityLabel } from '../../../configs/Constants';
 import { factory } from 'factory-girl';
+import IconComponent from '../../IconComponent';
+import { IconFill, IconOutline } from '@ant-design/icons-react-native';
 
 class Sensor {}
 
 factory.define('Sensor', Sensor, {});
-const mockSetState = jest.fn();
 
 jest.mock('react', () => {
   return {
     ...jest.requireActual('react'),
-    useState: jest.fn(),
+    memo: (x) => x,
   };
 });
 
-useState.mockImplementation((init) => [init, mockSetState]);
-
 const mockSendRemoteControl = jest.fn();
 jest.mock('../../../hooks/IoT', () => {
   return {
@@ -33,62 +32,41 @@ jest.mock('../../../iot/states', () => ({
 }));
 
 describe('Test ItemQuickAction', () => {
-  let tree;
+  let tree, sensor, style;
   beforeEach(() => {
     jest.useFakeTimers();
-    mockSetState.mockClear();
-  });
-
-  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: {
-      config_id: 51,
-      interval: 5000,
-      off_action: {
-        color: '#00979D',
-        command_prefer_over_bluetooth: true,
-        command_prefer_over_googlehome: false,
-        command_prefer_over_internet: false,
-        id: 10,
-      },
-      on_action: {
-        color: '#00979D',
-        command_prefer_over_bluetooth: true,
-        command_prefer_over_googlehome: false,
-        command_prefer_over_internet: false,
-        id: 9,
+    sensor = {
+      quick_action: {
+        config_id: 51,
+        interval: 5000,
+        off_action: {
+          icon: 'down',
+          command_prefer_over_bluetooth: true,
+          command_prefer_over_googlehome: false,
+          command_prefer_over_internet: false,
+          id: 10,
+        },
+        on_action: {
+          icon: 'up',
+          command_prefer_over_bluetooth: true,
+          command_prefer_over_googlehome: false,
+          command_prefer_over_internet: false,
+          id: 9,
+        },
+        off_status: 'OFF',
+        on_status: 'ON',
+        will_auto_update_status: false,
       },
-      off_status: 'OFF',
-      on_status: 'ON',
-      will_auto_update_status: false,
-    },
-    action2: {
-      color: '#00979D',
-      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',
-    status2: 'ON',
-  };
-  const style = {
-    width: 32,
-    height: 32,
-    backgroundColor: Colors.Gray3,
-    borderRadius: 16,
-    justifyContent: 'center',
-    alignItems: 'center',
-  };
+    };
+    style = {
+      width: 32,
+      height: 32,
+      backgroundColor: Colors.Gray3,
+      borderRadius: 16,
+      justifyContent: 'center',
+      alignItems: 'center',
+    };
+  });
 
   it('render with no action', async () => {
     const newSensor = await factory.build('Sensor');
@@ -105,9 +83,9 @@ describe('Test ItemQuickAction', () => {
     expect(buttonOnActionPress).toHaveLength(0);
   });
 
-  it('render with full action data case on and icon up', async () => {
+  it('render with icon_outlined poweroff', async () => {
     const mockSetStatus = jest.fn();
-    sensor.action.icon = 'up';
+    sensor.quick_action.on_action.icon = null;
     await act(async () => {
       tree = await create(
         <ItemQuickAction
@@ -119,36 +97,15 @@ describe('Test ItemQuickAction', () => {
     });
 
     const instance = tree.root;
-    const buttonOnActionPress = instance.find(
-      (el) =>
-        el.props.accessibilityLabel ===
-          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
-        el.type === TouchableOpacity
-    );
-    expect(buttonOnActionPress).toBeDefined();
-
-    mockSetState.mockClear();
-    await act(async () => {
-      buttonOnActionPress.props.onPress();
-    });
-    expect(mockSendRemoteControl).toBeCalled();
-    expect(mockSetState).toBeCalledTimes(1);
-
-    jest.runAllTimers();
-    expect(mockSetState).toBeCalledTimes(3);
-    expect(mockSetState).toBeCalledWith(sensor.quick_action.off_action);
+    const icon = instance.findByType(IconOutline);
+    expect(icon).toBeDefined();
+    expect(icon.props.name).toEqual('poweroff');
   });
 
-  it('render with icon_outlined poweroff and action have allow_config_store_value_id', async () => {
-    const mockSetStatus = jest.fn();
-    sensor.action.icon = null;
+  it('click quick action icon down , isSendingCommand = true', async () => {
     await act(async () => {
       tree = await create(
-        <ItemQuickAction
-          sensor={sensor}
-          wrapperStyle={style}
-          setStatus={mockSetStatus}
-        />
+        <ItemQuickAction sensor={sensor} wrapperStyle={style} />
       );
     });
 
@@ -159,95 +116,25 @@ describe('Test ItemQuickAction', () => {
           `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
-    expect(buttonOnActionPress).toBeDefined();
 
-    mockSetState.mockClear();
     await act(async () => {
-      buttonOnActionPress.props.onPress();
+      await buttonOnActionPress.props.onPress();
     });
-    expect(mockSendRemoteControl).toBeCalledWith(
-      sensor,
-      sensor.action,
-      JSON.stringify({ config_id: 51, config_value: 0 }),
-      undefined
-    );
-    expect(mockSetState).toBeCalledTimes(1);
 
-    jest.runAllTimers();
-    expect(mockSetState).toBeCalledTimes(3);
-    expect(mockSetState).toBeCalledWith(sensor.quick_action.off_action);
+    const icon = instance.findByType(IconFill);
+    expect(icon.props.color).toEqual(Colors.TextGray);
   });
 
-  it('render case old version config', async () => {
-    const oldSensor = {
-      action: {
-        color: '#00979D',
-        command_prefer_over_bluetooth: true,
-        command_prefer_over_googlehome: false,
-        command_prefer_over_internet: false,
-        id: 9,
-        icon: 'caret-up',
-      },
-      action2: {
-        color: '#00979D',
-        command_prefer_over_bluetooth: true,
-        command_prefer_over_googlehome: false,
-        command_prefer_over_internet: false,
-        id: 10,
-      },
-      status: 'OFF',
-      status2: 'ON',
-    };
-    await act(async () => {
-      tree = await create(
-        <ItemQuickAction sensor={oldSensor} wrapperStyle={style} />
-      );
-    });
-
-    const instance = tree.root;
-    const buttonOnActionPress = instance.find(
-      (el) =>
-        el.props.accessibilityLabel ===
-          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
-        el.type === TouchableOpacity
-    );
-
-    mockSetState.mockClear();
-    await act(async () => {
-      buttonOnActionPress.props.onPress();
-    });
-    expect(mockSetState).toBeCalledTimes(1);
-
-    jest.runAllTimers();
-    expect(mockSetState).toBeCalledTimes(3);
-  });
+  it('trigger action with quick action with auto update', async () => {
+    sensor.quick_action.will_auto_update_status = true;
 
-  it('when sending command, button is disabled', async () => {
-    useState.mockImplementationOnce((init) => [true, mockSetState]);
     await act(async () => {
       tree = await create(
         <ItemQuickAction sensor={sensor} wrapperStyle={style} />
       );
     });
 
-    const instance = tree.root;
-    const buttonOnActionPress = instance.find(
-      (el) =>
-        el.props.accessibilityLabel ===
-          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
-        el.type === TouchableOpacity
-    );
-    expect(buttonOnActionPress).toBeDefined();
-  });
-
-  it('click quick action icon down , isSendingCommand = true', async () => {
-    sensor.action.icon = 'down';
-    useState.mockImplementationOnce((init) => [true, mockSetState]);
-    await act(async () => {
-      tree = await create(
-        <ItemQuickAction sensor={sensor} wrapperStyle={style} />
-      );
-    });
+    assertIsActionOn();
 
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
@@ -256,75 +143,20 @@ describe('Test ItemQuickAction', () => {
           `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
         el.type === TouchableOpacity
     );
-    expect(buttonOnActionPress).toBeDefined();
-  });
-  it('trigger action with quick action no auto update', async () => {
-    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',
-      },
-      quick_action: {
-        config_id: 51,
-        interval: 5000,
-        off_action: {
-          color: '#00979D',
-          command_prefer_over_bluetooth: true,
-          command_prefer_over_googlehome: false,
-          command_prefer_over_internet: false,
-          id: 10,
-        },
-        on_action: {
-          color: '#00979D',
-          command_prefer_over_bluetooth: true,
-          command_prefer_over_googlehome: false,
-          command_prefer_over_internet: false,
-          id: 9,
-        },
-        off_status: 'OFF',
-        on_status: 'ON',
-        will_auto_update_status: true,
-      },
-    };
 
     await act(async () => {
-      tree = await create(
-        <ItemQuickAction sensor={noAutoUpdateSensor} wrapperStyle={style} />
-      );
+      await buttonOnActionPress.props.onPress();
     });
 
-    const instance = tree.root;
-    const buttonOnActionPress = instance.find(
-      (el) =>
-        el.props.accessibilityLabel ===
-          `${AccessibilityLabel.ITEM_QUICK_ACTION_PRESS}-${sensor?.id}` &&
-        el.type === TouchableOpacity
-    );
-
-    mockSetState.mockClear();
     await act(async () => {
-      buttonOnActionPress.props.onPress();
+      jest.runAllTimers();
     });
-    expect(mockSendRemoteControl).toBeCalledWith(
-      noAutoUpdateSensor,
-      noAutoUpdateSensor.action,
-      JSON.stringify({ config_id: 51, config_value: 1 }),
-      undefined
-    );
-    expect(mockSetState).toBeCalledTimes(1);
 
-    jest.runAllTimers();
-    expect(mockSetState).toBeCalledTimes(1);
+    assertIsActionOn();
   });
 
-  it('render with full action data case off', async () => {
-    sensor.action.id = 10; // off action
+  it('on press will toggle action', async () => {
+    sensor.quick_action.on_action.id = 10; // off action
     const mockSetStatus = jest.fn();
 
     await act(async () => {
@@ -336,7 +168,7 @@ describe('Test ItemQuickAction', () => {
         />
       );
     });
-
+    assertIsActionOn();
     const instance = tree.root;
     const buttonOnActionPress = instance.find(
       (el) =>
@@ -345,31 +177,37 @@ describe('Test ItemQuickAction', () => {
         el.type === TouchableOpacity
     );
 
-    mockSetState.mockClear();
     await act(async () => {
-      buttonOnActionPress.props.onPress();
+      await buttonOnActionPress.props.onPress();
+      jest.runAllTimers();
     });
 
-    jest.runAllTimers();
-    expect(mockSetState).toBeCalledWith(sensor.quick_action.on_action);
+    assertIsActionOff();
   });
 
   it('listen to config value for update action', async () => {
     const globalStates = require('../../../iot/states');
     globalStates.useConfigGlobalState = () => [{ 51: { value: true } }, null];
 
-    const mockSetStatus = jest.fn();
-
     await act(async () => {
       tree = await create(
-        <ItemQuickAction
-          sensor={sensor}
-          wrapperStyle={style}
-          setStatus={mockSetStatus}
-        />
+        <ItemQuickAction sensor={sensor} wrapperStyle={style} />
       );
     });
 
-    expect(mockSetState).toBeCalledWith(sensor.quick_action.off_action);
+    assertIsActionOff();
   });
+
+  const assertIsActionOn = () => {
+    const icon = tree.root.findByType(IconComponent);
+
+    expect(icon.props.icon).toEqual(sensor.quick_action.on_action.icon);
+    expect(icon.props.icon).not.toEqual(sensor.quick_action.off_action.icon);
+  };
+  const assertIsActionOff = () => {
+    const icon = tree.root.findByType(IconComponent);
+
+    expect(icon.props.icon).toEqual(sensor.quick_action.off_action.icon);
+    expect(icon.props.icon).not.toEqual(sensor.quick_action.on_action.icon);
+  };
 });

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

@@ -1,5 +1,5 @@
 import React, { memo, useCallback, useState } from 'react';
-import { SafeAreaView, View } from 'react-native';
+import { View } from 'react-native';
 import Slider from 'react-native-slider';
 import Text from '../../../Text';
 import { HeaderCustom } from '../../../Header';
@@ -16,7 +16,7 @@ const AutoLock = memo(() => {
     setIsEnabled((previousState) => !previousState);
   }, []);
   return (
-    <SafeAreaView style={styles.container}>
+    <View style={styles.container}>
       <HeaderCustom title={t('auto_lock')} isShowSeparator />
       <View style={styles.wrap}>
         <Text style={styles.textAutoLock}>{t('auto_lock')}</Text>
@@ -50,7 +50,7 @@ const AutoLock = memo(() => {
         </View>
         <Text style={styles.textReLock}>{t('re_lock_will_lock')}</Text>
       </View>
-    </SafeAreaView>
+    </View>
   );
 });
 

package/src/commons/ActionGroup/OnOffSmartLock/PasscodeList/ItemPasscode.js

@@ -1,5 +1,5 @@
 import React, { memo } from 'react';
-import { SafeAreaView, View, TouchableOpacity } from 'react-native';
+import { View, TouchableOpacity } from 'react-native';
 
 import Text from '../../../Text';
 import { HeaderCustom } from '../../../Header';
@@ -22,7 +22,7 @@ const ItemPasscode = memo(({ route }) => {
   const { item = {} } = route?.params || {};
 
   return (
-    <SafeAreaView style={styles.container}>
+    <View style={styles.container}>
       <HeaderCustom isShowSeparator title={item.code} />
       <ButtonWrapper textHeadline={t('code')} item={item.code} />
       <ButtonWrapper textHeadline={t('user')} item={item.name} />
@@ -41,7 +41,7 @@ const ItemPasscode = memo(({ route }) => {
           {t('delete_passcode')}
         </Text>
       </TouchableOpacity>
-    </SafeAreaView>
+    </View>
   );
 });
 

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

@@ -1,5 +1,5 @@
 import React, { memo, useCallback, useMemo } from 'react';
-import { SafeAreaView, TextInput, View, TouchableOpacity } from 'react-native';
+import { TextInput, View, TouchableOpacity } from 'react-native';
 import { IconOutline } from '@ant-design/icons-react-native';
 import { useNavigation } from '@react-navigation/native';
 
@@ -34,7 +34,7 @@ const PasscodeList = memo(() => {
     [navigation]
   );
   return (
-    <SafeAreaView style={styles.container}>
+    <View style={styles.container}>
       <HeaderCustom title={t('passcode_list')} />
       <View style={styles.wrap}>
         <View style={styles.searchBox}>
@@ -61,7 +61,7 @@ const PasscodeList = memo(() => {
           </TouchableOpacity>
         ))}
       </View>
-    </SafeAreaView>
+    </View>
   );
 });
 

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

@@ -1,7 +1,8 @@
 import React, { memo, useCallback, useMemo, useState } from 'react';
-import { SafeAreaView, View, ScrollView } from 'react-native';
-import { useTranslations } from '../../../../hooks/Common/useTranslations';
+import { View, ScrollView } from 'react-native';
+import moment from 'moment';
 
+import { useTranslations } from '../../../../hooks/Common/useTranslations';
 import Text from '../../../Text';
 import { HeaderCustom } from '../../../Header';
 import { useBoolean } from '../../../../hooks/Common';
@@ -13,7 +14,6 @@ import BottomButtonView from '../../../BottomButtonView';
 import { ACCESS_SCHEDULE } from '../../../../screens/GuestInfo/constant';
 import { AccessibilityLabel } from '../../../../configs/Constants';
 import ButtonWrapper from './ButtonWrapper';
-import moment from 'moment';
 import styles from './SetupGeneratePasscodeStyles';
 
 const SetupGeneratePasscode = memo(() => {
@@ -170,7 +170,7 @@ const SetupGeneratePasscode = memo(() => {
   }, [isSelectCircle]);
 
   return (
-    <SafeAreaView style={styles.container}>
+    <View style={styles.container}>
       <HeaderCustom
         title={t('setup_generate_passcode')}
         titleStyle={styles.title}
@@ -247,7 +247,7 @@ const SetupGeneratePasscode = memo(() => {
         onHide={releaseLockShowing}
       />
       <BottomButtonView style={styles.viewBottomFixed} mainTitle={t('done')} />
-    </SafeAreaView>
+    </View>
   );
 });
 

package/src/commons/ActionGroup/OptionsDropdownActionTemplate.js

@@ -52,7 +52,7 @@ const OptionsDropdownActionTemplate = ({
     for (let i = 0; i < options.length; i++) {
       const option = options[i];
       const value = getOptionValue(option, allow_config_store_value);
-      if (value === currentValue) {
+      if (String(value) === String(currentValue)) {
         return option;
       }
     }

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

@@ -61,12 +61,12 @@ describe('Test OptionsDropdownActionTemplate', () => {
           {
             text: 'Level1',
             value_int: 1,
-            value_text: '',
+            value_text: '1',
           },
           {
             text: 'Level2',
             value_int: 2,
-            value_text: '',
+            value_text: '2',
           },
         ],
         icon: 'slack',
@@ -96,6 +96,7 @@ describe('Test OptionsDropdownActionTemplate', () => {
   });
 
   it('render template without selectedOption match, get first one', async () => {
+    actionGroup.configuration.options[1].value_text = '3';
     actionGroup.configuration.options[1].value_int = 3;
     sensor.is_managed_by_backend = true;
     const mockDoAction = jest.fn();
@@ -160,7 +161,7 @@ describe('Test OptionsDropdownActionTemplate', () => {
 
     expect(mockDoAction).toHaveBeenCalledWith(
       action_data,
-      JSON.stringify({ level: 1, key_code: 1 })
+      JSON.stringify({ level: '1', key_code: 1 })
     );
     is_managed_by_backend
       ? expect(watchMultiConfigs).not.toBeCalled()