@eohjsc/react-native-smart-city 0.5.0 → 0.5.2-rc

package/src/screens/Sharing/SharingSelectPermission.js

@@ -1,409 +0,0 @@
-import React, { memo, useCallback, useEffect, useMemo, useState } from 'react';
-import { View, FlatList, Alert, ActivityIndicator } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
-
-import { useTranslations } from '../../hooks/Common/useTranslations';
-import ViewButtonBottom from '../../commons/ViewButtonBottom';
-import Text from '../../commons/Text';
-import { DeviceItem, TitleCheckBox } from './Components';
-import styles from './Styles/SelectPermissionStyles';
-import { axiosGet, axiosPost } from '../../utils/Apis/axios';
-import { objectIds } from '../../utils/Utils';
-import Routes from '../../utils/Route';
-import { API, Colors } from '../../configs';
-import { AccessibilityLabel } from '../../configs/Constants';
-
-let dataStationTemp = [];
-
-const SharingSelectPermission = ({ route }) => {
-  const t = useTranslations();
-  const { unit, type = '', member } = route?.params || {};
-  const navigation = useNavigation();
-  const [dataStations, setDataStations] = useState([]);
-  const [isTickAllDevices, setIsTickAllDevices] = useState(false);
-  const [expandedItemIds, setExpandedItemIds] = useState([]);
-  const [loading, setLoading] = useState(true);
-  const [hasDataChecked, setHasDataChecked] = useState(false);
-  const [dataDeviceShared, setDataDeviceShared] = useState([]);
-
-  const isUpdateSharedDevice = useMemo(() => {
-    return type === 'update_shared';
-  }, [type]);
-
-  const onTickTitle = (idGroup, isChecked, id) => {
-    if (!idGroup) {
-      setIsTickAllDevices(isChecked);
-      const data = dataStations.map((i) => ({
-        ...i,
-        isChecked,
-      }));
-      for (let station in data) {
-        for (let item in data[station].devices) {
-          const itemTemp = data[station].devices[item];
-          data[station].devices[item] = {
-            ...itemTemp,
-            isChecked,
-            actions: itemTemp.actions.map((i) => ({
-              ...i,
-              isChecked,
-            })),
-            read_configs: itemTemp.read_configs.map((i) => ({
-              ...i,
-              isChecked,
-            })),
-          };
-        }
-      }
-      setDataStations(data);
-    } else {
-      const data = [...dataStationTemp];
-
-      const index = data.findIndex((item) => item.id === idGroup);
-
-      data[index] = {
-        ...data[index],
-        isChecked,
-        devices: data[index]?.devices.map((i) => ({
-          ...i,
-          isChecked,
-          actions: i.actions.map((j) => ({ ...j, isChecked })),
-          read_configs: i.read_configs.map((j) => ({ ...j, isChecked })),
-        })),
-      };
-      setDataStations(data);
-      setIsTickAllDevices(!data.some((item) => !item.isChecked));
-    }
-  };
-
-  const onTickedChild = (
-    idGroup,
-    deviceId,
-    childId,
-    isChecked,
-    isReadConfig
-  ) => {
-    let data = [...dataStationTemp];
-    const group = data.find((i) => i.id === idGroup);
-    const device = group.devices.find((i) => i.id === deviceId);
-    const child = device[`${isReadConfig ? 'read_configs' : 'actions'}`].find(
-      (i) => i.id === childId
-    );
-
-    child.isChecked = isChecked;
-    device.isChecked = !(
-      device.read_configs.some((i) => !i.isChecked) ||
-      device.actions.some((i) => !i.isChecked)
-    );
-    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) => {
-    let data = [...dataStationTemp];
-    const group = data.find((i) => i.id === idGroup);
-    const device = group.devices.find((i) => i.id === deviceId);
-
-    device.isChecked = isChecked;
-
-    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) => () => {
-    setExpandedItemIds((ids) => {
-      const index = ids.indexOf(deviceItem.id);
-      if (index !== -1) {
-        return [...ids.slice(0, index), ...ids.slice(index + 1)];
-      } else {
-        return [...ids, deviceItem.id];
-      }
-    });
-  };
-
-  const autoCheckedGroup = useCallback(async () => {
-    if (isUpdateSharedDevice) {
-      if (hasDataChecked) {
-        const { stationIds, deviceIds, actionIds, configIds } =
-          objectIds(dataDeviceShared);
-        for (let station in dataStations) {
-          for (let item in dataStations[station].devices) {
-            const itemTemp = dataStations[station].devices[item];
-            dataStations[station].devices[item] = {
-              ...itemTemp,
-              isChecked: deviceIds.includes(itemTemp?.id),
-              actions: itemTemp.actions.map((i) => {
-                return {
-                  ...i,
-                  isChecked: actionIds?.includes(i.id),
-                };
-              }),
-              read_configs: itemTemp.read_configs.map((i) => {
-                return {
-                  ...i,
-                  isChecked: configIds?.includes(i.id),
-                };
-              }),
-            };
-          }
-        }
-        const data = dataStations?.map((i) => {
-          const devices = i?.devices;
-          const devices_checked = i?.devices?.filter(
-            (device) => device?.isChecked
-          );
-          return {
-            ...i,
-            isChecked:
-              !devices.length === !devices_checked.length &&
-              stationIds.includes(i.id),
-          };
-        });
-        setDataStations(data);
-        setIsTickAllDevices(data?.length === stationIds?.length);
-        setHasDataChecked(false);
-      }
-    }
-  }, [dataDeviceShared, dataStations, hasDataChecked, isUpdateSharedDevice]);
-
-  const GroupDeviceItem = ({ item = {} }) => {
-    const { name = '', devices = [], isChecked, id = '' } = item;
-    return (
-      <View style={styles.viewGroup}>
-        <TitleCheckBox
-          title={name}
-          wrapCheckBoxStyle={styles.checkBoxTile}
-          onPress={onTickTitle}
-          titleStyle={styles.GroupDeviceItem}
-          isChecked={isChecked}
-          idGroup={id}
-        />
-        <View style={styles.wrapDevice}>
-          {devices?.map((i, index) => (
-            <DeviceItem
-              item={i}
-              key={i.id}
-              isRenderSeparated={index !== devices?.length - 1}
-              onTickedChild={onTickedChild}
-              onTickedDevice={onTickedDevice}
-              onTickedDeviceIcon={onTickedDeviceIcon}
-              isItemExpanded={expandedItemIds.includes(i.id)}
-              toggleItem={toggleDeviceItem(i)}
-              idGroup={id}
-            />
-          ))}
-        </View>
-      </View>
-    );
-  };
-
-  const onPressBottom = async () => {
-    let read_permissions = [],
-      control_permissions = [];
-    for (let station of dataStationTemp) {
-      for (let item of station.devices) {
-        let arrIdControlTemp = [],
-          arrIdReadTemp = [];
-
-        for (let i of item.actions) {
-          i.isChecked && arrIdControlTemp.push(i.id);
-        }
-        for (let i of item.read_configs) {
-          i.isChecked && arrIdReadTemp.push(i.id);
-        }
-
-        arrIdControlTemp.length &&
-          control_permissions.push({ id: item.id, values: arrIdControlTemp });
-
-        arrIdReadTemp.length &&
-          read_permissions.push({ id: item.id, values: arrIdReadTemp });
-
-        !arrIdControlTemp.length &&
-          !arrIdReadTemp.length &&
-          item.isChecked &&
-          read_permissions.push({ id: item.id, values: [] });
-      }
-    }
-    if (!read_permissions.length && !control_permissions.length) {
-      Alert.alert('', t('choose_at_least_one'));
-      return;
-    }
-    if (isUpdateSharedDevice) {
-      const phone =
-        member?.phone_number && member?.email
-          ? member?.phone_number
-          : member?.phone_number || '';
-      const email = member?.phone_number ? '' : member?.email || '';
-      const { success } = await axiosPost(API.SHARE.SHARE(), {
-        phone,
-        email,
-        unit: unit?.id,
-        permissions: { read_permissions, control_permissions },
-        is_remove_old_permission: true,
-      });
-      success && navigation.goBack();
-    } else {
-      navigation.navigate(Routes.SharingInviteMembers, {
-        unit,
-        permissions: { read_permissions, control_permissions },
-      });
-    }
-  };
-
-  const renderGroupItem = ({ item }) => (
-    <GroupDeviceItem key={item.id} item={item} />
-  );
-
-  const renderFlatList = useMemo(() => {
-    return (
-      <FlatList
-        keyExtractor={(item) => item.id}
-        extraData={dataStations}
-        data={dataStations}
-        renderItem={renderGroupItem}
-        ListHeaderComponent={
-          dataStations?.length > 0 ? (
-            <TitleCheckBox
-              title={t('text_all_devices')}
-              wrapStyle={styles.wrapAllDevices}
-              onPress={onTickTitle}
-              titleStyle={styles.textAllDevice}
-              isChecked={isTickAllDevices}
-            />
-          ) : (
-            <></>
-          )
-        }
-        scrollIndicatorInsets={{ right: 1 }}
-      />
-    );
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [dataStations, isTickAllDevices, expandedItemIds]);
-
-  useEffect(() => {
-    autoCheckedGroup();
-  }, [autoCheckedGroup]);
-
-  const getShareUnitPermission = useCallback(async () => {
-    if (isUpdateSharedDevice && dataStations?.length > 0) {
-      const { success, data } = await axiosGet(
-        API.SHARE.UNIT_MEMBER_SHARE_DEVICE(unit?.id, member?.id)
-      );
-      if (success) {
-        setDataDeviceShared(data);
-        setHasDataChecked(true);
-      }
-    }
-  }, [dataStations?.length, isUpdateSharedDevice, member?.id, unit?.id]);
-
-  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;
-      }
-      await getUnitPermission();
-      await getShareUnitPermission();
-    })();
-  }, [getShareUnitPermission, getUnitPermission, unit]);
-
-  useEffect(() => {
-    dataStationTemp = dataStations;
-  }, [dataStations]);
-
-  return (
-    <View style={styles.wrap}>
-      <Text semibold style={styles.title}>
-        {t('select_device')}
-      </Text>
-      <Text style={styles.subtitle}>{t('sharing_select_devices_hint')}</Text>
-      <View style={styles.contentContainer}>
-        {loading ? (
-          <ActivityIndicator color={Colors.Primary} />
-        ) : dataStations?.length > 0 ? (
-          renderFlatList
-        ) : (
-          <Text
-            style={styles.textNodata}
-            accessibilityLabel={AccessibilityLabel.TEXT_NO_DATA_STATIONS}
-          >
-            {t('no_data')}
-          </Text>
-        )}
-      </View>
-      <View style={styles.wrapViewButtonStyle}>
-        <ViewButtonBottom
-          accessibilityLabelPrefix={
-            AccessibilityLabel.PREFIX.SHARING_SELECT_PERMISSION
-          }
-          leftTitle={t('cancel')}
-          onLeftClick={() => navigation.goBack()}
-          rightTitle={isUpdateSharedDevice ? t('done') : t('next')}
-          rightDisabled={false}
-          onRightClick={onPressBottom}
-        />
-      </View>
-    </View>
-  );
-};
-
-export default memo(SharingSelectPermission);

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

