@eohjsc/react-native-smart-city 0.2.83 → 0.2.84

package/assets/images/Event.svg

@@ -0,0 +1,9 @@
+<svg width="22" height="40" viewBox="0 0 22 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M21.4995 0H6.49908L0.500977 21.5962H6.51129L1.4009 40H3.20118L20.5983 18.4029H11.785L21.4995 0Z" fill="url(#paint0_linear_8208_3875)"/>
+<defs>
+<linearGradient id="paint0_linear_8208_3875" x1="0.500977" y1="0" x2="33.409" y2="17.2947" gradientUnits="userSpaceOnUse">
+<stop stop-color="#2B6B9F"/>
+<stop offset="1" stop-color="#D5FFCB"/>
+</linearGradient>
+</defs>
+</svg>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eohjsc/react-native-smart-city",
   "title": "React Native Smart Home",
-  "version": "0.2.83",
+  "version": "0.2.84",
   "description": "TODO",
   "main": "index.js",
   "files": [
@@ -186,7 +186,7 @@
     "react-native-udp": "^4.1.3",
     "react-native-unimodules": "^0.11.0",
     "react-native-version-check": "^3.4.2",
-    "react-native-vlc-media-player": "https://github.com/razorRun/react-native-vlc-media-player.git",
+    "react-native-vlc-media-player": "^1.0.39",
     "react-native-webview": "^10.9.3",
     "react-native-wheel-scrollview-picker": "^1.2.2",
     "react-native-wifi-reborn": "^4.5.0",

package/src/commons/Automate/ItemAutomate.js

@@ -38,7 +38,7 @@ const ItemAutomate = ({
         <View style={styles.wrapIcon}>
           <Icon />
         </View>
-        <View>
+        <View style={styles.wrapTitle}>
           <Text type="H4" bold>
             {t(item?.title)}
           </Text>

package/src/commons/Automate/ItemAutomateStyles.js

@@ -28,6 +28,10 @@ export default StyleSheet.create({
   },
   wrapIcon: {
     justifyContent: 'center',
-    marginRight: 16,
+    flexDirection: 'row',
+    width: 50,
+  },
+  wrapTitle: {
+    marginLeft: 10,
   },
 });

package/src/commons/Device/WaterQualitySensor/ListQualityIndicator.js

@@ -37,7 +37,7 @@ export default ListQualityIndicator;
 const styles = StyleSheet.create({
   standard: {
     flexDirection: 'row',
-    marginTop: 16,
+    marginVertical: 16,
   },
   flatlistContent: {
     paddingHorizontal: 16,

package/src/commons/Device/WaterQualitySensor/QualityIndicatorsItem.js

@@ -68,7 +68,7 @@ const styles = StyleSheet.create({
     borderWidth: 1,
     borderColor: Colors.Gray4,
     marginRight: 8,
-    width: (width / 375) * 120,
+    width: ((width - 32) / 375) * 120,
   },
   rowFlex: {
     flexDirection: 'row',

package/src/commons/FullLoading/index.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { View, ActivityIndicator, StyleSheet } from 'react-native';
+
+import { colorOpacity } from '../../utils/Converter/color';
+import { Colors } from '../../configs';
+
+const FullLoading = ({ wrapStyle, color = Colors.Primary, size = 'small' }) => (
+  <View style={[styles.wrap, wrapStyle]}>
+    <View style={styles.background}>
+      <ActivityIndicator color={color} size={size} />
+    </View>
+  </View>
+);
+
+const styles = StyleSheet.create({
+  wrap: {
+    position: 'absolute',
+    backgroundColor: colorOpacity(Colors.Black, 0.1),
+    alignItems: 'center',
+    justifyContent: 'center',
+    top: 0,
+    left: 0,
+    bottom: 0,
+    right: 0,
+    zIndex: 10,
+  },
+  background: {
+    backgroundColor: colorOpacity(Colors.White, 0.8),
+    borderRadius: 5,
+    paddingHorizontal: 32,
+    paddingVertical: 24,
+  },
+});
+
+export default FullLoading;

package/src/commons/SubUnit/OneTap/ItemOneTap.js

@@ -7,6 +7,7 @@ import { API, Colors } from '../../../configs';
 import OneTap from '../../../../assets/images/OneTap.svg';
 import ValueChange from '../../../../assets/images/ValueChange.svg';
 import Schedule from '../../../../assets/images/Schedule.svg';
+import Event from '../../../../assets/images/Event.svg';
 import CheckCircle from '../../../../assets/images/CheckCircle.svg';
 import FImage from '../../FImage';
 import { timeDifference } from '../../../utils/Converter/time';
@@ -92,6 +93,8 @@ const ItemOneTap = memo(
         return <OneTap />;
       } else if (type === AUTOMATE_TYPE.VALUE_CHANGE) {
         return <ValueChange />;
+      } else if (type === AUTOMATE_TYPE.EVENT) {
+        return <Event />;
       } else {
         return <Schedule />;
       }

package/src/commons/index.js

@@ -15,6 +15,7 @@ import MenuActionList from './MenuActionList';
 import RadioCircle from './RadioCircle';
 import { CircleButton } from './CircleButton';
 import HorizontalPicker from './HorizontalPicker';
+import FullLoading from './FullLoading';
 
 export {
   ButtonPopup,
@@ -34,4 +35,5 @@ export {
   RadioCircle,
   CircleButton,
   HorizontalPicker,
+  FullLoading,
 };

package/src/configs/API.js

@@ -25,6 +25,8 @@ const API = {
     MANAGE_UNIT: (id) => SCConfig.apiRoot + `/property_manager/units/${id}/`,
     CHIP_SCAN: (id) =>
       SCConfig.apiRoot + `/property_manager/units/${id}/chip_scan/`,
+    CHIP_SCAN_GET_WIFI_INFO: () =>
+      SCConfig.apiRoot + '/property_manager/units/chip_scan_get_wifi_info/',
     MANAGE_ACCESS: (id) =>
       SCConfig.apiRoot + `/property_manager/manage_access/${id}/`,
     AUTOMATE: (id) =>

package/src/configs/Constants.js

@@ -3,6 +3,7 @@ import { RFValue } from 'react-native-responsive-fontsize';
 import OneTap from '../../assets/images/OneTap.svg';
 import ValueChange from '../../assets/images/ValueChange.svg';
 import Schedule from '../../assets/images/Schedule.svg';
+import Event from '../../assets/images/Event.svg';
 
 const X_WIDTH = 375;
 const X_HEIGHT = 812;
@@ -91,6 +92,7 @@ export const AUTOMATE_TYPE = {
   ONE_TAP: 'one_tap',
   VALUE_CHANGE: 'value_change',
   SCHEDULE: 'schedule',
+  EVENT: 'event',
   ONE_TAP_ONLY: 'one_tap_only',
   AUTOMATE: 'automate',
   AUTOMATION: 'automation',
@@ -128,6 +130,12 @@ export const AUTOMATES = {
     explanation: 'setup_the_schedule',
     icon: Schedule,
   },
+  event: {
+    value: AUTOMATE_TYPE.EVENT,
+    title: 'event',
+    explanation: 'setup_the_conditions',
+    icon: Event,
+  },
 };
 
 export const UNIT_TYPES = {

package/src/screens/AddNewAction/SelectAction.js

@@ -148,38 +148,56 @@ const SelectAction = memo(({ route }) => {
     checkedItem,
     t,
   ]);
-
   const onSave = useCallback(async () => {
     if (isSelectSensor) {
       await checkConditionToContinue();
     } else {
-      let list_action = [...actions];
-      list_action = list_action.map((item) => ({
-        action: item.action,
-        data: item.data,
-      }));
-      const { success } = await axiosPost(
-        API.AUTOMATE.ADD_SCRIPT_ACTION(automateId),
-        {
-          list_action,
-          unit: unit.id,
+      if (automateId) {
+        let list_action = [...actions];
+        list_action = list_action.map((item) => ({
+          action: item.action,
+          data: item.data,
+        }));
+        const { success } = await axiosPost(
+          API.AUTOMATE.ADD_SCRIPT_ACTION(automateId),
+          {
+            list_action,
+            unit: unit.id,
+          }
+        );
+        if (!success) {
+          ToastBottomHelper.error(t('not_permission'));
         }
-      );
-      if (!success) {
-        ToastBottomHelper.error(t('not_permission'));
+        navigate(Routes.ScriptDetail, {
+          id: automateId,
+          name: scriptName,
+          havePermission: true,
+          unit,
+          saveAt: moment().valueOf(),
+          type: type,
+          isAutomateTab,
+          isCreateNewAction,
+          isMultiUnits,
+          automate,
+        });
+      } else {
+        navigate(Routes.AddNewOneTap, {
+          automateData: {
+            action: actions[0].action,
+          },
+          type,
+          unit,
+          isAutomateTab,
+          isSelectSensor,
+          isMultiUnits,
+          automateId,
+          automate: {
+            ...automate,
+            action: actions[0].action,
+          },
+          scriptName,
+        });
       }
-      navigate(Routes.ScriptDetail, {
-        id: automateId,
-        name: scriptName,
-        havePermission: true,
-        unit,
-        saveAt: moment().valueOf(),
-        type: type,
-        isAutomateTab,
-        isCreateNewAction,
-        isMultiUnits,
-        automate,
-      });
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [
@@ -284,14 +302,14 @@ const SelectAction = memo(({ route }) => {
     () => (
       <BottomButtonView
         style={styles.bottomButtonView}
-        mainTitle={t(isSelectSensor ? 'continue' : 'save')}
+        mainTitle={t(automateId ? 'save' : 'continue')}
         onPressMain={onSave}
         typeMain={
           actions.length > 0 || !!checkedItem?.id ? 'primary' : 'disabled'
         }
       />
     ),
-    [onSave, actions, checkedItem, isSelectSensor, t]
+    [t, automateId, onSave, actions.length, checkedItem?.id]
   );
 
   useEffect(() => {

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

@@ -3,7 +3,7 @@ import { act, create } from 'react-test-renderer';
 import AddNewAutoSmart from '..';
 import { SCProvider } from '../../../context';
 import { mockSCStore } from '../../../context/mockStore';
-import { TESTID } from '../../../configs/Constants';
+import { AUTOMATE_TYPE, TESTID } from '../../../configs/Constants';
 import ItemAutomate from '../../../commons/Automate/ItemAutomate';
 import Routes from '../../../utils/Route';
 
@@ -34,7 +34,7 @@ describe('test AddNewAutoSmart', () => {
   let tree;
   let route = {
     params: {
-      type: 'value_change',
+      type: AUTOMATE_TYPE.VALUE_CHANGE,
       unit: { id: 1 },
     },
   };
@@ -49,7 +49,7 @@ describe('test AddNewAutoSmart', () => {
     });
     const instance = tree.root;
     const items = instance.findAllByType(ItemAutomate);
-    expect(items).toHaveLength(2);
+    expect(items).toHaveLength(3);
 
     await act(async () => {
       await items[0].props.onPress();

package/src/screens/AddNewAutoSmart/index.js

@@ -42,6 +42,13 @@ const AddNewAutoSmart = memo(({ route }) => {
         type: AUTOMATE_TYPE.SCHEDULE,
         route: Routes.SetSchedule,
       },
+      {
+        type: AUTOMATE_TYPE.EVENT,
+        route: Routes.SelectSensorDevices,
+        data: {
+          title: AUTOMATE_SELECT.SELECT_DEVICE,
+        },
+      },
     ],
     [AUTOMATE_TYPE.VALUE_CHANGE]: [
       {
@@ -55,6 +62,13 @@ const AddNewAutoSmart = memo(({ route }) => {
         type: AUTOMATE_TYPE.SCHEDULE,
         route: Routes.SetSchedule,
       },
+      {
+        type: AUTOMATE_TYPE.EVENT,
+        route: Routes.SelectSensorDevices,
+        data: {
+          title: AUTOMATE_SELECT.SELECT_DEVICE,
+        },
+      },
     ],
     [AUTOMATE_TYPE.ONE_TAP_ONLY]: [
       {
@@ -84,7 +98,10 @@ const AddNewAutoSmart = memo(({ route }) => {
       scriptName,
     };
 
-    if (dataAutomate.type === AUTOMATE_TYPE.VALUE_CHANGE && isMultiUnits) {
+    if (
+      (dataAutomate.type === AUTOMATE_TYPE.VALUE_CHANGE && isMultiUnits) ||
+      (dataAutomate.type === AUTOMATE_TYPE.EVENT && isMultiUnits)
+    ) {
       navigate(Routes.SelectUnit, params);
     } else {
       navigate(dataAutomate.route, params);

package/src/screens/AddNewGateway/PlugAndPlay/ConnectWifiWarning.js

@@ -60,7 +60,7 @@ const ConnectWifiWarning = memo(({ route }) => {
         undefined
       );
     });
-    socket.on('message', function (msg, rinfo) {
+    socket.on('message', (msg, rinfo) => {
       const data = JSON.parse(msg.toString());
       if (data.hasOwnProperty('wifi')) {
         navigate(Routes.GatewayWifiList, {
@@ -71,27 +71,36 @@ const ConnectWifiWarning = memo(({ route }) => {
         });
       }
       if (data.hasOwnProperty('gateway')) {
-        navigate(Routes.Dashboard);
-        ToastBottomHelper.success(t('completed'));
+        const checkWifiInterval = setInterval(() => {
+          // eslint-disable-next-line promise/prefer-await-to-then
+          WifiManager.getCurrentWifiSSID().then(async (ssid) => {
+            if (ssid !== wifi_ssid) {
+              const { success } = await axiosPost(
+                API.UNIT.ADD_GATEWAY(unit_id),
+                {
+                  chip: chip_id,
+                  imei: data.gateway.imei,
+                  chip_name: data.gateway.model,
+                }
+              );
+              if (success) {
+                navigate(Routes.Dashboard);
+                ToastBottomHelper.success(t('add_gateway_success'));
+                clearInterval(checkWifiInterval);
+              }
+            }
+          });
+        }, 3000);
       }
     });
     socket.on('error', () => {
       ToastBottomHelper.error(t('server_error'));
       goBack();
     });
-    return () => {
-      socket.close();
-    };
   };
 
   const handleConnectWifiGateway = async () => {
     setIsLoading(true);
-    const { success } = await axiosPost(API.UNIT.ADD_GATEWAY(unit_id), {
-      chip: chip_id,
-    });
-    if (success) {
-      ToastBottomHelper.success(t('add_gateway_success'));
-    }
     // eslint-disable-next-line promise/prefer-await-to-then
     WifiManager.connectToProtectedSSID(wifi_ssid, wifi_pass, false).then(
       () => {

package/src/screens/AddNewGateway/__test__/SetupGateway.test.js

@@ -7,9 +7,6 @@ import { SCProvider } from '../../../context';
 import { mockSCStore } from '../../../context/mockStore';
 import SetupGatewayWifi from '../SetupGatewayWifi';
 import DisplayChecking from '../../../commons/DisplayChecking';
-import { AlertAction } from '../../../commons';
-import _TextInputPassword from '../../../commons/Form/TextInputPassword';
-import _TextInput from '../../../commons/Form/TextInput';
 
 const wrapComponent = (route) => (
   <SCProvider initState={mockSCStore({})}>
@@ -90,53 +87,4 @@ describe('Test SetupGatewayWifi', () => {
     const displayLoadingConnect = instance.findByType(DisplayChecking);
     expect(displayLoadingConnect.props.visible).toBeTruthy();
   });
-
-  test('test render AlertAction', async () => {
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const alertAction = instance.findByType(AlertAction);
-    await act(async () => {
-      alertAction.props.hideModal();
-      alertAction.props.leftButtonClick();
-    });
-    expect(alertAction).toBeDefined();
-  });
-
-  test('test render _TextInputPassword', async () => {
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const textInputPassword = instance.findByType(_TextInputPassword);
-    await act(async () => {
-      textInputPassword.props.onChange('new_name');
-    });
-    expect(textInputPassword.props.value).toEqual('new_name');
-  });
-
-  test('test render TextInput', async () => {
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const textInput = instance.findByType(_TextInput);
-    await act(async () => {
-      textInput.props.onChange('new_text');
-    });
-    expect(textInput.props.value).toEqual('new_text');
-  });
-
-  test('test render DisplayChecking', async () => {
-    await act(async () => {
-      tree = await create(wrapComponent(route));
-    });
-    const instance = tree.root;
-    const displayChecking = instance.findByType(DisplayChecking);
-    await act(async () => {
-      displayChecking.props.onClose();
-    });
-    expect(displayChecking).toBeDefined();
-  });
 });

package/src/screens/Device/styles.js

@@ -70,6 +70,8 @@ export default StyleSheet.create({
   },
   simpleList: {
     height: '100%',
+    marginRight: 4,
+    marginLeft: 4,
   },
   headerRight: {
     flexDirection: 'row',

package/src/screens/ScanChipQR/hooks/index.js

@@ -5,8 +5,7 @@ import { axiosPost } from '../../../utils/Apis/axios';
 import Routes from '../../../utils/Route';
 
 const useChipScan = (route) => {
-  const { unit_id, station, phoneNumber, chipName, wifiName, wifiPass, imei } =
-    route.params;
+  const { unit_id, imei } = route.params;
   const navigation = useNavigation();
   const [loading, setLoading] = useState(false);
 
@@ -15,15 +14,10 @@ const useChipScan = (route) => {
       setLoading(true);
       const body = JSON.parse(data);
       const { success, data: new_chip } = await axiosPost(
-        API.UNIT.CHIP_SCAN(unit_id),
+        API.UNIT.CHIP_SCAN_GET_WIFI_INFO(),
         {
           imei: imei || body.imei,
           qr_code: body.imei,
-          phone: phoneNumber,
-          name: chipName,
-          station: station,
-          wifi_ssid: wifiName,
-          wifi_pass: wifiPass,
         }
       );
       if (success) {
@@ -44,17 +38,7 @@ const useChipScan = (route) => {
         navigation.goBack();
       }
     },
-    [
-      chipName,
-      imei,
-      navigation,
-      phoneNumber,
-      route.params,
-      station,
-      unit_id,
-      wifiName,
-      wifiPass,
-    ]
+    [imei, navigation, route.params, unit_id]
   );
 
   return {

package/src/screens/Unit/ManageUnit.js

@@ -36,7 +36,7 @@ const ButtonWrapper = ({
     <TouchableOpacity
       onPress={onPress}
       testID={testId}
-      style={!icon ? styles.buttonWrapper : styles.buttonWrapperAvatar}
+      style={styles.buttonWrapper}
     >
       <View style={styles.buttonInfo}>
         {!icon ? (

package/src/screens/Unit/ManageUnitStyles.js

@@ -16,12 +16,6 @@ export default StyleSheet.create({
     borderBottomWidth: 0.5,
     borderBottomColor: Colors.Gray6,
   },
-  buttonWrapperAvatar: {
-    paddingTop: 14,
-    paddingBottom: 24,
-    borderBottomWidth: 0.5,
-    borderBottomColor: Colors.Gray7,
-  },
   buttonInfo: {
     flex: 1,
     flexDirection: 'row',

package/src/screens/Unit/SmartAccount.js

@@ -15,7 +15,7 @@ import { useNavigation } from '@react-navigation/native';
 import { axiosDelete, axiosGet } from '../../utils/Apis/axios';
 import { SmartAccountItem } from './SmartAccountItem';
 import { usePopover, useBoolean } from '../../hooks/Common';
-import { MenuActionMore, AlertAction } from '../../commons';
+import { MenuActionMore, AlertAction, FullLoading } from '../../commons';
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import { useStateAlertRemove } from '../Unit/hook/useStateAlertRemove';
 import { ToastBottomHelper } from '../../utils/Utils';
@@ -26,6 +26,7 @@ const ListSmartAccount = ({ route }) => {
   const [data, setData] = useState([]);
   const smartAccountRef = useRef(null);
   const { navigate } = useNavigation();
+  const [loadingRemoveItem, setLoadingRemoveItem] = useState(false);
 
   const getAllSmartAccounts = useCallback(async () => {
     const { success, data } = await axiosGet(
@@ -70,6 +71,7 @@ const ListSmartAccount = ({ route }) => {
 
   const deleteSmartAccount = useCallback(async () => {
     hideAlertAction();
+    setLoadingRemoveItem(true);
     if (!smartAccountRef?.current) {
       return;
     }
@@ -81,6 +83,7 @@ const ListSmartAccount = ({ route }) => {
       ToastBottomHelper.success(t('removed_successfully'));
       getAllSmartAccounts();
     }
+    setLoadingRemoveItem(false);
   }, [getAllSmartAccounts, hideAlertAction, t]);
 
   const listMenuItem = useMemo(() => {
@@ -142,6 +145,7 @@ const ListSmartAccount = ({ route }) => {
           hideComplete={releaseLockShowing}
         />
       </WrapHeaderScrollable>
+      {loadingRemoveItem && <FullLoading />}
     </View>
   );
 };

package/src/utils/Apis/axios.js

@@ -153,7 +153,7 @@ export async function axiosDelete(...options) {
 }
 const convertFilenameImage = (filename) => {
   const filenameConverted = filename?.replace(/HEIC/g, 'jpg');
-  return filename || filenameConverted;
+  return filenameConverted || filename;
 };
 export function createFormData(data, list_file_field) {
   const formData = new FormData();

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

@@ -186,6 +186,7 @@
   "explanation": "Do everything with just one button",
   "value_change": "Value change",
   "schedule": "Schedule",
+  "event": "Event",
   "setup_the_conditions": "Setup the conditions",
   "setup_the_schedule": "Setup the Schedule",
   "des_launch_one_tap": "Quick button create at the dashboard",

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

@@ -46,6 +46,7 @@
   "setup_the_conditions": "Cài đặt điều kiện",
   "setup_the_schedule": "Cài đặt thời gian ",
   "schedule": "Lịch trình",
+  "event": "Sự kiện",
   "des_launch_one_tap": "Tạo nút nhanh trên trang tổng quan",
   "active_list": "Danh sách hành động",
   "filtering": "Đang sục rửa",