@eohjsc/react-native-smart-city 0.3.29 → 0.3.32

package/src/screens/AddNewGateway/ConnectingGateway.js

@@ -1,137 +0,0 @@
-import React, { memo, useEffect, useMemo, useState } from 'react';
-import { View } from 'react-native';
-import { API, Colors } from '../../configs';
-import Text from '../../commons/Text';
-import { useTranslations } from '../../hooks/Common/useTranslations';
-import { useNavigation } from '@react-navigation/native';
-import Routes from '../../utils/Route';
-import { axiosGet } from '../../utils/Apis/axios';
-import { IconOutline } from '@ant-design/icons-react-native';
-import styles from './ConnectingGatewayStyles';
-
-const ProcessItem = ({ title, active, line }) => {
-  return (
-    <>
-      <View style={styles.processItem}>
-        <View
-          style={[styles.processCircle, active && styles.processCircleActive]}
-        >
-          <IconOutline
-            name="radar-chart"
-            size={16}
-            color={active ? Colors.White : Colors.Gray5}
-          />
-        </View>
-        <Text
-          center
-          type="Label"
-          color={Colors.Gray7}
-          style={styles.textProcessItem}
-        >
-          {title}
-        </Text>
-      </View>
-      {line && <View style={[styles.line, active && styles.lineActive]} />}
-    </>
-  );
-};
-
-const ConnectingGateway = memo(({ route }) => {
-  const t = useTranslations();
-  const { navigate } = useNavigation();
-  const { new_chip } = route.params;
-  const [finalizeStatus, setFinalizeStatus] = useState(0);
-
-  useEffect(() => {
-    const checkChipFinalized = setInterval(async () => {
-      const { success, data } = await axiosGet(
-        API.CHIP.CHECK_FINALIZED(),
-        {
-          params: {
-            chip_id: new_chip.id,
-          },
-        },
-        true
-      );
-      if (success) {
-        const { control, config, bluetooth } = data;
-        if (control) {
-          setFinalizeStatus(1);
-        }
-        if (config) {
-          setFinalizeStatus(2);
-        }
-        if (bluetooth) {
-          setFinalizeStatus(3);
-        }
-        if (control && config && bluetooth) {
-          navigate(Routes.ConnectedGateway, route.params);
-        }
-      }
-    }, 3000);
-    return () => clearInterval(checkChipFinalized);
-  }, [navigate, new_chip.id, route.params]);
-
-  const percent = useMemo(() => {
-    if (finalizeStatus === 0) {
-      return '0%';
-    }
-    if (finalizeStatus === 1) {
-      return '30%';
-    }
-    if (finalizeStatus === 2) {
-      return '60%';
-    }
-    return '100%';
-  }, [finalizeStatus]);
-
-  return (
-    <View style={styles.wrap}>
-      <Text semibold size={20} color={Colors.Black} style={styles.txtHeader}>
-        {t('connecting_your_gateway')}
-      </Text>
-      <Text size={14} color={Colors.Gray} style={styles.txtNote}>
-        {t('dont_turn_off_the_device_or_close_this_app')}
-      </Text>
-      <View style={styles.scan}>
-        <View style={styles.layout}>
-          <View style={styles.layout1}>
-            <View style={styles.outsideCircle}>
-              <View style={styles.circle}>
-                <IconOutline name="search" size={28} color={Colors.White} />
-              </View>
-            </View>
-            <Text
-              style={styles.textPercent}
-              color={Colors.Gray7}
-              semibold
-              center
-            >
-              {percent}
-            </Text>
-          </View>
-        </View>
-        <View style={styles.layoutProcess}>
-          <View style={styles.layoutProcess1}>
-            <ProcessItem
-              title="Finalize control"
-              line
-              active={[1, 2, 3].includes(finalizeStatus)}
-            />
-            <ProcessItem
-              title="Finalize config"
-              line
-              active={[2, 3].includes(finalizeStatus)}
-            />
-            <ProcessItem
-              title="Finalize bluetooth"
-              active={[3].includes(finalizeStatus)}
-            />
-          </View>
-        </View>
-      </View>
-    </View>
-  );
-});
-
-export default ConnectingGateway;

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

