@eohjsc/react-native-smart-city 0.4.46 → 0.4.48

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

@@ -17,7 +17,7 @@ import api from '../../../../utils/Apis/axios';
 import { API } from '../../../../configs';
 import { PERMISSION_TYPE } from '../../../../configs/Constants';
 import Detail from '../../components/Detail';
-// import ModalPopupCT from '../../../../commons/ModalPopupCT';
+import ModalPopupCT from '../../../../commons/ModalPopupCT';
 import { fetchGatewayCT, flushPromises } from '../../test-utils';
 
 const mock = new MockAdapter(api.axiosInstance);
@@ -133,6 +133,8 @@ describe('Test DeviceModbusDetail', () => {
     const menuActionMore = detail?.findAllByType(MenuActionMore);
     expect(menuActionMore[0].props.isVisible).toEqual(true);
 
+    await flushPromises();
+
     await act(async () => {
       await menuActionMore[0].props.listMenuItem[0].doAction();
     });
@@ -143,39 +145,38 @@ describe('Test DeviceModbusDetail', () => {
     });
   });
 
-  // NOTE: Hinh will fix it later
-  // it('test render DeviceModbusDetail onPress more and onPress Delete modbus', async () => {
-  //   await act(async () => {
-  //     tree = await create(wrapComponent());
-  //   });
-  //   await flushPromises();
-  //   const instance = tree.root;
-  //   const detail = instance?.findByType(Detail);
-  //   await headerCustomOnPressMore(detail);
-  //   const menuActionMore = detail?.findByType(MenuActionMore);
-  //   expect(menuActionMore.props.isVisible).toEqual(true);
+  it('test render DeviceModbusDetail onPress more and onPress Delete modbus', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    await flushPromises();
+    const instance = tree.root;
+    const detail = instance?.findByType(Detail);
+    await headerCustomOnPressMore(detail);
+    const menuActionMore = detail?.findByType(MenuActionMore);
+    expect(menuActionMore.props.isVisible).toEqual(true);
 
-  //   await act(async () => {
-  //     menuActionMore.props.listMenuItem[1].doAction();
-  //   });
-  //   await flushPromises();
+    await act(async () => {
+      menuActionMore.props.listMenuItem[1].doAction();
+    });
+    await flushPromises();
 
-  //   const modal = instance.findByType(ModalPopupCT);
-  //   mock.onDelete(API.DEV_MODE.ZIGBEE.DEVICE_DETAIL(1, 1)).reply(200);
-  //   await act(async () => {
-  //     await modal.props.onPressConfirm();
-  //   });
-  //   await flushPromises();
+    const modal = instance.findByType(ModalPopupCT);
+    mock.onDelete(API.DEV_MODE.ZIGBEE.DEVICE_DETAIL(1, 1)).reply(200);
+    await act(async () => {
+      await modal.props.onPressConfirm();
+    });
+    await flushPromises();
 
-  //   expect(mockPop).toBeCalledWith(1);
-  //   expect(Toast.show).toBeCalledWith({
-  //     position: 'bottom',
-  //     text1: 'Delete successfully!',
-  //     text2: undefined,
-  //     type: 'success',
-  //     visibilityTime: 1000,
-  //   });
-  // });
+    expect(mockPop).toBeCalledWith(1);
+    expect(Toast.show).toBeCalledWith({
+      position: 'bottom',
+      text1: 'Delete successfully!',
+      text2: undefined,
+      type: 'success',
+      visibilityTime: 1000,
+    });
+  });
 
   it('test render DeviceZigbeeDetail onPress TabPanel config write', async () => {
     mock.onGet(API.DEV_MODE.MODBUS.REGISTER(1, 1)).reply(200, [

package/src/screens/Automate/EditActionsList/__tests__/index.test.js

@@ -1,4 +1,3 @@
-/* eslint-disable no-unused-vars */
 import React from 'react';
 import DraggableFlatList from 'react-native-draggable-flatlist';
 import { create, act } from 'react-test-renderer';
@@ -38,78 +37,78 @@ describe('EditActionsList', () => {
     mockedNavigate.mockClear();
   });
   it('render EditActionsList', async () => {
-    // await act(async () => {
-    //   tree = await create(wrapComponent());
-    // });
-    // const instance = tree.root;
-    // const draggableFlatList = instance.findAllByType(DraggableFlatList);
-    // const modalBottom = instance.findAllByType(ModalBottom);
-    // expect(draggableFlatList).toHaveLength(1);
-    // expect(modalBottom).toHaveLength(1);
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const draggableFlatList = instance.findAllByType(DraggableFlatList);
+    const modalBottom = instance.findAllByType(ModalBottom);
+    expect(draggableFlatList).toHaveLength(1);
+    expect(modalBottom).toHaveLength(1);
+  });
+  it('EditActionsList onPress cancel', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const buttonCancel = instance.find(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.BUTTON_CANCEL_EDIT_ACTION_LIST &&
+        el.type === TouchableOpacity
+    );
+    expect(buttonCancel).toBeDefined();
+    await act(async () => {
+      buttonCancel.props.onPress();
+    });
+    expect(mockedNavigate).toHaveBeenCalled();
   });
-  // it('EditActionsList onPress cancel', async () => {
-  //   await act(async () => {
-  //     tree = await create(wrapComponent());
-  //   });
-  //   const instance = tree.root;
-  //   const buttonCancel = instance.find(
-  //     (el) =>
-  //       el.props.accessibilityLabel ===
-  //         AccessibilityLabel.BUTTON_CANCEL_EDIT_ACTION_LIST &&
-  //       el.type === TouchableOpacity
-  //   );
-  //   expect(buttonCancel).toBeDefined();
-  //   await act(async () => {
-  //     buttonCancel.props.onPress();
-  //   });
-  //   expect(mockedNavigate).toHaveBeenCalled();
-  // });
-  // it('EditActionsList onPress save', async () => {
-  //   mock.onPut(API.AUTOMATE.ORDER_SCRIPT_ACTION(1)).reply(200);
-  //   await act(async () => {
-  //     tree = await create(wrapComponent());
-  //   });
-  //   const instance = tree.root;
-  //   const buttonSave = instance.find(
-  //     (el) =>
-  //       el.props.accessibilityLabel ===
-  //         AccessibilityLabel.BUTTON_SAVE_EDIT_ACTION_LIST &&
-  //       el.type === TouchableOpacity
-  //   );
-  //   expect(buttonSave).toBeDefined();
+  it('EditActionsList onPress save', async () => {
+    mock.onPut(API.AUTOMATE.ORDER_SCRIPT_ACTION(1)).reply(200);
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const buttonSave = instance.find(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.BUTTON_SAVE_EDIT_ACTION_LIST &&
+        el.type === TouchableOpacity
+    );
+    expect(buttonSave).toBeDefined();
 
-  //   await act(async () => {
-  //     buttonSave.props.onPress();
-  //   });
+    await act(async () => {
+      buttonSave.props.onPress();
+    });
 
-  //   expect(mock.history.put).toHaveLength(1);
-  // });
+    expect(mock.history.put).toHaveLength(1);
+  });
 
-  // it('EditActionsList has remove button', async () => {
-  //   await act(async () => {
-  //     tree = await create(wrapComponent());
-  //   });
-  //   const instance = tree.root;
-  //   const buttonRemove = instance.find(
-  //     (el) =>
-  //       el.props.accessibilityLabel ===
-  //         AccessibilityLabel.BUTTON_REMOVE_EDIT_ACTION_LIST &&
-  //       el.type === TouchableOpacity
-  //   );
-  //   expect(buttonRemove).toBeDefined();
-  // });
+  it('EditActionsList has remove button', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const buttonRemove = instance.find(
+      (el) =>
+        el.props.accessibilityLabel ===
+          AccessibilityLabel.BUTTON_REMOVE_EDIT_ACTION_LIST &&
+        el.type === TouchableOpacity
+    );
+    expect(buttonRemove).toBeDefined();
+  });
 
-  // it('EditActionsList modal onPress remove', async () => {
-  //   await act(async () => {
-  //     tree = await create(wrapComponent());
-  //   });
-  //   const instance = tree.root;
-  //   const modalBottom = instance.findAllByType(ModalBottom);
-  //   await act(async () => {
-  //     modalBottom[0].props.onRemove();
-  //   });
+  it('EditActionsList modal onPress remove', async () => {
+    await act(async () => {
+      tree = await create(wrapComponent());
+    });
+    const instance = tree.root;
+    const modalBottom = instance.findAllByType(ModalBottom);
+    await act(async () => {
+      modalBottom[0].props.onRemove();
+    });
 
-  //   mock.onDelete(API.AUTOMATE.DELETE_SCRIPT_ACTION(1, 1)).reply(200);
-  //   expect(mock.history.delete).toHaveLength(1);
-  // });
+    mock.onDelete(API.AUTOMATE.DELETE_SCRIPT_ACTION(1, 1)).reply(200);
+    expect(mock.history.delete).toHaveLength(1);
+  });
 });

