@eohjsc/react-native-smart-city 0.3.38 → 0.3.40

package/package.json

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

package/src/commons/AlertAction/index.js

@@ -39,7 +39,11 @@ const AlertAction = ({
       <Animated.View style={[styles.popoverStyle, animatedStyle]}>
         <View style={styles.modalWrapper}>
           <View style={styles.modalHeader}>
-            <Text semibold style={styles.modalHeaderText}>
+            <Text
+              semibold
+              style={styles.modalHeaderText}
+              accessibilityLabel={`${accessibilityLabelPrefix}_TITLE`}
+            >
               {title}
             </Text>
           </View>

package/src/commons/Device/ItemDevice.js

@@ -11,9 +11,11 @@ import { useNavigation } from '@react-navigation/native';
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import ItemQuickAction from '../../commons/Action/ItemQuickAction';
 import Text from '../../commons/Text';
-import { isDeviceConnected as isBluetoothDeviceConnected } from '../../iot/RemoteControl/Bluetooth';
-import { useSCContextSelector } from '../../context';
-import { useHomeAssistantDeviceConnected } from '../../hooks/Common';
+import {
+  useHomeAssistantDeviceConnected,
+  useBluetoothDeviceConnected,
+  useEoHBackendDeviceConnected,
+} from '../../hooks/IoT';
 
 import { Colors } from '../../configs';
 import {
@@ -27,20 +29,20 @@ const ItemDevice = memo(
   ({ svgMain, description, title, sensor, unit, station, wrapStyle }) => {
     const t = useTranslations();
     const navigation = useNavigation();
-    const isBluetoothEnabled = useSCContextSelector(
-      (state) => state.app.isBluetoothEnabled
-    );
-    const isNetworkConnected = useSCContextSelector(
-      (state) => state.app.isNetworkConnected
-    );
-    const statuses = useSCContextSelector(
-      (state) => state.iot.internet.statuses
-    );
+
+    const {
+      isConnected: isEoHBackendConnected,
+      isFetchingStatus: isFetchingStatusFromEoHBackend,
+    } = useEoHBackendDeviceConnected(sensor);
+
     const {
       isConnected: isHomeAssistantConnected,
       isConnecting: isHomeAssistantConnecting,
     } = useHomeAssistantDeviceConnected(sensor);
 
+    const { isConnected: isBluetoothConnected } =
+      useBluetoothDeviceConnected(sensor);
+
     const goToSensorDisplay = useCallback(() => {
       navigation.navigate(Routes.DeviceDetail, {
         unitData: unit,
@@ -50,30 +52,15 @@ const ItemDevice = memo(
       });
     }, [navigation, sensor, station, title, unit]);
 
-    const isConnectedViaInternet =
-      isNetworkConnected &&
-      !!sensor &&
-      sensor.id in statuses &&
-      statuses[sensor.id]?.isConnected;
-
-    const isFetchingStatus =
-      isNetworkConnected && !!sensor && !(sensor.id in statuses);
-
-    const isConnectedViaBLE =
-      isBluetoothEnabled &&
-      isBluetoothDeviceConnected(
-        sensor?.remote_control_options?.bluetooth?.address
-      );
-
     const borderColor = (() => {
       if (!!sensor && sensor?.is_managed_by_backend) {
         if (sensor?.device_type === DEVICE_TYPE.LG_THINQ) {
           return Colors.Gray4;
         }
-        if (isConnectedViaBLE) {
+        if (isBluetoothConnected) {
           return Colors.Gray4;
         }
-        if (isFetchingStatus || isConnectedViaInternet) {
+        if (isFetchingStatusFromEoHBackend || isEoHBackendConnected) {
           return Colors.Gray4;
         }
         return Colors.Red6;
@@ -92,13 +79,13 @@ const ItemDevice = memo(
         if (sensor?.device_type === DEVICE_TYPE.LG_THINQ) {
           return t('connected');
         }
-        if (isConnectedViaBLE) {
+        if (isBluetoothConnected) {
           return t('connected');
         }
-        if (isFetchingStatus) {
+        if (isFetchingStatusFromEoHBackend) {
           return '';
         }
-        if (isConnectedViaInternet) {
+        if (isEoHBackendConnected) {
           return t('connected');
         }
         return t('disconnected');
@@ -120,10 +107,10 @@ const ItemDevice = memo(
         if (sensor?.device_type === DEVICE_TYPE.LG_THINQ) {
           return true;
         }
-        if (isConnectedViaBLE) {
+        if (isBluetoothConnected) {
           return true;
         }
-        if (isFetchingStatus) {
+        if (isFetchingStatusFromEoHBackend) {
           return false;
         }
         return true;

package/src/commons/Form/TextInput.js

@@ -29,6 +29,7 @@ const _TextInput = ({
   accessibilityLabel,
   selection,
   onSelectionChange,
+  accessibilityLabelError,
 }) => {
   const errorStyle = !!errorText && styles.errorWrap;
   return (
@@ -70,7 +71,14 @@ const _TextInput = ({
         onSelectionChange={onSelectionChange}
       />
       {extraText && extraText}
-      {!!errorText && <Text style={styles.errorText}>{errorText}</Text>}
+      {!!errorText && (
+        <Text
+          accessibilityLabel={accessibilityLabelError}
+          style={styles.errorText}
+        >
+          {errorText}
+        </Text>
+      )}
     </View>
   );
 };

package/src/commons/StatusBox/index.js

@@ -0,0 +1,19 @@
+import React, { memo } from 'react';
+import { View } from 'react-native';
+
+import Text from '../Text';
+import styles from './styles';
+import { useTranslations } from '../../hooks/Common/useTranslations';
+
+const StatusBox = ({ status }) => {
+  const t = useTranslations();
+  return (
+    <View style={[styles.viewStatus, status && styles.viewOnline]}>
+      <Text style={[styles.textStatus, status && styles.textOnline]}>
+        {t(status ? 'online' : 'offline')}
+      </Text>
+    </View>
+  );
+};
+
+export default memo(StatusBox);

package/src/commons/StatusBox/styles.js

@@ -0,0 +1,30 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from '../../configs';
+
+export default StyleSheet.create({
+  viewStatus: {
+    width: 65,
+    paddingHorizontal: 8,
+    paddingVertical: 4,
+    borderRadius: 54,
+    backgroundColor: Colors.White,
+    borderColor: Colors.Neutral.Neutral3,
+    borderWidth: 1,
+  },
+  textStatus: {
+    fontStyle: 'normal',
+    fontWeight: 600,
+    letterSpacing: 0.04,
+    fontSize: 12,
+    lineHeight: 16,
+    textTransform: 'uppercase',
+    textAlign: 'center',
+  },
+  textOnline: {
+    fontStyle: 'bold',
+  },
+  viewOnline: {
+    backgroundColor: Colors.LightGreen,
+    borderWidth: 0,
+  },
+});

package/src/commons/WrapParallaxScrollView/index.js

@@ -37,7 +37,12 @@ const WrapParallaxScrollView = ({
           hideRightPlus={hideRightPlus}
           idButtonMore={idButtonMore}
         />
-        <Text numberOfLines={1} semibold style={styles.nameUnit}>
+        <Text
+          numberOfLines={1}
+          semibold
+          style={styles.nameUnit}
+          accessibilityLabel={AccessibilityLabel.HEADER_UNIT_BUTTON_TEXT}
+        >
           {title}
         </Text>
         {contentBackground}

package/src/commons/index.js

@@ -16,7 +16,10 @@ import RadioCircle from './RadioCircle';
 import { CircleButton } from './CircleButton';
 import HorizontalPicker from './HorizontalPicker';
 import FullLoading from './FullLoading';
-
+import Text from './Text';
+import { HeaderCustom } from './Header';
+import StatusBox from './StatusBox';
+import WrapHeaderScrollable from './Sharing/WrapHeaderScrollable';
 export {
   ButtonPopup,
   CircleView,
@@ -36,4 +39,8 @@ export {
   CircleButton,
   HorizontalPicker,
   FullLoading,
+  Text,
+  HeaderCustom,
+  StatusBox,
+  WrapHeaderScrollable,
 };

package/src/configs/API.js

@@ -211,6 +211,10 @@ const API = {
     GET_TEMPLATES: '/property_manager/iot_dashboard/dev_mode/templates/',
     GET_WIDGETS: (templateId) =>
       `/property_manager/iot_dashboard/dev_mode/templates/${templateId}/list_widgets/`,
+    GATEWAY: {
+      LIST: () => '/chip_manager/developer_mode_chips/',
+      DETAIL: (id) => `/chip_manager/developer_mode_chips/${id}/`,
+    },
   },
 };
 

package/src/configs/AccessibilityLabel.js

@@ -43,6 +43,8 @@ export default {
 
   // ConfirmUnitDeletion
   CONFIRM_UNIT_DELETION_BUTTON: 'CONFIRM_UNIT_DELETION_BUTTON',
+  CONFIRM_UNIT_DELETION_CONFIRM_FIELD: 'CONFIRM_UNIT_DELETION_CONFIRM_FIELD',
+  CONFIRM_UNIT_DELETION_CONFIRM_ERROR: 'CONFIRM_UNIT_DELETION_CONFIRM_ERROR',
 
   //member list
   SHARING_MEMBER: 'SHARING_MEMBER',
@@ -252,6 +254,8 @@ export default {
   EMERGENCY_BUTTON: 'EMERGENCY_BUTTON',
 
   // ADD SUB UNIT
+  ADD_SUB_UNIT_SCREEN: 'ADD_SUB_UNIT_SCREEN',
+  ADD_SUB_UNIT_NAME_FIELD: 'ADD_SUB_UNIT_NAME_FIELD',
   ADD_SUB_UNIT_BUTTON_CHOOSE_PHOTO: 'ADD_SUB_UNIT_BUTTON_CHOOSE_PHOTO',
   ADD_SUB_UNIT_BUTTON_CHOOSE_LOCATION: 'ADD_SUB_UNIT_BUTTON_CHOOSE_LOCATION',
 
@@ -440,6 +444,7 @@ export default {
 
   // Header Unit
   HEADER_UNIT_BUTTON_BACK: 'HEADER_UNIT_BUTTON_BACK',
+  HEADER_UNIT_BUTTON_TEXT: 'HEADER_UNIT_BUTTON_TEXT',
   HEADER_UNIT_BUTTON_ADD: 'HEADER_UNIT_BUTTON_ADD',
   HEADER_UNIT_BUTTON_MORE: 'HEADER_UNIT_BUTTON_MORE',
 
@@ -633,7 +638,8 @@ export default {
   BUTTON_CANCEL_EDIT_ACTION_LIST: 'BUTTON_CANCEL_EDIT_ACTION_LIST',
   BUTTON_SAVE_EDIT_ACTION_LIST: 'BUTTON_SAVE_EDIT_ACTION_LIST',
   BUTTON_REMOVE_EDIT_ACTION_LIST: 'BUTTON_REMOVE_EDIT_ACTION_LIST',
-
+  // GATEWAY
+  LIST_GATEWAY: 'LIST_GATEWAY',
   //Notification
   CUSTOM_TEXT: 'CUSTOM_TEXT',
   //ButtonWrapper

package/src/configs/Colors.js

@@ -60,6 +60,7 @@ export const Colors = {
   Gray17: '#D3D3D3',
   Gray18: '#9B9A9B',
   Gray19: '#E5E5E5',
+  Gray20: '#808080',
 
   // Range Green
   Green1: '#F6FFED',

package/src/context/actionType.ts

@@ -17,6 +17,7 @@ export const Action = {
   SET_STARRED_SCRIPTS: 'SET_STARRED_SCRIPTS',
   STAR_SCRIPTS: 'STAR_SCRIPTS',
   UNSTAR_SCRIPTS: 'UNSTAR_SCRIPTS',
+  SET_BLUETOOTH_CONNECTED_DEVICE: 'SET_BLUETOOTH_CONNECTED_DEVICE',
   SET_HOME_ASSISTANT_CONNECTIONS: 'SET_HOME_ASSISTANT_CONNECTIONS',
   CHANGE_HOME_ASSISTANT_CONN_STATE: 'CHANGE_HOME_ASSISTANT_CONN_STATE',
   SET_LG_THINQ_CONNECTED: 'SET_LG_THINQ_CONNECTED',
@@ -95,6 +96,9 @@ export type AppType = {
 };
 
 export type IoTType = {
+  bluetooth: {
+    connectedDevices: {};
+  };
   homeassistant: {
     connections: {};
   };

package/src/context/mockStore.ts

@@ -41,6 +41,9 @@ export const mockDataStore: ContextData = {
     isLockWhenPickColor: false,
   },
   iot: {
+    bluetooth: {
+      connectedDevices: {},
+    },
     homeassistant: {
       connections: {},
     },

package/src/context/reducer.ts

@@ -68,6 +68,9 @@ export const initialState = {
     isLockWhenPickColor: false,
   },
   iot: {
+    bluetooth: {
+      connectedDevices: {},
+    },
     homeassistant: {
       connections: {},
     },
@@ -291,6 +294,20 @@ export const reducer = (currentState: ContextData, action: Action) => {
         },
       };
 
+    case Action.SET_BLUETOOTH_CONNECTED_DEVICE:
+      return {
+        ...currentState,
+        iot: {
+          ...currentState.iot,
+          bluetooth: {
+            ...currentState.iot.bluetooth,
+            connectedDevices: {
+              ...currentState.iot.bluetooth.connectedDevices,
+              [payload.name]: payload.device,
+            },
+          },
+        },
+      };
     case Action.SET_HOME_ASSISTANT_CONNECTIONS:
       return {
         ...currentState,

package/src/hooks/Common/index.js

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

package/src/hooks/Common/useDevicesStatus.js

@@ -1,6 +1,5 @@
-import { useCallback, useContext } from 'react';
-import { InteractionManager } from 'react-native';
-import { useFocusEffect } from '@react-navigation/native';
+import { useCallback, useContext, useEffect } from 'react';
+import { useIsFocused } from '@react-navigation/native';
 import { SCContext, useSCContextSelector } from '../../context';
 import { axiosGet } from '../../utils/Apis/axios';
 import { API } from '../../configs';
@@ -13,8 +12,13 @@ const useDevicesStatus = (unit, devices) => {
   const isNetworkConnected = useSCContextSelector(
     (state) => state.app.isNetworkConnected
   );
+  const isFocused = useIsFocused();
 
   const getDevicesStatus = useCallback(async (_unit, _devices) => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
+      timeoutId = 0;
+    }
     const params = new URLSearchParams();
     _devices.forEach((device) => {
       params.append('sensors', device.id);
@@ -30,32 +34,26 @@ const useDevicesStatus = (unit, devices) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  useFocusEffect(
-    useCallback(() => {
-      const task = InteractionManager.runAfterInteractions(() => {
-        if (!devices?.length || !isNetworkConnected) {
-          return;
-        }
+  useEffect(() => {
+    if (!isFocused) {
+      return;
+    }
+    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);
-        task.cancel();
-      };
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [unit, devices, isNetworkConnected])
-  );
+    const managedDevices = devices.filter(
+      (device) => device?.is_managed_by_backend
+    );
+    if (!managedDevices.length) {
+      return;
+    }
+    getDevicesStatus(unit, devices);
+    return () => {
+      clearTimeout(timeoutId);
+      timeoutId = 0;
+    };
+  }, [getDevicesStatus, unit, devices, isNetworkConnected, isFocused]);
 };
 
 export default useDevicesStatus;

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

@@ -88,6 +88,8 @@ describe('Test useRemoteControl', () => {
   });
 
   it('test send remote command via bluetooth failed then send via internet', async () => {
+    action.command_prefer_over_bluetooth = true;
+    action.command_prefer_over_internet = true;
     const { result: sendRemoteCommand } = renderHook(() => useRemoteControl(), {
       wrapper,
     });
@@ -156,6 +158,7 @@ describe('Test useRemoteControl', () => {
       data,
       'internet'
     );
+    expect(sendCommandOverInternet).toBeCalledTimes(1);
     expect(sendCommandOverBluetooth).not.toBeCalled();
     expect(sendCommandOverHomeAssistant).not.toBeCalled();
     expect(sendCommandOverLGThinq).not.toBeCalled();

package/src/hooks/IoT/index.js

@@ -1,13 +1,21 @@
+import useBluetoothConnection from './useBluetoothConnection';
 import useHomeAssistantConnection from './useHomeAssistantConnection';
 import useRemoteControl from './useRemoteControl';
 import useValueEvaluations from './useValueEvaluation';
 import useWatchConfigs from './useWatchConfigs';
 import useUnwatchLGDeviceConfigControl from './useUnwatchLGDeviceConfigControl';
+import useHomeAssistantDeviceConnected from './useHomeAssistantDeviceConnected';
+import useBluetoothDeviceConnected from './useBluetoothDeviceConnected';
+import useEoHBackendDeviceConnected from './useEoHBackendDeviceConnected';
 
 export {
+  useBluetoothConnection,
   useHomeAssistantConnection,
   useRemoteControl,
   useValueEvaluations,
   useWatchConfigs,
   useUnwatchLGDeviceConfigControl,
+  useHomeAssistantDeviceConnected,
+  useBluetoothDeviceConnected,
+  useEoHBackendDeviceConnected,
 };

package/src/hooks/IoT/useBluetoothConnection.js

@@ -0,0 +1,27 @@
+import { useContext, useCallback } from 'react';
+import { SCContext } from '../../context';
+import { Action } from '../../context/actionType';
+import { scanBluetoothDevices } from '../../iot/RemoteControl/Bluetooth';
+
+const useBluetoothConnection = () => {
+  const { setAction } = useContext(SCContext);
+
+  const onDeviceFound = useCallback(async (name, device) => {
+    setAction(Action.SET_BLUETOOTH_CONNECTED_DEVICE, { name, device });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  const bluetoothScanDevices = useCallback(
+    (addresses) => {
+      scanBluetoothDevices(addresses, onDeviceFound);
+    },
+    [onDeviceFound]
+  );
+
+  return {
+    onDeviceFound,
+    bluetoothScanDevices,
+  };
+};
+
+export default useBluetoothConnection;

package/src/hooks/IoT/useBluetoothDeviceConnected.js

@@ -0,0 +1,18 @@
+import { useSCContextSelector } from '../../context';
+
+const useBluetoothDeviceConnected = (device) => {
+  const connectedDevices = useSCContextSelector(
+    (state) => state.iot.bluetooth.connectedDevices
+  );
+  const isBluetoothEnabled = useSCContextSelector((state) => {
+    return state.app.isBluetoothEnabled;
+  });
+
+  const isConnected =
+    isBluetoothEnabled &&
+    !!connectedDevices[device?.remote_control_options?.bluetooth?.address];
+
+  return { isConnected };
+};
+
+export default useBluetoothDeviceConnected;

package/src/hooks/IoT/useEoHBackendDeviceConnected.js

@@ -0,0 +1,21 @@
+import { useSCContextSelector } from '../../context';
+
+const useEoHBackendDeviceConnected = (device) => {
+  const isNetworkConnected = useSCContextSelector(
+    (state) => state.app.isNetworkConnected
+  );
+  const statuses = useSCContextSelector((state) => state.iot.internet.statuses);
+
+  const isConnected =
+    isNetworkConnected &&
+    !!device &&
+    device.id in statuses &&
+    statuses[device.id]?.isConnected;
+
+  const isFetchingStatus =
+    isNetworkConnected && !!device && !(device.id in statuses);
+
+  return { isConnected, isFetchingStatus };
+};
+
+export default useEoHBackendDeviceConnected;

package/src/hooks/IoT/useRemoteControl.js

@@ -15,7 +15,7 @@ const useRemoteControl = () => {
   );
 
   const sendRemoteCommand = useCallback(
-    async (sensor, action, data, userId) => {
+    async (device, action, data, userId) => {
       // No action, raise not authorized
       let result = false;
       if (!action) {
@@ -27,39 +27,28 @@ const useRemoteControl = () => {
 
       if (action.command_prefer_over_bluetooth) {
         try {
-          result = await sendCommandOverBluetooth(sensor, action, data, userId);
+          result = await sendCommandOverBluetooth(device, action, data, userId);
         } catch (err) {
-          result = false;
-          if (err === SEND_COMMAND_OVER_BLUETOOTH_FAIL) {
-            result = await sendCommandOverInternet(
-              sensor,
-              action,
-              data,
-              'bluetooth'
-            );
-          } else {
+          if (err !== SEND_COMMAND_OVER_BLUETOOTH_FAIL) {
             throw err;
           }
+          result = false;
         }
       }
 
-      if (
-        (action.command_prefer_over_internet ||
-          action.command_prefer_over_bluetooth) &&
-        !result
-      ) {
+      if (action.command_prefer_over_internet && !result) {
         result = await sendCommandOverInternet(
-          sensor,
+          device,
           action,
           data,
-          'internet'
+          action.command_prefer_over_bluetooth ? 'bluetooth' : 'internet'
         );
       }
 
       if (action.command_prefer_over_googlehome && !result) {
         result = await sendCommandOverHomeAssistant(
           homeAssistantConnections,
-          sensor,
+          device,
           action,
           data
         );

package/src/iot/RemoteControl/Bluetooth.js

@@ -22,24 +22,17 @@ export const clearFoundDevices = () => {
   }
 };
 
-bleManager.onStateChange((state) => {
-  if (state === 'PoweredOn') {
-    ToastBottomHelper.success(t('text_ble_is_powered_on'));
-    realScanBluetoothDevices();
-  }
-}, true);
-
-export const scanBluetoothDevices = (names) => {
+export const scanBluetoothDevices = (names, onDeviceFound) => {
   names.map((name) => {
     if (bluetoothDevices[name]) {
       return;
     }
     needToScanDevices.push(name);
   });
-  realScanBluetoothDevices();
+  realScanBluetoothDevices(onDeviceFound);
 };
 
-const realScanBluetoothDevices = () => {
+export const realScanBluetoothDevices = (onDeviceFound) => {
   if (!needToScanDevices.length) {
     return;
   }
@@ -67,9 +60,9 @@ const realScanBluetoothDevices = () => {
     const index = needToScanDevices.indexOf(name);
     needToScanDevices.splice(index, 1);
 
-    ToastBottomHelper.success(t(`Found bluetooth ${name} for remote control`));
-
     bluetoothDevices[name] = device;
+    onDeviceFound && onDeviceFound(name, device);
+
     if (!needToScanDevices.length) {
       try {
         bleManager.stopDeviceScan();