@eohjsc/react-native-smart-city 0.3.61 → 0.3.63

package/src/navigations/Main.js

@@ -1,209 +1,209 @@
-import React, { useMemo, useRef } from 'react';
-import {
-  Animated,
-  View,
-  TouchableOpacity,
-  StyleSheet,
-  Image,
-} from 'react-native';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import { createDrawerNavigator } from '@react-navigation/drawer';
-import { useNavigation } from '@react-navigation/native';
-import { getStatusBarHeight } from 'react-native-iphone-x-helper';
-import { createStackNavigator } from '@react-navigation/stack';
+// import React, { useMemo, useRef } from 'react';
+// import {
+//   Animated,
+//   View,
+//   TouchableOpacity,
+//   StyleSheet,
+//   Image,
+// } from 'react-native';
+// import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+// import { createDrawerNavigator } from '@react-navigation/drawer';
+// import { useNavigation } from '@react-navigation/native';
+// import { getStatusBarHeight } from 'react-native-iphone-x-helper';
+// import { createStackNavigator } from '@react-navigation/stack';
 
-import Tabbar from '../commons/Tabbar';
-import { Colors, Constants, Images } from '../configs';
-import t from '../hooks/Common/useTranslations';
-import Routes from '../utils/Route';
-import GatewayStack from './GatewayStack';
-import SmartStack from './SmartStack';
-import TemplateStack from './TemplateStack';
-import DrawerContainer from '../screens/Drawer';
-import { AccessibilityLabel } from '../configs/Constants';
-import Text from '../commons/Text';
-import { screenOptions } from './utils';
-import TemplateDetail from '../screens/Template/detail';
-import Information from '../screens/Template/Information';
-import GatewayList from '../screens/Template/GatewayList';
-import EditTemplate from '../screens/Template/EditTemplate';
-import GatewayDetail from '../screens/Gateway/GatewayDetail';
-import GatewayInfo from '../screens/Gateway/GatewayInfo';
-import GatewayConnectionMethods from '../screens/Gateway/GatewayConnectionMethods';
-import DeviceZigbeeDetail from '../screens/Gateway/DeviceZigbeeDetail';
-import DeviceGatewayInfo from '../screens/Gateway/DeviceGatewayInfo';
-import DetailConfigActionZigbee from '../screens/Gateway/DetailConfigActionZigbee';
-import DeviceModbusDetail from '../screens/Gateway/DeviceModbusDetail';
-import DetailConfigActionModbus from '../screens/Gateway/DetailConfigActionModbus';
-import DetailChildConfigActionModbus from '../screens/Gateway/DetailConfigActionModbus';
-import { useBlockBackAndroid } from '../hooks/Common';
+// import Tabbar from '../commons/Tabbar';
+// import { Colors, Constants, Images } from '../configs';
+// import t from '../hooks/Common/useTranslations';
+// import Routes from '../utils/Route';
+// import GatewayStack from './GatewayStack';
+// import SmartStack from './SmartStack';
+// import TemplateStack from './TemplateStack';
+// import DrawerContainer from '../screens/Drawer';
+// import { AccessibilityLabel } from '../configs/Constants';
+// import Text from '../commons/Text';
+// import { screenOptions } from './utils';
+// import TemplateDetail from '../screens/Template/detail';
+// import Information from '../screens/Template/Information';
+// import GatewayList from '../screens/Template/GatewayList';
+// import EditTemplate from '../screens/Template/EditTemplate';
+// import GatewayDetail from '../screens/Gateway/GatewayDetail';
+// import GatewayInfo from '../screens/Gateway/GatewayInfo';
+// import GatewayConnectionMethods from '../screens/Gateway/GatewayConnectionMethods';
+// import DeviceZigbeeDetail from '../screens/Gateway/DeviceZigbeeDetail';
+// import DeviceGatewayInfo from '../screens/Gateway/DeviceGatewayInfo';
+// import DetailConfigActionZigbee from '../screens/Gateway/DetailConfigActionZigbee';
+// import DeviceModbusDetail from '../screens/Gateway/DeviceModbusDetail';
+// import DetailConfigActionModbus from '../screens/Gateway/DetailConfigActionModbus';
+// import DetailChildConfigActionModbus from '../screens/Gateway/DetailConfigActionModbus';
+// import { useBlockBackAndroid } from '../hooks/Common';
 