package/src/screens/Automate/ScriptDetail/Styles/indexStyles.js

@@ -63,7 +63,6 @@ export default StyleSheet.create({
   },
   moreButton: {
     marginLeft: -5,
-    transform: [{ rotate: '90deg' }],
   },
   wrapStyle: {
     borderRadius: 8,

package/src/screens/Automate/ScriptDetail/index.js

@@ -7,6 +7,7 @@ import React, {
 } from 'react';
 import { Image, Platform, TouchableOpacity, View } from 'react-native';
 import { PopoverMode } from 'react-native-popover-view';
+import { IconFill, IconOutline } from '@ant-design/icons-react-native';
 import { Icon } from '@ant-design/react-native';
 
 import { useTranslations } from '../../../hooks/Common/useTranslations';
@@ -30,8 +31,6 @@ import RenameScript from './Components/RenameScript';
 import DeleteScript from './Components/DeleteScript';
 import Images from '../../../configs/Images';
 import { useBackendPermission } from '../../../utils/Permission/backend';
-import StarFull from '../../../Images/Common/star-full.svg';
-import StarOutline from '../../../Images/Common/star-outline.svg';
 
 const PreventDoubleTouch = withPreventDoubleClick(TouchableOpacity);
 
@@ -161,7 +160,7 @@ const ScriptDetail = ({ route }) => {
           style={[styles.headerButton, styles.moreButton]}
           accessibilityLabel={AccessibilityLabel.ICON_MORE}
         >
-          <Icon name={'ellipsis'} size={27} color={Colors.Black} />
+          <Icon name={'more'} size={27} color={Colors.Black} />
         </TouchableOpacity>
       </View>
     ),
@@ -377,7 +376,11 @@ const ButtonStar = ({ automate }) => {
       onPress={onPressStar}
       accessibilityLabel={AccessibilityLabel.HEADER_SCRIPT_DETAIL_BUTTON_STAR}
     >
-      {isStarred ? <StarFull /> : <StarOutline />}
+      {isStarred ? (
+        <IconFill name="star" size={25} color={Colors.Yellow6} />
+      ) : (
+        <IconOutline name="star" size={25} />
+      )}
     </PreventDoubleTouch>
   );
 };

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

@@ -1,4 +1,3 @@
-/* eslint-disable no-unused-vars */
 import React from 'react';
 import { act, create } from 'react-test-renderer';
 import MockAdapter from 'axios-mock-adapter';
@@ -34,8 +33,6 @@ const wrapComponent = ({ ...rest }) => (
   </SCProvider>
 );
 
-// NOTE: Hinh will fix it later
-
 describe('Test ChangePosition', () => {
   let tree;
 
@@ -45,36 +42,37 @@ describe('Test ChangePosition', () => {
   });
 
   it('render ChangePosition', async () => {
-    // const mockFetchData = jest.fn();
-    // const spyToastSuccess = jest.spyOn(ToastBottomHelper, 'success');
-    // useRoute.mockReturnValue({
-    //   params: {
-    //     sensor: { id: 1, name: 'device' },
-    //     display: { items: [{ id: 1 }, { id: 2 }] },
-    //     setDisplay: mockSetDisplay,
-    //     station: { id: 1, name: 'station' },
-    //     evaluate: {},
-    //     fetchDataDeviceDetail: mockFetchData,
-    //   },
-    // });
-    // mock.onPut(API.DEVICE.ORDER_DISPLAY_ITEMS(1)).reply(200);
-    // await act(async () => {
-    //   tree = await create(wrapComponent({}));
-    // });
-    // const instance = tree.root;
-    // const flatListDnD = instance.findAllByType(DraggableFlatList);
-    // expect(flatListDnD).toHaveLength(1);
-    // const bottomButtonView = instance.findAllByType(BottomButtonView);
-    // expect(bottomButtonView).toHaveLength(1);
-    // await act(async () => {
-    //   flatListDnD[0].props.onDragEnd({ data: [{ id: 2 }, { id: 1 }] });
-    // });
-    // await act(async () => {
-    //   bottomButtonView[0].props.onPressMain();
-    // });
-    // expect(mockGoBack).toHaveBeenCalled();
-    // expect(mockFetchData).toHaveBeenCalled();
-    // expect(mockSetDisplay).toHaveBeenCalled();
-    // expect(spyToastSuccess).toBeCalledWith('Updated widget successfully');
+    const mockFetchData = jest.fn();
+    const spyToastSuccess = jest.spyOn(ToastBottomHelper, 'success');
+    useRoute.mockReturnValue({
+      params: {
+        sensor: { id: 1, name: 'device' },
+        display: { items: [{ id: 1 }, { id: 2 }] },
+        setDisplay: mockSetDisplay,
+        station: { id: 1, name: 'station' },
+        evaluate: {},
+        fetchDataDeviceDetail: mockFetchData,
+      },
+    });
+    mock.onPut(API.DEVICE.ORDER_DISPLAY_ITEMS(1)).reply(200);
+    await act(async () => {
+      tree = await create(wrapComponent({}));
+    });
+    const instance = tree.root;
+    const flatListDnD = instance.findAllByType(DraggableFlatList);
+    expect(flatListDnD).toHaveLength(1);
+
+    const bottomButtonView = instance.findAllByType(BottomButtonView);
+    expect(bottomButtonView).toHaveLength(1);
+    await act(async () => {
+      flatListDnD[0].props.onDragEnd({ data: [{ id: 2 }, { id: 1 }] });
+    });
+    await act(async () => {
+      bottomButtonView[0].props.onPressMain();
+    });
+    expect(mockGoBack).toHaveBeenCalled();
+    expect(mockFetchData).toHaveBeenCalled();
+    expect(mockSetDisplay).toHaveBeenCalled();
+    expect(spyToastSuccess).toBeCalledWith('Updated widget successfully');
   });
 });

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import renderer, { act } from 'react-test-renderer';
 
 import { SCProvider } from '../../../context';
@@ -30,6 +30,14 @@ jest.mock('@react-navigation/native', () => {
   };
 });
 
