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

package/src/screens/AllGateway/hooks/__test__/index.test.js

@@ -120,4 +120,22 @@ describe('Test useGateway', () => {
     });
     expect(hook.result.current.detailDeviceZigbee).toEqual({});
   });
+
+  it('test fetchChipQrDetail', async () => {
+    const response = {
+      org_slug: 'eoh',
+      secret: '123456',
+      prefix: 'lite',
+      host: 'example.com',
+      port: 1883,
+    };
+    mock
+      .onGet(API.DEV_MODE.CHIP_QR_CODE.DETAIL_BY_SECRET())
+      .reply(200, response);
+
+    await act(async () => {
+      await hook.result.current.fetchChipQrDetail('123456');
+    });
+    expect(hook.result.current.detailChipQr).toEqual(response);
+  });
 });

package/src/screens/AllGateway/hooks/useGateway.js

@@ -19,6 +19,7 @@ export const useGateway = () => {
   const [detailDeviceZigbee, setDetailDeviceZigbee] = useState({});
   const [detailDeviceModbus, setDetailDeviceModbus] = useState({});
   const [detailDeviceInternal, setDetailDeviceInternal] = useState({});
+  const [detailChipQr, setDetailChipQr] = useState({});
   const [dataModalPopupCT, setDataModalPopupCT] = useState({});
   const [pages, setPages] = useState(1);
   const [loadingMore, setLoadingMore] = useState(false);
@@ -251,6 +252,16 @@ export const useGateway = () => {
     [canLoadMore]
   );
 
+  const fetchChipQrDetail = useCallback(async (secret) => {
+    const { success, data } = await axiosGet(
+      API.DEV_MODE.CHIP_QR_CODE.DETAIL_BY_SECRET(),
+      {
+        params: { secret },
+      }
+    );
+    success && setDetailChipQr(data);
+  }, []);
+
   return {
     gateways,
     fetchDataGateways,
@@ -267,11 +278,13 @@ export const useGateway = () => {
     fetchActionConfigDevice,
     fetchRegistersModbus,
     fetchActionsModbus,
+    fetchChipQrDetail,
     gatewayDevices,
     setSelectedIndex,
     selectedIndex,
     detailDeviceZigbee,
     detailDeviceModbus,
+    detailChipQr,
     setIsShowModalPopupCT,
     isShowModalPopupCT,
     setDataModalPopupCT,

package/src/screens/Automate/AddNewAction/SetupConfigCondition.js

@@ -81,7 +81,7 @@ const SetupConfigCondition = () => {
 
   const setupCustomCondition = () => {
     setSelectedCondition('custom');
-    automate.value = null;
+    automate.value = NaN;
     setIsShowModal(true);
   };
 
@@ -98,7 +98,7 @@ const SetupConfigCondition = () => {
 
   const resetCustomizeCondition = useCallback(() => {
     automate.condition = null;
-    automate.value = null;
+    automate.value = NaN;
     setCustomCondition(undefined);
   }, [automate]);
 
@@ -182,7 +182,7 @@ const SetupConfigCondition = () => {
             title={t('continue')}
             testID={'continue_button'}
             onPress={() => {
-              if (!automate.value || !automate.condition) {
+              if (isNaN(automate.value) || !automate.condition) {
                 ToastBottomHelper.error(t('please_enter_a_number'), '', 3000);
                 return;
               }

package/src/screens/Automate/AddNewAction/SetupScriptEmail.js

@@ -0,0 +1,79 @@
+import React, { useCallback, useMemo, useState } from 'react';
+import { Keyboard, TouchableWithoutFeedback, View } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+import styles from './Styles/SetupScriptEmailStyles';
+import { HeaderCustom } from '../../../commons';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+
+import _TextInput from '../../../commons/Form/TextInput';
+import AccessibilityLabel from '../../../configs/AccessibilityLabel';
+import BottomButtonView from '../../../commons/BottomButtonView';
+import Routes from '../../../utils/Route';
+
+const SetupScriptEmail = ({ route }) => {
+  const t = useTranslations();
+  const { goBack, navigate } = useNavigation();
+  const { automate, unitId, multiUnit } = route.params || {};
+  const [formData, setFormData] = useState({ unit: unitId || multiUnit.id });
+
+  const onChangeTitle = (value) => {
+    setFormData((state) => ({
+      ...state,
+      title: value,
+    }));
+  };
+  const onChangeMessage = (value) => {
+    setFormData((state) => ({
+      ...state,
+      message: value,
+    }));
+  };
+
+  const onNext = useCallback(async () => {
+    navigate(Routes.SetupScriptReceiverEmail, {
+      automate,
+      unitId: unitId,
+      formData,
+    });
+  }, [automate, navigate, unitId, formData]);
+
+  const canSave = useMemo(() => {
+    const { title, message } = formData || {};
+    return !!title && !!message;
+  }, [formData]);
+
+  return (
+    <View style={styles.wrap}>
+      <HeaderCustom isShowClose onClose={goBack} title={t('email_content')} />
+      <TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
+        <View style={styles.container}>
+          <_TextInput
+            placeholder={t('subject')}
+            onChange={onChangeTitle}
+            textInputStyle={styles.textTitle}
+            value={formData?.title}
+            accessibilityLabel={AccessibilityLabel.AUTOMATE_TITLE_NOTIFY}
+            autoFocus
+          />
+          <_TextInput
+            placeholder={t('message')}
+            onChange={onChangeMessage}
+            textInputStyle={styles.textMessage}
+            value={formData?.message}
+            accessibilityLabel={AccessibilityLabel.AUTOMATE_MESSAGE_NOTIFY}
+            multiline={true}
+            maxLength={255}
+          />
+          <BottomButtonView
+            style={styles.bottomButtonView}
+            mainTitle={t('next')}
+            onPressMain={onNext}
+            typeMain={canSave ? 'primary' : 'disabled'}
+          />
+        </View>
+      </TouchableWithoutFeedback>
+    </View>
+  );
+};
+
+export default SetupScriptEmail;

package/src/screens/Automate/AddNewAction/SetupScriptReceiverEmail.js

@@ -0,0 +1,166 @@
+import React, { useCallback, useMemo, useState, useEffect, memo } from 'react';
+import { FlatList, View } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+import styles from './Styles/SetupScriptReceiverEmailStyles';
+import { CircleView, HeaderCustom, Text } from '../../../commons';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+
+import BottomButtonView from '../../../commons/BottomButtonView';
+import { axiosPost, axiosGet } from '../../../utils/Apis/axios';
+import { API, Colors } from '../../../configs';
+import { ToastBottomHelper } from '../../../utils/Utils';
+import Routes from '../../../utils/Route';
+import moment from 'moment';
+import { Image } from 'react-native-svg';
+import CheckBox from '@react-native-community/checkbox';
+import { useSCContextSelector } from '../../../context';
+
+const SetupScriptReceiverEmail = ({ route }) => {
+  const t = useTranslations();
+  const { goBack, navigate } = useNavigation();
+  const { automate = {}, unitId, formData } = route.params || {};
+  const { id: automateId } = automate;
+  const [members, setMembers] = useState([]);
+  const [listUser, setListUser] = useState([]);
+  const currentUserId = useSCContextSelector(
+    (state) => state.auth.account.user.id
+  );
+
+  const loadMembers = useCallback(async () => {
+    const { success, data } = await axiosGet(API.SHARE.UNITS_MEMBERS(unitId));
+    if (success) {
+      setMembers(data);
+    }
+  }, [unitId]);
+
+  useEffect(() => {
+    loadMembers();
+  }, [loadMembers]);
+
+  const onNext = useCallback(async () => {
+    formData.receiver = listUser;
+    const { success } = await axiosPost(
+      API.AUTOMATE.ADD_SCRIPT_EMAIL(automateId),
+      formData
+    );
+    if (success) {
+      ToastBottomHelper.success(t('text_done'));
+      navigate({
+        name: Routes.ScriptDetail,
+        merge: true,
+        params: { saveAt: moment().valueOf() },
+      });
+    } else {
+      ToastBottomHelper.error(t('error_please_try_later'));
+    }
+  }, [automateId, formData, listUser, navigate, t]);
+
+  const canSave = useMemo(() => {
+    const { title, message } = formData;
+    return !!title && !!message && !!listUser.length;
+  }, [formData, listUser.length]);
+
+  const arrColor = useMemo(
+    () => [
+      Colors.GeekBlue3,
+      Colors.Purple3,
+      Colors.Orange3,
+      Colors.Volcano3,
+      Colors.Blue9,
+      Colors.Green3,
+      Colors.Cyan2,
+    ],
+    []
+  );
+
+  const onChecked = useCallback(
+    (id) => (checked) => {
+      setListUser((prevListUser) =>
+        checked
+          ? [...prevListUser, id]
+          : prevListUser.filter((userId) => userId !== id)
+      );
+    },
+    []
+  );
+
+  const RowMember = memo(({ member, index, onValueChange }) => {
+    const { id, name, avatar, share_id, email } = member;
+    const [role, roleColor] = useMemo(() => {
+      if (!share_id) {
+        return [t('owner'), Colors.Primary];
+      }
+      if (id === currentUserId) {
+        return [t('me'), Colors.Primary];
+      }
+      return [t('member'), Colors.Gray6];
+    }, [share_id, id]);
+
+    const firstWordsInName = useMemo(() => {
+      return name.charAt();
+    }, [name]);
+
+    const circleColor = arrColor[index % arrColor.length];
+
+    return (
+      <View style={styles.rowContainer}>
+        <View style={styles.Border}>
+          <CheckBox
+            disabled={!email}
+            lineWidth={4}
+            value={listUser.includes(id)}
+            onValueChange={onValueChange(id)}
+          />
+          <View style={styles.paddingLeft16}>
+            {avatar ? (
+              <Image source={{ uri: avatar }} style={styles.avatar} />
+            ) : (
+              <CircleView size={40} backgroundColor={circleColor} center>
+                <Text color={Colors.White}>{firstWordsInName}</Text>
+              </CircleView>
+            )}
+          </View>
+          <View style={styles.paddingLeft16}>
+            <Text style={styles.titleName}>{name}</Text>
+            {email ? (
+              <Text style={styles.status}>{email}</Text>
+            ) : (
+              <Text style={styles.invalid}>{t('no_email')}</Text>
+            )}
+          </View>
+          <View style={styles.endFlex}>
+            <Text style={[styles.textRole, { color: roleColor }]}>{role}</Text>
+          </View>
+        </View>
+      </View>
+    );
+  });
+
+  return (
+    <View style={styles.wrap}>
+      <HeaderCustom isShowClose onClose={goBack} title={t('email_to')} />
+      <FlatList
+        data={members}
+        renderItem={({ item, index }) => (
+          <RowMember member={item} index={index} onValueChange={onChecked} />
+        )}
+        keyExtractor={(item) => item.id.toString()}
+        ListEmptyComponent={
+          <View style={styles.viewEmpty}>
+            <Text style={styles.textCenter}>{t('no_member')}</Text>
+          </View>
+        }
+      />
+      <View style={styles.container}>
+        <BottomButtonView
+          style={styles.bottomButtonView}
+          mainTitle={t('done')}
+          onPressMain={onNext}
+          typeMain={canSave ? 'primary' : 'disabled'}
+        />
+      </View>
+    </View>
+  );
+};
+
+export default SetupScriptReceiverEmail;

package/src/screens/Automate/AddNewAction/Styles/SetupScriptEmailStyles.js

@@ -0,0 +1,37 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from '../../../../configs';
+import { getBottomSpace } from 'react-native-iphone-x-helper';
+
+export default StyleSheet.create({
+  wrap: {
+    flex: 1,
+    backgroundColor: Colors.White,
+  },
+  container: {
+    flex: 1,
+    paddingHorizontal: 16,
+    paddingTop: 10,
+    paddingBottom: getBottomSpace() + 10,
+  },
+  textTitle: {
+    borderWidth: 1,
+    borderColor: Colors.Gray4,
+    borderStyle: 'solid',
+    borderRadius: 10,
+  },
+  textMessage: {
+    height: 500,
+    textAlignVertical: 'top',
+    borderWidth: 1,
+    borderColor: Colors.Gray4,
+    borderStyle: 'solid',
+    borderRadius: 10,
+  },
+  bottomButtonView: {
+    paddingTop: 24,
+    paddingBottom: 32,
+    backgroundColor: Colors.White,
+    borderColor: Colors.ShadownTransparent,
+    borderTopWidth: 1,
+  },
+});

package/src/screens/Automate/AddNewAction/Styles/SetupScriptReceiverEmailStyles.js

@@ -0,0 +1,79 @@
+import { StyleSheet } from 'react-native';
+import { Colors, Constants } from '../../../../configs';
+import { getBottomSpace } from 'react-native-iphone-x-helper';
+
+export default StyleSheet.create({
+  wrap: {
+    flex: 1,
+    backgroundColor: Colors.White,
+  },
+  viewEmpty: {
+    justifyContent: 'center',
+    alignItems: 'center',
+    height: Constants.height - 200,
+    backgroundColor: Colors.White,
+  },
+  textCenter: {
+    alignSelf: 'center',
+  },
+  container: {
+    flex: 1,
+    paddingHorizontal: 16,
+    paddingTop: 10,
+    paddingBottom: getBottomSpace() + 10,
+  },
+  bottomButtonView: {
+    paddingTop: 24,
+    paddingBottom: 32,
+    backgroundColor: Colors.White,
+    borderColor: Colors.ShadownTransparent,
+    borderTopWidth: 1,
+  },
+  rowContainer: {
+    marginTop: 16,
+  },
+  textRole: {
+    fontSize: 12,
+    lineHeight: 20,
+  },
+  endFlex: {
+    flex: 1,
+    justifyContent: 'flex-start',
+    alignItems: 'flex-end',
+  },
+  Border: {
+    flexDirection: 'row',
+    paddingBottom: 16,
+    paddingHorizontal: 16,
+  },
+  titleName: {
+    fontSize: 16,
+    lineHeight: 24,
+    fontStyle: 'normal',
+    fontWeight: '400',
+  },
+  status: {
+    fontSize: 12,
+    lineHeight: 20,
+    fontStyle: 'normal',
+    fontWeight: '400',
+    color: Colors.Gray7,
+  },
+  invalid: {
+    fontSize: 12,
+    lineHeight: 20,
+    fontStyle: 'normal',
+    fontWeight: '400',
+    color: Colors.Red,
+  },
+
+  paddingLeft16: {
+    paddingLeft: 16,
+  },
+  avatar: {
+    height: 40,
+    width: 40,
+    borderRadius: 40,
+    backgroundColor: Colors.Primary,
+  },
+});

package/src/screens/Automate/AddNewAction/__test__/ChooseAction.test.js

@@ -291,7 +291,7 @@ describe('Test ChooseAction', () => {
           },
           {
             action: '800ff454-4e2a-4a38-bad6-1bded728193e',
-            data: { config_id: config5, config_value: 1 },
+            data: { config_id: config5, config_value: 1, value: 1 },
           },
         ],
       })

package/src/screens/Automate/AddNewAction/__test__/SetupConfigCondition.test.js

@@ -182,7 +182,7 @@ describe('Test SetupConfigCondition', () => {
     });
   });
 
-  it('choose config custom condition', async () => {
+  const testCustomCondition = async (value) => {
     useRoute.mockReturnValue({
       params: {
         automate: {},
@@ -221,7 +221,7 @@ describe('Test SetupConfigCondition', () => {
     const input = instance.findByType(TextInput);
 
     await act(async () => {
-      input.props.onChange('123');
+      input.props.onChange(value.toString());
     });
 
     const bottomButtonView = instance.findByProps({
@@ -235,10 +235,18 @@ describe('Test SetupConfigCondition', () => {
     expect(global.mockedNavigate).toBeCalledWith(Routes.ValueChangeName, {
       automate: {
         condition: '<',
-        value: 123,
+        value: value,
       },
       closeScreen: undefined,
     });
+  };
+
+  it('choose config custom condition', async () => {
+    await testCustomCondition(123);
+  });
+
+  it('test custom condition with value = 0', async () => {
+    await testCustomCondition(0);
   });
 
   const testConditionValue = async (value, message) => {
@@ -273,9 +281,9 @@ describe('Test SetupConfigCondition', () => {
     });
 
     if (message === null) {
-      expect(global.mockedNavigate).toBeCalled();
+      expect(global.mockedNavigate).toHaveBeenCalled();
     } else {
-      expect(spyToastError).toBeCalledWith(message, '', 3000);
+      expect(spyToastError).toHaveBeenCalledWith(message, '', 3000);
     }
   };
 

package/src/screens/Automate/AddNewAction/__test__/SetupScriptEmail.test.js

@@ -0,0 +1,76 @@
+import { useNavigation, useRoute } from '@react-navigation/native';
+import MockAdapter from 'axios-mock-adapter';
+import React from 'react';
+import { TouchableWithoutFeedback } from 'react-native';
+import renderer, { act } from 'react-test-renderer';
+import BottomButtonView from '../../../../commons/BottomButtonView';
+import _TextInput from '../../../../commons/Form/TextInput';
+import API from '../../../../configs/API';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import api from '../../../../utils/Apis/axios';
+import Routes from '../../../../utils/Route';
+import SetupScriptEmail from '../SetupScriptEmail';
+
+const mock = new MockAdapter(api.axiosInstance);
+
+const wrapComponent = (route) => (
+  <SCProvider initState={mockSCStore({})}>
+    <SetupScriptEmail route={route} />
+  </SCProvider>
+);
+
+describe('Test SetupScriptEmail', () => {
+  const mockedNavigate = useNavigation().navigate;
+
+  let tree;
+  const route = {
+    params: {
+      unitId: 1,
+      automateId: 1,
+      scriptName: 'scriptName test',
+      automate: {
+        id: 1,
+        sensor_id: 1,
+      },
+      closeScreen: Routes.ScriptDetail,
+    },
+  };
+  beforeEach(() => {
+    mockedNavigate.mockClear();
+    useRoute.mockImplementation(() => route);
+  });
+
+  it('SetupScriptNotify onPress create script notify success', async () => {
+    mock.onPost(API.AUTOMATE.ADD_SCRIPT_NOTIFY(1)).reply(200);
+    await act(async () => {
+      tree = await renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const inputs = instance.findAllByType(_TextInput);
+    expect(inputs).toHaveLength(2);
+
+    await act(async () => {
+      inputs[0].props.onChange('Title');
+    });
+    const touchable = instance.findAllByType(TouchableWithoutFeedback);
+    await act(async () => {
+      touchable[0].props.onPress();
+    });
+    await act(async () => {
+      inputs[1].props.onChange('Message');
+    });
+    const button = instance.findByType(BottomButtonView);
+    await act(async () => {
+      button.props.onPressMain();
+    });
+    expect(mockedNavigate).toHaveBeenCalledWith(
+      Routes.SetupScriptReceiverEmail,
+      {
+        automate: route.params.automate,
+        unitId: 1,
+        formData: { message: 'Message', title: 'Title', unit: 1 },
+      }
+    );
+  });
+});

package/src/screens/Automate/AddNewAction/__test__/SetupScriptReceiverEmail.test.js

@@ -0,0 +1,105 @@
+import { useNavigation, useRoute } from '@react-navigation/native';
+import MockAdapter from 'axios-mock-adapter';
+import React from 'react';
+import renderer, { act } from 'react-test-renderer';
+import BottomButtonView from '../../../../commons/BottomButtonView';
+import API from '../../../../configs/API';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import api from '../../../../utils/Apis/axios';
+import Routes from '../../../../utils/Route';
+import { ToastBottomHelper } from '../../../../utils/Utils';
+import SetupScriptReceiverEmail from '../SetupScriptReceiverEmail';
+import CheckBox from '@react-native-community/checkbox';
+
+const mock = new MockAdapter(api.axiosInstance);
+
+const wrapComponent = (route) => (
+  <SCProvider initState={mockSCStore({})}>
+    <SetupScriptReceiverEmail route={route} />
+  </SCProvider>
+);
+
+describe('Test SetupScriptReceiverEmail', () => {
+  const mockedNavigate = useNavigation().navigate;
+
+  let tree;
+  const route = {
+    params: {
+      unitId: 1,
+      automateId: 1,
+      automate: {
+        id: 1,
+        sensor_id: 1,
+      },
+      closeScreen: Routes.ScriptDetail,
+      formData: { title: 'title', message: 'message' },
+    },
+  };
+
+  const listUser = [
+    {
+      avatar: 'https://xxx',
+      email: 'user1.nh@eoh.io',
+      id: 140,
+      name: 'User 1',
+    },
+    {
+      avatar: null,
+      email: null,
+      id: 56,
+      name: 'User 2',
+      share_id: 5386,
+    },
+  ];
+  beforeEach(() => {
+    mockedNavigate.mockClear();
+    useRoute.mockImplementation(() => route);
+  });
+
+  it('SetupScriptReceiverEmail onPress create script email success', async () => {
+    const spyToast = jest.spyOn(ToastBottomHelper, 'success');
+    mock.onGet(API.SHARE.UNITS_MEMBERS(1)).reply(200, listUser);
+    mock.onPost(API.AUTOMATE.ADD_SCRIPT_EMAIL(1)).reply(200);
+    await act(async () => {
+      tree = await renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const checkboxs = instance.findAllByType(CheckBox);
+    expect(checkboxs).toHaveLength(2);
+    expect(checkboxs[0].props.disabled).toBeFalsy();
+    expect(checkboxs[1].props.disabled).toBeTruthy();
+    await act(async () => {
+      checkboxs[0].props.onValueChange(true);
+    });
+
+    const button = instance.findByType(BottomButtonView);
+    await act(async () => {
+      button.props.onPressMain();
+    });
+    expect(spyToast).toHaveBeenCalled();
+  });
+
+  it('SetupScriptReceiverEmail onPress create script email fail', async () => {
+    const spyToast = jest.spyOn(ToastBottomHelper, 'error');
+    mock.onGet(API.SHARE.UNITS_MEMBERS(1)).reply(200, listUser);
+    mock.onPost(API.AUTOMATE.ADD_SCRIPT_EMAIL(1)).reply(400);
+    await act(async () => {
+      tree = await renderer.create(wrapComponent(route));
+    });
+    const instance = tree.root;
+    const checkboxs = instance.findAllByType(CheckBox);
+    expect(checkboxs).toHaveLength(2);
+    expect(checkboxs[0].props.disabled).toBeFalsy();
+    expect(checkboxs[1].props.disabled).toBeTruthy();
+    await act(async () => {
+      checkboxs[0].props.onValueChange(true);
+    });
+
+    const button = instance.findByType(BottomButtonView);
+    await act(async () => {
+      button.props.onPressMain();
+    });
+    expect(spyToast).toHaveBeenCalled();
+  });
+});