@eohjsc/react-native-smart-city 0.7.21 → 0.7.22

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

@@ -960,7 +960,7 @@ export default {
   today: 'Today',
   yesterday: 'Yesterday',
   at: 'at',
-  choose_at_least_one: 'Please choose at least one sensor.',
+  choose_at_least_one: 'Please choose at least one device.',
   'transaction_is_unsuccessful_%{message}':
     'Transaction is unsuccessful. %{message}',
   emergency_resolved:

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

@@ -532,7 +532,7 @@ export default {
   role: 'Vai trò',
   change_role: 'Thay đổi vai trò',
   identity: 'Xác thực',
-  share_devices: 'Chia sẽ thiết bị',
+  share_devices: 'Chia sẻ thiết bị',
   no_member: 'Không có thành viên nào',
   sharing_removed_user: 'Thành viên {name} đã được xóa.',
   sharing_you_left: 'Bạn đã rời địa điểm.',
@@ -1550,7 +1550,7 @@ export default {
   bellow_widget_is_not_configured: 'Tiện ích bên dưới chưa được cấu hình',
   bellow_widget_is_wrongly_configured: 'Tiện ích bên dưới được cấu hình sai',
   widget_have_not_been_shared:
-    'Tiện ích {widget} chưa được chia sẽ. Vui lòng liên hệ với chủ sở hữu',
+    'Tiện ích {widget} chưa được chia sẻ. Vui lòng liên hệ với chủ sở hữu',
   customize: 'Tùy chỉnh điều kiện',
   uri_invalid: 'URI không hợp lệ',
   when_value_is: 'Kích hoạt khi giá trị "{config_name}"',

package/src/commons/Sharing/StationDevicePermissions.js

@@ -1,204 +0,0 @@
-import React, { useState, useCallback } from 'react';
-import { View, StyleSheet, TouchableOpacity } from 'react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
-import { useTranslations } from '../../hooks/Common/useTranslations';
-import { Colors } from '../../configs';
-import Text from '../../commons/Text';
-import SensorIcon from '../../../assets/images/Device/sensor.svg';
-import BarrierIcon from '../../../assets/images/Device/barrier.svg';
-import SvgDoor from '../../../assets/images/Device/door.svg';
-import SensorInactive from '../../../assets/images/Device/sensor-inactive.svg';
-import BarrierInactive from '../../../assets/images/Device/barrier-inactive.svg';
-import DoorInactive from '../../../assets/images/Device/door-inactive.svg';
-
-import DevicePermissionsCheckbox from './DevicePermissionsCheckbox';
-
-const StationDevicePermissions = ({ dataStation, onselectSensor }) => {
-  const t = useTranslations();
-  const [listChosen, setListChosen] = useState({}); // { sensorId : indexConfigChoosen , ...}
-  const [expandedIndex, setExpandedIndex] = useState(-1);
-
-  const displayIconSensor = (svgMain, activated) => {
-    let svgResult;
-    switch (svgMain) {
-      case 'barrier':
-        svgResult = activated ? <BarrierIcon /> : <BarrierInactive />;
-        break;
-      case 'sensor':
-        svgResult = activated ? <SensorIcon /> : <SensorInactive />;
-        break;
-      default:
-        svgResult = activated ? <SvgDoor /> : <DoorInactive />;
-        break;
-    }
-    return svgResult;
-  };
-
-  const onPressExpand = useCallback(
-    (index) => () => {
-      setExpandedIndex(index === expandedIndex ? -1 : index);
-    },
-    [expandedIndex]
-  );
-
-  const onSelectIndexes = useCallback(
-    (sensor, selectionIndexes) => {
-      let readPermission = [];
-      let controlPermission = [];
-      if (selectionIndexes.indexOf(-1) > -1) {
-        //perrmision
-        readPermission = sensor.read_configs.map((item) => item.id);
-        controlPermission = sensor.actions.map((item) => item.id);
-      } else {
-        selectionIndexes.forEach((index) => {
-          if (index >= sensor.read_configs.length) {
-            //index of actions
-            controlPermission.push(
-              sensor.actions[index - sensor.read_configs.length].id
-            );
-          } else {
-            readPermission.push(sensor.read_configs[index].id);
-          }
-        });
-      }
-      onselectSensor(sensor.id, readPermission, controlPermission);
-
-      const chosen = { ...listChosen };
-      chosen[sensor.id] = selectionIndexes;
-      setListChosen(chosen);
-    },
-    [listChosen, setListChosen, onselectSensor]
-  );
-
-  const RowDevice = ({ sensor, index }) => {
-    return (
-      <View>
-        <TouchableOpacity
-          style={styles.rowContainer}
-          onPress={onPressExpand(index)}
-        >
-          <View style={styles.iconContainer}>
-            {displayIconSensor(
-              sensor.icon || 'door',
-              !!listChosen[sensor.id] && listChosen[sensor.id].length > 0
-            )}
-          </View>
-          <View style={styles.infoContainer}>
-            <Text style={styles.text}>{sensor.name}</Text>
-            <View style={styles.rightImage}>
-              <IconOutline
-                name={expandedIndex === index ? 'up' : 'down'}
-                size={20}
-                color={Colors.Gray6}
-              />
-            </View>
-          </View>
-        </TouchableOpacity>
-        <View
-          style={
-            expandedIndex === index
-              ? styles.expandContainer
-              : styles.collapseContainer
-          }
-        >
-          <DevicePermissionsCheckbox
-            sensor={sensor}
-            selectedIndexes={listChosen[sensor.id] ?? []}
-            onSelectIndexes={onSelectIndexes}
-          />
-        </View>
-        <View style={styles.lineSpace} />
-      </View>
-    );
-  };
-
-  return (
-    <>
-      <Text color={Colors.Gray8} style={styles.stationName}>
-        {dataStation.name}
-      </Text>
-      <View style={styles.box}>
-        {!dataStation.sensors.length && (
-          <Text style={styles.textEmpty}>{t('no_device')}</Text>
-        )}
-        {dataStation.sensors.map((device, index) => (
-          <RowDevice sensor={device} index={index} key={device.id} />
-        ))}
-      </View>
-    </>
-  );
-};
-
-const styles = StyleSheet.create({
-  box: {
-    paddingBottom: 16,
-    borderRadius: 20,
-    backgroundColor: Colors.White,
-    borderWidth: 1,
-    borderColor: Colors.Gray4,
-    marginBottom: 16,
-  },
-  rowContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    paddingHorizontal: 16,
-  },
-  iconContainer: {
-    alignItems: 'center',
-    justifyContent: 'center',
-    marginRight: 16,
-    width: 40,
-    height: 40,
-    borderRadius: 20,
-  },
-  infoContainer: {
-    flex: 1,
-    paddingVertical: 16,
-  },
-  lineSpace: {
-    borderBottomWidth: 1,
-    borderColor: Colors.Gray4,
-    position: 'absolute',
-    bottom: 0,
-    left: 72,
-    right: 24,
-    height: 1,
-  },
-  text: {
-    fontSize: 16,
-    lineHeight: 24,
-    color: Colors.Gray9,
-    marginBottom: 0,
-  },
-  rightImage: {
-    position: 'absolute',
-    right: 0,
-    top: 10,
-    bottom: 10,
-    paddingHorizontal: 10,
-    justifyContent: 'center',
-  },
-  expandContainer: {
-    marginTop: -6,
-    marginRight: 24,
-    marginLeft: 72,
-    marginBottom: 10,
-  },
-  collapseContainer: {
-    height: 0,
-    overflow: 'hidden',
-  },
-  stationName: {
-    fontSize: 14,
-    lineHeight: 22,
-    paddingLeft: 16,
-    marginBottom: 8,
-  },
-  textEmpty: {
-    flex: 1,
-    textAlign: 'center',
-    marginTop: 16,
-  },
-});
-
-export default StationDevicePermissions;

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

@@ -1,44 +0,0 @@
-import React, { memo } from 'react';
-import { View, Text } from 'react-native';
-import { CheckBoxCustom } from '.';
-import styles from './Styles/CheckBoxConfigStyles';
-import t from '../../../hooks/Common/useTranslations';
-import AccessibilityLabel from '../../../configs/AccessibilityLabel';
-
-const CheckBoxConfig = ({
-  isChecked,
-  onPress,
-  title,
-  indexSubUnit,
-  indexEndDevice,
-  configId,
-  isControl,
-  isConfig,
-  item,
-}) => {
-  const handleOnPress = () => {
-    onPress(indexSubUnit, indexEndDevice, configId, item, isConfig, !isChecked);
-  };
-
-  return (
-    <View style={styles.wrap}>
-      <View style={styles.wrapRow}>
-        <CheckBoxCustom
-          isChecked={isChecked}
-          onPress={handleOnPress}
-          wrapStyle={styles.wrapCheckBoxStyle}
-          accessibilityLabel={`${AccessibilityLabel.SHARE_DEVICE.CHECK_BOX_CONFIG}-${configId}`}
-        />
-        <Text onPress={handleOnPress} style={styles.titleStyle}>
-          {title}
-        </Text>
-      </View>
-      <View>
-        {isControl && <Text>{t('can_control')}</Text>}
-        {isConfig && <Text>{t('view_only')}</Text>}
-      </View>
-    </View>
-  );
-};
-
-export default memo(CheckBoxConfig);

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

@@ -1,35 +0,0 @@
-import React, { memo, useEffect, useState } from 'react';
-import { View, Text } from 'react-native';
-import { CheckBoxCustom } from '.';
-import styles from './Styles/TitleCheckBoxStyles';
-import AccessibilityLabel from '../../../configs/AccessibilityLabel';
-
-const CheckBoxSubUnit = ({ isChecked, onPress, title, indexSubUnit }) => {
-  const [checked, setChecked] = useState(isChecked);
-  const handleOnPress = () => {
-    setChecked(!checked);
-    onPress(indexSubUnit, !checked);
-  };
-
-  useEffect(() => {
-    if (isChecked !== checked) {
-      setChecked(isChecked);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isChecked]);
-
-  return (
-    <View style={styles.wrap}>
-      <View style={styles.wrapRow}>
-        <CheckBoxCustom
-          isChecked={checked}
-          onPress={handleOnPress}
-          accessibilityLabel={`${AccessibilityLabel.SHARE_DEVICE.CHECK_BOX_CUSTOM}-${indexSubUnit}`}
-        />
-        <Text onPress={handleOnPress}>{title}</Text>
-      </View>
-    </View>
-  );
-};
-
-export default memo(CheckBoxSubUnit);

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

@@ -1,93 +0,0 @@
-import React, { memo, useMemo, useState } from 'react';
-import { View, Text, TouchableOpacity } from 'react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
-import { Colors } from '../../../configs';
-import styles from './Styles/DeviceItemStyles';
-import { AccessibilityLabel } from '../../../configs/Constants';
-import IconComponent from '../../../commons/IconComponent';
-import CheckBoxConfig from './CheckBoxConfig';
-
-const EndDevice = ({
-  item,
-  onTickedChild,
-  onTickEndDevice,
-  isItemExpanded,
-  toggleExpandEndDevice,
-  indexSubUnit,
-  indexEndDevice,
-  expandEndDevice,
-}) => {
-  const { name, actions, read_configs, icon_kit, icon, isChecked } = item;
-  const [checked, setChecked] = useState(isChecked);
-
-  const dataConfig = useMemo(() => {
-    return [
-      ...actions.map((i) => ({ ...i, isControl: true })),
-      ...read_configs.map((i) => ({ ...i, isConfig: true })),
-    ];
-  }, [actions, read_configs]);
-
-  const onPressItem = () => {
-    expandEndDevice();
-    onTickEndDevice(indexSubUnit, indexEndDevice, item, !checked);
-    setChecked(!checked);
-  };
-
-  const renderData = useMemo(() => {
-    return dataConfig.map((i) => (
-      <CheckBoxConfig
-        key={i.id}
-        item={item}
-        title={i.name}
-        configId={i.id}
-        isConfig={i.isConfig}
-        isControl={i.isControl}
-        onPress={onTickedChild}
-        isChecked={i.isChecked}
-        indexSubUnit={indexSubUnit}
-        indexEndDevice={indexEndDevice}
-      />
-    ));
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [dataConfig]);
-
-  return (
-    <View style={styles.wrap}>
-      <TouchableOpacity onPress={onPressItem}>
-        <IconComponent
-          icon={icon_kit || icon}
-          size={20}
-          style={styles.viewLeft}
-        />
-      </TouchableOpacity>
-      <View style={styles.wrapRight}>
-        <View style={styles.viewRight}>
-          <Text
-            numberOfLines={1}
-            style={styles.text}
-            onPress={onPressItem}
-            accessibilityLabel={`${AccessibilityLabel.SHARE_DEVICE.CLICK_NAME_END_DEVICE}-${indexEndDevice}`}
-          >
-            {name}
-          </Text>
-          {checked && (
-            <IconOutline name={'check'} color={Colors.Primary} size={20} />
-          )}
-
-          {dataConfig.length > 0 && (
-            <IconOutline
-              onPress={() => toggleExpandEndDevice()}
-              name={isItemExpanded ? 'up' : 'down'}
-              size={20}
-              color={Colors.Gray6}
-              accessibilityLabel={`${AccessibilityLabel.SHARE_DEVICE.EXPAND_END_DEVICE}-${indexEndDevice}`}
-            />
-          )}
-        </View>
-        {isItemExpanded && <View style={styles.wrapExpand}>{renderData}</View>}
-      </View>
-    </View>
-  );
-};
-
-export default memo(EndDevice);

package/src/screens/Sharing/Components/Styles/CheckBoxConfigStyles.js

@@ -1,18 +0,0 @@
-import { StyleSheet } from 'react-native';
-
-export default StyleSheet.create({
-  wrap: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  wrapRow: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  wrapCheckBoxStyle: {
-    marginLeft: -10,
-  },
-  titleStyle: {
-    width: 200,
-  },
-});

package/src/screens/Sharing/Components/Styles/TitleCheckBoxStyles.js

@@ -1,21 +0,0 @@
-import { StyleSheet } from 'react-native';
-import { Colors } from '../../../../configs';
-import { normalize } from '../../../../configs/Constants';
-
-export default StyleSheet.create({
-  wrap: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  title: {
-    color: Colors.Gray8,
-    fontSize: normalize(14),
-    lineHeight: normalize(22),
-    fontWeight: '600',
-    fontStyle: 'normal',
-  },
-  wrapRow: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-});

package/src/screens/Sharing/Components/__test__/TitleCheckBox.test.js

@@ -1,31 +0,0 @@
-import React from 'react';
-import { create, act } from 'react-test-renderer';
-
-import { SCProvider } from '../../../../context';
-import { mockSCStore } from '../../../../context/mockStore';
-import TitleCheckBox from '../TitleCheckBox';
-import { CheckBoxCustom } from '..';
-
-const mockOnPress = jest.fn();
-const wrapComponent = (idGroup, id) => (
-  <SCProvider initState={mockSCStore({})}>
-    <TitleCheckBox idGroup={idGroup} id={id} onPress={mockOnPress} />
-  </SCProvider>
-);
-
-describe('test TitleCheckBox', () => {
-  it('test handleOnPress', async () => {
-    let tree;
-    await act(async () => {
-      tree = await create(wrapComponent(1, 2));
-    });
-    const instance = tree.root;
-    const checkBoxCustom = instance.findByType(CheckBoxCustom);
-    await act(async () => {
-      checkBoxCustom.props.onPress();
-    });
-
-    expect(checkBoxCustom.props.isChecked).toBe(true);
-    expect(mockOnPress).toHaveBeenLastCalledWith(1, true, 2);
-  });
-});