@eohjsc/react-native-smart-city 0.3.20 → 0.3.23

package/src/context/reducer.ts

@@ -63,10 +63,11 @@ export const initialState = {
   },
   iot: {
     googlehome: {
-      isFirstTimeConnect: true,
-      isConnecting: false,
       connections: {},
     },
+    internet: {
+      statuses: {},
+    },
   },
   valueEvaluations: {},
   fetchedValueEvaluationUnits: [],
@@ -235,7 +236,7 @@ export const reducer = (currentState: ContextData, action: Action) => {
           starredScriptIds: payload,
         },
       };
-    case Action.STAR_SCRIPT:
+    case Action.STAR_SCRIPTS:
       return {
         ...currentState,
         automate: {
@@ -245,13 +246,13 @@ export const reducer = (currentState: ContextData, action: Action) => {
           ),
         },
       };
-    case Action.UNSTAR_SCRIPT:
+    case Action.UNSTAR_SCRIPTS:
       return {
         ...currentState,
         automate: {
           ...currentState.automate,
           starredScriptIds: currentState.automate.starredScriptIds.filter(
-            (scriptId) => scriptId !== payload
+            (scriptId) => !payload.includes(scriptId)
           ),
         },
       };
@@ -263,8 +264,6 @@ export const reducer = (currentState: ContextData, action: Action) => {
           ...currentState.iot,
           googlehome: {
             ...currentState.iot.googlehome,
-            isFirstTimeConnect: false,
-            isConnecting: false,
             connections: payload,
           },
         },
