@eohjsc/react-native-smart-city 0.3.33 → 0.3.36

package/src/screens/EditActionsList/__tests__/index.test.js

@@ -0,0 +1,120 @@
+import React from 'react';
+import DraggableFlatList from 'react-native-draggable-flatlist';
+import { create, act } from 'react-test-renderer';
+import { SCProvider } from '../../../context';
+import { mockSCStore } from '../../../context/mockStore';
+import EditActionsList from '../index';
+import { AccessibilityLabel } from '../../../configs/Constants';
+import { TouchableOpacity } from 'react-native';
+import api from '../../../utils/Apis/axios';
+import MockAdapter from 'axios-mock-adapter';
+import API from '../../../configs/API';
+
+import { ModalBottom } from '../../../commons/Modal';
+
+const mockSetdata = jest.fn();
+const mockedNavigate = jest.fn();
+const mockGoBack = jest.fn();
+
+const wrapComponent = () => (
+  <SCProvider initState={mockSCStore({})}>
+    <EditActionsList />
+  </SCProvider>
+);
+const mock = new MockAdapter(api.axiosInstance);
+
+jest.mock('@react-navigation/native', () => {
+  return {
+    ...jest.requireActual('@react-navigation/native'),
+    useRoute: jest.fn().mockReturnValue({
+      params: {
+        data: [{ id: 1, sensor_name: 'abc', station_name: 'abc' }],
+        id: 1,
+        setData: mockSetdata,
+        unit: { id: 1, name: 'unit' },
+      },
+    }),
+    useNavigation: () => ({
+      navigate: mockedNavigate,
+      goBack: mockGoBack,
+    }),
+    useIsFocused: () => true,
+  };
+});
+
+jest.mock('react-native-parsed-text', () => () => []);
+
+describe('EditActionsList', () => {
+  let tree;
+
+  beforeEach(() => {
+    mockGoBack.mockClear();
+  });
+  test('render EditActionsList', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const draggableFlatList = instance.findAllByType(DraggableFlatList);
+    const modalBottom = instance.findAllByType(ModalBottom);
+    expect(draggableFlatList).toHaveLength(1);
+    expect(modalBottom).toHaveLength(1);
+  });
+  test('EditActionsList onPress cancel', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const buttonCancel = instance.find(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.BUTTON_CANCEL_EDIT_ACTION_LIST &&
+        el.type === TouchableOpacity
+    );
+    expect(buttonCancel).toBeDefined();
+    buttonCancel.props.onPress();
+    expect(mockGoBack).toHaveBeenCalled();
+  });
+  test('EditActionsList onPress save', async () => {
+    mock.onPut(API.AUTOMATE.ORDER_SCRIPT_ACTION(1)).reply(200);
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const buttonSave = instance.find(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.BUTTON_SAVE_EDIT_ACTION_LIST &&
+        el.type === TouchableOpacity
+    );
+    expect(buttonSave).toBeDefined();
+    buttonSave.props.onPress();
+    expect(mock.history.put).toHaveLength(1);
+  });
+  test('EditActionsList onPress remove', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const buttonRemove = instance.find(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.BUTTON_REMOVE_EDIT_ACTION_LIST &&
+        el.type === TouchableOpacity
+    );
+    expect(buttonRemove).toBeDefined();
+    buttonRemove.props.onPress();
+  });
+  test('EditActionsList modal onPress remove', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const modalBottom = instance.findAllByType(ModalBottom);
+    modalBottom[0].props.onRemove();
+
+    mock.onDelete(API.AUTOMATE.DELETE_SCRIPT_ACTION(1, 1)).reply(200);
+    expect(mock.history.delete).toHaveLength(1);
+    modalBottom[0].props.onClose();
+  });
+});

package/src/screens/EditActionsList/index.js

@@ -1,4 +1,4 @@
-import React, { useState, useCallback } from 'react';
+import React, { memo, useState, useCallback } from 'react';
 import { View, TouchableOpacity } from 'react-native';
 import DraggableFlatList from 'react-native-draggable-flatlist';
 import { useNavigation, useRoute } from '@react-navigation/native';
@@ -15,8 +15,9 @@ import Close from '../../../assets/images/Close.svg';
 import { axiosDelete, axiosPut } from '../../utils/Apis/axios';
 import { ModalBottom } from '../../commons/Modal';
 import { ToastBottomHelper } from '../../utils/Utils';
+import { AccessibilityLabel } from '../../configs/Constants';
 