@@ -1,214 +0,0 @@
-import React, {
-  memo,
-  useEffect,
-  useState,
-  useCallback,
-  useContext,
-} from 'react';
-import {
-  View,
-  StyleSheet,
-  Text,
-  PermissionsAndroid,
-  Platform,
-} from 'react-native';
-import WifiManager from 'react-native-wifi-reborn';
-import { useNavigation } from '@react-navigation/native';
-import { ToastBottomHelper } from '../../../utils/Utils';
-import dgram from 'react-native-udp';
-import { HeaderCustom } from '../../../commons/Header';
-import ScanQrGateway from '../../../../assets/images/scan-qr-gateway.svg';
-import { useTranslations } from '../../../hooks/Common/useTranslations';
-import { getBottomSpace } from 'react-native-iphone-x-helper';
-import BottomButtonView from '../../../commons/BottomButtonView';
-import { Colors } from '../../../configs';
-import Routes from '../../../utils/Route';
-import { SCContext } from '../../../context';
-import { Action } from '../../../context/actionType';
-import { TESTID } from '../../../configs/Constants';
-import Connecting from '../../../commons/Connecting';
-
-const isAndroid = Platform.OS === 'android';
-let socket,
-  intervalSend = null;
-
-const ConnectWifiWarning = memo(({ route }) => {
-  const {
-    wifi_ssid,
-    wifi_pass,
-    unit_id,
-    chip_id,
-    devicePrefixName,
-    body,
-    unit_name,
-  } = route.params;
-  const t = useTranslations();
-  const { navigate, goBack } = useNavigation();
-  const [isLoading, setIsLoading] = useState(false);
-  const [isConnect, setIsConnect] = useState(false);
-  const [isPercentConnect, setIsPercentConnect] = useState(0);
-
-  const { setAction } = useContext(SCContext);
-
-  const getPermissionWifiAndroid = useCallback(async () => {
-    return await PermissionsAndroid.request(
-      PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
-      {
-        title: t('location_permission_required_wifi_title'),
-        message: t('location_permission_required_wifi_message'),
-        buttonNegative: t('deny'),
-        buttonPositive: t('allow'),
-      }
-    );
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  useEffect(() => {
-    if (isAndroid) {
-      (async () => {
-        const granted = await getPermissionWifiAndroid();
-        if (!granted) {
-          ToastBottomHelper.error(
-            'Fail permission',
-            'You need to grant permission to continue'
-          );
-        }
-      })();
-    }
-  }, [getPermissionWifiAndroid]);
-
-  const handleSend = async () => {
-    socket = dgram.createSocket({ type: 'udp4' });
-    socket.bind(54321);
-    setIsPercentConnect(1);
-
-    socket.on('message', (msg, rinfo) => {
-      clearInterval(intervalSend);
-      const data = JSON.parse(msg.toString());
-      if (Object.prototype.hasOwnProperty.call(data, 'wifi')) {
-        navigate(Routes.GatewayWifiList, {
-          list_wifi: data.wifi,
-          unit_id: unit_id,
-          chip_id: chip_id,
-          scan_sensor_data: { ...body },
-          wifi_ssid: wifi_ssid,
-          wifi_pass: wifi_pass,
-          unit_name: unit_name,
-          devicePrefixName: devicePrefixName,
-          socket: socket,
-        });
-      }
-    });
-
-    socket.on('error', () => {
-      ToastBottomHelper.error(t('server_error'));
-      setAction(Action.IS_CONNECT_WIFI_GATEWAY, false);
-      goBack();
-    });
-
-    intervalSend = setInterval(() => {
-      socket.send(
-        JSON.stringify({ type: 'scan', data: { wifi: '' } }),
-        undefined,
-        undefined,
-        54321,
-        '192.168.27.1',
-        undefined
-      );
-    }, 5000); // workaround, todo Bang continue research
-  };
-
-  const handleConnectWifiGateway = async () => {
-    setIsLoading(true);
-    setIsConnect(true);
-    // eslint-disable-next-line promise/prefer-await-to-then
-    WifiManager.connectToProtectedSSID(wifi_ssid, wifi_pass, false).then(
-      () => {
-        handleSend();
-      },
-      (e) => {
-        ToastBottomHelper.error('Connection failed!');
-        goBack();
-      }
-    );
-  };
-
-  useEffect(() => {
-    return () => intervalSend && clearInterval(intervalSend);
-  }, []);
-
-  return (
-    <View style={styles.screen}>
-      {!isLoading ? (
-        <>
-          <HeaderCustom title={t('scan_qr')} isShowSeparator />
-          <View style={styles.container}>
-            <ScanQrGateway />
-            <View style={styles.content}>
-              <Text style={styles.text}>
-                {t('connecting_gateway_warning_1')}
-              </Text>
-              <Text style={styles.text}>
-                {t('connecting_gateway_warning_2')}
-              </Text>
-            </View>
-          </View>
-          <BottomButtonView
-            testID={TESTID.CONNECT_WIFI_WARNING.BUTTON_BOTTOM}
-            style={styles.viewBottomFixed}
-            mainTitle={t('ok')}
-            onPressMain={handleConnectWifiGateway}
-            typeMain={'primary'}
-          />
-        </>
-      ) : (
-        <View style={styles.centerLoading}>
-          <Connecting
-            isLoading={isLoading}
-            isConnect={isConnect}
-            isPercentConnect={isPercentConnect}
-          />
-        </View>
-      )}
-    </View>
-  );
-});
-
-export default ConnectWifiWarning;
-
-const styles = StyleSheet.create({
-  viewBottomFixed: {
-    position: 'absolute',
-    bottom: 0,
-    left: 0,
-    right: 0,
-    paddingBottom: getBottomSpace() > 0 ? getBottomSpace() : 32,
-    paddingTop: 24,
-    backgroundColor: Colors.Gray2,
-    borderColor: Colors.ShadownTransparent,
-    borderTopWidth: 1,
-  },
-  screen: {
-    flex: 1,
-    backgroundColor: Colors.Gray2,
-  },
-  container: {
-    flex: 1,
-    alignItems: 'center',
-    marginTop: 50,
-  },
-  content: {
-    alignItems: 'center',
-    width: '80%',
-    marginTop: 50,
-  },
-  text: {
-    textAlign: 'center',
-    lineHeight: 24,
-  },
-  centerLoading: {
-    flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-});

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

@@ -1,307 +0,0 @@
-import React, {
-  memo,
-  useState,
-  useCallback,
-  useContext,
-  useEffect,
-} from 'react';
-import {
-  View,
-  StyleSheet,
-  TouchableOpacity,
-  ScrollView,
-  ActivityIndicator,
-} from 'react-native';
-import { HeaderCustom } from '../../../commons/Header';
-import { Colors } from '../../../configs';
-import Text from '../../../commons/Text';
-import { useTranslations } from '../../../hooks/Common/useTranslations';
-import WifiIcon from '../../../../assets/images/wifi.svg';
-import ButtonPopup from '../../../commons/ButtonPopup';
-import TextInputPassword from '../../../commons/Form/TextInputPassword';
-import { SCContext, useSCContextSelector } from '../../../context';
-import { Action } from '../../../context/actionType';
-import { ToastBottomHelper } from '../../../utils/Utils';
-import Routes from '../../../utils/Route';
-import WifiManager from 'react-native-wifi-reborn';
-import { useNavigation } from '@react-navigation/native';
-import { TESTID } from '../../../configs/Constants';
-
-const GatewayWifiList = memo(({ route }) => {
-  const {
-    list_wifi,
-    socket,
-    unit_name,
-    wifi_pass,
-    wifi_ssid,
-    scan_sensor_data,
-    unit_id,
-    chip_id,
-    devicePrefixName,
-  } = route.params;
-  const t = useTranslations();
-  const { navigate, goBack } = useNavigation();
-  const [isShowPopupPassword, setIsShowPopupPassword] = useState(false);
-  const [password, setPassword] = useState('');
-  const [selectedWifi, setSelectedWifi] = useState('');
-  const [isSendWifi, setIsSendWifi] = useState(false);
-  const { setAction } = useContext(SCContext);
-
-  const isConnectWifiGateway = useSCContextSelector(
-    (state) => state.app.isConnectWifiGateway
-  );
-
-  const showPopupPassword = (ssid) => {
-    setIsShowPopupPassword(true);
-    setSelectedWifi(ssid);
-  };
-
-  const onPasswordChange = useCallback(
-    (newPassword) => {
-      setPassword(newPassword?.toString());
-    },
-    [setPassword]
-  );
-
-  const handleSocketOnMsg = useCallback(
-    (msg) => {
-      const data = JSON.parse(msg.toString());
-      if (Object.prototype.hasOwnProperty.call(data, 'gateway')) {
-        const checkWifiInterval = setInterval(() => {
-          // eslint-disable-next-line promise/prefer-await-to-then
-          WifiManager.getCurrentWifiSSID().then(
-            (ssid) => {
-              if (ssid !== wifi_ssid) {
-                const IsRobot = devicePrefixName === 'ROBOT';
-                if (IsRobot) {
-                  setAction(Action.IS_CONNECT_WIFI_GATEWAY, false);
-                  navigate(Routes.AddDeviceStack, {
-                    screen: Routes.AddCommonSelectSubUnit,
-                    params: {
-                      scan_sensor_data: scan_sensor_data,
-                      addType: 'AddDeviceNewFlow',
-                      gateway: data?.gateway,
-                      unit_id: unit_id,
-                      devicePrefixName: devicePrefixName,
-                      wifi_ssid: wifi_ssid,
-                      wifi_pass: wifi_pass,
-                    },
-                  });
-                  clearInterval(checkWifiInterval);
-                } else {
-                  setAction(Action.IS_CONNECT_WIFI_GATEWAY, false);
-                  navigate(Routes.AddDeviceStack, {
-                    screen: Routes.ConnectingProcess,
-                    params: {
-                      unit_id: unit_id,
-                      unit_name: unit_name,
-                      scan_sensor_data: scan_sensor_data,
-                      gateway: data?.gateway,
-                      devicePrefixName: devicePrefixName,
-                      chip_id: chip_id,
-                    },
-                  });
-                  clearInterval(checkWifiInterval);
-                }
-              }
-            },
-            () => {
-              ToastBottomHelper.error('Cannot get current SSID!');
-            }
-          );
-        }, 3000);
-      }
-    },
-    [
-      chip_id,
-      devicePrefixName,
-      navigate,
-      scan_sensor_data,
-      setAction,
-      unit_id,
-      unit_name,
-      wifi_pass,
-      wifi_ssid,
-    ]
-  );
-
-  const sendConnect = useCallback(
-    (i) => {
-      const timeoutSendConnect = setTimeout(async () => {
-        i++;
-        socket.send(
-          JSON.stringify({
-            type: 'connect',
-            data: { wifi: { ssid: selectedWifi, pass: password } },
-          }),
-          undefined,
-          undefined,
-          54321,
-          '192.168.27.1',
-          undefined
-        );
-        if (i < 3) {
-          sendConnect(i);
-          clearTimeout(timeoutSendConnect);
-        }
-      }, 1000);
-    },
-    [password, selectedWifi, socket]
-  );
-
-  const connectWifi = useCallback(async () => {
-    if (!isConnectWifiGateway) {
-      socket.on('message', (msg, rinfo) => {
-        handleSocketOnMsg(msg);
-      });
-      socket.on('error', () => {
-        ToastBottomHelper.error(t('server_error'));
-        setAction(Action.IS_CONNECT_WIFI_GATEWAY, false);
-        goBack();
-      });
-
-      sendConnect(0);
-      setAction(Action.IS_CONNECT_WIFI_GATEWAY, true);
-      setIsSendWifi(true);
-    }
-  }, [
-    goBack,
-    handleSocketOnMsg,
-    isConnectWifiGateway,
-    sendConnect,
-    setAction,
-    socket,
-    t,
-  ]);
-
-  useEffect(() => {
-    if (!isConnectWifiGateway) {
-      setIsShowPopupPassword(false);
-    }
-  }, [isConnectWifiGateway]);
-
-  const onCloseModal = useCallback(() => {
-    if (isSendWifi) {
-      setAction(Action.IS_CONNECT_WIFI_GATEWAY, false);
-      setIsShowPopupPassword(false);
-      setIsSendWifi(false);
-    }
-  }, [isSendWifi, setAction]);
-
-  const handleOnGoBack = useCallback(() => {
-    navigate(Routes.Dashboard);
-  }, [navigate]);
-
-  return (
-    <View style={styles.screen}>
-      <HeaderCustom
-        onGoBack={handleOnGoBack}
-        title={t('connect_home_wifi')}
-        isShowSeparator
-      />
-      <View>
-        <Text style={styles.title} semibold type="H3">
-          {t('set_network')}
-        </Text>
-        <Text style={styles.subTitle} type="Body">
-          {t('select_wifi')}
-        </Text>
-
-        <ScrollView
-          style={styles.listContainer}
-          scrollIndicatorInsets={{ right: 1 }}
-        >
-          {!!list_wifi.length &&
-            list_wifi.map((item, index) => (
-              <TouchableOpacity
-                key={index}
-                style={styles.listItem}
-                onPress={() => showPopupPassword(item.ssid)}
-              >
-                <Text type="H4" style={styles.textItem}>
-                  {item.ssid}
-                </Text>
-                <View style={styles.wifiIcon}>
-                  <WifiIcon />
-                </View>
-              </TouchableOpacity>
-            ))}
-        </ScrollView>
-      </View>
-
-      <ButtonPopup
-        testID={TESTID.GATEWAY_WIFI_LIST.BUTTON_POPUP}
-        visible={isShowPopupPassword}
-        mainTitle={
-          isConnectWifiGateway ? (
-            <ActivityIndicator color={Colors.White} size={'small'} />
-          ) : (
-            t('connect')
-          )
-        }
-        onPressMain={connectWifi}
-        secondaryTitle={t('cancel')}
-        typeSecondary={isConnectWifiGateway ? 'disabled' : 'cancel'}
-        onPressSecondary={() => setIsShowPopupPassword(false)}
-        hideClose
-        onClose={isSendWifi ? onCloseModal : () => <></>}
-      >
-        <>
-          <Text>{t('enter_wifi_password')}</Text>
-          <TextInputPassword
-            secureTextEntry
-            placeholder={t('password')}
-            onChange={onPasswordChange}
-            value={password}
-            textInputStyle={styles.input}
-            selectionColor={Colors.Primary}
-          />
-        </>
-      </ButtonPopup>
-    </View>
-  );
-});
-
-export default GatewayWifiList;
-
-const styles = StyleSheet.create({
-  screen: {
-    flex: 1,
-    backgroundColor: Colors.Gray2,
-  },
-  title: {
-    marginVertical: 16,
-    marginLeft: 16,
-  },
-  subTitle: {
-    marginBottom: 16,
-    marginLeft: 16,
-  },
-  listContainer: {
-    borderWidth: 1,
-    backgroundColor: Colors.White,
-    borderRadius: 20,
-    borderColor: Colors.Gray4,
-  },
-  listItem: {
-    borderBottomColor: Colors.Gray4,
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-  },
-  textItem: {
-    paddingVertical: 16,
-    paddingLeft: 16,
-  },
-  wifiIcon: {
-    paddingRight: 16,
-  },
-  input: {
-    height: 40,
-    marginVertical: 12,
-    borderWidth: 1,
-    padding: 10,
-    borderColor: Colors.Gray5,
-  },
-});