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

package/src/screens/AddNewDevice/ConnectingDevices.js

@@ -1,5 +1,7 @@
 import React, { memo, useEffect } from 'react';
 import { View, StyleSheet } from 'react-native';
+import { getStatusBarHeight } from 'react-native-iphone-x-helper';
+
 import { API, Colors } from '../../configs';
 import { axiosGet } from '../../utils/Apis/axios';
 import Text from '../../commons/Text';
@@ -44,6 +46,7 @@ const styles = StyleSheet.create({
   wrap: {
     flex: 1,
     backgroundColor: Colors.Gray2,
+    paddingTop: getStatusBarHeight(true),
   },
   txtHeader: {
     marginTop: 16,

package/src/screens/AddNewGateway/ConnectingGatewayStyles.js

@@ -1,10 +1,19 @@
-import { StyleSheet } from 'react-native';
+import { StyleSheet, StatusBar, Platform } from 'react-native';
 import { Colors } from '../../configs';
 import { colorOpacity } from '../../utils/Converter/color';
+import { getStatusBarHeight } from 'react-native-iphone-x-helper';
 
 export default StyleSheet.create({
   wrap: {
     flex: 1,
+    ...Platform.select({
+      android: {
+        paddingTop: StatusBar.currentHeight,
+      },
+      ios: {
+        paddingTop: getStatusBarHeight(),
+      },
+    }),
   },
   txtHeader: {
     marginTop: 16,

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

@@ -52,7 +52,12 @@ describe('test AddNewOneTap', () => {
   test('create AddNewOneTap success', async () => {
     Platform.OS = 'ios';
     let route = {
-      params: { type: 'one_tap', unit: { id: 1 } },
+      params: {
+        type: 'one_tap',
+        unit: { id: 1 },
+        isMultiUnits: false,
+        isAutomateTab: false,
+      },
     };
 
     const response = {
@@ -103,6 +108,9 @@ describe('test AddNewOneTap', () => {
         id: 1,
       },
       isCreateScriptSuccess: true,
+      automate: {},
+      isAutomateTab: false,
+      isMultiUnits: false,
     });
   });
   test('create AddNewOneTap fail', async () => {

package/src/screens/AddNewOneTap/index.js

@@ -13,13 +13,14 @@ import { useTranslations } from '../../hooks/Common/useTranslations';
 import { axiosPost, axiosPut } from '../../utils/Apis/axios';
 import Routes from '../../utils/Route';
 import { popAction } from '../../navigations/utils';
-import { ToastBottomHelper } from '../../utils/Utils';
+import { AUTOMATE_TYPE } from '../../configs/Constants';
 
 const AddNewOneTap = memo(({ route }) => {
   const {
     type,
     unit,
     automateData = {},
+    automate = {},
     isAutomateTab,
     isMultiUnits,
     automateId,
@@ -45,13 +46,12 @@ const AddNewOneTap = memo(({ route }) => {
         id: data.id,
         name: name,
         type: type,
+        automate,
         havePermission: true,
         isCreateScriptSuccess: true,
         isAutomateTab: automateId ? false : isAutomateTab,
         isMultiUnits,
       });
-    } else {
-      ToastBottomHelper.error(t('error_please_try_later'));
     }
   }, [
     isMultiUnits,
@@ -60,9 +60,9 @@ const AddNewOneTap = memo(({ route }) => {
     name,
     automateData,
     automateId,
+    automate,
     navigate,
     isAutomateTab,
-    t,
   ]);
 
   const onChangeName = useCallback((text) => {
@@ -89,6 +89,11 @@ const AddNewOneTap = memo(({ route }) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isAutomateTab]);
 
+  const textForNewTap =
+    type === AUTOMATE_TYPE.ONE_TAP
+      ? t('name_your_button')
+      : t('name_your_script');
+
   return (
     <SafeAreaView
       style={
@@ -106,10 +111,10 @@ const AddNewOneTap = memo(({ route }) => {
           color={Colors.Gray9}
           style={styles.textHeader}
         >
-          {t('name_your_button')}
+          {textForNewTap}
         </Text>
         <_TextInput
-          placeholder={t('name_your_button')}
+          placeholder={textForNewTap}
           wrapStyle={styles.noMarginTop}
           onChange={onChangeName}
           textInputStyle={styles.textInput}

package/src/screens/Automate/MultiUnits.js

@@ -17,7 +17,6 @@ import ItemOneTap from '../../commons/SubUnit/OneTap/ItemOneTap';
 import Routes from '../../utils/Route';
 import { useGetIdUser } from '../../hooks/Common';
 import ItemAddNew from '../../commons/Device/ItemAddNew';
-import { REPEAT_OPTIONS } from '../SetSchedule/components/RepeatOptionsPopup';
 
 const MultiUnits = () => {
   const t = useTranslations();
@@ -53,55 +52,6 @@ const MultiUnits = () => {
     setTabActive(tab);
   };
 
-  const textCondition = useCallback(
-    (item) => {
-      const {
-        type,
-        condition,
-        config,
-        value,
-        repeat,
-        date_repeat,
-        time_repeat,
-        weekday_repeat,
-      } = item;
-
-      if (type === AUTOMATE_TYPE.VALUE_CHANGE) {
-        let _condition;
-        if (condition === '>') {
-          _condition = 'higher_than';
-        } else if (condition === '<') {
-          _condition = 'lower_than';
-        } else if (condition === '=') {
-          _condition = 'equal';
-        }
-        return `${config} ${t(_condition)} ${value}`;
-      } else if (type === AUTOMATE_TYPE.SCHEDULE) {
-        const time = time_repeat.substring(0, time_repeat.length - 3);
-        const date = date_repeat.split('-').reverse().join('/');
-        const weekday = {
-          0: 'Mon',
-          1: 'Tue',
-          2: 'Wed',
-          3: 'Thu',
-          4: 'Fri',
-          5: 'Sat',
-          6: '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) {
-          return weekday_repeat.map((item) => weekday[item]).join(', ');
-        }
-      }
-      return null;
-    },
-    [t]
-  );
-
   const onPressItem = (item) => () => {
     navigate(Routes.UnitStack, {
       screen: Routes.ScriptDetail,
@@ -112,7 +62,7 @@ const MultiUnits = () => {
         havePermission: idUser === item?.user,
         unit,
         isMultiUnits,
-        textCondition: textCondition(item),
+        automate: item,
       },
     });
   };
@@ -125,8 +75,9 @@ const MultiUnits = () => {
           tabActive === t('Scenario')
             ? AUTOMATE_TYPE.ONE_TAP_ONLY
             : AUTOMATE_TYPE.VALUE_CHANGE,
+        unit: { id: unit?.id },
         isAutomateTab: true,
-        isMultiUnits: true,
+        isMultiUnits,
       },
     });
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -163,9 +114,19 @@ const MultiUnits = () => {
         : item?.type !== AUTOMATE_TYPE.ONE_TAP
     );
 
+    const listFavorite = listItems.filter(
+      (item) => item.script?.is_star === true
+    );
+
+    const listNotFavorite = listItems.filter(
+      (item) => item.script?.is_star === false
+    );
+
+    const newListItems = listFavorite.concat(listNotFavorite);
+
     return (
       <View style={styles.wrapItem}>
-        {listItems.map((item, index) => (
+        {newListItems.map((item, index) => (
           <ItemOneTap
             isOwner={idUser === item?.user}
             automate={item}

package/src/screens/Automate/__test__/MultiUnits.test.js

@@ -70,6 +70,7 @@ describe('Test MultiUnits', () => {
             id: 1,
             name: 'Tap to up down up down coc coc coc coc coc',
             icon: null,
+            is_star: true,
             icon_kit:
               'https://eoh-gateway-backend.eoh.io/_Category_Sensors_Type_Garage_door_StyleC_olorful.png',
           },
@@ -86,6 +87,7 @@ describe('Test MultiUnits', () => {
             id: 300,
             name: 'p14',
             icon: null,
+            is_star: true,
             icon_kit: null,
           },
         },
@@ -126,13 +128,13 @@ describe('Test MultiUnits', () => {
     expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
       screen: Routes.ScriptDetail,
       params: {
+        automate: response.data[1],
         id: response.data[1].id,
         name: response.data[1].script?.name,
         type: response.data[1].type,
         havePermission: false,
         unit: null,
         isMultiUnits: true,
-        textCondition: 'Light Value lower than 0',
       },
     });
     const ItemAddNews = instance.findAllByType(ItemAddNew);
@@ -145,6 +147,7 @@ describe('Test MultiUnits', () => {
         type: AUTOMATE_TYPE.VALUE_CHANGE,
         isAutomateTab: true,
         isMultiUnits: true,
+        unit: { id: undefined },
       },
     });
   });
@@ -219,6 +222,7 @@ describe('Test MultiUnits', () => {
         type: AUTOMATE_TYPE.ONE_TAP_ONLY,
         isAutomateTab: true,
         isMultiUnits: true,
+        unit: { id: undefined },
       },
     });
   });
@@ -234,249 +238,4 @@ describe('Test MultiUnits', () => {
     const WrapHeaderScrollables = instance.findAllByType(WrapHeaderScrollable);
     expect(WrapHeaderScrollables[0].props.title).toEqual('');
   });
-
-  it('Test render textCondition', async () => {
-    const response = {
-      status: 200,
-      data: [
-        {
-          id: 1,
-          user: 223,
-          type: 'schedule',
-          config: null,
-          value: null,
-          activate_at: '2021-09-22T14:16:54Z',
-          condition: null,
-          script: {
-            id: 1,
-            name: 'Tap to up down up down coc coc coc coc coc',
-            icon: null,
-            icon_kit:
-              'https://eoh-gateway-backend.eoh.io/_Category_Sensors_Type_Garage_door_StyleC_olorful.png',
-          },
-          repeat: 'once',
-          date_repeat: '2022-01-02',
-          time_repeat: '09:10:00',
-          weekday_repeat: ['1', '2', '4', '6'],
-        },
-        {
-          id: 299,
-          user: 223,
-          type: 'value_change',
-          config: 'Light Value',
-          value: 0,
-          activate_at: null,
-          condition: '>',
-          script: {
-            id: 300,
-            name: 'p14',
-            icon: null,
-            icon_kit: null,
-          },
-          repeat: 'once',
-          date_repeat: '2022-01-02',
-          time_repeat: '09:10:00',
-          weekday_repeat: ['1', '2', '4', '6'],
-        },
-        {
-          id: 300,
-          user: 223,
-          type: 'value_change',
-          config: 'Light Value',
-          value: 0,
-          activate_at: null,
-          condition: '=',
-          script: {
-            id: 300,
-            name: 'p15',
-            icon: null,
-            icon_kit: null,
-          },
-          repeat: 'once',
-          date_repeat: '2022-01-02',
-          time_repeat: '09:10:00',
-          weekday_repeat: ['1', '2', '4', '6'],
-        },
-        {
-          id: 301,
-          user: 223,
-          type: 'schedule',
-          config: null,
-          value: null,
-          activate_at: '2021-09-22T14:16:54Z',
-          condition: null,
-          script: {
-            id: 1,
-            name: 'Tap to up down up down coc coc coc coc coc',
-            icon: null,
-            icon_kit:
-              'https://eoh-gateway-backend.eoh.io/_Category_Sensors_Type_Garage_door_StyleC_olorful.png',
-          },
-          repeat: 'once',
-          date_repeat: '2022-01-02',
-          time_repeat: '09:10:00',
-          weekday_repeat: ['1', '2', '4', '6'],
-        },
-        {
-          id: 302,
-          user: 223,
-          type: 'schedule',
-          config: null,
-          value: null,
-          activate_at: '2021-09-22T14:16:54Z',
-          condition: null,
-          script: {
-            id: 1,
-            name: 'Tap to up down up down coc coc coc coc coc',
-            icon: null,
-            icon_kit:
-              'https://eoh-gateway-backend.eoh.io/_Category_Sensors_Type_Garage_door_StyleC_olorful.png',
-          },
-          repeat: 'every_day',
-          date_repeat: '2022-01-02',
-          time_repeat: '09:10:00',
-          weekday_repeat: ['1', '2', '4', '6'],
-        },
-        {
-          id: 302,
-          user: 223,
-          type: 'schedule',
-          config: null,
-          value: null,
-          activate_at: '2021-09-22T14:16:54Z',
-          condition: null,
-          script: {
-            id: 1,
-            name: 'Tap to up down up down coc coc coc coc coc',
-            icon: null,
-            icon_kit:
-              'https://eoh-gateway-backend.eoh.io/_Category_Sensors_Type_Garage_door_StyleC_olorful.png',
-          },
-          repeat: 'every_week',
-          date_repeat: '2022-01-02',
-          time_repeat: '09:10:00',
-          weekday_repeat: ['1', '2', '4', '6'],
-        },
-      ],
-    };
-    await axios.get.mockImplementation(async () => {
-      return response;
-    });
-    useRoute.mockReturnValue({
-      params: {
-        isMultiUnits: true,
-        unitName: null,
-        unit: null,
-      },
-    });
-    useState.mockImplementationOnce(() => [response.data, mockSetState]);
-    useState.mockImplementationOnce(() => [
-      getTranslate('en', 'Automation'),
-      mockSetState,
-    ]);
-    await act(() => {
-      tree = create(wrapComponent());
-    });
-    const instance = tree.root;
-    const WrapHeaderScrollables = instance.findAllByType(WrapHeaderScrollable);
-    expect(WrapHeaderScrollables[0].props.title).toEqual(
-      getTranslate('en', 'multi_units_automate')
-    );
-    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
-    act(() => {
-      TouchableOpacities[2].props.onPress();
-    });
-    expect(mockSetState).toBeCalledWith(getTranslate('en', 'Automation'));
-    const ItemOneTaps = instance.findAllByType(ItemOneTap);
-    act(() => {
-      ItemOneTaps[0].props.onPressItem();
-    });
-    expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.ScriptDetail,
-      params: {
-        id: response.data[0].id,
-        name: response.data[0].script?.name,
-        type: response.data[0].type,
-        havePermission: false,
-        unit: null,
-        isMultiUnits: true,
-        textCondition: '09:10 02/01/2022',
-      },
-    });
-    act(() => {
-      ItemOneTaps[1].props.onPressItem();
-    });
-    expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.ScriptDetail,
-      params: {
-        id: response.data[1].id,
-        name: response.data[1].script?.name,
-        type: response.data[1].type,
-        havePermission: false,
-        unit: null,
-        isMultiUnits: true,
-        textCondition: 'Light Value higher than 0',
-      },
-    });
-    act(() => {
-      ItemOneTaps[2].props.onPressItem();
-    });
-    expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.ScriptDetail,
-      params: {
-        id: response.data[2].id,
-        name: response.data[2].script?.name,
-        type: response.data[2].type,
-        havePermission: false,
-        unit: null,
-        isMultiUnits: true,
-        textCondition: 'Light Value equal 0',
-      },
-    });
-    act(() => {
-      ItemOneTaps[3].props.onPressItem();
-    });
-    expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.ScriptDetail,
-      params: {
-        id: response.data[3].id,
-        name: response.data[3].script?.name,
-        type: response.data[3].type,
-        havePermission: false,
-        unit: null,
-        isMultiUnits: true,
-        textCondition: '09:10 02/01/2022',
-      },
-    });
-    act(() => {
-      ItemOneTaps[4].props.onPressItem();
-    });
-    expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.ScriptDetail,
-      params: {
-        id: response.data[4].id,
-        name: response.data[4].script?.name,
-        type: response.data[4].type,
-        havePermission: false,
-        unit: null,
-        isMultiUnits: true,
-        textCondition: 'Every day at 09:10',
-      },
-    });
-    act(() => {
-      ItemOneTaps[5].props.onPressItem();
-    });
-    expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.ScriptDetail,
-      params: {
-        id: response.data[5].id,
-        name: response.data[5].script?.name,
-        type: response.data[5].type,
-        havePermission: false,
-        unit: null,
-        isMultiUnits: true,
-        textCondition: 'Tue, Wed, Fri, Sun',
-      },
-    });
-  });
 });

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

@@ -152,6 +152,7 @@ describe('Test Automate', () => {
     expect(mockedNavigate).toBeCalledWith(Routes.UnitStack, {
       screen: Routes.ScriptDetail,
       params: {
+        automate: response.data[0].automates[0],
         isAutomateTab: true,
         isMultiUnits: true,
         name: 'script',

package/src/screens/Automate/index.js

@@ -69,6 +69,7 @@ const Automate = () => {
         havePermission: isOwner || idUser === item?.user,
         unit: { id },
         isAutomateTab: true,
+        automate: item,
         isMultiUnits: type === UNIT_TYPES.MULTI,
       },
     });

package/src/screens/Device/__test__/detail.test.js

@@ -43,6 +43,16 @@ jest.mock('react-redux', () => {
   };
 });
 
+jest.mock('@react-native-community/netinfo', () => {
+  return {
+    useNetInfo: () => {
+      return {
+        isConnected: true,
+      };
+    },
+  };
+});
+
 jest.mock('react', () => ({
   ...jest.requireActual('react'),
   useLayoutEffect: jest.fn(),
@@ -807,6 +817,10 @@ describe('test DeviceDetail', () => {
     expect(mockedNavigate).toHaveBeenCalledWith(Routes.ActivityLog, {
       id: route.params.sensor.id,
       type: 'action',
+      filterEnabled: {
+        date: false,
+        user: false,
+      },
     });
   });
 });

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

@@ -0,0 +1,63 @@
+import moment from 'moment';
+import React, { useEffect, useState } from 'react';
+import { StyleSheet } from 'react-native';
+import HistoryChart from '../../../commons/Device/HistoryChart';
+import { API } from '../../../configs';
+import { axiosGet } from '../../../utils/Apis/axios';
+
+export const DetailHistoryChart = ({ item, sensor }) => {
+  const [chartData, setChartData] = useState(item.configuration.configs);
+  const [startDate, setStartDate] = useState(
+    moment().subtract(1, 'days').valueOf()
+  );
+  const [endDate, setEndDate] = useState(moment().valueOf());
+  useEffect(() => {
+    const fetchData = async () => {
+      let params = new URLSearchParams();
+      item.configuration.configs.map((config) => {
+        params.append('config', config.id);
+      });
+      params.append('date_from', startDate / 1000);
+      params.append('date_to', endDate / 1000);
+      const { success, data } = await axiosGet(
+        API.SENSOR.DISPLAY_HISTORY(sensor.id),
+        { params }
+      );
+      if (success) {
+        for (let i = 0; i < data.length; i++) {
+          for (let j = 0; j < data[i].data.length; j++) {
+            data[i].data[j].x = moment(data[i].data[j].x).toDate();
+          }
+        }
+
+        const formatData = item.configuration.configs.map((config) => {
+          const dataChart = data.find((k) => k.config === config.id) || {
+            data: [],
+          };
+          return { ...config, data: dataChart.data };
+        });
+        setChartData(formatData);
+      }
+    };
+    fetchData();
+  }, [startDate, endDate, item, sensor]);
+  if (!chartData.length) {
+    return false;
+  }
+
+  return (
+    <HistoryChart
+      configuration={item.configuration}
+      datas={chartData}
+      style={styles.chartStyle}
+      setStartDate={setStartDate}
+      setEndDate={setEndDate}
+    />
+  );
+};
+
+const styles = StyleSheet.create({
+  chartStyle: {
+    paddingHorizontal: 16,
+  },
+});

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

@@ -0,0 +1,29 @@
+import React, { memo } from 'react';
+import { StyleSheet, View } from 'react-native';
+import Text from '../../../commons/Text';
+import { Colors } from '../../../configs';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+
+export const EmergencyCountdown = memo(({ countUpStr }) => {
+  const t = useTranslations();
+  return (
+    <View style={styles.countDown}>
+      <Text type="Label" center style={styles.messageCountDown}>
+        {t('time_since_the_emergency_button_was_pressed')}
+      </Text>
+      <Text type="H3" center semibold color={Colors.Red6}>
+        {countUpStr}
+      </Text>
+    </View>
+  );
+});
+
+const styles = StyleSheet.create({
+  countDown: {
+    marginBottom: 16,
+    marginTop: 8,
+  },
+  messageCountDown: {
+    marginBottom: 8,
+  },
+});