@@ -1,292 +0,0 @@
-import { act } from '@testing-library/react-hooks';
-import React, { useState } from 'react';
-import { FlatList, Text, Platform } from 'react-native';
-import { create } from 'react-test-renderer';
-import MockAdapter from 'axios-mock-adapter';
-import { DeviceItem, TitleCheckBox } from '../Components';
-import { ViewButtonBottom } from '../../../commons';
-import { SCProvider } from '../../../context';
-import { mockSCStore } from '../../../context/mockStore';
-import API from '../../../configs/API';
-import api from '../../../utils/Apis/axios';
-import SharingSelectPermission from '../SharingSelectPermission';
-
-const mock = new MockAdapter(api.axiosInstance);
-
-const mockSetState = jest.fn();
-jest.mock('react', () => {
-  return {
-    ...jest.requireActual('react'),
-    useState: jest.fn((init) => [init, mockSetState]),
-    memo: (x) => x,
-  };
-});
-
-const mockNavigate = jest.fn();
-const mockGoBack = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  return {
-    ...jest.requireActual('@react-navigation/native'),
-    useNavigation: () => ({
-      navigate: mockNavigate,
-      goBack: mockGoBack,
-    }),
-  };
-});
-
-const wrapComponent = (route) => (
-  <SCProvider initState={mockSCStore({})}>
-    <SharingSelectPermission route={route} />
-  </SCProvider>
-);
-
-describe('Test SharingSelectPermission', () => {
-  let tree;
-  let route = { params: { unit: { id: 1, name: 'unit 1' } } };
-  let listDevices = [
-    {
-      id: 204,
-      name: 'device',
-      devices: [
-        {
-          id: 123,
-          actions: [{ id: 136, name: 'action 1' }],
-          read_configs: [{ id: 137, name: 'config 1' }],
-          name: 'child1',
-        },
-      ],
-    },
-  ];
-
-  const mockSetTickAllDevice = jest.fn();
-  const mockSetActiveItemId = jest.fn();
-  const mockSetDataStations = jest.fn();
-
-  afterEach(() => {
-    mockSetState.mockClear();
-    mockSetTickAllDevice.mockClear();
-    mockSetActiveItemId.mockClear();
-    mockSetDataStations.mockClear();
-  });
-
-  function mockLoading() {
-    useState.mockImplementationOnce((init) => [init, mockSetState]);
-    useState.mockImplementationOnce((init) => [init, mockSetState]);
-    useState.mockImplementationOnce((init) => [init, mockSetState]);
-    useState.mockImplementationOnce((init) => [false, mockSetState]); // loading
-  }
-
-  function mocSetdata() {
-    useState.mockImplementationOnce((init) => [
-      listDevices,
-      mockSetDataStations,
-    ]);
-    useState.mockImplementationOnce((init) => [init, mockSetTickAllDevice]);
-    useState.mockImplementationOnce((init) => [init, mockSetActiveItemId]);
-    useState.mockImplementationOnce((init) => [false, mockSetState]); // loading
-  }
-
-  it('test unit null', async () => {
-    Platform.OS = 'android';
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const ViewButtonBottoms = instance.findAllByType(ViewButtonBottom);
-    expect(ViewButtonBottoms).toHaveLength(1);
-  });
-
-  it('render empty list', async () => {
-    mockLoading();
-    Platform.OS = 'ios';
-    route.params.unit = 1;
-    mock.onGet(API.SHARE.UNIT_MEMBER_SHARE_DEVICE(1, 1)).reply(200);
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const TextElement = instance.findAllByType(Text);
-    expect(TextElement[2].props.children).toBe('No data');
-  });
-
-  it('test unit get permission default', async () => {
-    mocSetdata();
-    const routes = { params: { unit: { id: 1, name: '123' } } };
-    mock.onGet(API.SHARE.UNIT_PERMISSIONS(1)).reply(200);
-    await act(async () => {
-      tree = await create(wrapComponent(routes));
-    });
-    const instance = tree.root;
-    const FlatListElement = instance.findAllByType(FlatList);
-    expect(FlatListElement).toHaveLength(1);
-  });
-
-  it('test unit fail default', async () => {
-    mockLoading();
-    const routes = { params: { unit: null } };
-    mock.onGet(API.SHARE.UNIT_PERMISSIONS(1)).reply(400);
-    await act(async () => {
-      tree = await 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', async () => {
-    mockLoading();
-    route.params.unit = 1;
-    mock.onGet(API.SHARE.UNIT_MEMBER_SHARE_DEVICE(1, 1)).reply(400);
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const TextElement = instance.findAllByType(Text);
-    expect(TextElement[2].props.children).toBe('No data');
-  });
-
-  it('render list', async () => {
-    mocSetdata();
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const FlatListElement = instance.findAllByType(FlatList);
-    expect(FlatListElement).toHaveLength(1);
-    const TitleCheckBoxElement = instance.findAllByType(TitleCheckBox);
-    expect(TitleCheckBoxElement).toHaveLength(2);
-    await act(async () => {
-      TitleCheckBoxElement[0].props.onPress(null, true);
-    });
-    expect(mockSetTickAllDevice).toBeCalledWith(true);
-    expect(mockSetDataStations).toBeCalledWith([
-      {
-        id: 204,
-        isChecked: true,
-        name: 'device',
-        devices: [
-          {
-            actions: [{ id: 136, isChecked: true, name: 'action 1' }],
-            id: 123,
-            isChecked: true,
-            name: 'child1',
-            read_configs: [{ id: 137, isChecked: true, name: 'config 1' }],
-          },
-        ],
-      },
-    ]);
-    await act(async () => {
-      TitleCheckBoxElement[0].props.onPress(204, true);
-    });
-    expect(mockSetTickAllDevice).toBeCalledWith(true);
-  });
-
-  it('test onTickedChild function', async () => {
-    mocSetdata();
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const DeviceItemElement = instance.findAllByType(DeviceItem);
-    expect(DeviceItemElement).toHaveLength(1);
-    await act(async () => {
-      DeviceItemElement[0].props.onTickedChild(204, 123, 137, true, true);
-    });
-    expect(mockSetDataStations).toBeCalled();
-  });
-
-  it('test onTickedDevice function', async () => {
-    mocSetdata();
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const DeviceItemElement = instance.findAllByType(DeviceItem);
-    expect(DeviceItemElement).toHaveLength(1);
-    await act(async () => {
-      DeviceItemElement[0].props.onTickedDevice(204, 123, true);
-      DeviceItemElement[0].props.toggleItem(123);
-    });
-    expect(mockSetDataStations).toBeCalled();
-  });
-
-  it('test onTickedDeviceIcon function', async () => {
-    mocSetdata();
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const DeviceItemElement = instance.findAllByType(DeviceItem);
-    expect(DeviceItemElement).toHaveLength(1);
-    await act(async () => {
-      DeviceItemElement[0].props.onTickedDeviceIcon(204, 123, true);
-    });
-    expect(mockSetDataStations).toBeCalled();
-  });
-
-  it('test ViewButtonBottom', async () => {
-    mocSetdata();
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const ViewButtonBottomElement = instance.findAllByType(ViewButtonBottom);
-    expect(ViewButtonBottomElement).toHaveLength(1);
-    await act(async () => {
-      ViewButtonBottomElement[0].props.onRightClick();
-    });
-    await act(async () => {
-      ViewButtonBottomElement[0].props.onLeftClick();
-    });
-    expect(mockGoBack).toBeCalled();
-  });
-
-  it('test SharingSelectPermission type share_device', async () => {
-    mocSetdata();
-    useState.mockImplementationOnce((init) => [true, mockSetState]);
-    const response = {
-      status: 200,
-      data: [
-        {
-          id: 204,
-          isChecked: true,
-          name: 'device',
-          devices: [
-            {
-              actions: [{ id: 136, isChecked: true, name: 'action 1' }],
-              id: 123,
-              isChecked: true,
-              name: 'child1',
-              read_configs: [{ id: 137, isChecked: true, name: 'config 1' }],
-            },
-          ],
-        },
-      ],
-    };
-    mock
-      .onGet(API.SHARE.UNIT_MEMBER_SHARE_DEVICE(1, 1))
-      .reply(200, response.data);
-    const routes = {
-      params: {
-        unit: { id: 1 },
-        type: 'update_shared',
-        member: {
-          id: 1,
-          name: 'a',
-          phone_number: '89898888',
-          email: 'abcderfg@gmail.com',
-        },
-      },
-    };
-    await act(async () => {
-      tree = await create(wrapComponent(routes));
-    });
-    const instance = tree.root;
-    const ViewButtonBottomElement = instance.findAllByType(ViewButtonBottom);
-    await act(async () => {
-      ViewButtonBottomElement[0].props.onRightClick();
-    });
-    mock.onPost(API.SHARE.SHARE()).reply(200);
-    expect(mockGoBack).toBeCalled();
-  });
-});