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

package/src/commons/ConnectWifi/index.js

@@ -0,0 +1,201 @@
+import React, { memo, useCallback, useMemo, useState } from 'react';
+import {
+  View,
+  FlatList,
+  TouchableOpacity,
+  ActivityIndicator,
+  Platform,
+} from 'react-native';
+import LottieView from 'lottie-react-native';
+import WifiIcon from '../../../assets/images/wifi.svg';
+import WifiOpenIcon from '../../../assets/images/wifi-open.svg';
+import { HeaderCustom, FullLoading, ButtonPopup, Text } from '../../commons';
+import _TextInput from '../Form/TextInput';
+import _TextInputPassword from '../Form/TextInputPassword';
+import AccessibilityLabel from '../../configs/AccessibilityLabel';
+import { useTranslations } from '../../hooks/Common/useTranslations';
+import { Colors } from '../../configs';
+import { ToastBottomHelper } from '../../utils/Utils';
+import LoadingCircle from '../../Images/Common/loading-circle.json';
+import styles from './styles';
+
+const ConnectWifi = ({
+  title,
+  wifiList,
+  onConnect,
+  onGoBack,
+  isShowLoading,
+  setIsShowLoading,
+}) => {
+  const t = useTranslations();
+
+  const [isOther, setIsOther] = useState(false);
+  const [isOpenWifi, setIsOpenWifi] = useState(false);
+  const [isShowPopupPassword, setIsShowPopupPassword] = useState(false);
+
+  const [wifiSsid, setWifiSsid] = useState('');
+  const [wifiPassword, setWifiPassword] = useState('');
+
+  const hidePopupPassword = useCallback(() => {
+    setIsShowPopupPassword(false);
+  }, []);
+
+  const handleSelectWifi = useCallback((item) => {
+    setWifiSsid(item.ssid);
+    setWifiPassword('');
+    setIsOther(false);
+    setIsOpenWifi(item?.encryption === 'OPEN');
+    setIsShowPopupPassword(true);
+  }, []);
+
+  const handleOtherOption = useCallback(() => {
+    setWifiSsid('');
+    setWifiPassword('');
+    setIsOther(true);
+    setIsOpenWifi(false);
+    setIsShowPopupPassword(true);
+  }, []);
+
+  const onConnectWifi = useCallback(() => {
+    if (!onConnect) {
+      return;
+    }
+
+    if (!wifiSsid) {
+      ToastBottomHelper.error(t('please_enter_wifi_name'));
+      return;
+    }
+    if (!isOpenWifi && !isOther && !wifiPassword) {
+      ToastBottomHelper.error(t('please_enter_wifi_password'));
+      return;
+    }
+    if (wifiPassword && wifiPassword.length < 8) {
+      ToastBottomHelper.error(t('password_must_be_at_least_8_characters'));
+      return;
+    }
+
+    setIsShowLoading(true);
+    setIsShowPopupPassword(false);
+
+    onConnect({ wifiSsid, wifiPassword });
+  }, [
+    onConnect,
+    wifiSsid,
+    wifiPassword,
+    isOpenWifi,
+    isOther,
+    setIsShowLoading,
+    t,
+  ]);
+
+  const wifiListWithOther = useMemo(
+    () => [...wifiList, { ssid: `${t('other')}...`, isOther: true }],
+    [wifiList, t]
+  );
+
+  const renderItem = useCallback(
+    ({ item }) => (
+      <TouchableOpacity
+        onPress={() =>
+          item.isOther ? handleOtherOption() : handleSelectWifi(item)
+        }
+        accessibilityLabel={`${AccessibilityLabel.SELECT_WIFI}-${
+          item.isOther ? 'other' : item.ssid
+        }`}
+      >
+        <View style={styles.listItem}>
+          <View style={styles.textItem}>
+            <Text type="H4">{item.ssid}</Text>
+          </View>
+          {!item.isOther && (
+            <View style={styles.wifiIcon}>
+              {item?.encryption === 'OPEN' ? <WifiOpenIcon /> : <WifiIcon />}
+            </View>
+          )}
+        </View>
+      </TouchableOpacity>
+    ),
+    [handleSelectWifi, handleOtherOption]
+  );
+
+  return (
+    <View style={styles.container}>
+      <HeaderCustom onGoBack={onGoBack} title={t(title)} isShowSeparator />
+
+      <View style={styles.rowContainer}>
+        <Text style={styles.subTitle} type="Body">
+          {t('select_network')}
+        </Text>
+        {!wifiList.length && (
+          <ActivityIndicator style={styles.containerLoading} />
+        )}
+      </View>
+
+      <FlatList
+        style={styles.listContainer}
+        keyExtractor={(item, index) => `${item.ssid}-${index}`}
+        data={wifiListWithOther}
+        renderItem={renderItem}
+        extraData={wifiListWithOther}
+        numColumns={1}
+      />
+
+      <ButtonPopup
+        accessibilityLabel={AccessibilityLabel.GATEWAY_WIFI_LIST.BUTTON_POPUP}
+        visible={isShowPopupPassword}
+        mainTitle={t('connect')}
+        onPressMain={onConnectWifi}
+        secondaryTitle={t('cancel')}
+        typeSecondary={'cancel'}
+        onPressSecondary={hidePopupPassword}
+        hideClose
+        avoidKeyboard={Platform.OS === 'ios'}
+      >
+        <Text type="H3" semibold>
+          {isOther
+            ? t('enter_wifi_name_password')
+            : isOpenWifi
+            ? `${t('connect_to_wifi')} '${wifiSsid}'`
+            : `${t('enter_wifi_password')} '${wifiSsid}'`}
+        </Text>
+        {isOther && (
+          <_TextInput
+            placeholder={t('wifi_name')}
+            onChange={setWifiSsid}
+            value={wifiSsid}
+            textInputStyle={styles.input}
+            selectionColor={Colors.Primary}
+            autoFocus
+          />
+        )}
+        {!isOpenWifi && (
+          <_TextInputPassword
+            secureTextEntry
+            placeholder={t('password')}
+            onChange={setWifiPassword}
+            value={wifiPassword}
+            textInputStyle={styles.input}
+            selectionColor={Colors.Primary}
+            autoFocus={!isOther}
+          />
+        )}
+      </ButtonPopup>
+
+      {isShowLoading && (
+        <FullLoading
+          styleBackground={styles.backgroundLoading}
+          customIcon={
+            <LottieView
+              source={LoadingCircle}
+              autoPlay
+              loop
+              style={styles.loading}
+            />
+          }
+        />
+      )}
+    </View>
+  );
+};
+
+export default memo(ConnectWifi);

