@eohjsc/react-native-smart-city 0.7.7 → 0.7.9

package/src/screens/SubUnit/RearrageSubUnit.js

@@ -0,0 +1,90 @@
+import React, { useState } from 'react';
+import { View, TouchableOpacity } from 'react-native';
+import { isEqual } from 'lodash';
+import { API } from '../../configs';
+import { axiosPost } from '../../utils/Apis/axios';
+import styles from './RearrrageSubUnitStyle';
+import Text from '../../commons/Text';
+import FlatListDnD from '../../commons/FlatListDnD';
+import ViewButtonBottom from '../../commons/ViewButtonBottom';
+import { HeaderCustom } from '../../commons/Header';
+import Rearrange from '../../../assets/images/Rearrange.svg';
+import { ToastBottomHelper } from '../../utils/Utils';
+import { useNavigation } from '@react-navigation/native';
+import { useTranslations } from '../../hooks/Common/useTranslations';
+
+const RearrangeSubUnit = ({ route }) => {
+  const { stations, unit } = route.params;
+  const t = useTranslations();
+  const { goBack } = useNavigation();
+  const [reorderItems, setReorderItems] = useState(stations);
+  const handleOnSave = async () => {
+    const idOrderSubUnits = reorderItems.map((i) => i.id);
+    const { success } = await axiosPost(API.SUB_UNIT.ORDER_SUB_UNITS(unit.id), {
+      id_order_sub_units: idOrderSubUnits,
+    });
+    if (success) {
+      ToastBottomHelper.success(t('updated_sub_unit_order'));
+      goBack();
+    }
+  };
+
+  const renderItem = ({ item, getIndex, drag, isActive }) => {
+    const index = getIndex() + 1;
+    return (
+      <View style={styles.itemWrapper}>
+        <TouchableOpacity
+          style={[
+            styles.border,
+            styles.indexWrapper,
+            /* istanbul ignore next */
+            isActive && styles.isDragging,
+          ]}
+          onPressIn={drag}
+        >
+          <Text style={styles.indexText}>{`${index}`.padStart(2, '0')}</Text>
+          <Rearrange />
+        </TouchableOpacity>
+        <View
+          style={[
+            styles.border,
+            styles.subUnitWrapper,
+            /* istanbul ignore next */
+            isActive && styles.isDragging,
+          ]}
+        >
+          <Text style={styles.indexText}>{item.name}</Text>
+          <Text style={styles.deviceText}>
+            {`${item.devices.length} ${t('devices').toLowerCase()}`}
+          </Text>
+        </View>
+      </View>
+    );
+  };
+
+  return (
+    <View style={styles.container}>
+      <HeaderCustom title={t('rearrange_sub_unit')} isShowSeparator />
+      <Text style={styles.hintText}>{t('rearrange_sub_unit_hint')}</Text>
+      <View style={styles.flatList}>
+        <FlatListDnD
+          data={reorderItems}
+          extraData={reorderItems}
+          setData={setReorderItems}
+          renderItem={renderItem}
+        />
+      </View>
+      <ViewButtonBottom
+        leftTitle={t('cancel')}
+        onLeftClick={() => goBack()}
+        rightTitle={t('save')}
+        rightDisabled={isEqual(stations, reorderItems)}
+        onRightClick={handleOnSave}
+        isPreventDoubleTouch
+        wrapStyle={styles.bottomButtonWrapper}
+      />
+    </View>
+  );
+};
+
+export default RearrangeSubUnit;

package/src/screens/SubUnit/RearrrageSubUnitStyle.js