-const Tab = createBottomTabNavigator();
-const Drawer = createDrawerNavigator();
-const Stack = createStackNavigator();
+// const Tab = createBottomTabNavigator();
+// const Drawer = createDrawerNavigator();
+// const Stack = createStackNavigator();
 
-const getWidth = () => {
-  const Width = Constants.width - 12;
-  return Width / 3;
-};
+// const getWidth = () => {
+//   const Width = Constants.width - 12;
+//   return Width / 3;
+// };
 
-const MainDevMode = () => {
-  const navigation = useNavigation();
+// const MainDevMode = () => {
+//   const navigation = useNavigation();
 
-  const listTabName = useMemo(
-    () => [
-      {
-        name: Routes.TemplateStack,
-        tabBarLabel: t('dashboard'),
-        component: TemplateStack,
-      },
-      {
-        name: Routes.GatewayStack,
-        tabBarLabel: t('gateways'),
-        component: GatewayStack,
-      },
-      {
-        name: Routes.SmartStack,
-        tabBarLabel: t('smart'),
-        component: SmartStack,
-      },
-    ],
-    []
-  );
+//   const listTabName = useMemo(
+//     () => [
+//       {
+//         name: Routes.TemplateStack,
+//         tabBarLabel: t('dashboard'),
+//         component: TemplateStack,
+//       },
+//       {
+//         name: Routes.GatewayStack,
+//         tabBarLabel: t('gateways'),
+//         component: GatewayStack,
+//       },
+//       {
+//         name: Routes.SmartStack,
+//         tabBarLabel: t('smart'),
+//         component: SmartStack,
+//       },
+//     ],
+//     []
+//   );
 
-  const tabOffSetValue = useRef(new Animated.Value(0)).current;
+//   const tabOffSetValue = useRef(new Animated.Value(0)).current;
 
-  const Header = () => {
-    return (
-      <View style={styles.wrapHeader}>
-        <TouchableOpacity
-          style={styles.btnMenu}
-          onPress={() => navigation.toggleDrawer()}
-          accessibilityLabel={AccessibilityLabel.BURGER_MENU_ICON}
-        >
-          <Image source={Images.menu} style={styles.menu} />
-        </TouchableOpacity>
-        <Text style={styles.textHeader}>{t('developer_mode')}</Text>
-      </View>
-    );
-  };
+//   const Header = () => {
+//     return (
+//       <View style={styles.wrapHeader}>
+//         <TouchableOpacity
+//           style={styles.btnMenu}
+//           onPress={() => navigation.toggleDrawer()}
+//           accessibilityLabel={AccessibilityLabel.BURGER_MENU_ICON}
+//         >
+//           <Image source={Images.menu} style={styles.menu} />
+//         </TouchableOpacity>
+//         <Text style={styles.textHeader}>{t('developer_mode')}</Text>
+//       </View>
+//     );
+//   };
 
-  return (
-    <>
-      <Header />
-      <Tab.Navigator tabBar={(props) => <Tabbar {...props} />}>
-        {listTabName.map((item) => (
-          <Tab.Screen
-            name={item.name}
-            component={item.component}
-            options={{
-              tabBarLabel: item.tabBarLabel,
-              tabOffSetValue,
-            }}
-          />
-        ))}
-      </Tab.Navigator>
-      <Animated.View
-        // eslint-disable-next-line react-native/no-inline-styles
-        style={{
-          width: getWidth() - 4,
-          transform: [{ translateX: tabOffSetValue }],
-          height: 2,
-          backgroundColor: Colors.Primary,
-          position: 'absolute',
-          bottom: 70,
-          left: 8,
-          borderRadius: 1,
-        }}
-      />
-    </>
-  );
-};
+//   return (
+//     <>
+//       <Header />
+//       <Tab.Navigator tabBar={(props) => <Tabbar {...props} />}>
+//         {listTabName.map((item) => (
+//           <Tab.Screen
+//             name={item.name}
+//             component={item.component}
+//             options={{
+//               tabBarLabel: item.tabBarLabel,
+//               tabOffSetValue,
+//             }}
+//           />
+//         ))}
+//       </Tab.Navigator>
+//       <Animated.View
+//         // eslint-disable-next-line react-native/no-inline-styles
+//         style={{
+//           width: getWidth() - 4,
+//           transform: [{ translateX: tabOffSetValue }],
+//           height: 2,
+//           backgroundColor: Colors.Primary,
+//           position: 'absolute',
+//           bottom: 70,
+//           left: 8,
+//           borderRadius: 1,
+//         }}
+//       />
+//     </>
+//   );
+// };
 