+const mockSetState = jest.fn();
+jest.mock('react', () => {
+  return {
+    ...jest.requireActual('react'),
+    useState: jest.fn((init) => [init, mockSetState]),
+  };
+});
+
 describe('Test ConfirmUnitDeletion', () => {
   let tree;
   let route;
@@ -45,6 +53,7 @@ describe('Test ConfirmUnitDeletion', () => {
   });
 
   it('test render ConfirmUnitDeletion', async () => {
+    useState.mockImplementationOnce((init) => ['new_name', mockSetState]);
     await act(async () => {
       tree = await renderer.create(wrapComponent(route));
     });
@@ -56,6 +65,7 @@ describe('Test ConfirmUnitDeletion', () => {
     });
   });
   it('Onpress button ConfirmUnitDeletion ', async () => {
+    useState.mockImplementationOnce((init) => ['YES', mockSetState]);
     await act(async () => {
       tree = await renderer.create(wrapComponent(route));
     });

package/src/screens/Device/__test__/detail.test.js

@@ -194,7 +194,6 @@ describe('test DeviceDetail', () => {
     useLayoutEffectSpy.mockImplementation(() => setState);
     mock.reset();
     mockedNavigate.mockClear();
-    watchMultiConfigs.mockReset();
   });
 
   it('render DeviceDetail render SensorDisplayItem', async () => {
@@ -814,65 +813,6 @@ describe('test DeviceDetail', () => {
         el.props.accessibilityLabel === AccessibilityLabel.SENSOR_DISPLAY_ITEM
     );
     expect(sensorDisplayItem.length).toEqual(1);
-    expect(watchMultiConfigs).toHaveBeenCalledWith([1]);
-  });
-
-  it('watch action config', async () => {
-    mock.onGet(API.CHIP.JSON_CONFIGURATION).reply(200, []);
-    const responseDisplay = {
-      items: [
-        {
-          id: 1,
-          order: 0,
-          template: 'on_off_button_action_template',
-          type: 'on_off_button_action_template',
-          configuration: {
-            config: 2,
-          },
-        },
-      ],
-    };
-    const responseDisplayValueV2 = {
-      configs: [{ id: 2 }],
-      is_connected: true,
-      last_updated: '2021-01-24T12:00:00.000Z',
-    };
-    mockAxios(responseDisplay, responseDisplayValueV2);
-    await act(async () => {
-      tree = await create(wrapComponent(store, account, route));
-    });
-
-    expect(watchMultiConfigs).toHaveBeenCalledWith([2]);
-  });
-
-  it('watch stages grid action config', async () => {
-    mock.onGet(API.CHIP.JSON_CONFIGURATION).reply(200, []);
-    const responseDisplay = {
-      items: [
-        {
-          id: 1,
-          order: 0,
-          template: 'StatesGridActionTemplate',
-          configuration: {
-            options: [
-              {
-                config: 3,
-              },
-            ],
-          },
-        },
-      ],
-    };
-    const responseDisplayValueV2 = {
-      configs: [{ id: 2 }],
-      is_connected: true,
-      last_updated: '2021-01-24T12:00:00.000Z',
-    };
-    mockAxios(responseDisplay, responseDisplayValueV2);
-    await act(async () => {
-      tree = await create(wrapComponent(store, account, route));
-    });
-
-    expect(watchMultiConfigs).toHaveBeenCalledWith([3]);
+    expect(watchMultiConfigs).toHaveBeenCalled();
   });
 });

package/src/screens/Device/components/ChartWrapper.js

@@ -5,7 +5,7 @@ import DateTimeRangeChange from '../../../commons/DateTimeRangeChange';
 import moment from 'moment';
 
 const ChartWrapper = memo(
-  ({ children, onChangeDate, showTime, isWidgetOrder, shouldRenderDate }) => {
+  ({ children, onChangeDate, showTime, isWidgetOrder }) => {
     const [value, setValue] = useState([
       moment().subtract(6, 'days'),
       moment(),
@@ -24,20 +24,18 @@ const ChartWrapper = memo(
 
     return (
       <View>
-        {shouldRenderDate && (
-          <View style={styles.headerContainer}>
-            <View>
-              <DateTimeRangeChange
-                startTime={value[0]}
-                endTime={value[1]}
-                showTime={showTime}
-                selectStart={selectStart}
-                selectEnd={selectEnd}
-                isWidgetOrder={isWidgetOrder}
-              />
-            </View>
+        <View style={styles.headerContainer}>
+          <View>
+            <DateTimeRangeChange
+              startTime={value[0]}
+              endTime={value[1]}
+              showTime={showTime}
+              selectStart={selectStart}
+              selectEnd={selectEnd}
+              isWidgetOrder={isWidgetOrder}
+            />
           </View>
-        )}
+        </View>
         {children}
       </View>
     );

package/src/screens/Device/components/VisualChart.js

@@ -163,12 +163,7 @@ const groupByOptions = [
   { title: 'Y', data: CHART_GROUP_TYPE.YEAR },
 ];
 
-const VisualChart = ({
-  item,
-  isDemo = false,
-  isWidgetOrder,
-  shouldRenderDate,
-}) => {
+const VisualChart = ({ item, isDemo = false, isWidgetOrder }) => {
   const { configuration = {} } = item;
   const {
     configs = [],
@@ -307,7 +302,6 @@ const VisualChart = ({
         dateFormat={date_format}
         showTime={show_time}
         isWidgetOrder={isWidgetOrder}
-        shouldRenderDate
       >
         <Highcharts
           options={options}

package/src/screens/Device/components/__test__/VisualChart.test.js

@@ -6,6 +6,7 @@ import { act, create } from 'react-test-renderer';
 import VisualChart from '../VisualChart';
 import { API } from '../../../../configs';
 import { getPusher } from '../../../../utils/Pusher';
+import { flushPromises } from '../../../AllGateway/test-utils';
 import api from '../../../../utils/Apis/axios';
 import ChartAggregationOption from '../../../../commons/ChartAggregationOption';
 import DateTimeRangeChange from '../../../../commons/DateTimeRangeChange';
@@ -135,6 +136,8 @@ describe('Test LinearChartWidget', () => {
         });
     });
 
+    await flushPromises();
+
     assertChartData(chart.props.options.series[0].data, [
       [moment(1), 2],
       [moment(3), 4],