@@ -0,0 +1,65 @@
+import { Colors } from '../../configs';
+import { StyleSheet } from 'react-native';
+
+export default StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: Colors.White,
+  },
+  border: {
+    borderRadius: 5,
+    borderColor: Colors.Gray6,
+    borderWidth: 1,
+    padding: 20,
+    backgroundColor: Colors.White,
+    shadowColor: Colors.Black,
+    shadowOffset: {
+      width: 0,
+      height: 10,
+    },
+    shadowOpacity: 0.23,
+    shadowRadius: 11.27,
+    elevation: 4,
+  },
+  flatList: {
+    flex: 0.95,
+    marginBottom: 10,
+  },
+  isDragging: {
+    borderBottomWidth: 1,
+    borderColor: Colors.Red,
+  },
+  itemWrapper: {
+    flexDirection: 'row',
+    marginBottom: 20,
+    marginHorizontal: 16,
+    backgroundColor: Colors.White,
+  },
+  indexWrapper: {
+    flexDirection: 'column',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  subUnitWrapper: {
+    flex: 1,
+    marginLeft: 10,
+    justifyContent: 'center',
+  },
+  hintText: {
+    marginHorizontal: 16,
+    marginTop: 10,
+  },
+  indexText: {
+    fontSize: 16,
+    lineHeight: 24,
+    fontWeight: 'bold',
+  },
+  deviceText: {
+    fontSize: 14,
+    lineHeight: 20,
+    color: Colors.Gray7,
+  },
+  bottomButtonWrapper: {
+    backgroundColor: Colors.White,
+  },
+});

package/src/screens/SubUnit/__test__/ManageSubUnit.test.js