-const DrawerScreen = () => {
-  useBlockBackAndroid();
-  return (
-    <Drawer.Navigator
-      backBehavior="none"
-      drawerContent={(props) => <DrawerContainer {...props} />}
-      drawerStyle={{ paddingTop: getStatusBarHeight() }}
-    >
-      <Drawer.Screen name={Routes.MainDevMode} component={MainDevMode} />
-    </Drawer.Navigator>
-  );
-};
+// const DrawerScreen = () => {
+//   useBlockBackAndroid();
+//   return (
+//     <Drawer.Navigator
+//       backBehavior="none"
+//       drawerContent={(props) => <DrawerContainer {...props} />}
+//       drawerStyle={{ paddingTop: getStatusBarHeight() }}
+//     >
+//       <Drawer.Screen name={Routes.MainDevMode} component={MainDevMode} />
+//     </Drawer.Navigator>
+//   );
+// };
 
-const DevModeStack = () => {
-  return (
-    <Stack.Navigator
-      screenOptions={{
-        ...screenOptions,
-        headerShown: false,
-      }}
-    >
-      <Stack.Screen component={DrawerScreen} name={Routes.DrawerScreen} />
-      <Stack.Screen component={TemplateDetail} name={Routes.TemplateDetail} />
-      <Stack.Screen component={GatewayDetail} name={Routes.GatewayDetail} />
-      <Stack.Screen component={GatewayInfo} name={Routes.GatewayInfo} />
-      <Stack.Screen
-        component={DeviceGatewayInfo}
-        name={Routes.DeviceGatewayInfo}
-      />
-      <Stack.Screen
-        component={GatewayConnectionMethods}
-        name={Routes.GatewayConnectionMethods}
-      />
-      <Stack.Screen
-        component={DeviceZigbeeDetail}
-        name={Routes.DeviceZigbeeDetail}
-      />
-      <Stack.Screen
-        component={DeviceModbusDetail}
-        name={Routes.DeviceModbusDetail}
-      />
-      <Stack.Screen
-        component={DetailConfigActionZigbee}
-        name={Routes.DetailConfigActionZigbee}
-      />
-      <Stack.Screen
-        component={DetailConfigActionModbus}
-        name={Routes.DetailConfigActionModbus}
-      />
-      <Stack.Screen
-        component={DetailChildConfigActionModbus}
-        name={Routes.DetailChildConfigActionModbus}
-      />
-      <Stack.Screen component={Information} name={Routes.Information} />
-      <Stack.Screen component={GatewayList} name={Routes.GatewayList} />
-      <Stack.Screen component={EditTemplate} name={Routes.EditTemplate} />
-    </Stack.Navigator>
-  );
-};
+// const DevModeStack = () => {
+//   return (
+//     <Stack.Navigator
+//       screenOptions={{
+//         ...screenOptions,
+//         headerShown: false,
+//       }}
+//     >
+//       <Stack.Screen component={DrawerScreen} name={Routes.DrawerScreen} />
+//       <Stack.Screen component={TemplateDetail} name={Routes.TemplateDetail} />
+//       <Stack.Screen component={GatewayDetail} name={Routes.GatewayDetail} />
+//       <Stack.Screen component={GatewayInfo} name={Routes.GatewayInfo} />
+//       <Stack.Screen
+//         component={DeviceGatewayInfo}
+//         name={Routes.DeviceGatewayInfo}
+//       />
+//       <Stack.Screen
+//         component={GatewayConnectionMethods}
+//         name={Routes.GatewayConnectionMethods}
+//       />
+//       <Stack.Screen
+//         component={DeviceZigbeeDetail}
+//         name={Routes.DeviceZigbeeDetail}
+//       />
+//       <Stack.Screen
+//         component={DeviceModbusDetail}
+//         name={Routes.DeviceModbusDetail}
+//       />
+//       <Stack.Screen
+//         component={DetailConfigActionZigbee}
+//         name={Routes.DetailConfigActionZigbee}
+//       />
+//       <Stack.Screen
+//         component={DetailConfigActionModbus}
+//         name={Routes.DetailConfigActionModbus}
+//       />
+//       <Stack.Screen
+//         component={DetailChildConfigActionModbus}
+//         name={Routes.DetailChildConfigActionModbus}
+//       />
+//       <Stack.Screen component={Information} name={Routes.Information} />
+//       <Stack.Screen component={GatewayList} name={Routes.GatewayList} />
+//       <Stack.Screen component={EditTemplate} name={Routes.EditTemplate} />
+//     </Stack.Navigator>
+//   );
+// };
 