package/src/commons/ConnectWifi/styles.js

@@ -0,0 +1,69 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from '../../configs';
+
+export default StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: Colors.Gray2,
+  },
+  rowContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  title: {
+    marginVertical: 16,
+    marginLeft: 16,
+  },
+  subTitle: {
+    fontSize: 14,
+    lineHeight: 22,
+    marginTop: 16,
+    marginLeft: 16,
+    marginBottom: 16,
+  },
+  listContainer: {
+    flex: 1,
+    borderWidth: 1,
+    backgroundColor: Colors.White,
+    borderRadius: 20,
+    borderColor: Colors.Gray4,
+  },
+  listItem: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    borderBottomColor: Colors.Gray4,
+    borderBottomWidth: 1,
+    paddingVertical: 16,
+    marginRight: 24,
+    marginLeft: 16,
+  },
+  textItem: {
+    flex: 1,
+    height: 'auto',
+    paddingLeft: 16,
+  },
+  wifiIcon: {
+    paddingRight: 16,
+  },
+  loading: {
+    width: 40,
+    height: 40,
+  },
+  backgroundLoading: {
+    backgroundColor: Colors.Gray21,
+  },
+  containerLoading: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'flex-start',
+    marginLeft: 16,
+  },
+  input: {
+    height: 45,
+    borderWidth: 1,
+    padding: 20,
+    borderColor: Colors.Gray5,
+  },
+});

package/src/commons/Form/TextInputPassword.js

