@eohjsc/react-native-smart-city 0.2.72 → 0.2.76

package/src/configs/Images.js

@@ -10,4 +10,5 @@ export default {
   buttonPauseCurtain: require('../Images/Common/buttonPauseCurtain.png'),
   buttonLeftCurtain: require('../Images/Common/buttonLeftCurtain.png'),
   buttonRightCurtain: require('../Images/Common/buttonRightCurtain.png'),
+  shadowButton: require('../Images/Common/shadowButton.png'),
 };

package/src/context/SCContext.tsx

@@ -1,4 +1,6 @@
 import React, { useContext, useReducer } from 'react';
+import { StyleSheet, View } from 'react-native';
+import Toast from 'react-native-toast-message';
 
 import {
   ActionDataMap,
@@ -10,6 +12,18 @@ import {
 import { initialState, Action, ContextData, reducer } from './reducer';
 import { setConfigGlobalState } from '../iot/states.js';
 import { setAxiosDefaultLanguage } from '../utils/Utils';
+import { Alert } from '../commons';
+import { Colors } from '../configs';
+import Text from '../commons/Text';
+
+const toastConfig = {
+  // only for error for now
+  error: (internalState) => (
+    <View style={styles.toastContainer}>
+      <Text style={styles.textWhite}>{internalState.text1}</Text>
+    </View>
+  ),
+};
 
 type SCContextType = {
   stateData: ContextData;
@@ -68,15 +82,34 @@ export const SCProvider = ({ children, initState = initialState }) => {
   return (
     <SCContext.Provider value={providerValue}>
       {children}
-      {/* <Alert ref={(ref) => Alert.setRef(ref)} />
-      <Toast config={toastConfig} ref={(ref) => Toast.setRef(ref)} /> */}
+      <Alert ref={(ref) => Alert.setRef(ref)} />
     </SCContext.Provider>
   );
 };
 
+export const SCWrapper = (props) => {
+  return (
+    <>
+      <SCProvider {...props} />
+      <Toast config={toastConfig} ref={(ref) => Toast.setRef(ref)} />
+    </>
+  );
+};
+
 export const useSCContextSelector = (
   selector: (contextData: ContextData) => unknown
 ) => {
   const { stateData } = useContext(SCContext);
   return selector(stateData);
 };
+
+const styles = StyleSheet.create({
+  toastContainer: {
+    borderRadius: 5,
+    padding: 10,
+    backgroundColor: Colors.Black,
+  },
+  textWhite: {
+    color: Colors.White,
+  },
+});

package/src/context/index.ts

@@ -1 +1,6 @@
-export { useSCContextSelector, SCContext, SCProvider } from './SCContext';
+export {
+  useSCContextSelector,
+  SCContext,
+  SCProvider,
+  SCWrapper,
+} from './SCContext';

package/src/navigations/UnitStack.js

@@ -1,5 +1,5 @@
 import React, { memo } from 'react';
-import { View, StyleSheet, Platform } from 'react-native';
+import { View, StyleSheet } from 'react-native';
 import { IconOutline } from '@ant-design/icons-react-native';
 import { createStackNavigator } from '@react-navigation/stack';
 import { get } from 'lodash';
@@ -134,7 +134,6 @@ export const UnitStack = memo((props) => {
         component={UnitSummary}
         options={{
           headerShown: false,
-          animationEnabled: Platform.OS === 'ios',
         }}
       />
       <Stack.Screen
@@ -161,7 +160,6 @@ export const UnitStack = memo((props) => {
         component={DeviceDetail}
         options={{
           headerShown: false,
-          animationEnabled: Platform.OS === 'ios',
         }}
       />
       <Stack.Screen

package/src/screens/ActivityLog/__test__/index.test.js

@@ -101,50 +101,49 @@ describe('Test Activity log', () => {
     });
     const instance = tree.root;
     const dateTimeRangeChange = instance.findByType(DateTimeRangeChange);
-    const filterPopup = instance.findByType(Modal);
+    const filterPopup = instance.findAllByType(Modal);
     const datePicker = instance.findByType(DateTimePickerModal);
     const filterButton = instance.find(
       (el) =>
         el.props.testID === TESTID.FILTER_BUTTON && el.type === TouchableOpacity
     );
     // open popup
-    expect(filterPopup.props.isVisible).toBeFalsy();
+    expect(filterPopup[0].props.isVisible).toBeFalsy();
     await act(async () => {
       await filterButton.props.onPress();
     });
-    expect(filterPopup.props.isVisible).toBeTruthy();
+    expect(filterPopup[0].props.isVisible).toBeTruthy();
     // pick start date
     await act(async () => {
       await dateTimeRangeChange.props.onStart();
-      await filterPopup.props.onModalHide();
+      await filterPopup[0].props.onModalHide();
     });
-    expect(filterPopup.props.isVisible).toBeFalsy();
-    expect(datePicker.props.isVisible).toBeTruthy();
+    expect(filterPopup[0].props.isVisible).toBeFalsy();
     // cancel
     await act(async () => {
       await datePicker.props.onCancel();
       await datePicker.props.onHide();
     });
-    expect(filterPopup.props.isVisible).toBeTruthy();
+    expect(filterPopup[0].props.isVisible).toBeTruthy();
     expect(datePicker.props.isVisible).toBeFalsy();
     // open popup
     await act(async () => {
       await filterButton.props.onPress();
     });
-    expect(filterPopup.props.isVisible).toBeTruthy();
+    expect(filterPopup[0].props.isVisible).toBeTruthy();
     // pick end date
     await act(async () => {
       await dateTimeRangeChange.props.onEnd();
-      await filterPopup.props.onModalHide();
+      await filterPopup[0].props.onModalHide();
     });
-    expect(filterPopup.props.isVisible).toBeFalsy();
+    expect(filterPopup[0].props.isVisible).toBeFalsy();
     expect(datePicker.props.isVisible).toBeTruthy();
     // confirm
     await act(async () => {
       await datePicker.props.onConfirm();
       await datePicker.props.onHide();
     });
-    expect(filterPopup.props.isVisible).toBeTruthy();
+    expect(filterPopup[0].props.isVisible).toBeTruthy();
     expect(datePicker.props.isVisible).toBeFalsy();
   });
 });

package/src/screens/AddNewAction/Device/__test__/index.test.js

@@ -31,11 +31,11 @@ describe('Test SelectDevice', () => {
     });
 
     const instance = tree.root;
-    const touchableWithoutFeedback = instance.findByType(
+    const touchableWithoutFeedback = instance.findAllByType(
       TouchableWithoutFeedback
     );
     act(() => {
-      touchableWithoutFeedback.props.onPress();
+      touchableWithoutFeedback[0].props.onPress();
     });
     expect(mockFuntion).toHaveBeenCalledWith(sensor);
   });

package/src/screens/AddNewDevice/__test__/ConnectingDevices.test.js

@@ -53,7 +53,7 @@ describe('Test ConnectingDevices', () => {
     });
     const instance = tree.root;
     const texts = instance.findAllByType(Text);
-    expect(texts).toHaveLength(2);
+    expect(texts).toHaveLength(4);
     expect(texts[0].props.children).toEqual(
       getTranslate('en', 'connecting_your_device')
     );

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

@@ -20,45 +20,12 @@ import { Colors, API } from '../../../configs';
 import { axiosPost } from '../../../utils/Apis/axios';
 import Routes from '../../../utils/Route';
 
-const socket = dgram.createSocket({ type: 'udp4' });
-
-socket.once('listening', function () {
-  socket.send(
-    JSON.stringify({ type: 'scan', data: { wifi: '' } }),
-    undefined,
-    undefined,
-    54321,
-    '192.168.27.1',
-    undefined
-  );
-});
-
 const ConnectWifiWarning = memo(({ route }) => {
   const { wifi_ssid, wifi_pass, unit_id, chip_id } = route.params;
   const t = useTranslations();
-  const { navigate } = useNavigation();
+  const { navigate, goBack } = useNavigation();
   const [isLoading, setIsLoading] = useState(false);
 
-  socket.on('message', function (msg, rinfo) {
-    const data = JSON.parse(msg.toString());
-    if (data.hasOwnProperty('wifi')) {
-      navigate(Routes.GatewayWifiList, {
-        list_wifi: data.wifi,
-        unit_id: unit_id,
-        chip_id: chip_id,
-        socket: socket,
-      });
-    }
-    if (data.hasOwnProperty('gateway')) {
-      navigate(Routes.Dashboard);
-      ToastBottomHelper.success(t('completed'));
-    }
-  });
-
-  socket.on('error', () => {
-    ToastBottomHelper.error(t('server_error'));
-  });
-
   const getPermissionWifiAndroid = useCallback(async () => {
     const granted = await PermissionsAndroid.request(
       PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
@@ -78,26 +45,45 @@ const ConnectWifiWarning = memo(({ route }) => {
 
   useEffect(() => {
     Platform.OS === 'android' && getPermissionWifiAndroid();
-    socket.bind(54321);
   }, [getPermissionWifiAndroid]);
 
-  const handleSend = async () => {
-    await socket.send(
-      JSON.stringify({ type: 'scan', data: { wifi: '' } }),
-      undefined,
-      undefined,
-      54321,
-      '192.168.27.1',
-      undefined
-    );
+  const handleSend = () => {
+    const socket = dgram.createSocket({ type: 'udp4' });
+    socket.bind(54321);
+    socket.once('listening', function () {
+      socket.send(
+        JSON.stringify({ type: 'scan', data: { wifi: '' } }),
+        undefined,
+        undefined,
+        54321,
+        '192.168.27.1',
+        undefined
+      );
+    });
+    socket.on('message', function (msg, rinfo) {
+      const data = JSON.parse(msg.toString());
+      if (data.hasOwnProperty('wifi')) {
+        navigate(Routes.GatewayWifiList, {
+          list_wifi: data.wifi,
+          unit_id: unit_id,
+          chip_id: chip_id,
+          socket: socket,
+        });
+      }
+      if (data.hasOwnProperty('gateway')) {
+        navigate(Routes.Dashboard);
+        ToastBottomHelper.success(t('completed'));
+      }
+    });
+    socket.on('error', () => {
+      ToastBottomHelper.error(t('server_error'));
+      goBack();
+    });
+    return () => {
+      socket.close();
+    };
   };
 
-  useEffect(() => {
-    if (isLoading) {
-      handleSend();
-    }
-  }, [isLoading]);
-
   const handleConnectWifiGateway = async () => {
     setIsLoading(true);
     const { success } = await axiosPost(API.UNIT.ADD_GATEWAY(unit_id), {
@@ -113,6 +99,7 @@ const ConnectWifiWarning = memo(({ route }) => {
       },
       (e) => {
         ToastBottomHelper.error('Connection failed!');
+        goBack();
       }
     );
   };

package/src/screens/AddNewGateway/PlugAndPlay/__test__/FirstWarning.test.js

@@ -37,7 +37,7 @@ describe('Test FirstWarning', () => {
     });
     const instance = tree.root;
     const texts = instance.findAllByType(Text);
-    expect(texts).toHaveLength(8);
+    expect(texts).toHaveLength(10);
     expect(texts[1].props.children).toEqual(
       getTranslate('en', 'warning_beta_test_feature')
     );

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

@@ -28,7 +28,7 @@ describe('Test GatewayWifiList', () => {
     });
     const instance = tree.root;
     const texts = instance.findAllByType(Text);
-    expect(texts).toHaveLength(8);
+    expect(texts).toHaveLength(10);
     expect(texts[1].props.children).toEqual(getTranslate('en', 'set_network'));
     expect(texts[3].props.children).toEqual('eoh@io');
   });

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

@@ -53,7 +53,7 @@ describe('Test ConnectingGateway', () => {
     });
     const instance = tree.root;
     const texts = instance.findAllByType(Text);
-    expect(texts).toHaveLength(6);
+    expect(texts).toHaveLength(8);
     expect(texts[0].props.children).toEqual(
       getTranslate('en', 'connecting_your_gateway')
     );

package/src/screens/AddNewGateway/index.js

@@ -48,6 +48,10 @@ const AddNewGateway = memo(({ route }) => {
     return true;
   }, [chipName, imei]);
 
+  const textGateWay = !wifiName
+    ? t('please_add_your_phone_number_and_chip_name')
+    : t('Please_add_gateway_name');
+
   return (
     <SafeAreaView style={styles.wrap}>
       <Text
@@ -65,7 +69,7 @@ const AddNewGateway = memo(({ route }) => {
         color={Colors.Gray8}
         style={styles.textNote}
       >
-        {t('please_add_your_phone_number_and_chip_name')}
+        {textGateWay}
       </Text>
 
       <ScrollView

package/src/screens/ConfirmUnitDeletion/index.js

@@ -28,8 +28,8 @@ const ConfirmUnitDeletion = ({ route }) => {
     if (confirm === 'YES') {
       const { success } = await axiosDelete(API.UNIT.MANAGE_UNIT(unit.id));
       if (success) {
-        navigation.navigate(Routes.Dashboard);
         ToastBottomHelper.success(t('unit_deleted_successfully'));
+        navigation.navigate(Routes.Dashboard);
       }
     } else {
       setErrorText(t('please_enter_correct'));

package/src/screens/Device/EditDevice/index.js

@@ -96,7 +96,7 @@ const EditDevice = memo(() => {
             </Text>
             <IconOutline
               name="right"
-              size={20}
+              size={18}
               color={Colors.Gray7}
               style={styles.iconRight}
             />

package/src/screens/Device/EditDevice/styles/EditDeviceStyles.js

@@ -25,6 +25,8 @@ export default StyleSheet.create({
   DeviceButtonRight: {
     flexDirection: 'row',
     paddingRight: 16,
+    marginTop: 1,
+    marginLeft: 5,
   },
   iconRight: {
     paddingLeft: 16,

package/src/screens/Notification/Monitor.js

@@ -0,0 +1,12 @@
+import { getPusher, destroyPusher } from '../../utils/Pusher';
+
+// eslint-disable-next-line promise/prefer-await-to-callbacks
+export const watchNotificationData = (user, callback) => {
+  const channel = getPusher().subscribe(`private-user-${user.id}`);
+  channel.bind('new-notification', callback);
+};
+
+export const unwatchNotificationData = (user) => {
+  getPusher().unsubscribe(`private-user-${user.id}`);
+  destroyPusher();
+};

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

@@ -243,6 +243,17 @@ const NotificationItem = memo(({ item }) => {
             <IconComponent icon={'home'} style={styles.backgroundSummer} />
           ),
         };
+      case NOTIFICATION_TYPES.NOTIFY_MEMBER_LEAVE_UNIT:
+        return {
+          content: customColorText(
+            t('text_notification_content_member_leave_unit'),
+            arrParams
+          ),
+          redirect: () => null,
+          iconContent: (
+            <IconComponent icon={'home'} style={styles.backgroundSummer} />
+          ),
+        };
       default:
         return {
           content: customColorText(t('this_notification_will_be_updated_soon')),

package/src/screens/Notification/index.js

@@ -8,11 +8,14 @@ import { axiosGet } from '../../utils/Apis/axios';
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import NotificationItem from './components/NotificationItem';
 import WrapHeaderScrollable from '../../commons/Sharing/WrapHeaderScrollable';
+import { watchNotificationData, unwatchNotificationData } from './Monitor';
+import { useSCContextSelector } from '../../context';
 
 let page = 1;
 
 const Notification = memo(() => {
   const t = useTranslations();
+  const user = useSCContextSelector((state) => state?.auth?.account?.user);
   const [notifications, setNotifications] = useState([]);
   const [maxPageNotification, setMaxPageNotification] = useState(1);
   const rightComponent = useMemo(
@@ -66,6 +69,11 @@ const Notification = memo(() => {
     }
   }, []);
 
+  useEffect(() => {
+    watchNotificationData(user, onRefresh);
+    return () => unwatchNotificationData(user);
+  }, [user, onRefresh]);
+
   return (
     <View style={styles.wrap}>
       <WrapHeaderScrollable

package/src/screens/PlayBackCamera/__test__/index.test.js

@@ -34,6 +34,6 @@ describe('Test PlayBackCamera', () => {
     });
     const instance = tree.root;
     const HeaderCustoms = instance.findAllByType(ModalCustom);
-    expect(HeaderCustoms).toHaveLength(1);
+    expect(HeaderCustoms).toHaveLength(2);
   });
 });

package/src/screens/Unit/Detail.js

@@ -305,8 +305,8 @@ const UnitDetail = ({ route }) => {
   };
 
   const onBack = useCallback(() => {
-    navigate(routeName);
-  }, [navigate, routeName]);
+    navigate(isLavidaSource ? Routes.SmartHomeDashboard : routeName);
+  }, [navigate, routeName, isLavidaSource]);
 
   const Dashboard = useCallback(() => {
     navigate(isLavidaSource ? Routes.SmartHomeDashboard : Routes.Dashboard);

package/src/screens/Unit/ManageUnit.js

@@ -73,8 +73,8 @@ const ManageUnit = ({ route }) => {
   const [showImagePicker, setShowImagePicker] = useState(false);
 
   const updateUnit = useCallback(
-    async (headers) => {
-      const formData = createFormData({ background: imageUrl }, ['background']);
+    async (bodyData, headers) => {
+      const formData = createFormData(bodyData, ['background']);
 
       const { success, data } = await axiosPatch(
         API.UNIT.MANAGE_UNIT(unit.id),
@@ -86,7 +86,7 @@ const ManageUnit = ({ route }) => {
         ToastBottomHelper.success(t('unit_updated_successfully'));
       }
     },
-    [unit.id, t, imageUrl]
+    [unit.id, t]
   );
 
   const updateLocation = useCallback(
@@ -116,9 +116,12 @@ const ManageUnit = ({ route }) => {
 
   useEffect(() => {
     if (imageUrl) {
-      updateUnit({
-        headers: { 'Content-Type': 'multipart/form-data' },
-      });
+      updateUnit(
+        { background: imageUrl },
+        {
+          headers: { 'Content-Type': 'multipart/form-data' },
+        }
+      );
     }
   }, [imageUrl, updateUnit]);
 

package/src/screens/Unit/__test__/Detail.test.js

@@ -74,6 +74,7 @@ describe('Test UnitDetail', () => {
 
   const detailUnitApiUrl = API.UNIT.UNIT_DETAIL(1);
   const summaryUnitApiUrl = API.UNIT.UNIT_SUMMARY(1);
+  const sensorStatusApiUrl = API.SENSOR.STATUS();
 
   let tree;
 
@@ -318,6 +319,11 @@ describe('Test UnitDetail', () => {
           status: 200,
           data: [],
         };
+      } else if (url === sensorStatusApiUrl) {
+        return {
+          status: 200,
+          data: [],
+        };
       }
 
       return {
@@ -396,7 +402,7 @@ describe('Test UnitDetail', () => {
       );
     });
     await act(async () => {
-      await jest.runAllTimers();
+      await jest.runOnlyPendingTimers();
     });
     // TODO Called but can not expect
     // expect(axios.get).toHaveBeenCalledWith(API.IOT.LG.DEVICE_STATUS(2));

package/src/screens/Unit/components/MyUnitDevice/index.js

@@ -51,12 +51,14 @@ const MyUnitDevice = ({ sensor, unit }) => {
 
 const styles = StyleSheet.create({
   item: {
-    height: 46,
+    height: 'auto',
     flexDirection: 'row',
     justifyContent: 'space-between',
     alignItems: 'center',
     borderBottomColor: Colors.Gray4,
     borderBottomWidth: 1,
+    paddingTop: 5,
+    paddingBottom: 5,
   },
   iconCircle: {
     width: 32,
@@ -89,6 +91,7 @@ const styles = StyleSheet.create({
     height: 32,
   },
   marginTop3: {
+    flex: 1,
     marginTop: 3,
   },
 });

package/src/screens/Unit/components/__test__/Header.test.js

@@ -22,11 +22,11 @@ describe('Test Header', () => {
       tree = renderer.create(wrapComponent());
     });
     const instance = tree.root;
-    const modal = instance.findByType(Modal);
+    const modal = instance.findAllByType(Modal);
     act(() => {
-      modal.props.onBackButtonPress();
+      modal[0].props.onBackButtonPress();
     });
-    expect(modal.props.isVisible).toBe(false);
+    expect(modal[0].props.isVisible).toBe(false);
   });
 
   test('test onItemClick', () => {
@@ -34,12 +34,12 @@ describe('Test Header', () => {
       tree = renderer.create(wrapComponent());
     });
     const instance = tree.root;
-    const modal = instance.findByType(Modal);
+    const modal = instance.findAllByType(Modal);
     const imageButton = instance.findByType(ImageButton);
     act(() => {
       imageButton.props.onPress(Routes.Sharing);
     });
-    expect(modal.props.isVisible).toBe(false);
+    expect(modal[0].props.isVisible).toBe(false);
   });
 
   test('test Popover Close Menu', () => {

package/src/screens/Unit/components/__test__/MyUnitDevice.test.js

@@ -22,7 +22,7 @@ describe('Test MyUnitDevice', () => {
     });
     const instance = tree.root;
     const Views = instance.findAllByType(View);
-    expect(Views).toHaveLength(5);
+    expect(Views).toHaveLength(10);
   });
 
   it('Test render without status', async () => {
@@ -31,6 +31,6 @@ describe('Test MyUnitDevice', () => {
     });
     const instance = tree.root;
     const Views = instance.findAllByType(View);
-    expect(Views).toHaveLength(5);
+    expect(Views).toHaveLength(10);
   });
 });

package/src/screens/UnitSummary/components/PowerConsumption/index.js

@@ -91,8 +91,10 @@ const PowerConsumption = memo(({ summaryDetail }) => {
       let params = new URLSearchParams();
       params.append('config', listConfigs.total_power);
       params.append('group_by', groupBy);
-      params.append('date_from', moment(startDate).format('YYYY-MM-DD'));
-      params.append('date_to', moment(endDate).format('YYYY-MM-DD'));
+      if (groupBy === 'date') {
+        params.append('date_from', moment(startDate).format('YYYY-MM-DD'));
+        params.append('date_to', moment(endDate).format('YYYY-MM-DD'));
+      }
       const { success, data } = await axiosGet(
         API.POWER_CONSUME.DISPLAY_HISTORY(),
         {

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

@@ -196,7 +196,7 @@
   "text_poor_level": "Poor",
   "text_very_poor_level": "Very poor",
   "text_clo_low_range": "< 0.2 mg/l",
-  "text_clo_good_range": "< 0.2 - 0.5 mg/l",
+  "text_clo_good_range": "0.2 - 0.5 mg/l",
   "text_clo_high_range": "> 0.5 mg/l",
   "turbidity_guide": "Water Turbidity Guide",
   "what_is_turbidity": "What is Water Turbidity?",
@@ -671,6 +671,7 @@
   "text_notification_content_remove_unit_to_owner": "Unit **%{unit_name}** has been removed successfully.",
   "text_notification_content_remove_unit_to_member": "Unit **%{unit_name}** has been removed by **%{unit_owner_name}**. You cannot access to this unit anymore.",
   "text_notification_content_remove_member": "You were remove from **%{unit_name}** by **%{unit_owner_name}**. You cannot access to this unit anymore.",
+  "text_notification_content_member_leave_unit": "**%{member_name}**  has left **%{unit_name}**.",
   "this_spot_does_not_exsit": "This spot does not exist",
   "please_scan_again_or_contact_the_parking_manager": "Please scan again or contact the parking manager",
   "this_spot_does_not_support_to_scan": "This spot does not support to scan",
@@ -750,6 +751,7 @@
   "edit_actions_list": "Edit Actions List",
   "des_edit_actions_list": "Hold and hover to rearrange actions order",
   "please_add_your_phone_number_and_chip_name": "Please add your phone number and chip name",
+  "Please_add_gateway_name" : "Please add gateway name",
   "phone_number_of_data_sim": "Phone number of data sim",
   "select_a_sub_unit": "Select a sub-unit that you want to add this gateway",
   "all_camera": "All Cameras",