-export default DevModeStack;
+// export default DevModeStack;
 
-const styles = StyleSheet.create({
-  btnMenu: {
-    width: 40,
-    height: 40,
-    justifyContent: 'center',
-    alignItems: 'center',
-    marginLeft: 10,
-  },
-  wrapHeader: {
-    height: 100,
-    paddingTop: getStatusBarHeight(),
-    flexDirection: 'row',
-    alignItems: 'center',
-    backgroundColor: Colors.Gray2,
-  },
-  textHeader: {
-    fontSize: 20,
-    fontWeight: 'bold',
-    color: Colors.Gray9,
-  },
-  menu: {
-    width: 24,
-    height: 24,
-  },
-});
+// const styles = StyleSheet.create({
+//   btnMenu: {
+//     width: 40,
+//     height: 40,
+//     justifyContent: 'center',
+//     alignItems: 'center',
+//     marginLeft: 10,
+//   },
+//   wrapHeader: {
+//     height: 100,
+//     paddingTop: getStatusBarHeight(),
+//     flexDirection: 'row',
+//     alignItems: 'center',
+//     backgroundColor: Colors.Gray2,
+//   },
+//   textHeader: {
+//     fontSize: 20,
+//     fontWeight: 'bold',
+//     color: Colors.Gray9,
+//   },
+//   menu: {
+//     width: 24,
+//     height: 24,
+//   },
+// });

package/src/navigations/UnitStack.js

@@ -53,6 +53,7 @@ import EmergencySetting from '../screens/EmergencySetting';
 import ConfirmUnitDeletion from '../screens/ConfirmUnitDeletion';
 import InfoMemberUnit from '../screens/Sharing/InfoMemberUnit';
 import EnterPassword from '../screens/EnterPassword';
+import AllGateway from '../screens/AllGateway';
 import SelectAddToFavorites from '../screens/Unit/SelectAddToFavorites';
 import { HanetCameraStack } from './HanetCameraStack';
 import { axiosGet, fetchWithCache } from '../utils/Apis/axios';
@@ -462,6 +463,13 @@ export const UnitStack = memo((props) => {
           headerShown: false,
         }}
       />
+      <Stack.Screen
+        name={Route.AllGateway}
+        component={AllGateway}
+        options={{
+          headerShown: false,
+        }}
+      />
     </Stack.Navigator>
   );
 });

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

