@eohjsc/react-native-smart-city 0.2.86 → 0.2.89

package/src/screens/HanetCamera/styles/manageAccessStyles.js

@@ -0,0 +1,49 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from '../../../configs';
+
+export default StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: Colors.White,
+  },
+  headerRight: {
+    flexDirection: 'row',
+  },
+  contentContainerStyle: {
+    paddingBottom: 60,
+  },
+  wrapItem: {
+    height: 100,
+    width: '100%',
+    flexDirection: 'row',
+    alignItems: 'center',
+    padding: 16,
+    borderBottomWidth: 1,
+    borderBottomColor: Colors.Gray3,
+  },
+  itemAvatar: {
+    height: 48,
+    width: 48,
+    borderRadius: 24,
+    borderWidth: 1,
+    borderColor: Colors.Gray3,
+  },
+  itemName: {
+    marginLeft: 16,
+    flex: 1,
+  },
+  addMemberModal: {
+    paddingBottom: 50,
+  },
+  row: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingVertical: 16,
+    marginHorizontal: 16,
+    borderBottomColor: Colors.Gray3,
+    borderBottomWidth: 1,
+  },
+  textOption: {
+    marginLeft: 18,
+  },
+});

package/src/screens/HanetCamera/styles/memberInfoStyles.js

@@ -0,0 +1,73 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from '../../../configs';
+
+export default StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: Colors.White,
+  },
+  headerRight: {
+    flexDirection: 'row',
+  },
+  wrapAvatar: {
+    alignItems: 'center',
+    marginTop: 24,
+    marginBottom: 52,
+  },
+  avatar: {
+    height: 88,
+    width: 88,
+    borderRadius: 44,
+    borderWidth: 1,
+    borderColor: Colors.Gray3,
+  },
+  row: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    borderBottomWidth: 1,
+    borderBottomColor: Colors.Gray3,
+    height: 64,
+    marginHorizontal: 16,
+  },
+  textSetPhoto: {
+    flex: 1,
+    marginLeft: 16,
+    lineHeight: 24,
+  },
+  photoID: {
+    width: 42,
+    height: 42,
+    borderRadius: 6,
+    borderWidth: 1,
+    borderColor: Colors.Gray3,
+  },
+  spaceBetween: {
+    justifyContent: 'space-between',
+  },
+  buttonRemove: {
+    position: 'absolute',
+    alignItems: 'center',
+    padding: 32,
+    bottom: 0,
+    left: 0,
+    right: 0,
+  },
+  textInput: {
+    margin: 16,
+    marginTop: 0,
+    borderWidth: 0,
+    paddingLeft: 0,
+    paddingTop: 0,
+    borderBottomWidth: 2,
+    borderBottomColor: Colors.Primary,
+    fontSize: 16,
+    color: Colors.Gray9,
+  },
+  bottomButton: {
+    paddingBottom: 24,
+  },
+  textError: {
+    marginHorizontal: 16,
+    marginTop: 4,
+  },
+});

package/src/screens/HanetCamera/utils/Monitor.js

@@ -0,0 +1,52 @@
+import { API } from '../../../configs';
+import Pusher from 'pusher-js/react-native';
+import { SCConfig } from '../../../configs/SCConfig';
+import { axiosPost } from '../../../utils/Apis/axios';
+
+Pusher.logToConsole = true;
+let pusher = null;
+
+const getPusher = () => {
+  if (!pusher) {
+    pusher = new Pusher(SCConfig.pusherAppKey, {
+      cluster: SCConfig.pusherAppCluste,
+      authorizer: function (channel, option) {
+        return {
+          // eslint-disable-next-line promise/prefer-await-to-callbacks
+          authorize: async function (socketId, callback) {
+            const { success, data } = await axiosPost(
+              API.CAMERA.HANET.PUSHER_AUTH(),
+              {
+                channel_name: channel.name,
+                socket_id: socketId,
+              }
+            );
+            if (success) {
+              // eslint-disable-next-line promise/prefer-await-to-callbacks
+              callback(null, data);
+            }
+          },
+        };
+      },
+    });
+  }
+  return pusher;
+};
+
+const destroyPusher = () => {
+  pusher.disconnect();
+  pusher = null;
+};
+
+// eslint-disable-next-line promise/prefer-await-to-callbacks
+export const watchHanetCheckinData = (hanetCamera, callback) => {
+  const channel = getPusher().subscribe(
+    `private-hanet-camera-${hanetCamera.device_id}`
+  );
+  channel.bind('new-checkin-data', callback);
+};
+
+export const unwatchHanetCheckinData = (hanetCamera) => {
+  getPusher().unsubscribe(`private-hanet-camera-${hanetCamera.device_id}`);
+  destroyPusher();
+};

