@eohjsc/react-native-smart-city 0.2.45 → 0.2.49

package/src/screens/Device/hooks/useDisconnectedDevice.js

@@ -0,0 +1,63 @@
+import NetInfo from '@react-native-community/netinfo';
+import { useCallback, useEffect } from 'react';
+import { Alert, Linking, Platform } from 'react-native';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+import {
+  enableBluetoothForAndroid,
+  isBluetoothEnabled,
+} from '../../../iot/RemoteControl/Bluetooth';
+
+export const useDisconnectedDevice = (isConnected, sensorName) => {
+  const t = useTranslations();
+  const openBluetoothIOS = () => {
+    Linking.openURL('App-Prefs:Bluetooth');
+  };
+  const actions =
+    Platform.OS === 'ios'
+      ? [
+          {
+            text: 'Skip',
+          },
+          {
+            text: 'Open',
+            onPress: () => openBluetoothIOS(),
+          },
+        ]
+      : [
+          {
+            text: 'Skip',
+          },
+          {
+            text: 'Open',
+            onPress: () => enableBluetoothForAndroid(),
+          },
+        ];
+  const checkNetWorkConnect = useCallback(async () => {
+    const netState = await NetInfo.fetch();
+    if (!isConnected || !netState.isConnected) {
+      const isBtEnabled = await isBluetoothEnabled();
+      if (isBtEnabled) {
+        Alert.alert(
+          '',
+          t(
+            'your_internet_is_disconnected_change_to_control_via_bluetooth_connection',
+            { name: sensorName }
+          )
+        );
+      } else {
+        Alert.alert(
+          '',
+          t(
+            'your_connection_to_the_server_was_disconnected_please_open_the_bluetooth_to_continue'
+          ),
+          actions
+        );
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isConnected]);
+
+  useEffect(() => {
+    checkNetWorkConnect();
+  }, [checkNetWorkConnect]);
+};

package/src/screens/Device/styles.js

@@ -24,9 +24,6 @@ export default StyleSheet.create({
     paddingHorizontal: 16,
     paddingTop: 16,
   },
-  chartStyle: {
-    paddingHorizontal: 16,
-  },
   bottomButtonEmergencyResolve: {
     borderTopWidth: 1,
     borderColor: Colors.Gray4,
@@ -37,13 +34,6 @@ export default StyleSheet.create({
     marginHorizontal: 16,
     marginBottom: 32,
   },
-  countDown: {
-    marginBottom: 16,
-    marginTop: 8,
-  },
-  messageCountDown: {
-    marginBottom: 8,
-  },
   locationName: {
     flex: 1,
     alignItems: 'center',

package/src/screens/GuestInfo/components/RecurringDetail.js

@@ -73,7 +73,7 @@ const RecurringDetail = ({
         testID={TESTID.RECURRING_TEXT_BUTTON}
       >
         <Text type="Body" color={Colors.Orange} style={styles.value}>
-          {recurringTimeStart.format('HH:mm A')}
+          {recurringTimeStart.format('hh:mm A')}
         </Text>
       </TouchableOpacity>
       <Text type="Body" color={Colors.Gray8} style={styles.title}>
@@ -84,7 +84,7 @@ const RecurringDetail = ({
         testID={TESTID.RECURRING_TEXT_BUTTON}
       >
         <Text type="Body" color={Colors.Orange} style={styles.value}>
-          {recurringTimeEnd.format('HH:mm A')}
+          {recurringTimeEnd.format('hh:mm A')}
         </Text>
       </TouchableOpacity>
       <Text type="Body" color={Colors.Gray8} style={styles.title}>

package/src/screens/Notification/components/NotificationItem.js

@@ -1,11 +1,11 @@
 import React, { memo, useCallback, useMemo, useState } from 'react';
-import { View, TouchableOpacity } from 'react-native';
+import { View, TouchableOpacity, Image } from 'react-native';
 import moment from 'moment';
 import { useNavigation } from '@react-navigation/native';
 
 import styles from '../styles/NotificationItemStyles';
 import Text from '../../../commons/Text';
-import { Colors, API } from '../../../configs';
+import { Colors, API, Images } from '../../../configs';
 import IconComponent from '../../../commons/IconComponent';
 import { NOTIFICATION_TYPES } from '../../../configs/Constants';
 import { useTranslations } from '../../../hooks/Common/useTranslations';
@@ -18,14 +18,18 @@ const NotificationItem = memo(({ item }) => {
   const { id, icon, created_at, is_read, params, content_code } = item;
   const [isRead, setIsRead] = useState(is_read);
   const timeFormat = moment(created_at).format('LT DD/MM/YYYY');
+  const regex = useMemo(() => {
+    return /\B'|'\B/g;
+  }, []);
+
   let arrParams = useMemo(() => {
     const values = [];
-    const paramsJSON = JSON.parse(params.replace(/'/g, '"'));
+    const paramsJSON = JSON.parse(params.replace(regex, '"'));
     Object.entries(paramsJSON).forEach(([key, value]) => {
       values.push(value);
     });
     return values;
-  }, [params]);
+  }, [params, regex]);
 
   const customColorText = (text, params) => {
     return text.split('**').map((str, i) =>
@@ -42,7 +46,7 @@ const NotificationItem = memo(({ item }) => {
   };
 
   const renderItem = useCallback(() => {
-    const paramsJSON = JSON.parse(params.replace(/'/g, '"'));
+    const paramsJSON = JSON.parse(params.replace(regex, '"'));
     const booking_id = paramsJSON.booking_id && paramsJSON.booking_id;
     switch (content_code) {
       case NOTIFICATION_TYPES.NOTIFY_INVITE_MEMBER:
@@ -60,7 +64,12 @@ const NotificationItem = memo(({ item }) => {
               },
             });
           },
-          textInviteMember: t('accept_invitation'),
+          iconContent: (
+            <IconComponent
+              icon_outlined={'usergroup-add'}
+              style={styles.iconInviteMember}
+            />
+          ),
         };
       case NOTIFICATION_TYPES.REMIND_TO_MAKE_PAYMENT:
         return {
@@ -211,10 +220,19 @@ const NotificationItem = memo(({ item }) => {
               params: { id: booking_id },
             }),
         };
+      case NOTIFICATION_TYPES.REMINDER:
+        return {
+          content: customColorText(
+            t('text_notification_content_update_reminder'),
+            arrParams
+          ),
+          redirect: () => navigation.navigate(Routes.PersonalHealthStack),
+          iconContent: <Image source={Images.logo} style={styles.logo} />,
+        };
     }
-  }, [arrParams, content_code, navigation, params, t]);
+  }, [arrParams, content_code, navigation, params, regex, t]);
 
-  const { content, redirect, textInviteMember } = renderItem() || {};
+  const { content, redirect, iconContent } = renderItem() || {};
 
   const onItemPress = useCallback(() => {
     if (!isRead) {
@@ -224,16 +242,15 @@ const NotificationItem = memo(({ item }) => {
     setIsRead(true);
   }, [id, isRead, redirect]);
 
+  if (!content) {
+    return null;
+  }
+
   return (
     <TouchableOpacity onPress={onItemPress}>
       <View style={[styles.container, !isRead && styles.backgroundGray]}>
         <View style={styles.wrapIcon}>
-          {textInviteMember ? (
-            <IconComponent
-              icon_outlined={'usergroup-add'}
-              style={styles.iconInviteMember}
-            />
-          ) : (
+          {iconContent || (
             <IconComponent iconKit={icon} style={styles.iconNotification} />
           )}
         </View>

package/src/screens/Notification/styles/NotificationItemStyles.js

@@ -47,4 +47,9 @@ export default StyleSheet.create({
     borderRadius: 50,
     width: 120,
   },
+  logo: {
+    width: 20,
+    height: 20,
+    resizeMode: 'contain',
+  },
 });

package/src/screens/ScanChipQR/__test__/ScanChipQR.test.js

@@ -1,10 +1,19 @@
 import React from 'react';
 import { create, act } from 'react-test-renderer';
 import axios from 'axios';
+
+import { SCProvider } from '../../../context';
+import { mockSCStore } from '../../../context/mockStore';
 import ScanChipQR from '..';
 import QRScan from '../components/QRScan';
 import Routes from '../../../utils/Route';
 
+const wrapComponent = (route) => (
+  <SCProvider initState={mockSCStore({})}>
+    <ScanChipQR route={route} />
+  </SCProvider>
+);
+
 const mockedNavigate = jest.fn();
 const mockedGoBack = jest.fn();
 
@@ -45,7 +54,7 @@ describe('test ScanChipQR', () => {
   test('create ScanChipQR', async () => {
     let tree;
     await act(async () => {
-      tree = await create(<ScanChipQR route={route} />);
+      tree = await create(wrapComponent(route));
     });
     const instance = tree.root;
     const qrScan = instance.findAllByType(QRScan);
@@ -69,7 +78,7 @@ describe('test ScanChipQR', () => {
     let tree;
     const body = { id: 1, imei: 'IMEI_X', name: 'New Chip' };
     await act(async () => {
-      tree = await create(<ScanChipQR route={route} />);
+      tree = await create(wrapComponent(route));
     });
     const instance = tree.root;
     const qrScan = instance.findByType(QRScan);
@@ -100,7 +109,7 @@ describe('test ScanChipQR', () => {
     let tree;
     const body = { id: 1, imei: 'IMEI_X', name: 'New Chip' };
     await act(async () => {
-      tree = await create(<ScanChipQR route={route} />);
+      tree = await create(wrapComponent(route));
     });
     const instance = tree.root;
     const qrScan = instance.findByType(QRScan);

package/src/screens/ScanChipQR/components/QRScan/__test__/QRScan.test.js

@@ -1,6 +1,9 @@
 import React from 'react';
 import { RNCamera } from 'react-native-camera';
 import { act, create } from 'react-test-renderer';
+
+import { SCProvider } from '../../../../../context';
+import { mockSCStore } from '../../../../../context/mockStore';
 import QRScan from '../index';
 
 const mockedPop = jest.fn();
@@ -17,6 +20,12 @@ jest.mock('@react-navigation/native', () => {
   };
 });
 
+const wrapComponent = (data) => (
+  <SCProvider initState={mockSCStore({})}>
+    <QRScan {...data} />
+  </SCProvider>
+);
+
 describe('Test QRScan', () => {
   let data;
 
@@ -32,7 +41,7 @@ describe('Test QRScan', () => {
 
   test('render QRScan', async () => {
     act(() => {
-      tree = create(<QRScan {...data} />);
+      tree = create(wrapComponent(data));
     });
     const instance = tree.root;
     const RNCam = instance.findAllByType(RNCamera);
@@ -41,7 +50,7 @@ describe('Test QRScan', () => {
 
   test('onBarCodeRead', async () => {
     act(() => {
-      tree = create(<QRScan {...data} />);
+      tree = create(wrapComponent(data));
     });
     const instance = tree.root;
     const RNCam = instance.findByType(RNCamera);

package/src/screens/ScanSensorQR/__test__/ScanSensorQR.test.js

@@ -1,11 +1,20 @@
 import React from 'react';
 import { create, act } from 'react-test-renderer';
 import axios from 'axios';
+
+import { SCProvider } from '../../../context';
+import { mockSCStore } from '../../../context/mockStore';
 import ScanSensorQR from '..';
 import QRScan from '../../ScanChipQR/components/QRScan';
 import API from '../../../configs/API';
 import Routes from '../../../utils/Route';
 
+const wrapComponent = (route) => (
+  <SCProvider initState={mockSCStore({})}>
+    <ScanSensorQR route={route} />
+  </SCProvider>
+);
+
 const mockedNavigate = jest.fn();
 const mockedGoBack = jest.fn();
 
@@ -46,7 +55,7 @@ describe('test ScanSensorQR', () => {
   test('create ScanSensorQR', async () => {
     let tree;
     await act(async () => {
-      tree = await create(<ScanSensorQR route={route} />);
+      tree = await create(wrapComponent(route));
     });
     const instance = tree.root;
     const qrScan = instance.findAllByType(QRScan);
@@ -70,7 +79,7 @@ describe('test ScanSensorQR', () => {
     let tree;
     const body = { id: 1, imei: 'IMEI_X', name: 'New Chip' };
     await act(async () => {
-      tree = await create(<ScanSensorQR route={route} />);
+      tree = await create(wrapComponent(route));
     });
     const instance = tree.root;
     const qrScan = instance.findByType(QRScan);
@@ -103,7 +112,7 @@ describe('test ScanSensorQR', () => {
     let tree;
     const body = { id: 1, imei: 'IMEI_X', name: 'New Chip' };
     await act(async () => {
-      tree = await create(<ScanSensorQR route={route} />);
+      tree = await create(wrapComponent(route));
     });
     const instance = tree.root;
     const qrScan = instance.findByType(QRScan);

package/src/screens/ScriptDetail/__test__/index.test.js

@@ -16,6 +16,7 @@ import { API } from '../../../configs';
 import { TouchableOpacity } from 'react-native';
 import Routes from '../../../utils/Route';
 import WrapHeaderScrollable from '../../../commons/Sharing/WrapHeaderScrollable';
+import ItemAutomate from '../../../commons/Automate/ItemAutomate';
 
 const wrapComponent = (route) => (
   <SCProvider initState={mockSCStore({})}>
@@ -271,9 +272,12 @@ describe('Test ScriptDetail', () => {
     });
   });
 
-  const _testGoToActivityLog = (automateType, activityLogType) => {
+  const _testGoToActivityLog = (automateType, activityLogType, isMultiUnit) => {
     test('test go to activity log', async () => {
       route.params.type = automateType;
+      if (isMultiUnit) {
+        route.params.unit.id = undefined;
+      }
       await act(async () => {
         tree = await create(wrapComponent(route));
       });
@@ -288,13 +292,89 @@ describe('Test ScriptDetail', () => {
         id: route.params.id,
         type: activityLogType,
         share: route.params.unit,
+        filterEnabled: {
+          user: !isMultiUnit,
+          date: true,
+        },
       });
     });
   };
 
   _testGoToActivityLog(
     AUTOMATE_TYPE.ONE_TAP,
-    `automate.${AUTOMATE_TYPE.ONE_TAP}`
+    `automate.${AUTOMATE_TYPE.ONE_TAP}`,
+    false
   );
-  _testGoToActivityLog(AUTOMATE_TYPE.VALUE_CHANGE, 'automate');
+  _testGoToActivityLog(AUTOMATE_TYPE.VALUE_CHANGE, 'automate', false);
+  _testGoToActivityLog(AUTOMATE_TYPE.VALUE_CHANGE, 'automate', true);
+
+  test('Test render textCondition value change >', async () => {
+    route.params = {
+      ...route.params,
+      type: AUTOMATE_TYPE.VALUE_CHANGE,
+      automate: {
+        repeat: 'once',
+        date_repeat: '2022-01-02',
+        time_repeat: '09:10:00',
+        weekday_repeat: ['1', '2', '4', '6'],
+        config_name: 'Light Value',
+        value: 3,
+        condition: '>',
+      },
+    };
+    await act(() => {
+      tree = create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const itemAutomate = instance.findByType(ItemAutomate);
+    expect(itemAutomate.props.textCondition).toEqual(
+      'Light Value higher than 3'
+    );
+  });
+
+  test('Test render textCondition value change =', async () => {
+    route.params = {
+      ...route.params,
+      type: AUTOMATE_TYPE.VALUE_CHANGE,
+      automate: {
+        repeat: 'once',
+        date_repeat: '2022-01-02',
+        time_repeat: '09:10:00',
+        weekday_repeat: ['1', '2', '4', '6'],
+        config_name: 'Light Value',
+        value: 3,
+        condition: '=',
+      },
+    };
+    await act(() => {
+      tree = create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const itemAutomate = instance.findByType(ItemAutomate);
+    expect(itemAutomate.props.textCondition).toEqual('Light Value equal 3');
+  });
+
+  test('Test render textCondition value change <', async () => {
+    route.params = {
+      ...route.params,
+      type: AUTOMATE_TYPE.VALUE_CHANGE,
+      automate: {
+        repeat: 'once',
+        date_repeat: '2022-01-02',
+        time_repeat: '09:10:00',
+        weekday_repeat: ['1', '2', '4', '6'],
+        config_name: 'Light Value',
+        value: 3,
+        condition: '<',
+      },
+    };
+    await act(() => {
+      tree = create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const itemAutomate = instance.findByType(ItemAutomate);
+    expect(itemAutomate.props.textCondition).toEqual(
+      'Light Value lower than 3'
+    );
+  });
 });

package/src/screens/ScriptDetail/hooks/index.js

@@ -63,6 +63,10 @@ const useStateAlertAction = () => {
               ? `automate.${AUTOMATE_TYPE.ONE_TAP}`
               : 'automate',
           share: unit,
+          filterEnabled: {
+            date: true,
+            user: Boolean(unit.id),
+          },
         });
       } else {
         setStateAlertAction((action) => {

package/src/screens/ScriptDetail/index.js

@@ -43,6 +43,7 @@ import { AUTOMATE_SELECT, AUTOMATE_TYPE } from '../../configs/Constants';
 import { popAction } from '../../navigations/utils';
 import { TESTID } from '../../configs/Constants';
 import useKeyboardAnimated from '../../hooks/Explore/useKeyboardAnimated';
+import { REPEAT_OPTIONS } from '../SetSchedule/components/RepeatOptionsPopup';
 
 const PreventDoubleTouch = withPreventDoubleClick(TouchableOpacity);
 
@@ -61,6 +62,7 @@ const ScriptDetail = ({ route }) => {
   const t = useTranslations();
   const {
     id,
+    automate = {},
     name = '',
     type,
     havePermission,
@@ -70,7 +72,6 @@ const ScriptDetail = ({ route }) => {
     isAutomateTab,
     isCreateNewAction,
     isMultiUnits,
-    textCondition = '',
   } = params;
   const [isStar, setIsStar] = useState(false);
   const [scriptName, setScriptName] = useState(name);
@@ -214,15 +215,15 @@ const ScriptDetail = ({ route }) => {
 
   const handleUpdateAutomate = useCallback(async () => {
     navigate(Routes.AddNewAutoSmart, {
-      type: AUTOMATE_TYPE.AUTOMATE,
-      automateId: id,
+      type,
+      automate,
       unit,
       isAutomateTab,
       isMultiUnits,
       scriptName: name,
     });
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [name]);
+  }, [name, automate]);
 
   const onGoBack = useCallback(() => {
     if (isCreateScriptSuccess || isCreateNewAction) {
@@ -351,6 +352,66 @@ const ScriptDetail = ({ route }) => {
     return () => backHandler.remove();
   }, [isCreateScriptSuccess]);
   const isHaveScriptActions = data?.length > 0;
+
+  const textCondition = useMemo(() => {
+    const {
+      condition,
+      config_name,
+      value,
+      repeat,
+      date_repeat,
+      time_repeat,
+      weekday_repeat,
+    } = automate;
+    if (type === AUTOMATE_TYPE.VALUE_CHANGE) {
+      let textCondition;
+      if (condition === '>') {
+        textCondition = 'higher_than';
+      } else if (condition === '<') {
+        textCondition = 'lower_than';
+      } else if (condition === '=') {
+        textCondition = 'equal';
+      }
+      return `${config_name} ${t(textCondition)} ${value}`;
+    } else if (type === AUTOMATE_TYPE.SCHEDULE) {
+      const time =
+        time_repeat.length >= 8
+          ? time_repeat.substring(0, time_repeat.length - 3)
+          : time_repeat;
+      const date = date_repeat.split('-').reverse().join('/');
+      const weekday = {
+        1: t('mon'),
+        2: t('tue'),
+        3: t('wed'),
+        4: t('thu'),
+        5: t('fri'),
+        6: t('sat'),
+        0: t('sun'),
+      };
+
+      if (repeat === REPEAT_OPTIONS.ONCE) {
+        return `${time} ${date}`;
+      } else if (repeat === REPEAT_OPTIONS.EVERYDAY) {
+        return `${t('every_day_at', { time })}`;
+      } else if (repeat === REPEAT_OPTIONS.EVERYWEEK) {
+        //sort 0 is last number, exp: [1,3,5,0]
+        const newWeekdayRepeat = weekday_repeat.map((item) => parseInt(item));
+        const sortWeekday = newWeekdayRepeat.sort((a, b) => {
+          if (a !== 0 && b === 0) {
+            return -1;
+          }
+          if (a === 0 && b !== 0) {
+            return 1;
+          }
+          return a - b;
+        });
+        const textWeekday = sortWeekday.map((item) => weekday[item]).join(', ');
+        return `${textWeekday} ${t('at')} ${time}`;
+      }
+    }
+    return null;
+  }, [t, automate, type]);
+
   return (
     <View style={styles.wrap}>
       <WrapHeaderScrollable

package/src/screens/SetSchedule/__test__/SelectWeekday.test.js

@@ -28,7 +28,7 @@ test('test select', async () => {
   await act(async () => {
     await items[0].props.onPress();
   });
-  expect(mockSetWeekday).toBeCalledWith(['0']);
+  expect(mockSetWeekday).toBeCalledWith(['1']);
 
   mockSetWeekday.mockClear();
   props = {
@@ -44,5 +44,5 @@ test('test select', async () => {
   await act(async () => {
     await items[0].props.onPress();
   });
-  expect(mockSetWeekday).toBeCalledWith([]);
+  expect(mockSetWeekday).toBeCalledWith(['0', '1']);
 });

package/src/screens/SetSchedule/__test__/index.test.js

@@ -162,6 +162,14 @@ describe('Test SetSchedule', () => {
       isAutomateTab: true,
       isScript: undefined,
       isMultiUnits: undefined,
+      automateId: undefined,
+      scriptName: undefined,
+      automate: {
+        date_repeat: '2021-01-24',
+        repeat: 'once',
+        time_repeat: '12:00:00',
+        weekday_repeat: [],
+      },
     });
   });
 });

package/src/screens/SetSchedule/components/SelectWeekday.js

@@ -5,7 +5,15 @@ import { Colors } from '../../../configs';
 import styles from '../styles/SelectWeekdayStyles';
 import { useTranslations } from '../../../hooks/Common/useTranslations';
 
-const WEEKDAY_ITEMS = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
+const WEEKDAY_ITEMS = [
+  { day: 'Mon', value: 1 },
+  { day: 'Tue', value: 2 },
+  { day: 'Wed', value: 3 },
+  { day: 'Thu', value: 4 },
+  { day: 'Fri', value: 5 },
+  { day: 'Sat', value: 6 },
+  { day: 'Sun', value: 0 },
+];
 
 const SelectWeekday = ({ weekday, setWeekday }) => {
   const t = useTranslations();
@@ -23,11 +31,10 @@ const SelectWeekday = ({ weekday, setWeekday }) => {
   );
 
   const WeekdayItem = useCallback(
-    ({ item, index, isSelected }) => {
+    ({ item, isSelected }) => {
       return (
         <TouchableOpacity
-          key={index}
-          onPress={() => onSetWeekday(`${index}`)}
+          onPress={() => onSetWeekday(`${item?.value}`)}
           style={[styles.item, isSelected && styles.selected]}
         >
           <Text
@@ -36,7 +43,7 @@ const SelectWeekday = ({ weekday, setWeekday }) => {
             style={styles.text}
             semibold
           >
-            {item}
+            {item?.day}
           </Text>
         </TouchableOpacity>
       );
@@ -54,8 +61,7 @@ const SelectWeekday = ({ weekday, setWeekday }) => {
           <WeekdayItem
             key={index}
             item={item}
-            index={index}
-            isSelected={weekday.includes(`${index}`)}
+            isSelected={weekday.includes(`${item?.value}`)}
           />
         ))}
       </View>