@eohjsc/react-native-smart-city 0.3.80 → 0.3.81

package/package.json

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

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

@@ -0,0 +1,63 @@
+import React, { memo, useCallback, useState } from 'react';
+import { Switch, View } from 'react-native';
+
+import Text from '../../Text';
+import { Colors } from '../../../configs';
+import styles from './OnOffButtonTemplateStyle';
+import AccessibilityLabel from '../../../configs/AccessibilityLabel';
+
+const SwitchButtonTemplate = memo(
+  ({ isOn, triggerAction, actionGroup = {}, isLight = false, doAction }) => {
+    const [_isOn, setIsOn] = useState(isOn);
+
+    const { configuration = {}, id } = actionGroup;
+    const {
+      action_off_data,
+      action_on_data,
+      text_on,
+      text_off,
+      color_on,
+      color_off,
+    } = configuration;
+
+    const onChangeSwitch = useCallback(() => {
+      if (_isOn) {
+        setIsOn(false);
+        doAction(action_off_data, null);
+        return;
+      }
+      doAction(action_on_data, null);
+      setIsOn(true);
+    }, [action_off_data, action_on_data, doAction, _isOn]);
+
+    return (
+      <>
+        <View style={styles.barrierControlContainer}>
+          <Switch
+            trackColor={{ false: color_off, true: color_on }}
+            ios_backgroundColor={_isOn ? color_on : color_off}
+            onValueChange={onChangeSwitch}
+            value={_isOn}
+          />
+          <Text
+            style={[
+              styles.textBig,
+              { color: _isOn ? Colors.Gray8 : Colors.Gray6 },
+            ]}
+            accessibilityLabel={`${AccessibilityLabel.SENSOR_STATUS}-${id}`}
+          >
+            {_isOn ? text_on : text_off}
+          </Text>
+        </View>
+
+        {!!actionGroup.title && !isLight && (
+          <Text type="H3" semibold center>
+            {actionGroup.title}
+          </Text>
+        )}
+      </>
+    );
+  }
+);
+
+export default SwitchButtonTemplate;

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

@@ -0,0 +1,93 @@
+import React from 'react';
+import { act, create } from 'react-test-renderer';
+
+import { mockSCStore } from '../../../context/mockStore';
+import { SCProvider } from '../../../context';
+import SwitchButtonTemplate from '../OnOffTemplate/SwitchButtonTemplate';
+
+const wrapComponent = (actionGroup, mockDoAction) => (
+  <SCProvider initState={mockSCStore({})}>
+    <SwitchButtonTemplate actionGroup={actionGroup} doAction={mockDoAction} />
+  </SCProvider>
+);
+
+jest.mock('@react-navigation/native', () => {
+  return {
+    ...jest.requireActual('@react-navigation/native'),
+    useFocusEffect: jest.fn(),
+  };
+});
+
+describe('Test SwitchButtonTemplate', () => {
+  const action_on_data = {
+    color: '#00979D',
+    command_prefer_over_bluetooth: true,
+    command_prefer_over_googlehome: false,
+    command_prefer_over_internet: false,
+    googlehome_actions: [],
+    icon: 'caret-up',
+    id: 20,
+    key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
+  };
+
+  const action_off_data = {
+    color: '#00979D',
+    command_prefer_over_bluetooth: true,
+    command_prefer_over_googlehome: false,
+    command_prefer_over_internet: false,
+    googlehome_actions: [],
+    icon: 'caret-up',
+    id: 20,
+    key: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
+  };
+  const actionGroup = {
+    configuration: {
+      action_on: '5ed1d4dc-a905-47cd-b0c9-f979644bd21a',
+      action_on_data: action_on_data,
+      icon_on: 'caret-up',
+      text_on: 'ON',
+      action_off: '5ed1d4dc-a905-47cd-b0c9-f979644bd21b',
+      action_off_data: action_off_data,
+      icon_off: 'caret-up',
+      text_off: 'OFF',
+    },
+  };
+  let wrapper;
+
+  const assertRender = async () => {
+    const mockDoAction = jest.fn();
+
+    await act(async () => {
+      wrapper = create(wrapComponent(actionGroup, mockDoAction));
+    });
+
+    const renderJson = wrapper.toJSON();
+    expect(renderJson[1].props?.visible).toEqual(false);
+    expect(renderJson[1]?.type).toEqual('Modal');
+  };
+
+  it('render state on', async () => {
+    await assertRender(true, 'ON');
+  });
+
+  it('render state off', async () => {
+    await assertRender(false, 'OFF');
+  });
+
+  const assertActionCall = async (state, action_data) => {
+    const mockDoAction = jest.fn();
+    await act(async () => {
+      wrapper = create(wrapComponent(actionGroup, mockDoAction));
+    });
+
+    expect(mockDoAction).not.toHaveBeenCalled();
+  };
+
+  it('action state on', async () => {
+    await assertActionCall(true, action_off_data);
+  });
+
+  it('action state off', async () => {
+    await assertActionCall(false, action_on_data);
+  });
+});

package/src/commons/ActionGroup/index.js

@@ -13,6 +13,7 @@ import ColorPickerTemplate from './ColorPickerTemplate';
 import SliderRangeTemplate from './SliderRangeTemplate';
 import OnOffSmartLock from './OnOffSmartLock/OnOffSmartLock';
 import TwoButtonTemplate from './TwoButtonTemplate';
+import SwitchButtonTemplate from './OnOffTemplate/SwitchButtonTemplate';
 
 export const getActionComponent = (template) => {
   switch (template) {
@@ -46,6 +47,8 @@ export const getActionComponent = (template) => {
       return SliderRangeTemplate;
     case 'two_button_action_template':
       return TwoButtonTemplate;
+    case 'switch_button_action_template':
+      return SwitchButtonTemplate;
     default:
       return null;
   }

package/src/utils/Utils.js

@@ -154,7 +154,11 @@ export const notImplemented = (t) => {
 
 export const roundNumber = (value, round = 2) => {
   if (typeof value === 'string') {
-    return Math.round((isNaN(value) ? 0 : value) * 10 ** round) / 10 ** round;
+    const temp = value.split(' ');
+    return (
+      Math.round((isNaN(temp[0]) ? 0 : temp[0]) * 10 ** round) / 10 ** round +
+      ` ${temp[1] || ''}`
+    );
   }
   return value;
 };

package/src/utils/__test__/Utils.test.js

@@ -174,10 +174,10 @@ describe('Test utils', () => {
 
   it('Test roundNumber', async () => {
     let result;
-    result = await roundNumber('abc');
-    expect(result).toBe(0);
-    result = await roundNumber('123.123');
-    expect(result).toBe(123.12);
+    result = await roundNumber('NaN kwh');
+    expect(result).toBe('0 kwh');
+    result = await roundNumber('123.123 kwh');
+    expect(result).toBe('123.12 kwh');
     result = await roundNumber(12.12);
     expect(result).toBe(12.12);
   });