package/src/screens/Notification/__test__/NotificationItem.test.js

@@ -191,6 +191,7 @@ describe('test NotificationItem', () => {
     SENSOR_TYPE.SMOKE,
     SENSOR_TYPE.FIRE,
     SENSOR_TYPE.SOS,
+    SENSOR_TYPE.FILTER_WATER,
   ];
   for (const sensorType of listSensorType2) {
     test(`create ItemNotification NOTIFY_INDICATOR sensor_type ${sensorType}`, () => {

package/src/screens/Notification/components/NotificationItem.js

@@ -352,6 +352,22 @@ const NotificationItem = memo(({ item }) => {
                 }),
               iconContent: <Image source={Images.logo} style={styles.logo} />,
             };
+          case SENSOR_TYPE.FILTER_WATER:
+            return {
+              content: customColorText(
+                t('text_notification_content_replace_water_filter'),
+                arrParams
+              ),
+              redirect: () =>
+                navigation.navigate(Routes.UnitStack, {
+                  screen: Routes.DeviceDetail,
+                  params: {
+                    unitId,
+                    sensorId,
+                  },
+                }),
+              iconContent: <Image source={Images.logo} style={styles.logo} />,
+            };
           default:
             return {
               content: customColorText(

package/src/screens/SmartIr/__test__/ButtonsBottom.test.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import renderer, { act } from 'react-test-renderer';
+import { ButtonsBottom } from '../components/GroupButtonByType/ButtonsBottom';
+import { SCProvider } from '../../../context';
+import { mockSCStore } from '../../../context/mockStore';
+import { TouchableOpacity } from 'react-native';
+
+const wrapComponent = () => (
+  <SCProvider initState={mockSCStore({})}>
+    <ButtonsBottom />
+  </SCProvider>
+);
+
+jest.mock('react', () => {
+  return {
+    ...jest.requireActual('react'),
+    memo: (x) => x,
+  };
+});
+describe('Test ButtonsBottom', () => {
+  let tree;
+
+  test('render ButtonsBottom', () => {
+    act(() => {
+      tree = renderer.create(wrapComponent());
+    });
+    const instance = tree.root;
+    const touchableOpacity = instance.findAllByType(TouchableOpacity);
+    expect(touchableOpacity).toHaveLength(2);
+  });
+});

package/src/screens/SmartIr/__test__/GroupButtonByType.test.js

@@ -0,0 +1,80 @@
+import React from 'react';
+import renderer, { act } from 'react-test-renderer';
+import GroupButtonByType from '../components/GroupButtonByType/GroupButtonByType';
+import { SCProvider } from '../../../context';
+import { mockSCStore } from '../../../context/mockStore';
+import WrapHeaderScrollable from '../../../commons/Sharing/WrapHeaderScrollable';
+import { ButtonsBottom } from '../components/GroupButtonByType/ButtonsBottom';
+
+const wrapComponent = (route) => (
+  <SCProvider initState={mockSCStore({})}>
+    <GroupButtonByType route={route} />
+  </SCProvider>
+);
+
+const mockNavigate = jest.fn();
+jest.mock('@react-navigation/native', () => {
+  return {
+    ...jest.requireActual('@react-navigation/native'),
+    useNavigation: () => ({
+      navigate: mockNavigate,
+    }),
+  };
+});
+jest.mock('react', () => {
+  return {
+    ...jest.requireActual('react'),
+    memo: (x) => x,
+  };
+});
+describe('Test GroupButtonByType', () => {
+  let tree;
+  test('render GroupButtonByType', () => {
+    const route = {
+      params: {
+        device_type: { id: 1, name: '', icon: '' },
+        brand: { id: 1, name: '' },
+      },
+    };
+    act(() => {
+      tree = renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const wrapHeaderScrollable = instance.findAllByType(WrapHeaderScrollable);
+    expect(wrapHeaderScrollable).toHaveLength(1);
+  });
+  test('onPressLeft ButtonsBottom', () => {
+    const route = {
+      params: {
+        device_type: { id: 1, name: '', icon: '' },
+        brand: { id: 1, name: '' },
+      },
+    };
+    act(() => {
+      tree = renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const buttonsBottom = instance.findAllByType(ButtonsBottom);
+    expect(buttonsBottom).toHaveLength(2);
+    act(() => {
+      buttonsBottom[0].props.onPressLeft();
+    });
+  });
+  test('onPressRight ButtonsBottom', () => {
+    const route = {
+      params: {
+        device_type: { id: 1, name: '', icon: '' },
+        brand: { id: 1, name: '' },
+      },
+    };
+    act(() => {
+      tree = renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const buttonsBottom = instance.findAllByType(ButtonsBottom);
+    expect(buttonsBottom).toHaveLength(2);
+    act(() => {
+      buttonsBottom[0].props.onPressRight();
+    });
+  });
+});

package/src/screens/SmartIr/__test__/SelectBrand.test.js

@@ -0,0 +1,65 @@
+import React from 'react';
+import { ScrollView } from 'react-native';
+import renderer, { act } from 'react-test-renderer';
+import SelectBrand from '../components/SelectBrand';
+import { SCProvider } from '../../../context';
+import { mockSCStore } from '../../../context/mockStore';
+import { RowItem } from '../../../commons/RowItem';
+
+const wrapComponent = (route) => (
+  <SCProvider initState={mockSCStore({})}>
+    <SelectBrand route={route} />
+  </SCProvider>
+);
+
+const mockNavigate = jest.fn();
+jest.mock('@react-navigation/native', () => {
+  return {
+    ...jest.requireActual('@react-navigation/native'),
+    useNavigation: () => ({
+      navigate: mockNavigate,
+    }),
+  };
+});
+jest.mock('react', () => {
+  return {
+    ...jest.requireActual('react'),
+    memo: (x) => x,
+  };
+});
+describe('Test SelectBrand', () => {
+  let tree;
+  test('render SelectBrand', () => {
+    const route = {
+      params: {
+        device_type: { id: 1, name: '' },
+      },
+    };
+    act(() => {
+      tree = renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const scrollView = instance.findAllByType(ScrollView);
+    expect(scrollView).toHaveLength(1);
+  });
+
+  test('Row SmartIr onPress', () => {
+    const route = {
+      params: {
+        device_type: { id: 1, name: '' },
+      },
+    };
+    act(() => {
+      tree = renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const scrollView = instance.findAllByType(ScrollView);
+    expect(scrollView).toHaveLength(1);
+    const rowItem = instance.findAllByType(RowItem);
+    expect(rowItem).toHaveLength(3);
+    act(() => {
+      rowItem[0].props.onPress();
+    });
+    expect(mockNavigate).toHaveBeenCalled();
+  });
+});

package/src/screens/SmartIr/__test__/SelectDeviceType.test.js

@@ -0,0 +1,57 @@
+import React from 'react';
+import { ScrollView, TouchableOpacity } from 'react-native';
+import renderer, { act } from 'react-test-renderer';
+import SelectDeviceType from '../components/SelectDeviceType';
+import { SCProvider } from '../../../context';
+import { mockSCStore } from '../../../context/mockStore';
+
+const wrapComponent = () => (
+  <SCProvider initState={mockSCStore({})}>
+    <SelectDeviceType />
+  </SCProvider>
+);
+
+const mockNavigate = jest.fn();
+
+jest.mock('@react-navigation/native', () => {
+  return {
+    ...jest.requireActual('@react-navigation/native'),
+    useNavigation: () => ({
+      navigate: mockNavigate,
+    }),
+  };
+});
+jest.mock('react', () => {
+  return {
+    ...jest.requireActual('react'),
+    memo: (x) => x,
+  };
+});
+describe('Test SelectDeviceType', () => {
+  let tree;
+
+  test('render SelectDeviceType', () => {
+    act(() => {
+      tree = renderer.create(wrapComponent());
+    });
+    const instance = tree.root;
+    const scrollView = instance.findAllByType(ScrollView);
+    expect(scrollView).toHaveLength(1);
+  });
+
+  test('itemDevice SelectDeviceType onPress', () => {
+    act(() => {
+      tree = renderer.create(wrapComponent());
+    });
+    const instance = tree.root;
+    const scrollView = instance.findAllByType(ScrollView);
+    expect(scrollView).toHaveLength(1);
+    const touchableOpacity = instance.findAllByType(TouchableOpacity);
+    expect(touchableOpacity).toHaveLength(7);
+    const itemDevice = touchableOpacity[1];
+    act(() => {
+      itemDevice.props.onPress();
+    });
+    expect(mockNavigate).toHaveBeenCalled();
+  });
+});

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

@@ -57,5 +57,6 @@ describe('Test SmartIr', () => {
     act(() => {
       itemAddNew[0].props.onPress();
     });
+    expect(mockNavigate).toHaveBeenCalled();
   });
 });

package/src/screens/SmartIr/components/GroupButtonByType/ButtonsBottom.js

@@ -0,0 +1,45 @@
+import React, { memo } from 'react';
+import { View, TouchableOpacity } from 'react-native';
+import Text from '../../../../commons/Text';
+
+import { Colors } from '../../../../configs';
+
+import styles from './ButtonsBottomStyles';
+
+const ButtonsBottom = memo(
+  ({
+    onPressLeft,
+    onPressRight,
+    textLeft,
+    colorTextLeft = Colors.White,
+    colorTextRight = Colors.Gray8,
+    leftButtonStyle,
+    rightButtonStyle,
+    buttonStyle = {},
+    textRight,
+    type = 'H4',
+  }) => {
+    return (
+      <View style={styles.ButtonsBottom}>
+        <TouchableOpacity
+          style={[styles.LeftButton, buttonStyle, leftButtonStyle]}
+          onPress={onPressLeft}
+        >
+          <Text type={type} color={colorTextLeft}>
+            {textLeft}
+          </Text>
+        </TouchableOpacity>
+        <TouchableOpacity
+          style={[styles.RightButton, buttonStyle, rightButtonStyle]}
+          onPress={onPressRight}
+        >
+          <Text type={type} color={colorTextRight}>
+            {textRight}
+          </Text>
+        </TouchableOpacity>
+      </View>
+    );
+  }
+);
+
+export { ButtonsBottom };

package/src/screens/SmartIr/components/GroupButtonByType/ButtonsBottomStyles.js

@@ -0,0 +1,31 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from '../../../../configs';
+
+const flexCenter = {
+  justifyContent: 'center',
+  alignItems: 'center',
+};
+const styleButton = {
+  paddingVertical: 8,
+  paddingHorizontal: 32,
+  borderRadius: 30,
+  marginHorizontal: 8,
+};
+export default StyleSheet.create({
+  ButtonsBottom: {
+    marginTop: 16,
+    flexDirection: 'row',
+  },
+  LeftButton: {
+    backgroundColor: Colors.Primary,
+    ...styleButton,
+    ...flexCenter,
+  },
+  RightButton: {
+    backgroundColor: Colors.Gray1,
+    borderColor: Colors.Gray5,
+    borderWidth: 1,
+    ...styleButton,
+    ...flexCenter,
+  },
+});