@eohjsc/react-native-smart-city 0.4.41 → 0.4.42

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

@@ -10,150 +10,152 @@ import { useUnwatchLGDeviceConfigControl } from '../../../hooks/IoT';
 import Text from '../../Text';
 import styles from './TwoButtonTemplateStyles';
 
-const TwoButtonTemplate = memo(({ item = {}, doAction, sensor = {} }) => {
-  const { configuration = {} } = item;
-  const { button1, button2 } = configuration;
-  const [isOn, setIsOn] = useState(true);
-  const [isStart, setIsStart] = useState(true);
-  const [configValues] = useConfigGlobalState('configValues');
-  const isLight = false;
+const TwoButtonTemplate = memo(
+  ({ actionGroup = {}, doAction, sensor = {} }) => {
+    const { configuration = {} } = actionGroup;
+    const { button1, button2 } = configuration;
+    const [isOn, setIsOn] = useState(true);
+    const [isStart, setIsStart] = useState(true);
+    const [configValues] = useConfigGlobalState('configValues');
+    const isLight = false;
 
-  const triggerAction1 = useCallback(async () => {
-    if (button1?.action_on_data && button1?.action_off_data) {
-      if (isOn) {
-        await doAction(button1?.action_off_data, null);
-      } else {
-        await doAction(button1?.action_on_data, null);
+    const triggerAction1 = useCallback(async () => {
+      if (button1?.action_on_data && button1?.action_off_data) {
+        if (isOn) {
+          await doAction(button1?.action_off_data, null);
+        } else {
+          await doAction(button1?.action_on_data, null);
+        }
       }
-    }
-    if (sensor?.is_managed_by_backend) {
-      configuration.config &&
-        sensor.device_type === DEVICE_TYPE.LG_THINQ &&
-        watchMultiConfigs([configuration.config]);
-    }
-  }, [
-    button1,
-    configuration.config,
-    doAction,
-    isOn,
-    sensor?.is_managed_by_backend,
-    sensor.device_type,
-  ]);
+      if (sensor?.is_managed_by_backend) {
+        configuration.config &&
+          sensor.device_type === DEVICE_TYPE.LG_THINQ &&
+          watchMultiConfigs([configuration.config]);
+      }
+    }, [
+      button1,
+      configuration.config,
+      doAction,
+      isOn,
+      sensor?.is_managed_by_backend,
+      sensor.device_type,
+    ]);
 
-  const triggerAction2 = useCallback(async () => {
-    if (button2?.action_on_data && button2?.action_off_data) {
-      if (isStart) {
-        await doAction(button2?.action_off_data, null);
-      } else {
-        await doAction(button2?.action_on_data, null);
+    const triggerAction2 = useCallback(async () => {
+      if (button2?.action_on_data && button2?.action_off_data) {
+        if (isStart) {
+          await doAction(button2?.action_off_data, null);
+        } else {
+          await doAction(button2?.action_on_data, null);
+        }
+      }
+      if (
+        sensor?.is_managed_by_backend &&
+        sensor.device_type === DEVICE_TYPE.LG_THINQ
+      ) {
+        configuration.config && watchMultiConfigs([configuration.config]);
       }
-    }
-    if (
-      sensor?.is_managed_by_backend &&
-      sensor.device_type === DEVICE_TYPE.LG_THINQ
-    ) {
-      configuration.config && watchMultiConfigs([configuration.config]);
-    }
-  }, [
-    button2?.action_off_data,
-    button2?.action_on_data,
-    configuration.config,
-    doAction,
-    isStart,
-    sensor?.is_managed_by_backend,
-    sensor.device_type,
-  ]);
+    }, [
+      button2?.action_off_data,
+      button2?.action_on_data,
+      configuration.config,
+      doAction,
+      isStart,
+      sensor?.is_managed_by_backend,
+      sensor.device_type,
+    ]);
+
+    useUnwatchLGDeviceConfigControl(sensor, [configuration.config]);
 
-  useUnwatchLGDeviceConfigControl(sensor, [configuration.config]);
+    useEffect(() => {
+      const configValue1 = configValues[button1?.config];
+      const configValue2 = configValues[button2?.config];
+      if (button1?.is_on_value && button1?.is_on_value.length > 0) {
+        setIsOn(button1?.is_on_value.includes(configValue1?.value));
+        return;
+      }
+      if (button2?.is_on_value && button2?.is_on_value.length > 0) {
+        setIsStart(button2?.is_on_value.includes(configValue2?.value));
+        return;
+      }
 
-  useEffect(() => {
-    const configValue1 = configValues[button1?.config];
-    const configValue2 = configValues[button2?.config];
-    if (button1?.is_on_value && button1?.is_on_value.length > 0) {
-      setIsOn(button1?.is_on_value.includes(configValue1?.value));
-      return;
-    }
-    if (button2?.is_on_value && button2?.is_on_value.length > 0) {
-      setIsStart(button2?.is_on_value.includes(configValue2?.value));
-      return;
-    }
+      setIsOn(configValue1?.value);
+      setIsStart(configValue2?.value);
+    }, [
+      configuration.config,
+      configValues,
+      configuration.is_on_value,
+      configuration,
+      button1?.config,
+      button1?.is_on_value,
+      button2?.config,
+      button2?.is_on_value,
+    ]);
 
-    setIsOn(configValue1?.value);
-    setIsStart(configValue2?.value);
-  }, [
-    configuration.config,
-    configValues,
-    configuration.is_on_value,
-    configuration,
-    button1?.config,
-    button1?.is_on_value,
-    button2?.config,
-    button2?.is_on_value,
-  ]);
+    const RenderTwoButtonAction = () => {
+      const buttons = [
+        {
+          icon_on: button1?.icon_on,
+          icon_off: button1?.icon_off,
+          text_on: button1?.text_on,
+          text_off: button1?.text_off,
+          onPress: triggerAction1,
+          isCheckOnOff: isOn,
+          accessibilityLabel: AccessibilityLabel.BUTTON_TEMPLATE_1,
+        },
+        {
+          icon_on: button2?.icon_on,
+          icon_off: button2?.icon_off,
+          text_on: button2?.text_on,
+          text_off: button2?.text_off,
+          onPress: triggerAction2,
+          isCheckOnOff: isStart,
+          accessibilityLabel: AccessibilityLabel.BUTTON_TEMPLATE_1,
+        },
+      ];
+      return (
+        <>
+          {buttons.map((item, index) => (
+            <TouchableOpacity
+              accessibilityLabel={item.accessibilityLabel}
+              style={styles.bigCircle}
+              onPress={item.onPress}
+              key={index}
+            >
+              <View style={styles.smallCircle}>
+                <Icon
+                  name={item?.isCheckOnOff ? item?.icon_on : item?.icon_off}
+                  size={44}
+                  color={item?.isCheckOnOff ? Colors.Green7 : Colors.Gray6}
+                />
+                <Text
+                  style={[
+                    styles.textBig,
+                    { color: item?.isCheckOnOff ? Colors.Gray8 : Colors.Gray6 },
+                  ]}
+                >
+                  {item?.isCheckOnOff ? item?.text_on : item?.text_off}
+                </Text>
+              </View>
+            </TouchableOpacity>
+          ))}
+        </>
+      );
+    };
 
-  const RenderTwoButtonAction = () => {
-    const buttons = [
-      {
-        icon_on: button1?.icon_on,
-        icon_off: button1?.icon_off,
-        text_on: button1?.text_on,
-        text_off: button1?.text_off,
-        onPress: triggerAction1,
-        isCheckOnOff: isOn,
-        accessibilityLabel: AccessibilityLabel.BUTTON_TEMPLATE_1,
-      },
-      {
-        icon_on: button2?.icon_on,
-        icon_off: button2?.icon_off,
-        text_on: button2?.text_on,
-        text_off: button2?.text_off,
-        onPress: triggerAction2,
-        isCheckOnOff: isStart,
-        accessibilityLabel: AccessibilityLabel.BUTTON_TEMPLATE_1,
-      },
-    ];
     return (
       <>
-        {buttons.map((button, index) => (
-          <TouchableOpacity
-            accessibilityLabel={button.accessibilityLabel}
-            style={styles.bigCircle}
-            onPress={button.onPress}
-            key={index}
-          >
-            <View style={styles.smallCircle}>
-              <Icon
-                name={button?.isCheckOnOff ? button?.icon_on : button?.icon_off}
-                size={44}
-                color={button?.isCheckOnOff ? Colors.Green7 : Colors.Gray6}
-              />
-              <Text
-                style={[
-                  styles.textBig,
-                  { color: button?.isCheckOnOff ? Colors.Gray8 : Colors.Gray6 },
-                ]}
-              >
-                {button?.isCheckOnOff ? button?.text_on : button?.text_off}
-              </Text>
-            </View>
-          </TouchableOpacity>
-        ))}
+        <View style={styles.wrap}>
+          <RenderTwoButtonAction />
+        </View>
+        {!!actionGroup.title && !isLight && (
+          <Text size={20} semibold center>
+            {actionGroup.title}
+          </Text>
+        )}
       </>
     );
-  };
-
-  return (
-    <>
-      <View style={styles.wrap}>
-        <RenderTwoButtonAction />
-      </View>
-      {!!item.title && !isLight && (
-        <Text size={20} semibold center>
-          {item.title}
-        </Text>
-      )}
-    </>
-  );
-});
+  }
+);
 
 export default TwoButtonTemplate;

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

@@ -25,17 +25,21 @@ jest.mock('../../../iot/states', () => ({
   useConfigGlobalState: jest.fn(),
 }));
 
-const wrapComponent = (item, doAction, sensor) => (
+const wrapComponent = (actionGroup, doAction, sensor) => (
   <SCProvider initState={mockSCStore({})}>
-    <ColorPickerTemplate item={item} doAction={doAction} sensor={sensor} />
+    <ColorPickerTemplate
+      actionGroup={actionGroup}
+      doAction={doAction}
+      sensor={sensor}
+    />
   </SCProvider>
 );
 
 describe('Test ColorPickerTemplate', () => {
   let wrapper;
-  let displayItem;
+  let actionGroup;
 
-  const actionColorData = {
+  const action_color_data = {
     color: '#00979D',
     command_prefer_over_bluetooth: false,
     command_prefer_over_googlehome: false,
@@ -46,11 +50,11 @@ describe('Test ColorPickerTemplate', () => {
   beforeEach(() => {
     watchMultiConfigs.mockClear();
     mockDoAction.mockClear();
-    displayItem = {
+    actionGroup = {
       template: 'ColorPickerTemplate',
       configuration: {
         config: 5,
-        action_color_data: actionColorData,
+        action_color_data: action_color_data,
       },
       title: '',
     };
@@ -64,7 +68,7 @@ describe('Test ColorPickerTemplate', () => {
       name: 'Sensor',
     };
     await act(async () => {
-      wrapper = await create(wrapComponent(displayItem, mockDoAction, sensor));
+      wrapper = await create(wrapComponent(actionGroup, mockDoAction, sensor));
     });
     const instance = wrapper.root;
     const pickers = instance.findAllByType(ColorPicker);
@@ -90,7 +94,7 @@ describe('Test ColorPickerTemplate', () => {
       device_type: DEVICE_TYPE.LG_THINQ,
     };
     await act(async () => {
-      wrapper = await create(wrapComponent(displayItem, mockDoAction, sensor));
+      wrapper = await create(wrapComponent(actionGroup, mockDoAction, sensor));
     });
     const instance = wrapper.root;
     const pickers = instance.findAllByType(ColorPicker);
@@ -104,40 +108,13 @@ describe('Test ColorPickerTemplate', () => {
       device_type: DEVICE_TYPE.LG_THINQ,
     };
     await act(async () => {
-      wrapper = await create(wrapComponent(displayItem, mockDoAction, sensor));
+      wrapper = await create(wrapComponent(actionGroup, mockDoAction, sensor));
     });
     const instance = wrapper.root;
     const wheelpicker = instance.findByType(WheelColorPicker);
     await act(async () => {
       await wheelpicker.props.onStart();
     });
-    // NOTE: Hinh will fix it later
-    expect(mockSetAction).not.toBeCalled();
-  });
-
-  it('test WheelColorPicker onChangeColorComplete', async () => {
-    const sensor = {
-      is_managed_by_backend: true,
-      name: 'Sensor',
-      device_type: DEVICE_TYPE.LG_THINQ,
-    };
-    await act(async () => {
-      wrapper = await create(wrapComponent(displayItem, mockDoAction, sensor));
-    });
-    const instance = wrapper.root;
-    const wheelpicker = instance.findByType(WheelColorPicker);
-    await act(async () => {
-      await wheelpicker.props.onStart();
-    });
-    // NOTE: Hinh will fix it later
-    expect(mockSetAction).toBeCalledTimes(0);
-    expect(mockDoAction).toBeCalledTimes(0);
-
-    await act(async () => {
-      await wheelpicker.props.onChangeColorComplete('#ffffff');
-    });
-    // NOTE: Hinh will fix it later
-    expect(mockSetAction).toBeCalledTimes(0);
-    expect(mockDoAction).toBeCalledTimes(1);
+    expect(mockSetAction).toBeCalled();
   });
 });

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

@@ -1,11 +1,10 @@
 import React from 'react';
-import { ActivityIndicator, TouchableOpacity, View } from 'react-native';
+import { ActivityIndicator, TouchableOpacity } from 'react-native';
 import { act, create } from 'react-test-renderer';
 import Text from '../../../commons/Text';
 import { DEVICE_TYPE, AccessibilityLabel } from '../../../configs/Constants';
 import { watchMultiConfigs } from '../../../iot/Monitor';
 import NumberUpDownActionTemplate from '../NumberUpDownActionTemplate';
-import styles from '../NumberUpDownActionTemplateStyle';
 
 jest.mock('../../../iot/Monitor');
 
@@ -21,7 +20,7 @@ jest.mock('@react-navigation/native', () => {
 });
 
 describe('Test NumberUpDownTemplate', () => {
-  const actionData = {
+  const action_data = {
     color: '#00979D',
     command_prefer_over_bluetooth: true,
     command_prefer_over_googlehome: false,
@@ -32,16 +31,16 @@ describe('Test NumberUpDownTemplate', () => {
     key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
   };
 
-  let displayItem;
+  let actionGroup;
   let wrapper;
 
   beforeEach(() => {
     watchMultiConfigs.mockClear();
-    displayItem = {
+    actionGroup = {
       configuration: {
         allow_config_store_value: false,
         config: 5,
-        action_data: actionData,
+        action_data,
         min_value: 16,
         max_value: 30,
         text_format: '{number} *C',
@@ -54,7 +53,7 @@ describe('Test NumberUpDownTemplate', () => {
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{
             is_managed_by_backend: true,
@@ -81,7 +80,7 @@ describe('Test NumberUpDownTemplate', () => {
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{ is_managed_by_backend: false }}
         />
@@ -103,7 +102,7 @@ describe('Test NumberUpDownTemplate', () => {
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{
             is_managed_by_backend: true,
@@ -125,11 +124,11 @@ describe('Test NumberUpDownTemplate', () => {
 
   it('do action watchConfigs cause allow_config_store_value true', async () => {
     const mockDoAction = jest.fn();
-    displayItem.configuration.allow_config_store_value = true;
+    actionGroup.configuration.allow_config_store_value = true;
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{
             is_managed_by_backend: true,
@@ -150,13 +149,13 @@ describe('Test NumberUpDownTemplate', () => {
   });
 
   it('action down without config', async () => {
-    displayItem.configuration.allow_config_store_value = true;
-    displayItem.configuration.config = undefined;
+    actionGroup.configuration.allow_config_store_value = true;
+    actionGroup.configuration.config = undefined;
     const mockDoAction = jest.fn();
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{ is_managed_by_backend: true }}
         />
@@ -175,12 +174,12 @@ describe('Test NumberUpDownTemplate', () => {
 
   it('action down allow_config_store_value true', async () => {
     const mockDoAction = jest.fn();
-    displayItem.configuration.allow_config_store_value = true;
-    displayItem.configuration.config = null;
+    actionGroup.configuration.allow_config_store_value = true;
+    actionGroup.configuration.config = null;
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{ is_managed_by_backend: true }}
         />
@@ -202,12 +201,12 @@ describe('Test NumberUpDownTemplate', () => {
 
   it('action up allow_config_store_value true', async () => {
     const mockDoAction = jest.fn();
-    displayItem.configuration.allow_config_store_value = true;
-    displayItem.configuration.config = null;
+    actionGroup.configuration.allow_config_store_value = true;
+    actionGroup.configuration.config = null;
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{ is_managed_by_backend: true }}
         />
@@ -223,7 +222,7 @@ describe('Test NumberUpDownTemplate', () => {
       await touchs.props.onPress();
     });
     const text = instance.find(
-      (el) => el.props.accessibilityLabel === 'text_format' && el.type === Text
+      (el) => el.props.accessibilityLabel === 'abcd' && el.type === Text
     );
     expect(text.props.children).toEqual('29 *C');
   });
@@ -233,7 +232,7 @@ describe('Test NumberUpDownTemplate', () => {
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{ is_managed_by_backend: true }}
         />
@@ -259,7 +258,7 @@ describe('Test NumberUpDownTemplate', () => {
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{ is_managed_by_backend: true }}
         />
@@ -281,12 +280,12 @@ describe('Test NumberUpDownTemplate', () => {
   });
 
   it('action down limit ', async () => {
-    displayItem.configuration.min_value = 25;
+    actionGroup.configuration.min_value = 25;
     const mockDoAction = jest.fn();
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{ is_managed_by_backend: true }}
         />
@@ -305,12 +304,12 @@ describe('Test NumberUpDownTemplate', () => {
   });
 
   it('action up limit ', async () => {
-    displayItem.configuration.max_value = 25;
+    actionGroup.configuration.max_value = 25;
     const mockDoAction = jest.fn();
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{ is_managed_by_backend: true }}
         />
@@ -329,11 +328,11 @@ describe('Test NumberUpDownTemplate', () => {
   });
   it('render template have title', async () => {
     const mockDoAction = jest.fn();
-    displayItem.title = 'title';
+    actionGroup.title = 'title';
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{
             is_managed_by_backend: true,
@@ -348,11 +347,11 @@ describe('Test NumberUpDownTemplate', () => {
   });
   it('render template watch config not exits', async () => {
     const mockDoAction = jest.fn();
-    displayItem.configuration.config = 100;
+    actionGroup.configuration.config = 100;
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{
             is_managed_by_backend: true,
@@ -369,7 +368,7 @@ describe('Test NumberUpDownTemplate', () => {
     await act(async () => {
       wrapper = await create(
         <NumberUpDownActionTemplate
-          item={displayItem}
+          actionGroup={actionGroup}
           doAction={mockDoAction}
           sensor={{
             is_managed_by_backend: true,
@@ -403,43 +402,4 @@ describe('Test NumberUpDownTemplate', () => {
       26
     );
   });
-
-  it('render isWidgetOrder', async () => {
-    const mockDoAction = jest.fn();
-    await act(async () => {
-      wrapper = await create(
-        <NumberUpDownActionTemplate
-          item={displayItem}
-          doAction={mockDoAction}
-          sensor={{
-            is_managed_by_backend: true,
-            device_type: DEVICE_TYPE.LG_THINQ,
-          }}
-          isWidgetOrder
-        />
-      );
-    });
-    const rootElement = wrapper.root.findAllByType(View)[0];
-    expect(rootElement.props.style).toEqual(styles.wrapOrderItem);
-  });
-
-  it('render default value', async () => {
-    const mockDoAction = jest.fn();
-    await act(async () => {
-      wrapper = await create(
-        <NumberUpDownActionTemplate
-          doAction={mockDoAction}
-          sensor={{
-            is_managed_by_backend: true,
-            device_type: DEVICE_TYPE.LG_THINQ,
-          }}
-          isWidgetOrder
-        />
-      );
-    });
-    const rootElement = wrapper.root.findByProps({
-      accessibilityLabel: 'text_format',
-    });
-    expect(rootElement.props.children).toEqual('');
-  });
 });