@@ -113,7 +113,7 @@ const styles = StyleSheet.create({
   icons: {
     position: 'absolute',
     right: 0,
-    top: -5,
+    top: 7,
     bottom: 0,
     width: 40,
     justifyContent: 'center',

package/src/commons/OneTapTemplate/StatesGridActionTemplate.js

@@ -16,10 +16,14 @@ const ActionItem = ({
   item,
 }) => {
   const handleSelectAction = useCallback(() => {
-    let actionData = null;
+    let actionData = { value: is_on_value };
     const { allow_config_store_value, config, is_on_value } = item;
     if (allow_config_store_value && config) {
-      actionData = { config_id: config, config_value: is_on_value };
+      actionData = {
+        config_id: config,
+        config_value: is_on_value,
+        value: is_on_value,
+      };
     }
     setActionName(item.text);
 

package/src/configs/API.js

@@ -42,6 +42,8 @@ const API = {
     CREATE_SUB_UNIT: (unitId) => `/property_manager/${unitId}/sub_units/`,
     MANAGE_SUB_UNIT: (unitId, id) =>
       `/property_manager/${unitId}/sub_units/${id}/`,
+    ORDER_SUB_UNITS: (unitId) =>
+      `/property_manager/${unitId}/sub_units/order_sub_units/`,
   },
   CHIP: {
     GET_CHIPS_FROM_UNIT: (id) => `/property_manager/get_chips/?unit_id=${id}`,
@@ -103,12 +105,16 @@ const API = {
       `/property_manager/automate/${automateId}/update_script_notify/`,
     UPDATE_SCRIPT_ACTION: (automateId) =>
       `/property_manager/automate/${automateId}/update_script_action/`,
+    UPDATE_SCRIPT_EMAIL: (automateId) =>
+      `/property_manager/automate/${automateId}/update_script_email/`,
     ADD_SCRIPT_ACTION: (id) =>
       `/property_manager/automate/${id}/add_script_action/`,
     ADD_SCRIPT_NOTIFY: (id) =>
       `/property_manager/automate/${id}/add_script_notify/`,
     ADD_SCRIPT_DELAY: (id) =>
       `/property_manager/automate/${id}/add_script_delay/`,
+    ADD_SCRIPT_EMAIL: (id) =>
+      `/property_manager/automate/${id}/add_script_email/`,
 
     FETCH_AUTOMATE: (automateId) => `/property_manager/automate/${automateId}/`,
     CREATE_AUTOMATE: () => '/property_manager/automate/',
@@ -144,6 +150,9 @@ const API = {
     UNIT_MEMBER_SHARE_DEVICE: (unit_id, member_id) =>
       `/property_manager/sharing/units/${unit_id}/member/${member_id}/shared_devices/`,
     SHARE: () => '/property_manager/sharing/share/',
+    SHARE_V2: () => '/property_manager/sharing/share_v2/',
+    SEARCH_USER_BY_PHONE: (phone) => `/accounts/search/phone/${phone}/`,
+    SEARCH_USER_BY_EMAIL: (email) => `/accounts/search/email/${email}/`,
   },
   EMERGENCY_BUTTON: {
     CREATE_CONTACT: () => '/emergency_button/contacts/',
@@ -257,6 +266,9 @@ const API = {
       ACTION: (gatewayId, deviceId) =>
         `/iot/modules/zigbee/gateways/${gatewayId}/devices/${deviceId}/zigbee_actions/`,
     },
+    CHIP_QR_CODE: {
+      DETAIL_BY_SECRET: () => '/chip_manager/chip_qr_code/by_secret/',
+    },
     MODBUS: {
       DETAIL: (id) => `/iot/modules/modbus/gateways/${id}/`,
       DEVICE: (gatewayId) =>

package/src/configs/AccessibilityLabel.js

@@ -115,6 +115,7 @@ export default {
   SUB_UNIT_FAVORITES: 'SUB_UNIT_FAVORITES',
   ANIMATED_SCROLL: 'ANIMATED_SCROLL',
   ADD_SUB_UNIT: 'ADD_SUB_UNIT',
+  REARRANGE_SUB_UNIT: 'REARRANGE_SUB_UNIT',
 
   // NavBar
   NAVBAR_ICON_BARS: 'NAVBAR_ICON_BARS',
@@ -454,8 +455,13 @@ export default {
   SELECT_UNIT: 'SELECT_UNIT',
   SELECT_MEMBER_UNIT: 'SELECT_MEMBER_UNIT',
 
+  // Select device
+  SELECT_DEVICE: 'SELECT_DEVICE',
+  SELECT_RADIO_DEVICE: 'SELECT_RADIO_DEVICE',
+
   // select wifi
   SELECT_WIFI: 'SELECT_WIFI',
+  CHANGE_WIFI: 'CHANGE_WIFI',
 
   SHARED_UNIT: 'SHARED_UNIT',
 
@@ -467,6 +473,7 @@ export default {
     MANAGE_UNIT: 'MANAGE_UNIT',
     MANAGE_UNIT_ALERT: 'MANAGE_UNIT_ALERT',
     SELECT_UNIT: 'SELECT_UNIT',
+    SELECT_DEVICE: 'SELECT_DEVICE',
     BUTTON_ADD_AUTO_SMART: 'BUTTON_ADD_AUTO_SMART',
     BUTTON_CONNECT_WIFI: 'BUTTON_CONNECT_WIFI',
     BUTTON_BOTTOM_SMART_ACCOUNT: 'BUTTON_BOTTOM_SMART_ACCOUNT',

package/src/configs/Constants.js

@@ -82,6 +82,7 @@ export const DEVICE_TYPE = {
   ZIGBEE: 'ZIGBEE',
   GOOGLE_HOME: 'GOOGLE_HOME',
   WIFI_DEVICE: 'WIFI_DEVICE',
+  SCAN_DEVICE: 'SCAN_DEVICE',
   MODBUS: 'MODBUS',
   IO: 'INPUT/OUTPUT',
 };

package/src/hooks/Common/index.js

@@ -4,7 +4,7 @@ import useForceUpdate from './useForceUpdate';
 import useKeyboardShow from './useKeyboardShow';
 import usePopover from './usePopover';
 import useDevicesStatus from './useDevicesStatus';
-import { useBlockBackAndroid } from './useBlockBackAndroid';
+import { useBlockBack } from './useBlockBack';
 import { useIsOwnerOfUnit } from './useIsOwnerOfUnit';
 import { useStatusBar } from './useStatusBar';
 import { useGetIdUser } from './useGetIdUser';
@@ -15,7 +15,7 @@ export {
   useForceUpdate,
   useKeyboardShow,
   usePopover,
-  useBlockBackAndroid,
+  useBlockBack,
   useIsOwnerOfUnit,
   useStatusBar,
   useGetIdUser,

package/src/hooks/Common/useBlockBack.js

@@ -0,0 +1,36 @@
+import { useFocusEffect, useNavigation } from '@react-navigation/native';
+import { useCallback, useRef } from 'react';
+import { BackHandler } from 'react-native';
+
+export const useBlockBack = (actionBack) => {
+  const navigation = useNavigation();
+  const isBeforeRemoveHandled = useRef(false);
+
+  const blockBack = useCallback(() => {
+    actionBack && actionBack();
+    return true;
+  }, [actionBack]);
+
+  useFocusEffect(
+    useCallback(() => {
+      const onBeforeRemove = (e) => {
+        if (!isBeforeRemoveHandled.current) {
+          isBeforeRemoveHandled.current = true;
+          e.preventDefault();
+          blockBack();
+        }
+      };
+
+      BackHandler.addEventListener('hardwareBackPress', blockBack);
+      const unsubscribe = navigation.addListener(
+        'beforeRemove',
+        onBeforeRemove
+      );
+
+      return () => {
+        BackHandler.removeEventListener('hardwareBackPress', blockBack);
+        unsubscribe();
+      };
+    }, [blockBack, navigation])
+  );
+};

package/src/hooks/useMqtt.js

@@ -27,15 +27,20 @@ const useChipJsonConfiguration = (dashboardId) => {
   };
 };
 
-const connectChipMqtt = (chip) => {
-  const configById = {};
-  const { code, mqtt_server } = chip;
-  const { websocket_host, websocket_port } = mqtt_server;
-
+export const connectMqttServer = (mqttServer, code) => {
+  const { websocket_host, websocket_port } = mqttServer;
   const client = mqtt.connect(`wss://${websocket_host}:${websocket_port}`, {
     username: code,
     password: code,
   });
+  return client;
+};
+
+const connectChipMqtt = (chip) => {
+  const configById = {};
+  const { code, mqtt_server } = chip;
+
+  const client = connectMqttServer(mqtt_server, code);
 
   (chip?.sensors).forEach((sensor) => {
     (sensor?.configs).forEach((config) => {

package/src/navigations/AddGatewayStack.js

@@ -19,6 +19,7 @@ import ShareWifiPassword from '../screens/AddNewGateway/ShareWifiPassword';
 import ScanGatewayQR from '../screens/AddNewGateway/ScanGatewayQR';
 import RenameNewDevices from '../screens/AddNewGateway/RenameNewDevices';
 import ConnectingWifiGuide from '../screens/AddNewGateway/ConnectingWifiGuide';
+import ScanDeviceLocal from '../screens/AddNewGateway/ScanDeviceLocal';
 import ZigbeeDeviceConnectGuide from '../screens/AddNewGateway/PlugAndPlay/ZigbeeDeviceConnectGuide';
 
 const Stack = createNativeStackNavigator();
@@ -87,6 +88,7 @@ export const AddGatewayStack = memo(() => {
         name={Route.ZigbeeDeviceConnectGuide}
         component={ZigbeeDeviceConnectGuide}
       />
+      <Stack.Screen name={Route.ScanDeviceLocal} component={ScanDeviceLocal} />
     </Stack.Navigator>
   );
 });

package/src/navigations/AllGatewayStack.js

@@ -3,6 +3,8 @@ import { createNativeStackNavigator } from '@react-navigation/native-stack';
 
 import GatewayDetail from '../screens/AllGateway/GatewayDetail';
 import GatewayInfo from '../screens/AllGateway/GatewayInfo';
+import GatewayWifi from '../screens/AllGateway/GatewayWifi';
+import Successfully from '../screens/AllGateway/Successfully';
 import GatewayConnectionMethods from '../screens/AllGateway/GatewayConnectionMethods';
 import DeviceZigbeeDetail from '../screens/AllGateway/DeviceZigbeeDetail';
 import DeviceInternalDetail from '../screens/AllGateway/DeviceInternalDetail';
@@ -27,6 +29,8 @@ export const AllGatewayStack = memo(() => {
     >
       <Stack.Screen component={GatewayDetail} name={Route.GatewayDetail} />
       <Stack.Screen component={GatewayInfo} name={Route.GatewayInfo} />
+      <Stack.Screen component={GatewayWifi} name={Route.GatewayWifi} />
+      <Stack.Screen component={Successfully} name={Route.Successfully} />
       <Stack.Screen
         component={DeviceGatewayInfo}
         name={Route.DeviceGatewayInfo}

package/src/navigations/Main.js

@@ -36,7 +36,7 @@
 // import DeviceModbusDetail from '../screens/Gateway/DeviceModbusDetail';
 // import DetailConfigActionModbus from '../screens/Gateway/DetailConfigActionModbus';
 // import DetailChildConfigActionModbus from '../screens/Gateway/DetailConfigActionModbus';
-// import { useBlockBackAndroid } from '../hooks/Common';
+// import { useBlockBack } from '../hooks/Common';
 
 // const Tab = createBottomTabNavigator();
 // const Drawer = createDrawerNavigator();
@@ -121,7 +121,7 @@
 // };
 
 // const DrawerScreen = () => {
-//   useBlockBackAndroid();
+//   useBlockBack();
 //   return (
 //     <Drawer.Navigator
 //       backBehavior="none"

package/src/navigations/UnitStack.js

@@ -27,6 +27,8 @@ import SelectMonitorDevices from '../screens/Automate/AddNewAction/SelectMonitor
 import SetupConfigCondition from '../screens/Automate/AddNewAction/SetupConfigCondition';
 import SetupScriptDelay from '../screens/Automate/AddNewAction/SetupScriptDelay';
 import SetupScriptNotify from '../screens/Automate/AddNewAction/SetupScriptNotify';
+import SetupScriptEmail from '../screens/Automate/AddNewAction/SetupScriptEmail';
+import SetupScriptReceiverEmail from '../screens/Automate/AddNewAction/SetupScriptReceiverEmail';
 import AddAutomationTypeSmart from '../screens/Automate/AddNewAutoSmart/AddAutomationTypeSmart';
 import AddUnknownTypeSmart from '../screens/Automate/AddNewAutoSmart/AddUnknownTypeSmart';
 import EditActionsList from '../screens/Automate/EditActionsList';
@@ -53,6 +55,7 @@ import UnitMemberList from '../screens/Sharing/UnitMemberList';
 import SideMenuDetail from '../screens/SideMenuDetail';
 import EditSubUnit from '../screens/SubUnit/EditSubUnit';
 import ManageSubUnit from '../screens/SubUnit/ManageSubUnit';
+import RearrangeSubUnit from '../screens/SubUnit/RearrageSubUnit';
 import TDSGuide from '../screens/TDSGuide';
 import ChooseLocation from '../screens/Unit/ChooseLocation';
 import UnitDetail from '../screens/Unit/Detail';
@@ -68,6 +71,7 @@ import { ToastBottomHelper } from '../utils/Utils';
 import { HanetCameraStack } from './HanetCameraStack';
 import { styles } from './UnitStackStyles';
 import { bleManager } from '../utils/bluetooth';
+import UpdateReceiverEmailScript from '../screens/Automate/EditActionsList/UpdateReceiverEmailScript';
 
 const Stack = createNativeStackNavigator();
 
@@ -260,6 +264,13 @@ export const UnitStack = memo((props) => {
           headerTitle: '',
         }}
       />
+      <Stack.Screen
+        name={Route.RearrangeSubUnit}
+        component={RearrangeSubUnit}
+        options={{
+          headerShown: false,
+        }}
+      />
       <Stack.Screen
         name={Route.DeviceDetail}
         component={DeviceDetail}
@@ -414,6 +425,27 @@ export const UnitStack = memo((props) => {
           headerShown: false,
         }}
       />
+      <Stack.Screen
+        name={Route.SetupScriptEmail}
+        component={SetupScriptEmail}
+        options={{
+          headerShown: false,
+        }}
+      />
+      <Stack.Screen
+        name={Route.SetupScriptReceiverEmail}
+        component={SetupScriptReceiverEmail}
+        options={{
+          headerShown: false,
+        }}
+      />
+      <Stack.Screen
+        name={Route.UpdateReceiverEmailScript}
+        component={UpdateReceiverEmailScript}
+        options={{
+          headerShown: false,
+        }}
+      />
       <Stack.Screen
         name={Route.AddAutomationTypeSmart}
         component={AddAutomationTypeSmart}

package/src/screens/AddNewGateway/ConnectingWifiDevice.js

@@ -43,10 +43,10 @@ const ConnectingWifiDevice = ({ route }) => {
               code,
               host: qrData?.host,
               secret: qrData?.secret,
-              name: gateway?.model,
+              name: gateway?.name || gateway?.model,
               station: subUnit?.id,
-              wifi_ssid: selectedWifi.ssid, // for storing
-              wifi_pass: selectedWifi.password, // for storing
+              wifi_ssid: selectedWifi?.ssid, // for storing
+              wifi_pass: selectedWifi?.password, // for storing
               channel_name: channelName,
             }
           );
@@ -65,10 +65,11 @@ const ConnectingWifiDevice = ({ route }) => {
       code,
       qrData?.host,
       qrData?.secret,
+      gateway?.name,
       gateway?.model,
       subUnit?.id,
-      selectedWifi.ssid,
-      selectedWifi.password,
+      selectedWifi?.ssid,
+      selectedWifi?.password,
       addingWifiDeviceFail,
     ]
   );
@@ -82,7 +83,7 @@ const ConnectingWifiDevice = ({ route }) => {
     });
     return () => unsubscribe && unsubscribe();
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [selectedWifi.ssid, channelName]);
+  }, [selectedWifi?.ssid, channelName]);
 
   return (
     <ConnectingDevice