@@ -276,8 +275,6 @@ export const reducer = (currentState: ContextData, action: Action) => {
           ...currentState.iot,
           googlehome: {
             ...currentState.iot.googlehome,
-            isFirstTimeConnect: false,
-            isConnecting: false,
             connections: {
               ...currentState.iot.googlehome.connections,
               [payload.option.chip_id]: payload.data,
@@ -285,16 +282,24 @@ export const reducer = (currentState: ContextData, action: Action) => {
           },
         },
       };
-    case Action.CONNECTING_GOOGLE_HOME:
+
+    case Action.SET_DEVICES_STATUS:
+      // eslint-disable-next-line no-case-declarations
+      let newStatuses = currentState.iot.internet.statuses;
+      (payload || []).map(
+        (i) =>
+          (newStatuses[i.id] = {
+            ...(newStatuses[i.id] || {}),
+            isConnected: i.is_connected,
+          })
+      );
       return {
         ...currentState,
         iot: {
           ...currentState.iot,
-          googlehome: {
-            ...currentState.iot.googlehome,
-            isConnecting: currentState.iot.googlehome.isFirstTimeConnect
-              ? true
-              : false,
+          internet: {
+            ...currentState.iot.internet,
+            statuses: newStatuses,
           },
         },
       };

package/src/hoc/index.js

@@ -0,0 +1,3 @@
+import withRemoteControl from './withRemoteControl';
+
+export { withRemoteControl };

package/src/hoc/withRemoteControl.js

@@ -0,0 +1,10 @@
+import { useRemoteControl } from '../hooks/IoT';
+
+function withRemoteControl(Component) {
+  return function WrappedComponent(props) {
+    const sendRemoteCommand = useRemoteControl();
+    return <Component {...props} sendRemoteCommand={sendRemoteCommand} />;
+  };
+}
+
+export default withRemoteControl;

package/src/hooks/Common/index.js

@@ -4,7 +4,7 @@ import useForceUpdate from './useForceUpdate';
 import useKeyboardShow from './useKeyboardShow';
 import usePopover from './usePopover';
 import useTitleHeader from './useTitleHeader';
-import useSensorsStatus from './useSensorsStatus';
+import useDevicesStatus from './useDevicesStatus';
 import useGGHomeDeviceConnected from './useGGHomeDeviceConnected';
 import { useBlockBackAndroid } from './useBlockBackAndroid';
 import { useIsOwnerOfUnit } from './useIsOwnerOfUnit';
@@ -22,6 +22,6 @@ export {
   useIsOwnerOfUnit,
   useStatusBar,
   useGetIdUser,
-  useSensorsStatus,
+  useDevicesStatus,
   useGGHomeDeviceConnected,
 };

package/src/hooks/Common/useDevicesStatus.js

@@ -0,0 +1,57 @@
+import { useCallback, useContext } from 'react';
+import { useFocusEffect } from '@react-navigation/native';
+import { SCContext, useSCContextSelector } from '../../context';
+import { axiosGet } from '../../utils/Apis/axios';
+import { API } from '../../configs';
+import { Action } from '../../context/actionType';
+
+let timeoutId;
+
+const useDevicesStatus = (unit, devices) => {
+  const { setAction } = useContext(SCContext);
+  const isNetworkConnected = useSCContextSelector(
+    (state) => state.app.isNetworkConnected
+  );
+
+  const getDevicesStatus = useCallback(async (_unit, _devices) => {
+    const params = new URLSearchParams();
+    _devices.forEach((device) => {
+      params.append('sensors', device.id);
+    });
+    const { success, data } = await axiosGet(
+      API.UNIT.SENSORS_STATUS(_unit.id),
+      {
+        params: params,
+      }
+    );
+    if (success) {
+      setAction(Action.SET_DEVICES_STATUS, data);
+    }
+    timeoutId = setTimeout(() => getDevicesStatus(_unit, _devices), 5000);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  useFocusEffect(
+    useCallback(() => {
+      if (!devices?.length || !isNetworkConnected) {
+        return;
+      }
+
+      const managedDevices = devices.filter(
+        (device) => device?.is_managed_by_backend
+      );
+      if (!managedDevices.length) {
+        return;
+      }
+
+      timeoutId = setTimeout(() => getDevicesStatus(unit, managedDevices), 200);
+
+      return () => {
+        clearTimeout(timeoutId);
+      };
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [unit, devices, isNetworkConnected])
+  );
+};
+
+export default useDevicesStatus;

package/src/hooks/Common/useGGHomeDeviceConnected.js

@@ -1,9 +1,9 @@
 import { useSCContextSelector } from '../../context';
 
 const useGGHomeDeviceConnected = (device) => {
-  const { connections, isConnecting } = useSCContextSelector(
-    (state) => state.iot.googlehome
-  );
+  const { connections } = useSCContextSelector((state) => state.iot.googlehome);
+
+  const isConnecting = !!device?.chip_id && !(device.chip_id in connections);
 
   const isConnected =
     !!device?.chip_id &&

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

@@ -167,8 +167,7 @@ describe('Test useGGHomeConnection', () => {
     await act(async () => {
       await result.current.connectGoogleHome(options);
     });
-    expect(mockedSetAction).toBeCalledTimes(3);
-    expect(mockedSetAction).toBeCalledWith(Action.CONNECTING_GOOGLE_HOME);
+    expect(mockedSetAction).toBeCalledTimes(2);
     expect(mockedSetAction).toBeCalledWith(
       Action.SET_GOOGLE_HOME_CONNECTIONS,
       conns

package/src/hooks/IoT/index.js

@@ -1,5 +1,13 @@
 import useGGHomeConnection from './useGGHomeConnection';
 import useRemoteControl from './useRemoteControl';
 import useValueEvaluations from './useValueEvaluation';
+import useWatchConfigs from './useWatchConfigs';
+import useUnwatchLGDeviceConfigControl from './useUnwatchLGDeviceConfigControl';
 
-export { useGGHomeConnection, useRemoteControl, useValueEvaluations };
+export {
+  useGGHomeConnection,
+  useRemoteControl,
+  useValueEvaluations,
+  useWatchConfigs,
+  useUnwatchLGDeviceConfigControl,
+};

package/src/hooks/IoT/useGGHomeConnection.js

@@ -63,7 +63,6 @@ const useGGHomeConnection = () => {
 
   const connectGoogleHome = useCallback(
     async (options) => {
-      setAction(Action.CONNECTING_GOOGLE_HOME);
       await googleHomeConnect(
         connections,
         options,

package/src/hooks/IoT/useUnwatchLGDeviceConfigControl.js

@@ -0,0 +1,29 @@
+import { useCallback } from 'react';
+import { useFocusEffect } from '@react-navigation/native';
+import { unwatchMultiConfigs } from '../../iot/Monitor';
+import { DEVICE_TYPE } from '../../configs/Constants';
+
+const useUnwatchLGDeviceConfigControl = (device, configs) => {
+  const unwatch = useCallback(
+    (_configs) => {
+      if (
+        device?.is_managed_by_backend &&
+        device?.device_type === DEVICE_TYPE.LG_THINQ
+      ) {
+        unwatchMultiConfigs(configs.map((config) => config));
+      }
+    },
+    [device, configs]
+  );
+
+  useFocusEffect(
+    useCallback(() => {
+      return () => {
+        unwatch();
+      };
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [])
+  );
+};
+
+export default useUnwatchLGDeviceConfigControl;

package/src/hooks/IoT/useValueEvaluation.js

@@ -1,4 +1,4 @@
-import { useCallback, useContext, useEffect } from 'react';
+import { useCallback, useContext, useEffect, useState } from 'react';
 import { API } from '../../configs';
 import { SCContext, useSCContextSelector } from '../../context';
 import { Action } from '../../context/actionType';
@@ -6,12 +6,14 @@ import { axiosGet } from '../../utils/Apis/axios';
 
 const useValueEvaluations = (unitId) => {
   const { setAction } = useContext(SCContext);
+  const [fetching, setFetching] = useState(false);
 
   const fetchConfigValueEvaluations = useCallback(
     async (page = 1) => {
       if (!unitId) {
         return;
       }
+      setFetching(true);
       const params = new URLSearchParams();
       params.append('config__end_device__station__unit', unitId);
       params.append('page', page);
@@ -24,9 +26,15 @@ const useValueEvaluations = (unitId) => {
           data: data.results,
         });
         if (data.next) {
-          await fetchConfigValueEvaluations(page + 1);
+          return await fetchConfigValueEvaluations(page + 1);
         }
+      } else {
+        setAction(Action.UPDATE_VALUE_EVALUATIONS, {
+          unitId,
+          data: [],
+        });
       }
+      setFetching(false);
     },
     [unitId, setAction]
   );
@@ -36,10 +44,15 @@ const useValueEvaluations = (unitId) => {
   });
 
   useEffect(() => {
-    if (!(fetchedValueEvaluationUnits.indexOf(unitId) !== -1)) {
+    if (!fetching && !(fetchedValueEvaluationUnits.indexOf(unitId) !== -1)) {
       fetchConfigValueEvaluations();
     }
-  }, [unitId, fetchConfigValueEvaluations, fetchedValueEvaluationUnits]);
+  }, [
+    unitId,
+    fetching,
+    fetchConfigValueEvaluations,
+    fetchedValueEvaluationUnits,
+  ]);
 };
 
 export default useValueEvaluations;

package/src/hooks/IoT/useWatchConfigs.js

@@ -0,0 +1,34 @@
+import { useCallback } from 'react';
+import { useFocusEffect } from '@react-navigation/native';
+import { useSCContextSelector } from '../../context';
+import { watchMultiConfigs, unwatchMultiConfigs } from '../../iot/Monitor';
+import { SCConfig } from '../../configs';
+
+let intervalId;
+
+const useWatchConfigs = (configIds) => {
+  const isNetworkConnected = useSCContextSelector(
+    (state) => state.app.isNetworkConnected
+  );
+
+  useFocusEffect(
+    useCallback(() => {
+      if (!configIds.length || !isNetworkConnected) {
+        return;
+      }
+
+      watchMultiConfigs(configIds);
+      clearInterval(intervalId);
+      intervalId = setInterval(() => {
+        watchMultiConfigs(configIds);
+      }, SCConfig.intervalWatchConfigTime);
+
+      return () => {
+        unwatchMultiConfigs(configIds);
+        clearInterval(intervalId);
+      };
+    }, [configIds, isNetworkConnected])
+  );
+};
+
+export default useWatchConfigs;

package/src/iot/Monitor.js

@@ -2,8 +2,10 @@ import { API } from '../configs';
 import { getConfigGlobalState, setConfigGlobalState } from './states';
 import _ from 'lodash';
 import Pusher from 'pusher-js/react-native';
+import PusherBatchAuthorizer from 'pusher-js-auth';
 import { axiosPost } from '../utils/Apis/axios';
 import { SCConfig } from '../configs';
+import api from '../utils/Apis/axios';
 
 Pusher.logToConsole = true;
 let pusher = null;
@@ -12,23 +14,14 @@ const getPusher = () => {
   if (!pusher) {
     pusher = new Pusher(SCConfig.pusherAppKey, {
       cluster: 'ap1',
-      authorizer: function (channel, option) {
-        return {
-          // eslint-disable-next-line promise/prefer-await-to-callbacks
-          authorize: async function (socketId, callback) {
-            const { success, data } = await axiosPost(
-              API.IOT.CHIP_MANAGER.PUSHER_AUTH(),
-              {
-                channel_name: channel.name,
-                socket_id: socketId,
-              }
-            );
-            if (success) {
-              // eslint-disable-next-line promise/prefer-await-to-callbacks
-              callback(null, data);
-            }
-          },
-        };
+      authorizer: PusherBatchAuthorizer,
+      authEndpoint: SCConfig.apiRoot + API.IOT.CHIP_MANAGER.PUSHER_AUTH(),
+      authDelay: 300,
+      auth: {
+        headers: {
+          Accept: 'application/json',
+          Authorization: api.headers.Authorization,
+        },
       },
     });
   }
@@ -55,7 +48,7 @@ const watchConfig = (configId) => {
     return;
   }
   watchingConfigs[configId] = 1;
-  const channel = getPusher().subscribe(`private-config-${configId}`);
+  const channel = getPusher().subscribe(`private-config_v2-${configId}`);
   channel.bind('new-value', updateGlobalValue.bind(channel, configId));
 };
 
@@ -66,7 +59,7 @@ const unwatchConfig = (configId) => {
   watchingConfigs[configId] -= 1;
   if (!watchingConfigs[configId]) {
     delete watchingConfigs[configId];
-    getPusher().unsubscribe(`private-config-${configId}`);
+    getPusher().unsubscribe(`private-config_v2-${configId}`);
     if (_.isEmpty(watchingConfigs)) {
       destroyPusher();
     }
@@ -84,7 +77,7 @@ export const watchMultiConfigs = async (configIds) => {
       waitWatchConfigIds = [];
       clearTimeout(waitWatchConfigTimerId);
       waitWatchConfigTimerId = 0;
-    }, 100);
+    }, 200);
   }
 };
 

package/src/iot/RemoteControl/GoogleHome.js

@@ -48,10 +48,9 @@ async function stateChangeCallback(event) {
     isChanged = true;
     const [configId, type] = configMaps[entityId];
     const typeConverter = valueTypes[type] || keepValue;
-    configValues[configId] = typeConverter(
-      event.data.new_state.state,
-      entityId
-    );
+    configValues[configId] = {
+      value: typeConverter(event.data.new_state.state, entityId),
+    };
   }
 
   if (entityId in attributeMaps) {
@@ -66,10 +65,9 @@ async function stateChangeCallback(event) {
 
       const [configId, type] = attributeMap;
       const typeConverter = valueTypes[type] || keepValue;
-      configValues[configId] = typeConverter(
-        entity.attributes[attributeName],
-        entityId
-      );
+      configValues[configId] = {
+        value: typeConverter(entity.attributes[attributeName], entityId),
+      };
     }
   }
 
@@ -91,7 +89,9 @@ async function fetchConnectionEntities(connection) {
       const [configId, type] = configMaps[entityId];
       const typeConverter = valueTypes[type] || keepValue;
 
-      configValues[configId] = typeConverter(entity.state, entityId);
+      configValues[configId] = {
+        value: typeConverter(entity.state, entityId),
+      };
     }
 
     if (Object.prototype.hasOwnProperty.call(attributeMaps, entityId)) {
@@ -105,10 +105,9 @@ async function fetchConnectionEntities(connection) {
 
         const [configId, type] = attributeMap;
         const typeConverter = valueTypes[type] || keepValue;
-        configValues[configId] = typeConverter(
-          entity.attributes[attributeName],
-          entityId
-        );
+        configValues[configId] = {
+          value: typeConverter(entity.attributes[attributeName], entityId),
+        };
       }
     }
   }

package/src/iot/RemoteControl/LG.js

@@ -3,6 +3,7 @@ import { axiosGet } from '../../utils/Apis/axios';
 import { getConfigGlobalState, setConfigGlobalState } from '../states';
 import { sendCommandOverInternet } from './Internet';
 
+// TODO update show config name of camelCase and snakeCase
 let deviceMaps = {};
 const propertyListMaps = {
   temperature: 'targetTemperature',

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

@@ -122,7 +122,12 @@ describe('Remote Control Google Home', () => {
     expect(getStates).toBeCalledTimes(1);
 
     configValues = getConfigGlobalState('configValues');
-    expect(configValues).toEqual({ 1: true, 2: 50, 3: 10, 4: 123.4 });
+    expect(configValues).toEqual({
+      1: { value: true },
+      2: { value: 50 },
+      3: { value: 10 },
+      4: { value: 123.4 },
+    });
   });
 
   it('When state change, global config value also change', async () => {
@@ -162,7 +167,7 @@ describe('Remote Control Google Home', () => {
     );
 
     configValues = getConfigGlobalState('configValues');
-    expect(configValues).toEqual({ 1: true });
+    expect(configValues).toEqual({ 1: { value: true } });
   });
 
   it('Connect to same google home will be skipped', async () => {

package/src/navigations/UnitStack.js

@@ -4,10 +4,12 @@ import { IconOutline } from '@ant-design/icons-react-native';
 import { createStackNavigator } from '@react-navigation/stack';
 import { BleManager } from 'react-native-ble-plx';
 import NetInfo from '@react-native-community/netinfo';
+import { AppState } from 'react-native';
 import { get } from 'lodash';
 
 import Text from '../commons/Text';
 import { useTranslations } from '../hooks/Common/useTranslations';
+import { unwatchAllConfigs } from '../iot/Monitor';
 import { Colors, Device } from '../configs';
 import Route from '../utils/Route';
 import ActivityLogScreen from '../screens/ActivityLog';
@@ -51,7 +53,7 @@ import EmergencySetting from '../screens/EmergencySetting';
 import ConfirmUnitDeletion from '../screens/ConfirmUnitDeletion';
 import InfoMemberUnit from '../screens/Sharing/InfoMemberUnit';
 import EnterPassword from '../screens/EnterPassword';
-import SelectFavoritesDevices from '../screens/Unit/SelectFavoritesDevices';
+import SelectAddToFavorites from '../screens/Unit/SelectAddToFavorites';
 import { HanetCameraStack } from './HanetCameraStack';
 import { axiosGet } from '../utils/Apis/axios';
 import { API } from '../configs';
@@ -107,6 +109,17 @@ export const UnitStack = memo((props) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
+  useEffect(() => {
+    const subscription = AppState.addEventListener('change', (nextAppState) => {
+      if (nextAppState === 'background') {
+        unwatchAllConfigs();
+      }
+    });
+    return () => {
+      subscription?.remove();
+    };
+  }, []);
+
   return (
     <Stack.Navigator
       screenOptions={{
@@ -402,8 +415,8 @@ export const UnitStack = memo((props) => {
         }}
       />
       <Stack.Screen
-        name={Route.SelectFavoritesDevices}
-        component={SelectFavoritesDevices}
+        name={Route.SelectAddToFavorites}
+        component={SelectAddToFavorites}
         options={{
           headerShown: false,
         }}

package/src/screens/AddNewAction/SelectAction.js

@@ -349,7 +349,7 @@ const SelectAction = memo(({ route }) => {
             <LoadingSelectAction style={styles.container} />
           ) : (
             sensorData.map((item) => {
-              const isHasValue = !!item?.value || item?.value === 0;
+              const isHasValue = !!item?.value;
               return (
                 <View style={styles.wrapItem} key={item?.id}>
                   <TitleCheckBox

package/src/screens/AddNewAction/SetupSensor.js

@@ -149,6 +149,10 @@ const SetUpSensor = () => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [minimum, maximum, value]);
 
+  useEffect(() => {
+    !isNumberValue && setValue(1);
+  }, [isNumberValue]);
+
   useEffect(() => {
     if (!isHasLimit && maximum - 150 <= value * 10) {
       setMaximum(maximum + 200);