-const EditActionsList = () => {
+const EditActionsList = memo(() => {
   const t = useTranslations();
   const { goBack } = useNavigation();
   const { params = {} } = useRoute() || {};
@@ -115,6 +116,9 @@ const EditActionsList = () => {
             </Text>
           </View>
           <TouchableOpacity
+            accessibilityLabel={
+              AccessibilityLabel.BUTTON_REMOVE_EDIT_ACTION_LIST
+            }
             onPress={onPressRemove({
               id: item?.id,
               actionName: item?.sensor_name,
@@ -148,12 +152,18 @@ const EditActionsList = () => {
         />
       </View>
       <View style={styles.wrapBottom}>
-        <TouchableOpacity onPress={onPressCancel}>
+        <TouchableOpacity
+          onPress={onPressCancel}
+          accessibilityLabel={AccessibilityLabel.BUTTON_CANCEL_EDIT_ACTION_LIST}
+        >
           <Text type="H4" hilight semibold>
             {t('cancel')}
           </Text>
         </TouchableOpacity>
-        <TouchableOpacity onPress={onPressSave}>
+        <TouchableOpacity
+          onPress={onPressSave}
+          accessibilityLabel={AccessibilityLabel.BUTTON_SAVE_EDIT_ACTION_LIST}
+        >
           <Text type="H4" hilight semibold>
             {t('save')}
           </Text>
@@ -189,6 +199,6 @@ const EditActionsList = () => {
       </ModalBottom>
     </View>
   );
-};
+});
 
 export default EditActionsList;

package/src/screens/ScanChipQR/components/InvalidQRCode/index.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { StyleSheet } from 'react-native';
+
+import { useTranslations } from '../../../../hooks/Common/useTranslations';
+import Text from '../../../../commons/Text';
+import { ViewButtonBottom } from '../../../../commons';
+import BottomSheet from '../../../../commons/BottomSheet';
+
+const InvalidQRCode = ({ isInvalidQrCode, goBack, onRetry }) => {
+  const t = useTranslations();
+
+  return (
+    <BottomSheet isVisible={isInvalidQrCode} title={t('invalid_qr_code')}>
+      <Text style={styles.warningContainer}>
+        {t('invalid_qr_code_warning')}
+      </Text>
+      <ViewButtonBottom
+        leftTitle={t('cancel')}
+        onLeftClick={goBack}
+        rightTitle={t('retry')}
+        onRightClick={onRetry}
+      />
+    </BottomSheet>
+  );
+};
+
+export default InvalidQRCode;
+
+const styles = StyleSheet.create({
+  warningContainer: {
+    paddingHorizontal: 16,
+  },
+});

package/src/screens/ScanChipQR/components/QRScan/index.js

@@ -46,7 +46,7 @@ const VerifingQRCode = memo(() => {
   );
 });
 
-const QRScan = ({ onScan }) => {
+const QRScan = ({ isScanReady = true, onScan }) => {
   const t = useTranslations();
   const navigation = useNavigation();
   const isFocused = useIsFocused();
@@ -55,12 +55,14 @@ const QRScan = ({ onScan }) => {
 
   const onBarCodeRead = useCallback(
     (e) => {
-      setLoading(true);
-      if (!loading) {
-        onScan(e.data, setLoading);
+      if (isScanReady) {
+        setLoading(true);
+        if (!loading) {
+          onScan(e.data, setLoading);
+        }
       }
     },
-    [loading, onScan]
+    [isScanReady, loading, onScan]
   );
 
   const onPressClose = useCallback(() => {

package/src/screens/SharedUnit/__test__/ShareUnit.test.js

@@ -4,6 +4,12 @@ import SharedUnit from '../index';
 import Modal from 'react-native-modal';
 import { SCProvider } from '../../../context';
 import { mockSCStore } from '../../../context/mockStore';
+import { AccessibilityLabel } from '../../../configs/Constants';
+import MockAdapter from 'axios-mock-adapter';
+import api from '../../../utils/Apis/axios';
+import { API } from '../../../configs';
+
+const mock = new MockAdapter(api.axiosInstance);
 
 const wrapComponent = () => (
   <SCProvider initState={mockSCStore({})}>
@@ -16,9 +22,11 @@ jest.mock('react-redux', () => ({
   useSelector: jest.fn(),
 }));
 
+const mockSetSharedUnits = jest.fn();
 jest.mock('react', () => ({
   ...jest.requireActual('react'),
   useLayoutEffect: jest.fn(),
+  useState: jest.fn((init) => [init, mockSetSharedUnits]),
 }));
 
 jest.mock('react-native-onesignal', () => {
@@ -37,4 +45,21 @@ describe('test SharedUnit', () => {
     const modalShareds = instance.findAllByType(Modal);
     expect(modalShareds[0]).not.toBeUndefined();
   });
+
+  test('render touch item filter', async () => {
+    mock.onGet(API.UNIT.FILTER_SHARED_UNITS()).reply(200, [{}]);
+
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const item = instance.findAll(
+      (el) =>
+        el.props.accessibilityLabel === AccessibilityLabel.FILTER_SHARING_ITEM
+    );
+    await act(async () => {
+      item[0].props.onPress();
+    });
+    expect(mockSetSharedUnits).toBeCalled();
+  });
 });

package/src/screens/SharedUnit/index.js

@@ -12,6 +12,7 @@ import {
   useBoolean,
   useBlockBackAndroid,
 } from '../../hooks/Common';
+import { AccessibilityLabel } from '../../configs/Constants';
 
 import styles from './styles';
 import TabHeader from './TabHeader';
@@ -185,6 +186,7 @@ const Shared = () => {
                     style={styles.row}
                     onPress={() => onFilter(item.filter, item.textFilter)}
                     key={`filter-${index}`}
+                    accessibilityLabel={`${AccessibilityLabel.FILTER_SHARING_ITEM}`}
                   >
                     <Text
                       style={

package/src/screens/Sharing/Components/DeviceItem.js

@@ -1,5 +1,12 @@
 import React, { memo, useEffect, useMemo, useState } from 'react';
-import { View, Text, LayoutAnimation, Platform, UIManager } from 'react-native';
+import {
+  View,
+  Text,
+  LayoutAnimation,
+  Platform,
+  UIManager,
+  TouchableOpacity,
+} from 'react-native';
 import { IconOutline } from '@ant-design/icons-react-native';
 import { Colors } from '../../../configs';
 import styles from './Styles/DeviceItemStyles';
@@ -13,6 +20,7 @@ const DeviceItem = ({
   isRenderSeparated,
   onTickedChild,
   onTickedDevice,
+  onTickedDeviceIcon,
   isItemExpanded,
   toggleItem,
   idGroup,
@@ -57,6 +65,14 @@ const DeviceItem = ({
       );
   };
 
+  const isCheckedIcon = useMemo(() => {
+    return dataConfig.some((i) => i.isChecked);
+  }, [dataConfig]);
+
+  const handleOnTickedIcon = () => {
+    onTickedDeviceIcon && onTickedDeviceIcon(idGroup, id, isCheckedIcon);
+  };
+
   const handleOnTickedDevice = () => {
     onTickedDevice && onTickedDevice(idGroup, id, !isChecked);
   };
@@ -88,13 +104,13 @@ const DeviceItem = ({
 
   return (
     <View style={[styles.wrap, !isRenderSeparated && styles.isRenderSeparated]}>
-      <FImage
-        source={{ uri: icon_kit }}
-        style={styles.viewLeft}
-        tintColor={
-          dataConfig.some((i) => i.isChecked) ? Colors.Primary : Colors.Gray
-        }
-      />
+      <TouchableOpacity onPress={handleOnTickedIcon}>
+        <FImage
+          source={{ uri: icon_kit }}
+          style={styles.viewLeft}
+          tintColor={isCheckedIcon ? Colors.Primary : Colors.Gray}
+        />
+      </TouchableOpacity>
       <View style={styles.wrapRight}>
         <View style={styles.viewRight}>
           <Text

package/src/screens/Sharing/SelectPermission.js

@@ -84,17 +84,6 @@ const SelectPermission = ({ route }) => {
     }
   };
 
-  const stationCheck = (data) => {
-    for (let station of data) {
-      if (station.devices.length) {
-        station.isChecked = !station.devices.some((i) => !i.isChecked);
-      }
-    }
-    setIsTickAllDevices(!dataStationTemp.some((i) => !i.isChecked));
-    dataStationTemp = data;
-    setDataStations(data);
-  };
-
   const onTickedChild = (
     idGroup,
     deviceId,
@@ -114,8 +103,18 @@ const SelectPermission = ({ route }) => {
       device.read_configs.some((i) => !i.isChecked) ||
       device.actions.some((i) => !i.isChecked)
     );
-
-    stationCheck(data);
+    for (let station of data) {
+      if (station.devices.length) {
+        station.isChecked = station.devices.some(
+          (i) =>
+            i.read_configs.some((r) => r.isChecked) ||
+            i.actions.some((a) => a.isChecked)
+        );
+      }
+    }
+    setIsTickAllDevices(!dataStationTemp.some((i) => !i.isChecked));
+    dataStationTemp = data;
+    setDataStations(data);
   };
 
   const onTickedDevice = (idGroup, deviceId, isChecked) => {
@@ -125,7 +124,48 @@ const SelectPermission = ({ route }) => {
 
     device.isChecked = isChecked;
 
-    stationCheck(data);
+    for (let station of data) {
+      if (station.devices.length) {
+        station.isChecked = !station.devices.some((i) => !i.isChecked);
+      }
+    }
+    setIsTickAllDevices(!dataStationTemp.some((i) => !i.isChecked));
+    dataStationTemp = data;
+    setDataStations(data);
+  };
+
+  const onTickedDeviceIcon = (idGroup, deviceId, isChecked) => {
+    let data = [...dataStationTemp];
+    const group = data.find((i) => i.id === idGroup);
+    const device = group.devices.find((i) => i.id === deviceId);
+    const index = data.findIndex((item) => item.id === idGroup);
+
+    data[index] = {
+      ...data[index],
+      devices: data[index]?.devices.map((i) => {
+        if (i.id === device?.id) {
+          return {
+            ...i,
+            isChecked: !isChecked,
+            actions: i.actions.map((j) => ({ ...j, isChecked: !isChecked })),
+            read_configs: i.read_configs.map((j) => ({
+              ...j,
+              isChecked: !isChecked,
+            })),
+          };
+        }
+        return { ...i };
+      }),
+    };
+
+    data[index] = {
+      ...data[index],
+      isChecked:
+        !data[index]?.devices.length ===
+        !data[index]?.devices.filter((i) => i.isChecked).length,
+    };
+
+    setDataStations(data);
   };
 
   const toggleDeviceItem = (deviceItem) => () => {
@@ -142,15 +182,8 @@ const SelectPermission = ({ route }) => {
   const autoCheckedGroup = useCallback(async () => {
     if (isUpdateSharedDevice) {
       if (hasDataChecked) {
-        const stationIds = object_Ids(dataDeviceShared)?.stationIds;
-        const deviceIds = object_Ids(dataDeviceShared)?.deviceIds;
-        const actionIds = object_Ids(dataDeviceShared)?.actionIds;
-        const configIds = object_Ids(dataDeviceShared)?.configIds;
-        const device_checked = [];
-        const action_checked = [];
-        const config_checked = [];
-        const action_temp = [];
-        const config_temp = [];
+        const { stationIds, deviceIds, actionIds, configIds } =
+          object_Ids(dataDeviceShared);
         for (let station in dataStations) {
           for (let item in dataStations[station].devices) {
             const itemTemp = dataStations[station].devices[item];
@@ -158,54 +191,34 @@ const SelectPermission = ({ route }) => {
               ...itemTemp,
               isChecked: deviceIds.includes(itemTemp?.id),
               actions: itemTemp.actions.map((i) => {
-                if (actionIds?.includes(i.id)) {
-                  action_checked.push(i);
-                }
-                action_temp.push(i);
                 return {
                   ...i,
                   isChecked: actionIds?.includes(i.id),
                 };
               }),
               read_configs: itemTemp.read_configs.map((i) => {
-                if (configIds?.includes(i.id)) {
-                  config_checked.push(i);
-                }
-                config_temp.push(i);
                 return {
                   ...i,
                   isChecked: configIds?.includes(i.id),
                 };
               }),
             };
-            if (dataStations[station].devices[item]?.isChecked) {
-              device_checked.push(dataStations[station].devices[item]);
-            }
           }
         }
-        const check_action_config = () => {
-          return (
-            action_checked?.length === action_temp?.length &&
-            config_checked?.length === config_temp?.length
-          );
-        };
         const data = dataStations?.map((i) => {
+          const devices = i?.devices;
+          const devices_checked = i?.devices?.filter(
+            (device) => device?.isChecked
+          );
           return {
             ...i,
             isChecked:
-              check_action_config() &&
-              i?.devices?.length === device_checked?.length &&
+              !devices.length === !devices_checked.length &&
               stationIds.includes(i.id),
           };
         });
-        const deviceIdsDefault = object_Ids(data)?.deviceIds;
-        const stationIdsDefault = object_Ids(data)?.stationIds;
         setDataStations(data);
-        setIsTickAllDevices(
-          check_action_config() &&
-            deviceIdsDefault?.length === deviceIds?.length &&
-            stationIdsDefault?.length === stationIds?.length
-        );
+        setIsTickAllDevices(data?.length === stationIds?.length);
         setHasDataChecked(false);
       }
     }
@@ -231,6 +244,7 @@ const SelectPermission = ({ route }) => {
               isRenderSeparated={index !== devices?.length - 1}
               onTickedChild={onTickedChild}
               onTickedDevice={onTickedDevice}
+              onTickedDeviceIcon={onTickedDeviceIcon}
               isItemExpanded={expandedItemIds.includes(i.id)}
               toggleItem={toggleDeviceItem(i)}
               idGroup={id}
@@ -331,33 +345,35 @@ const SelectPermission = ({ route }) => {
 
   const getShareUnitPermission = useCallback(async () => {
     if (isUpdateSharedDevice && dataStations?.length > 0) {
-      const response = await axiosGet(
+      const { success, data } = await axiosGet(
         API.SHARE.UNIT_MEMBER_SHARE_DEVICE(unit?.id, member?.id)
       );
-      if (response?.success) {
-        setDataDeviceShared(response?.data);
+      if (success) {
+        setDataDeviceShared(data);
         setHasDataChecked(true);
       }
     }
   }, [dataStations?.length, isUpdateSharedDevice, member?.id, unit?.id]);
 
-  useEffect(() => {
-    getShareUnitPermission();
-  }, [getShareUnitPermission]);
+  const getUnitPermission = useCallback(async () => {
+    const { success, data } = await axiosGet(
+      API.SHARE.UNIT_PERMISSIONS(unit?.id)
+    );
+    if (success) {
+      setDataStations(data);
+    }
+    setLoading(false);
+  }, [unit?.id]);
 
   useEffect(() => {
     (async () => {
       if (!unit) {
         return;
       }
-
-      const { success, data } = await axiosGet(
-        API.SHARE.UNIT_PERMISSIONS(unit.id)
-      );
-      success && setDataStations(data);
-      setLoading(false);
+      await getUnitPermission();
+      await getShareUnitPermission();
     })();
-  }, [dataStations?.length, isUpdateSharedDevice, member?.id, unit]);
+  }, [getShareUnitPermission, getUnitPermission, unit]);
 
   useEffect(() => {
     dataStationTemp = dataStations;

package/src/screens/Sharing/__test__/SelectPermission.test.js

@@ -43,7 +43,7 @@ const wrapComponent = (route) => (
 
 describe('Test SelectPermission', () => {
   let tree;
-  let route = { params: { unit: null } };
+  let route = { params: { unit: { id: 1, name: 'unit 1' } } };
   let listDevices = [
     {
       id: 204,
@@ -110,7 +110,31 @@ describe('Test SelectPermission', () => {
     expect(TextElement[2].props.children).toBe('No data');
   });
 
-  it('test get unit fail', () => {
+  it('test unit get permission default', () => {
+    mocSetdata();
+    const routes = { params: { unit: { id: 1, name: '123' } } };
+    mock.onGet(API.SHARE.UNIT_PERMISSIONS(1)).reply(200);
+    act(() => {
+      tree = create(wrapComponent(routes));
+    });
+    const instance = tree.root;
+    const FlatListElement = instance.findAllByType(FlatList);
+    expect(FlatListElement).toHaveLength(1);
+  });
+
+  it('test unit fail default', () => {
+    mockLoading();
+    const routes = { params: { unit: null } };
+    mock.onGet(API.SHARE.UNIT_PERMISSIONS(1)).reply(400);
+    act(() => {
+      tree = create(wrapComponent(routes));
+    });
+    const instance = tree.root;
+    const TextElement = instance.findAllByType(Text);
+    expect(TextElement[2].props.children).toBe('No data');
+  });
+
+  it('test get unit fail shared', () => {
     mockLoading();
     route.params.unit = 1;
     mock.onGet(API.SHARE.UNIT_MEMBER_SHARE_DEVICE(1, 1)).reply(400);
@@ -172,6 +196,35 @@ describe('Test SelectPermission', () => {
     expect(mockSetDataStations).toBeCalled();
   });
 
+  it('test onTickedDevice function', () => {
+    mocSetdata();
+    act(() => {
+      tree = create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const DeviceItemElement = instance.findAllByType(DeviceItem);
+    expect(DeviceItemElement).toHaveLength(1);
+    act(() => {
+      DeviceItemElement[0].props.onTickedDevice(204, 123, true);
+      DeviceItemElement[0].props.toggleItem(123);
+    });
+    expect(mockSetDataStations).toBeCalled();
+  });
+
+  it('test onTickedDeviceIcon function', () => {
+    mocSetdata();
+    act(() => {
+      tree = create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const DeviceItemElement = instance.findAllByType(DeviceItem);
+    expect(DeviceItemElement).toHaveLength(1);
+    act(() => {
+      DeviceItemElement[0].props.onTickedDeviceIcon(204, 123, true);
+    });
+    expect(mockSetDataStations).toBeCalled();
+  });
+
   it('test ViewButtonBottom', () => {
     mocSetdata();
     act(() => {