@@ -22,26 +22,29 @@ const wrapComponent = (route) => (
 );
 
 describe('Test ManageSubUnit', () => {
-  let tree;
+  let tree, route, data;
   const mockedNavigate = useNavigation().navigate;
 
+  beforeEach(() => {
+    route = {
+      params: { unit: { id: 1, name: 'unit 1' } },
+    };
+    data = [{ id: 1, name: 'station', devices: [{ id: 1, name: 'device' }] }];
+  });
+
   afterEach(() => {
     mockedNavigate.mockClear();
     mock.reset();
   });
 
   it('render ManageSubUnit', async () => {
-    let route = {
-      params: { unit: { id: 1, name: 'unit 1' } },
-    };
-    const data = [{ id: 1, name: 'sensor' }];
     mock.onGet(API.UNIT.UNIT_DETAIL(1)).reply(200, { stations: data });
     await act(async () => {
       tree = await create(wrapComponent(route));
     });
     const instance = tree.root;
     const subUnitScrollViews = instance.findAllByType(ScrollView);
-    expect(subUnitScrollViews).toHaveLength(2);
+    expect(subUnitScrollViews).toHaveLength(1);
     const rowItem = instance.findAllByType(RowItem);
     expect(rowItem).toHaveLength(1);
     await act(async () => {
@@ -49,19 +52,13 @@ describe('Test ManageSubUnit', () => {
     });
     expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.UnitStack, {
       params: {
-        station: { id: 1, name: 'sensor' },
-        unit: {
-          id: 1,
-          name: 'unit 1',
-        },
+        station: data[0],
+        unit: route.params.unit,
       },
-      screen: 'EditSubUnit',
+      screen: Routes.EditSubUnit,
     });
   });
   it('ManageSubUnit add sub unit', async () => {
-    let route = {
-      params: { unit: { id: 1, name: 'unit 1' } },
-    };
     await act(async () => {
       tree = await create(wrapComponent(route));
     });
@@ -76,12 +73,31 @@ describe('Test ManageSubUnit', () => {
     });
     expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.AddSubUnitStack, {
       params: {
-        unit: {
-          id: 1,
-          name: 'unit 1',
-        },
+        unit: route.params.unit,
       },
       screen: Routes.AddSubUnit,
     });
   });
+  it('ManageSubUnit rearrange sub unit', async () => {
+    mock.onGet(API.UNIT.UNIT_DETAIL(1)).reply(200, { stations: data });
+    await act(async () => {
+      tree = await create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const buttonRearrangeSubUnit = instance.find(
+      (el) =>
+        el.props.accessibilityLabel === AccessibilityLabel.REARRANGE_SUB_UNIT &&
+        el.type === TouchableOpacity
+    );
+    await act(async () => {
+      buttonRearrangeSubUnit.props.onPress();
+    });
+    expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.UnitStack, {
+      params: {
+        unit: route.params.unit,
+        stations: data,
+      },
+      screen: Routes.RearrangeSubUnit,
+    });
+  });
 });

package/src/screens/SubUnit/__test__/RearrangeSubUnit.test.js

@@ -0,0 +1,129 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import { act } from '@testing-library/react-hooks';
+import { API } from '../../../configs';
+import { ViewButtonBottom } from '../../../commons';
+import { SCProvider } from '../../../context';
+import { mockSCStore } from '../../../context/mockStore';
+import api from '../../../utils/Apis/axios';
+import RearrageSubUnit from '../RearrageSubUnit';
+import MockAdapter from 'axios-mock-adapter';
+import { useNavigation } from '@react-navigation/native';
+import { ToastBottomHelper } from '../../../utils/Utils';
+import DraggableFlatList from 'react-native-draggable-flatlist';
+
+const mock = new MockAdapter(api.axiosInstance);
+
+const wrapComponent = (route) => (
+  <SCProvider initState={mockSCStore({})}>
+    <RearrageSubUnit route={route} />
+  </SCProvider>
+);
+
+describe('Test RearrangeSubUnit', () => {
+  let tree, route;
+  const mockGoBack = useNavigation().goBack;
+
+  beforeEach(() => {
+    route = {
+      params: {
+        unit: { id: 1, name: 'unit 1' },
+        stations: [
+          { id: 1, name: 'station 1', devices: [{ id: 1, name: 'device 1' }] },
+          { id: 2, name: 'station 2', devices: [{ id: 1, name: 'device 2' }] },
+        ],
+      },
+    };
+  });
+  afterEach(() => {
+    mockGoBack.mockClear();
+    mock.reset();
+  });
+
+  it('test render RearrageSubUnit', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent(route));
+    });
+
+    const spyToastSuccess = jest.spyOn(ToastBottomHelper, 'success');
+    mock.onPost(API.SUB_UNIT.ORDER_SUB_UNITS(1)).reply(200);
+
+    const instance = tree.root;
+    const flatListDnD = instance.findByType(DraggableFlatList);
+    const viewButtonBottom = instance.findByType(ViewButtonBottom);
+
+    expect(flatListDnD.props.data).toEqual(route.params.stations);
+
+    const swappedStations = [
+      { id: 2, name: 'station 2', devices: [{ id: 1, name: 'device 2' }] },
+      { id: 1, name: 'station 1', devices: [{ id: 1, name: 'device 1' }] },
+    ];
+
+    await act(async () => {
+      flatListDnD.props.onDragEnd({ data: swappedStations });
+    });
+
+    await act(async () => {
+      viewButtonBottom.props.onRightClick();
+    });
+
+    expect(mock.history.post).toHaveLength(1);
+    expect(mock.history.post[0].data).toEqual(
+      JSON.stringify({ id_order_sub_units: [2, 1] })
+    );
+    expect(spyToastSuccess).toHaveBeenCalledTimes(1);
+    expect(mockGoBack).toHaveBeenCalled();
+    expect(flatListDnD.props.data).toEqual(swappedStations);
+  });
+  it('test click cancel and save button is disabled', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent(route));
+    });
+
+    const instance = tree.root;
+    const viewButtonBottom = instance.findByType(ViewButtonBottom);
+
+    expect(viewButtonBottom.props.rightDisabled).toEqual(true);
+    await act(async () => {
+      viewButtonBottom.props.onLeftClick();
+    });
+
+    expect(mockGoBack).toHaveBeenCalled();
+    expect(mock.history.post).toHaveLength(0);
+  });
+
+  it('test call api error', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent(route));
+    });
+    const spyToastError = jest.spyOn(ToastBottomHelper, 'error');
+    mock.onPost(API.SUB_UNIT.ORDER_SUB_UNITS(1)).reply(400);
+
+    const instance = tree.root;
+    const flatListDnD = instance.findByType(DraggableFlatList);
+    const viewButtonBottom = instance.findByType(ViewButtonBottom);
+
+    expect(flatListDnD.props.data).toEqual(route.params.stations);
+
+    const swappedStations = [
+      { id: 2, name: 'station 2', devices: [{ id: 1, name: 'device 2' }] },
+      { id: 1, name: 'station 1', devices: [{ id: 1, name: 'device 1' }] },
+    ];
+
+    await act(async () => {
+      flatListDnD.props.onDragEnd({ data: swappedStations });
+    });
+
+    await act(async () => {
+      viewButtonBottom.props.onRightClick();
+    });
+
+    expect(mock.history.post).toHaveLength(1);
+    expect(mock.history.post[0].data).toEqual(
+      JSON.stringify({ id_order_sub_units: [2, 1] })
+    );
+    expect(spyToastError).toHaveBeenCalledTimes(1);
+    expect(mockGoBack).toHaveBeenCalledTimes(0);
+    expect(flatListDnD.props.data).toEqual(swappedStations);
+  });
+});