@@ -0,0 +1,104 @@
+import React from 'react';
+import { create, act } from 'react-test-renderer';
+import { useRoute } from '@react-navigation/native';
+
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
+import DetailConfigAction from '../../components/DetailConfigAction';
+import DetailConfigActionInternal from '..';
+
+const wrapComponent = () => (
+  <SCProvider initState={mockSCStore({})}>
+    <DetailConfigActionInternal />
+  </SCProvider>
+);
+
+jest.mock('@react-navigation/native', () => {
+  return {
+    ...jest.requireActual('@react-navigation/native'),
+    useRoute: jest.fn(),
+  };
+});
+
+const mockNavigate = jest.fn();
+jest.mock('@react-navigation/native', () => {
+  return {
+    ...jest.requireActual('@react-navigation/native'),
+    useNavigation: () => ({
+      navigate: mockNavigate,
+      pop: jest.fn(),
+    }),
+    useRoute: jest.fn(),
+    useIsFocused: () => true,
+  };
+});
+
+describe('Test DetailConfigActionInternal', () => {
+  let tree;
+  it('test render DetailConfigActionInternal isConfigRead', async () => {
+    useRoute.mockReturnValue({
+      params: {
+        isConfigRead: true,
+        isConfigWrite: false,
+        isAction: false,
+        itemActionConfig: {
+          id: 1,
+          config: { name: 'config1' },
+          value_type: 'boolean',
+          pin_number: 0,
+          pin_mode: 1,
+        },
+      },
+    });
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const detailConfigAction = instance?.findAllByType(DetailConfigAction);
+    expect(detailConfigAction).toHaveLength(1);
+  });
+  it('test render DetailConfigActionInternal isConfigWrite', async () => {
+    useRoute.mockReturnValue({
+      params: {
+        isConfigRead: false,
+        isConfigWrite: true,
+        isAction: false,
+        itemActionConfig: {
+          id: 1,
+          config: { name: 'config1' },
+          value_type: 'boolean',
+          pin_number: 0,
+          pin_mode: 1,
+        },
+      },
+    });
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const detailConfigAction = instance?.findAllByType(DetailConfigAction);
+    expect(detailConfigAction).toHaveLength(1);
+  });
+  it('test render DetailConfigActionInternal isAction', async () => {
+    useRoute.mockReturnValue({
+      params: {
+        isConfigRead: false,
+        isConfigWrite: false,
+        isAction: true,
+        isChildAction: false,
+        itemActionConfig: {
+          id: 1,
+          action: { name: 'config1' },
+          pin: 'boolean',
+          default_value: 0,
+        },
+      },
+    });
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const detailConfigAction = instance?.findAllByType(DetailConfigAction);
+    expect(detailConfigAction).toHaveLength(1);
+  });
+});

package/src/screens/AllGateway/DetailConfigActionInternal/index.js

@@ -0,0 +1,97 @@
+import React, { memo, useMemo } from 'react';
+import { View } from 'react-native';
+import { useRoute } from '@react-navigation/native';
+
+import styles from './styles';
+import DetailConfigAction from '../components/DetailConfigAction';
+
+const DetailConfigActionInternal = () => {
+  const { params = {} } = useRoute();
+  const {
+    device = {},
+    itemActionConfig,
+    isConfigRead,
+    isConfigWrite,
+    isAction,
+  } = params;
+
+  const listData = useMemo(() => {
+    if (isConfigRead || isConfigWrite) {
+      return [
+        {
+          id: 1,
+          title: 'config_name',
+          data: itemActionConfig?.config?.name || '--',
+        },
+        {
+          id: 2,
+          title: 'config_type',
+          data:
+            itemActionConfig?.value_type === 'boolean'
+              ? 'Digital'
+              : itemActionConfig?.value_type === 'integer'
+              ? 'Analog'
+              : '--',
+        },
+        {
+          id: 3,
+          title: 'pin',
+          data: itemActionConfig?.pin_number || '0',
+        },
+        {
+          id: 4,
+          title: 'pin_mode',
+          data: itemActionConfig?.pin_mode || '--',
+        },
+      ];
+    }
+    if (isAction) {
+      return [
+        {
+          id: 1,
+          title: 'action_name',
+          data: itemActionConfig?.action?.name || '--',
+        },
+        {
+          id: 2,
+          title: 'pin_number',
+          data: itemActionConfig?.pin || '0',
+        },
+        {
+          id: 3,
+          title: 'default_value',
+          data: itemActionConfig?.default_value || '--',
+        },
+      ];
+    }
+    return [];
+  }, [isAction, isConfigRead, isConfigWrite, itemActionConfig]);
+
+  const title = useMemo(
+    () =>
+      ((isConfigRead || isConfigWrite) && itemActionConfig?.config?.name) ||
+      (isAction && itemActionConfig?.action?.name) ||
+      '',
+    [
+      isConfigRead,
+      isConfigWrite,
+      itemActionConfig?.config?.name,
+      itemActionConfig?.action?.name,
+      isAction,
+    ]
+  );
+
+  const subTitle = useMemo(() => device?.sensor?.name || '--', [device]);
+
+  return (
+    <View style={styles.wrap}>
+      <DetailConfigAction
+        title={title}
+        subTitle={subTitle}
+        listData={listData}
+      />
+    </View>
+  );
+};
+
+export default memo(DetailConfigActionInternal);