@eohjsc/react-native-smart-city 0.3.14 → 0.3.17

package/package.json

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

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

@@ -6,6 +6,8 @@ import { useConfigGlobalState } from '../../../iot/states';
 import OnOffButtonTemplate from './OnOffButtonTemplate';
 import OnOffSimpleTemplate from './OnOffSimpleTemplate';
 
+let temp;
+
 const getComponent = (template) => {
   switch (template) {
     case 'on_off_button_action_template': // todo refactor later with backend
@@ -20,11 +22,28 @@ const getComponent = (template) => {
 const OnOffTemplate = memo(({ actionGroup, doAction, sensor }) => {
   const { configuration } = actionGroup;
   const { action_data, action_on_data, action_off_data } = configuration;
-  const [isOn, setIsOn] = useState(null);
 
   // eslint-disable-next-line no-unused-vars
   const [configValues, _] = useConfigGlobalState('configValues');
 
+  const getIsOnValue = useCallback(() => {
+    const { is_on_value, config } = configuration;
+    const configValue = configValues[config];
+    if (is_on_value && is_on_value.length > 0) {
+      return is_on_value.includes(configValue);
+    }
+    return !!configValue;
+  }, [configValues, configuration]);
+
+  const [isOn, setIsOn] = useState(false);
+  const [tempIsOn, setTempIsOn] = useState(getIsOnValue());
+
+  const updateStatusFromPusher = () => {
+    setTimeout(() => {
+      setTempIsOn(temp);
+    }, 2500);
+  };
+
   const actionName = useCallback(
     (text) => {
       const actionNameType = `${
@@ -34,7 +53,9 @@ const OnOffTemplate = memo(({ actionGroup, doAction, sensor }) => {
     },
     [actionGroup?.title, sensor?.name]
   );
+
   const triggerAction = useCallback(async () => {
+    setTempIsOn((prev) => !prev);
     switch (sensor?.device_type) {
       case DEVICE_TYPE.ZIGBEE:
         if (action_on_data && action_off_data) {
@@ -53,6 +74,13 @@ const OnOffTemplate = memo(({ actionGroup, doAction, sensor }) => {
           }
         }
         break;
+      case DEVICE_TYPE.LG_THINQ:
+        if (action_data) {
+          await doAction(action_data, JSON.stringify({ value: !isOn }));
+        }
+
+        updateStatusFromPusher();
+        break;
       default:
         if (action_data) {
           if (isOn) {
@@ -88,19 +116,12 @@ const OnOffTemplate = memo(({ actionGroup, doAction, sensor }) => {
   ]);
 
   useEffect(() => {
-    const { is_on_value, config } = configuration;
-    const configValue = configValues[config];
-    if (is_on_value && is_on_value.length > 0) {
-      setIsOn(is_on_value.includes(configValue));
-      return;
-    }
-    setIsOn(configValue);
-  }, [
-    configuration.config,
-    configValues,
-    configuration.is_on_value,
-    configuration,
-  ]);
+    setIsOn(getIsOnValue());
+  }, [getIsOnValue]);
+
+  useEffect(() => {
+    temp = isOn;
+  }, [isOn]);
 
   useEffect(() => {
     if (sensor?.device_type === DEVICE_TYPE.LG_THINQ) {
@@ -118,7 +139,7 @@ const OnOffTemplate = memo(({ actionGroup, doAction, sensor }) => {
   return (
     <>
       <Component
-        isOn={isOn}
+        isOn={tempIsOn}
         triggerAction={triggerAction}
         actionGroup={actionGroup}
         disabled={!action_data && !action_on_data && !action_off_data}

package/src/commons/ActionGroup/TimerActionTemplate.js

@@ -90,7 +90,7 @@ const TimerActionTemplate = ({ actionGroup = {}, doAction, sensor = {} }) => {
 
   const doActionTime = useCallback(
     (hour, minute) => {
-      doAction(configuration.action_data, [hour, minute]);
+      doAction(configuration.action_data, JSON.stringify({ hour, minute }));
       if (sensor.is_managed_by_backend) {
         hour !== undefined &&
           minute !== undefined &&
@@ -113,7 +113,7 @@ const TimerActionTemplate = ({ actionGroup = {}, doAction, sensor = {} }) => {
 
   const doActionHour = useCallback(
     (hour) => {
-      doAction(configuration.action_data, hour);
+      doAction(configuration.action_data, JSON.stringify({ hour }));
       if (
         sensor.is_managed_by_backend &&
         sensor.device_type !== 'GOOGLE_HOME'

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

@@ -1,5 +1,5 @@
 /* eslint-disable promise/prefer-await-to-callbacks */
-import { TESTID } from '../../../configs/Constants';
+import { DEVICE_TYPE, TESTID } from '../../../configs/Constants';
 import { watchMultiConfigs } from '../../../iot/Monitor';
 import React from 'react';
 import { View } from 'react-native';
@@ -149,6 +149,7 @@ describe('Test OnOffTemplate', () => {
     await act(async () => {
       tree = await create(wrapComponent(actionGroup, mockDoAction, sensor));
     });
+
     const instance = tree.root;
     const template = instance.findByType(OnOffSimpleTemplate);
     expect(template.props.isOn).toEqual(true);
@@ -230,6 +231,39 @@ describe('Test OnOffTemplate', () => {
     expect(mockDoAction).toHaveBeenCalledWith(action_data, false);
   });
 
+  test('render with template OnOffSimpleActionTemplate with just action_data lg_thinq', async () => {
+    actionGroup = {
+      template: 'OnOffSimpleActionTemplate',
+      configuration: {
+        config: 5,
+        action_data: action_data,
+        icon: 'up',
+        is_on_value: [2],
+      },
+      title: 'Turn on / off',
+    };
+    const mockDoAction = jest.fn();
+    await act(async () => {
+      tree = await create(
+        wrapComponent(actionGroup, mockDoAction, {
+          device_type: DEVICE_TYPE.LG_THINQ,
+        })
+      );
+    });
+    const instance = tree.root;
+    const template = instance.findAllByType(OnOffSimpleTemplate);
+    expect(template).toHaveLength(1);
+    expect(template[0].props.disabled).toBeFalsy();
+
+    await act(async () => {
+      await template[0].props.triggerAction();
+    });
+    expect(mockDoAction).toHaveBeenCalledWith(
+      action_data,
+      JSON.stringify({ value: false })
+    );
+  });
+
   test('render with template OnOffSimpleActionTemplate disabled', async () => {
     actionGroup = {
       template: 'OnOffSimpleActionTemplate',

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

@@ -89,6 +89,9 @@ describe('Test TimerActionTemplate without config value', () => {
       await dateTimePicker.props.onConfirm();
     });
     expect(dateTimePicker.props.isVisible).toBeFalsy();
-    expect(mockDoAction).toHaveBeenCalledWith(action_data, [11, 0]);
+    expect(mockDoAction).toHaveBeenCalledWith(
+      action_data,
+      JSON.stringify({ hour: 11, minute: 0 })
+    );
   });
 });

package/src/commons/ConnectingProcess/index.js

@@ -14,6 +14,35 @@ import Connecting from '../Connecting';
 import { useSCContextSelector } from '../../context';
 import { ToastBottomHelper } from '../../utils/Utils';
 
+const ConnectingSuccess = ({
+  unit,
+  sensor,
+  station,
+  unit_name,
+  newName,
+  setNewName,
+}) => {
+  const t = useTranslations();
+  return (
+    <View style={styles.ConnectingSuccess}>
+      <ImageSuccessfully />
+      <Text bold style={styles.connectingText}>
+        {t('successfully_connected')}
+      </Text>
+      <Text size={14} style={styles.textHome}>
+        {`${unit?.name || unit_name} ${
+          station?.name !== undefined ? '- ' + station?.name : ''
+        }`}
+      </Text>
+      <DeviceItem
+        icon={sensor?.icon_kit}
+        name={newName}
+        setNewName={setNewName}
+      />
+    </View>
+  );
+};
+
 const ConnectingProcess = ({ route }) => {
   const { navigate, goBack } = useNavigation();
   const t = useTranslations();
@@ -34,7 +63,7 @@ const ConnectingProcess = ({ route }) => {
   const user = useSCContextSelector((state) => state?.auth?.account?.user);
   const [newName, setNewName] = useState('');
 
-  const ConnectingDevice = useCallback(async () => {
+  const connectingDevice = useCallback(async () => {
     setIsLoading(true);
     switch (devicePrefixName) {
       case 'SENSOR': {
@@ -106,27 +135,6 @@ const ConnectingProcess = ({ route }) => {
     unit_id,
   ]);
 
-  const ConnectingSuccess = useCallback(() => {
-    return (
-      <View style={styles.ConnectingSuccess}>
-        <ImageSuccessfully />
-        <Text bold style={styles.connectingText}>
-          {t('successfully_connected')}
-        </Text>
-        <Text size={14} style={styles.textHome}>
-          {`${unit?.name || unit_name} ${
-            station?.name !== undefined ? '- ' + station?.name : ''
-          }`}
-        </Text>
-        <DeviceItem
-          icon={sensor?.icon_kit}
-          name={newName}
-          setNewName={setNewName}
-        />
-      </View>
-    );
-  }, [newName, sensor?.icon_kit, station?.name, t, unit?.name, unit_name]);
-
   const handleDone = useCallback(async () => {
     let result, message;
     switch (devicePrefixName) {
@@ -178,8 +186,8 @@ const ConnectingProcess = ({ route }) => {
   ]);
 
   useEffect(() => {
-    ConnectingDevice();
-  }, [ConnectingDevice]);
+    connectingDevice();
+  }, [connectingDevice]);
 
   return (
     <SafeAreaView style={styles.wrap}>
@@ -188,7 +196,16 @@ const ConnectingProcess = ({ route }) => {
           {t('connect_device')}
         </Text>
         {!!isLoading && <Connecting isLoading={isLoading} />}
-        {!isLoading && <ConnectingSuccess />}
+        {!isLoading && (
+          <ConnectingSuccess
+            unit={unit}
+            sensor={sensor}
+            station={station}
+            unit_name={unit_name}
+            newName={newName}
+            setNewName={setNewName}
+          />
+        )}
       </View>
       {!isLoading && (
         <TouchableOpacity style={styles.buttonDone} onPress={handleDone}>

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

@@ -24,7 +24,7 @@ const SubUnitFavorites = ({
   const { getStatus, serverDown } = useSensorsStatus(unit, favoriteDevices);
 
   const handleOnAddNew = () => {
-    navigate(Routes.SelectDevices, {
+    navigate(Routes.SelectFavoritesDevices, {
       unitId: unit.id,
     });
   };

package/src/hooks/IoT/__test__/useRemoteControl.test.js

@@ -113,6 +113,7 @@ describe('Test useRemoteControl', () => {
       'bluetooth',
       actionName
     );
+    expect(sendCommandOverInternet).toBeCalledTimes(1);
     expect(sendCommandOverGoogleHome).not.toBeCalled();
     expect(sendCommandOverLGThinq).not.toBeCalled();
   });
@@ -190,7 +191,6 @@ describe('Test useRemoteControl', () => {
     act(() => {
       sendRemoteCommand.current(sensor, action, data, userId, actionName);
     });
-    expect(sendCommandOverLGThinq).toBeCalledWith(sensor, action, data);
     expect(sendCommandOverBluetooth).not.toBeCalled();
     expect(sendCommandOverGoogleHome).not.toBeCalled();
     expect(sendCommandOverInternet).not.toBeCalled();

package/src/hooks/IoT/useRemoteControl.js

@@ -2,7 +2,6 @@ import { useCallback } from 'react';
 import { useSCContextSelector } from '../../context';
 import { sendCommandOverGoogleHome } from '../../iot/RemoteControl/GoogleHome';
 import { sendCommandOverInternet } from '../../iot/RemoteControl/Internet';
-import { sendCommandOverLGThinq } from '../../iot/RemoteControl/LG';
 import {
   sendCommandOverBluetooth,
   SEND_COMMAND_OVER_BLUETOOTH_FAIL,
@@ -19,6 +18,7 @@ const useRemoteControl = () => {
     async (sensor, action, data, userId, actionName) => {
       // No action, raise not authorized
       let result = false;
+
       if (!action) {
         ToastBottomHelper.error(
           t('your_account_has_not_been_authorized_to_control')
@@ -30,6 +30,7 @@ const useRemoteControl = () => {
         try {
           result = await sendCommandOverBluetooth(sensor, action, data, userId);
         } catch (err) {
+          result = false;
           if (err === SEND_COMMAND_OVER_BLUETOOTH_FAIL) {
             result = await sendCommandOverInternet(
               sensor,
@@ -45,8 +46,9 @@ const useRemoteControl = () => {
       }
 
       if (
-        action.command_prefer_over_internet ||
-        action.command_prefer_over_bluetooth
+        (action.command_prefer_over_internet ||
+          action.command_prefer_over_bluetooth) &&
+        !result
       ) {
         result = await sendCommandOverInternet(
           sensor,
@@ -56,7 +58,7 @@ const useRemoteControl = () => {
         );
       }
 
-      if (action.command_prefer_over_googlehome) {
+      if (action.command_prefer_over_googlehome && !result) {
         result = await sendCommandOverGoogleHome(
           ggHomeConnections,
           sensor,
@@ -64,10 +66,6 @@ const useRemoteControl = () => {
           data
         );
       }
-
-      if (action.command_prefer_over_lg) {
-        result = await sendCommandOverLGThinq(sensor, action, data);
-      }
       return result;
     },
     [ggHomeConnections]

package/src/iot/RemoteControl/LG.js

@@ -94,17 +94,17 @@ export async function updateStateByLgThinq(device_id, data) {
   setConfigGlobalState('configValues', { ...configValues });
 }
 
-export async function fetchDeviceStatusLG(sensor) {
+export async function fetchDeviceStatusLG(endDevice) {
   // still need some delay
   setTimeout(async () => {
     const { success, data: dataStatus } = await axiosGet(
-      API.IOT.LG.DEVICE_STATUS(sensor.id),
+      API.IOT.LG.DEVICE_STATUS(endDevice.id),
       {},
       true
     );
 
     if (success) {
-      updateStateByLgThinq(sensor.lg_device_id, dataStatus);
+      updateStateByLgThinq(endDevice.lg_device_id, dataStatus);
     }
   }, 1000);
 }
@@ -128,11 +128,11 @@ export const lgThinqConnect = async (options) => {
     const option = options[i];
     for (let j = 0; j < option.lg_devices.length; j++) {
       const lgDevice = option.lg_devices[j];
-      const sensor = {
-        id: lgDevice.sensor_id,
+      const endDevice = {
+        id: lgDevice.end_device_id,
         lg_device_id: lgDevice.device_id,
       };
-      await fetchDeviceStatusLG(sensor);
+      await fetchDeviceStatusLG(endDevice);
     }
   }
 };

package/src/iot/RemoteControl/__test__/LgThinq.test.js

@@ -107,7 +107,7 @@ describe('Remote Control LG Thinq', () => {
         lg_devices: [
           {
             id: 1,
-            sensor_id: 2,
+            end_device_id: 2,
             device_id: 'DEVICE_ID',
             configs: [
               {
@@ -188,7 +188,7 @@ describe('Remote Control LG Thinq', () => {
         lg_devices: [
           {
             id: 1,
-            sensor_id: 2,
+            end_device_id: 2,
             device_id: 'DEVICE_ID',
             configs: [
               {

package/src/navigations/UnitStack.js

@@ -51,7 +51,7 @@ import EmergencySetting from '../screens/EmergencySetting';
 import ConfirmUnitDeletion from '../screens/ConfirmUnitDeletion';
 import InfoMemberUnit from '../screens/Sharing/InfoMemberUnit';
 import EnterPassword from '../screens/EnterPassword';
-import SelectDevices from '../screens/Unit/SelectDevices';
+import SelectFavoritesDevices from '../screens/Unit/SelectFavoritesDevices';
 import { HanetCameraStack } from './HanetCameraStack';
 import { axiosGet } from '../utils/Apis/axios';
 import { API } from '../configs';
@@ -402,8 +402,8 @@ export const UnitStack = memo((props) => {
         }}
       />
       <Stack.Screen
-        name={Route.SelectDevices}
-        component={SelectDevices}
+        name={Route.SelectFavoritesDevices}
+        component={SelectFavoritesDevices}
         options={{
           headerShown: false,
         }}

package/src/screens/AddNewAction/SelectAction.js

@@ -41,6 +41,7 @@ const SelectAction = memo(({ route }) => {
     isAutomateTab,
     isCreateNewAction,
     isMultiUnits,
+    oldType,
   } = route.params;
   const [data, setData] = useState([]);
   const [actions, setActions] = useState([]);
@@ -257,7 +258,7 @@ const SelectAction = memo(({ route }) => {
       navigate(Routes.ScriptDetail, {
         id: automateId,
         name: scriptName,
-        type: type,
+        type: oldType,
         havePermission: true,
         unit,
         isMultiUnits,

package/src/screens/AddNewAction/SelectSensorDevices.js

@@ -116,6 +116,7 @@ const SelectSensorDevices = memo(({ route }) => {
       isAutomateTab,
       isCreateNewAction,
       isMultiUnits,
+      oldType,
     });
   }, [
     navigate,
@@ -131,6 +132,7 @@ const SelectSensorDevices = memo(({ route }) => {
     isAutomateTab,
     isCreateNewAction,
     isMultiUnits,
+    oldType,
   ]);
 
   const onPressClose = useCallback(() => {

package/src/screens/Device/components/SensorDisplayItem.js

@@ -49,6 +49,7 @@ export const SensorDisplayItem = ({
     },
     [sensor, userId, sendRemoteCommand]
   );
+
   if (item.configuration.type === 'compass') {
     setShowWindDirection(true);
   }

package/src/screens/Unit/Detail.js

@@ -257,7 +257,6 @@ const UnitDetail = ({ route }) => {
           unit={unit}
           favoriteDevices={favoriteDevices}
           favoriteAutomates={favoriteAutomates}
-          wrapItemStyle={styles.wrapItemStyle}
         />
       );
     }

package/src/screens/Unit/{SelectDevices.js → SelectFavoritesDevices.js}

@@ -20,9 +20,9 @@ import { SCContext } from '../../context';
 import { Action } from '../../context/actionType';
 import { axiosGet, axiosPost } from '../../utils/Apis/axios';
 import { API, Colors } from '../../configs';
-import styles from './SelectDevicesStyles';
+import styles from './SelectFavoritesDevicesStyles';
 
-const SelectDevices = memo(({ route }) => {
+const SelectFavoritesDevices = memo(({ route }) => {
   const t = useTranslations();
   const { goBack } = useNavigation();
   const { unitId } = route.params;
@@ -32,7 +32,7 @@ const SelectDevices = memo(({ route }) => {
   const [indexStation, setIndexStation] = useState(0);
   const [stations, setStations] = useState([]);
   const [selectedIds, setSelectedIds] = useState([]);
-  const [loading, setLoading] = useState(false);
+  const [loading, setLoading] = useState(true);
 
   const fetchData = useCallback(async () => {
     setLoading(true);
@@ -116,7 +116,7 @@ const SelectDevices = memo(({ route }) => {
           {t('select_device')}
         </Text>
 
-        {listStation.length ? (
+        {!!listStation.length && (
           <NavBar
             listStation={listStation}
             listMenuItem={listMenuItem}
@@ -124,7 +124,8 @@ const SelectDevices = memo(({ route }) => {
             indexStation={indexStation}
             style={styles.navbar}
           />
-        ) : (
+        )}
+        {!listStation.length && !loading && (
           <View style={styles.noneData}>
             <Text center>{t('text_unit_add_to_favorites_no_devices')}</Text>
           </View>
@@ -155,4 +156,4 @@ const SelectDevices = memo(({ route }) => {
   );
 });
 
-export default SelectDevices;
+export default SelectFavoritesDevices;

package/src/screens/Unit/__test__/{SelectDevices.test.js → SelectFavoritesDevices.test.js}

@@ -4,7 +4,7 @@ import MockAdapter from 'axios-mock-adapter';
 
 import { SCProvider } from '../../../context';
 import { mockSCStore } from '../../../context/mockStore';
-import SelectDevices from '../SelectDevices';
+import SelectFavoritesDevices from '../SelectFavoritesDevices';
 import Device from '../../AddNewAction/Device';
 import BottomButtonView from '../../../commons/BottomButtonView';
 import { API } from '../../../configs';
@@ -12,7 +12,7 @@ import api from '../../../utils/Apis/axios';
 
 const wrapComponent = (route) => (
   <SCProvider initState={mockSCStore({})}>
-    <SelectDevices route={route} />
+    <SelectFavoritesDevices route={route} />
   </SCProvider>
 );
 
@@ -35,7 +35,7 @@ jest.mock('react', () => {
   };
 });
 
-describe('Test SelectDevices', () => {
+describe('Test SelectFavoritesDevices', () => {
   let tree, route;
 
   beforeAll(() => {

package/src/screens/Unit/styles.js

@@ -1,10 +1,5 @@
 import { StyleSheet } from 'react-native';
-import { Colors, Constants } from '../../configs';
-
-const marginItem = 12;
-const marginHorizontal = 16;
-const widthItem = (Constants.width - marginHorizontal * 2 - marginItem) / 2;
-const heightItem = (widthItem / 166) * 126;
+import { Colors } from '../../configs';
 
 export default StyleSheet.create({
   container: {
@@ -76,10 +71,6 @@ export default StyleSheet.create({
     margin: 0,
     padding: 0,
   },
-  wrapItemStyle: {
-    height: heightItem,
-    marginVertical: 0,
-  },
   camera: {
     width: 1,
     height: 1,

package/src/utils/Route/index.js

@@ -146,7 +146,7 @@ const Routes = {
   ItemPasscode: 'ItemPasscode',
   UnitMemberInformation: 'UnitMemberInformation',
   EnterPassword: 'EnterPassword',
-  SelectDevices: 'SelectDevices',
+  SelectFavoritesDevices: 'SelectFavoritesDevices',
 };
 
 export default Routes;