package/src/screens/SubUnit/hooks/__test__/useManageSubUnit.test.js

@@ -10,14 +10,13 @@ describe('Test Manage Access', () => {
   const unit = { id: 1, name: 'unit name' };
 
   it('Test init', async () => {
-    const { result } = renderHook(() => useManageSubUnit(unit));
+    const { result } = renderHook(() => useManageSubUnit(unit.id));
     expect(result.current.stations).toEqual([]);
-    expect(result.current.isLoading).toBeFalsy();
-    expect(result.current.isRefreshing).toBeFalsy();
+    expect(result.current.refreshing).toBeFalsy();
   });
 
   it('Test onRefresh', async () => {
-    const { result } = renderHook(() => useManageSubUnit(unit));
+    const { result } = renderHook(() => useManageSubUnit(unit.id));
     mock.onGet(API.UNIT.UNIT_DETAIL(unit?.id)).reply(200, [
       {
         id: 1,
@@ -55,15 +54,15 @@ describe('Test Manage Access', () => {
     await act(async () => {
       result.current.onRefresh();
     });
-    expect(result.current.isRefreshing).toBeFalsy();
+    expect(result.current.refreshing).toBeFalsy();
   });
 
   it('Test get unit failure', async () => {
-    const { result } = renderHook(() => useManageSubUnit(unit));
+    const { result } = renderHook(() => useManageSubUnit(unit.id));
     mock.onGet(API.UNIT.UNIT_DETAIL(unit?.id)).reply(400);
     await act(async () => {
       result.current.onRefresh();
     });
-    expect(result.current.isRefreshing).toBeFalsy();
+    expect(result.current.refreshing).toBeFalsy();
   });
 });

package/src/screens/SubUnit/hooks/useManageSubUnit.js

@@ -2,34 +2,26 @@ import { useCallback, useState } from 'react';
 import { axiosGet } from '../../../utils/Apis/axios';
 import API from '../../../configs/API';
 
-export default (unit) => {
+export default (unit_id) => {
   const [stations, setStations] = useState([]);
-  const [isLoading, setIsLoading] = useState(false);
-  const [isRefresh, setRefresh] = useState(false);
+  const [refreshing, setRefreshing] = useState(false);
 
   const fetchData = useCallback(async () => {
-    setIsLoading(true);
+    setRefreshing(true);
     const { success, data } = await axiosGet(
-      API.UNIT.UNIT_DETAIL(unit?.id),
+      API.UNIT.UNIT_DETAIL(unit_id),
       {},
       true
     );
     if (success) {
       setStations(data?.stations);
     }
-    setIsLoading(false);
-  }, [unit]);
-
-  const onRefresh = useCallback(async () => {
-    setRefresh(true);
-    await fetchData();
-    setRefresh(false);
-  }, [fetchData]);
+    setRefreshing(false);
+  }, [unit_id]);
 
   return {
     stations,
-    isRefresh,
-    onRefresh,
-    isLoading,
+    refreshing,
+    onRefresh: fetchData,
   };
 };

package/src/screens/Unit/Detail.js

@@ -14,11 +14,7 @@ import Summaries from './Summaries';
 
 import Text from '../../commons/Text';
 import { API } from '../../configs';
-import {
-  useBlockBackAndroid,
-  useBoolean,
-  useIsOwnerOfUnit,
-} from '../../hooks/Common';
+import { useBlockBack, useBoolean, useIsOwnerOfUnit } from '../../hooks/Common';
 import { useFavorites } from './hook/useFavorites';
 import { useUnitConnectRemoteDevices } from './hook/useUnitConnectRemoteDevices';
 import { useValueEvaluations } from '../../hooks/IoT';
@@ -209,7 +205,7 @@ const UnitDetail = ({ route }) => {
     [navigate]
   );
 
-  useBlockBackAndroid(
+  useBlockBack(
     isSuccessfullyConnected ? RouterHardware(Routes.Dashboard) : goBack
   );
   const user = useSCContextSelector((state) => state?.auth?.account?.user);

package/src/screens/Unit/ManageUnit.js

@@ -193,7 +193,7 @@ const ManageUnit = ({ route }) => {
               <ButtonWrapper
                 onPress={goToManageSubUnit}
                 title={t('manage_sub_units')}
-                value={`${SensorNumbers} sub-units`}
+                value={`${SensorNumbers} ${t('sub_units').toLowerCase()}`}
                 accessibilityLabel={
                   AccessibilityLabel.MANAGE_UNIT_GO_TO_SUBUNIT
                 }

package/src/utils/Functions/__test__/ShortEmail.test.js

@@ -4,3 +4,8 @@ it('Test shortEmailName function', async () => {
   const data = shortEmailName('emailExample@gmail.com');
   expect(data).toEqual('emailExample');
 });
+
+it('Test email null', async () => {
+  const data = shortEmailName(null);
+  expect(data).toEqual('');
+});

package/src/utils/I18n/translations/en.js

@@ -13,6 +13,7 @@ export default {
     'Please note that your personal data including records of your control of the connected devices and services ' +
     'will be shared with other members in the same unit.',
   add_user_invitation_sent: 'Invitation sent',
+  check: 'Check',
   cancel: 'Cancel',
   max_value: 'Max value',
   text_password: 'Password',
@@ -51,6 +52,7 @@ export default {
   text_all_locations: 'All locations',
   text_starred: 'Starred',
   text_new_unit: 'New Unit',
+  text_unit: 'Unit',
   text_good_morning: 'Good morning, {0}',
   text_good_afternoon: 'Good afternoon, {0}',
   text_good_evening: 'Good evening, {0}',
@@ -79,7 +81,7 @@ export default {
   text_visibility: 'Visibility',
   text_air_quality: 'Air Quality',
   sub_units: 'Sub-units',
-  text_no_sub_unit_yet: "No sub-units yet. Tap '+’ to add new sub-units.",
+  text_no_sub_unit_yet: "No Sub-Units yet. Tap '+’ to add new sub-units.",
   text_no_units: 'No units',
   text_last_7_days: 'Last 7 days',
   text_average: 'Average',
@@ -411,8 +413,8 @@ export default {
   choose_on_map: 'Choose on map',
   plan_and_zoom_to_adjust: 'Plan and zoom to adjust',
   add_remote_control: 'Add remote control',
-  manage_sub_unit: 'Manage sub-unit',
-  remove_sub_unit: 'Remove sub-unit',
+  manage_sub_unit: 'Manage Sub-Unit',
+  remove_sub_unit: 'Remove Sub-Unit',
   text_ble_is_powered_on: 'Bluetooth is powered on',
   current_wind_speed: 'Current Wind Speed',
   history: 'History',
@@ -725,6 +727,13 @@ export default {
   title_notification: 'Subject: “Warning”',
   update_title_notification: 'Update title',
   update_message_notification: 'Update warning content',
+  email_content: 'E-mail content',
+  email_to: 'E-mail to',
+  subject: 'Subject',
+  message: 'Message...',
+  no_email: 'No email address',
+  update_title_email: 'Update title',
+  update_message_email: 'Update warning content',
   update_action: 'Update action',
   updated_action_order: 'Updated action order',
   message_notification:
@@ -978,7 +987,7 @@ export default {
   alert_send_error: 'Send alert fail!',
   unit_name: 'Unit name',
   location: 'Location',
-  manage_sub_units: 'Manage Sub-units',
+  manage_sub_units: 'Manage Sub-Unit',
   unit_wallpaper: 'Unit Wallpaper',
   tap_to_change: 'Tap to change',
   choose_location: 'Choose location',
@@ -1041,7 +1050,7 @@ export default {
   rename_automate: 'Rename automate',
   edit_sub_unit: 'Edit Sub-unit',
   no_sub_unit_yet: 'No sub-unit yet.',
-  'tap_+_to_add_new_sub_unit': 'Tap + to add new sub-unit.',
+  'tap_+_to_add_new_sub_unit': 'Tap + to add new Sub-Unit.',
   go_to_automate_scripts: 'Go to automate scripts',
   Script: 'Script',
   'One-Tap': 'One-Tap',
@@ -1065,6 +1074,7 @@ export default {
   send_email: 'Send e-mail',
   send_app_notification: 'Send app notification',
   delay_the_action: 'Delay the action',
+  email_the_action: 'Send e-mail',
   wait: 'Wait',
   set_timeout_seconds: 'Set timeout (seconds)',
   update_waiting_time: 'Update waiting time (seconds)',
@@ -1160,11 +1170,32 @@ export default {
   connecting: 'Connecting',
   connect_device: 'Connect Device',
   connect: 'Connect',
+  failed: 'Failed',
+  other: 'Other',
   server_error: 'Server Error',
   add_gateway_success: 'Add gateway success',
+  change_wifi: 'Change Wi-Fi',
+  change_wifi_success: 'Change Wi-Fi success',
+  change_wifi_failed: 'Change Wi-Fi failed',
+  gateway_need_to_be_connected:
+    'Gateway needs to be connected to make Wi-Fi changes',
   set_network: 'Set network',
-  select_wifi: 'Select your wifi network',
-  enter_wifi_password: 'Enter wifi password',
+  select_wifi: 'Select your Wi-Fi network',
+  enter_wifi_password: 'Enter Wi-Fi password',
+  enter_wifi_name_password: 'Enter Wi-Fi name and password',
+  connect_wifi: 'Connect Wi-Fi',
+  connect_to_wifi: 'Connect to Wi-Fi',
+  please_enter_wifi_name: 'Please enter Wi-Fi name',
+  please_enter_wifi_password: 'Please enter Wi-Fi password',
+  password_must_be_at_least_8_characters:
+    'Password must be at least 8 characters',
+  connection_timeout: 'Connection timeout',
+  you_have_successfully_connected_wifi:
+    'You have successfully connected to the Wi-Fi name (SSID)',
+  device_scaned: 'Device scaned',
+  select_device_and_connect: 'Select a device and press connect',
+  error_sending_data_to_local_device:
+    'Error sending data to local device. Please try again.',
   gateway_warning_content_1: 'To bring you good experiences, ',
   gateway_warning_content_2: 'your device needs a permanent wifi connection.',
   gateway_warning_content_3:
@@ -1302,6 +1333,8 @@ export default {
   zigbee: 'Zigbee',
   device_connect_remotely_to_the_gateway:
     'Device connected remotely to the gateway',
+  scan: 'Scan',
+  device_connected_to_local_network: 'Device connected to the local network',
   connect_wifi_asking:
     "By continuing, {appName} needs to connect to the device's Wifi. A message will appear asking you to connect.",
   previous: 'Previous',
@@ -1348,6 +1381,7 @@ export default {
   connection_methods: 'Connection methods',
   delete_gateway: 'Delete gateway',
   connection_time: 'Connection time',
+  board: 'Board',
   device_id: 'Device id',
   auth_token: 'Auth token',
   activate_date: 'Activate date',
@@ -1486,7 +1520,11 @@ export default {
   uri_invalid: 'URI invalid',
   when_value_is: 'Activates when "{config_name}" value is',
   template_not_supported: 'Widget "{template}" not yet supported',
-  invited_user: 'Invited user {user}',
+  invited_user: 'Invited user',
   enter_value: 'Enter value',
   enter_parameters: 'Enter parameters',
+  rearrange_sub_unit_hint:
+    'Press and hold the number and drag to rearrange the order of the Sub-Units',
+  rearrange_sub_unit: 'Rearrange Sub-Unit',
+  updated_sub_unit_order: 'Updated Sub-Units order successfully!',
 };