@eohjsc/react-native-smart-city 0.2.21 → 0.2.27

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

@@ -1,6 +1,6 @@
 import React, { memo } from 'react';
 import { View, StyleSheet } from 'react-native';
-import { t } from 'i18n-js';
+import { useTranslations } from '../../../../hooks/Common/useTranslations';
 
 import { Colors } from '../../../../configs';
 import Text from '../../../../commons/Text';
@@ -8,6 +8,7 @@ import TotalPowerBox from '../TotalPowerBox';
 import { TESTID } from '../../../../configs/Constants';
 
 const TotalPowerConsumption = memo(({ time, total }) => {
+  const t = useTranslations();
   return (
     <View style={styles.container}>
       <Text color={Colors.Gray9} size={16} style={styles.txtCurrent}>

package/src/screens/UnitSummary/components/UvIndex/__test__/__snapshots__/index.test.js.snap

@@ -38,7 +38,7 @@ Array [
           ]
         }
       >
-        Hôm nay, 24 tháng 1
+        Today, Jan 24
       </Text>
     </View>
     <View>
@@ -2687,7 +2687,7 @@ Array [
             }
           >
             <RNSVGTSpan
-              content="Chỉ số UV"
+              content="UV Index "
               dx={Array []}
               dy={Array []}
               font={Object {}}
@@ -2804,7 +2804,7 @@ Array [
           ]
         }
       >
-        Khuyến nghị về sức khoẻ:
+        Protection advices:
       </Text>
     </View>
   </View>,
@@ -2848,7 +2848,7 @@ Array [
             ]
           }
         >
-          Lịch sử
+          History
         </Text>
         <View
           style={
@@ -2878,7 +2878,7 @@ Array [
               ]
             }
           >
-            từ
+            From
           </Text>
           <View
             accessible={true}
@@ -2958,7 +2958,7 @@ Array [
               ]
             }
           >
-            đến
+            to
           </Text>
           <View
             accessible={true}
@@ -3168,7 +3168,7 @@ Array [
           ]
         }
       >
-        Hôm nay, 24 tháng 1
+        Today, Jan 24
       </Text>
     </View>
     <View>
@@ -5817,7 +5817,7 @@ Array [
             }
           >
             <RNSVGTSpan
-              content="Chỉ số UV"
+              content="UV Index "
               dx={Array []}
               dy={Array []}
               font={Object {}}
@@ -5934,7 +5934,7 @@ Array [
           ]
         }
       >
-        Khuyến nghị về sức khoẻ:
+        Protection advices:
       </Text>
     </View>
     <View
@@ -6022,7 +6022,7 @@ Array [
             ]
           }
         >
-          Lịch sử
+          History
         </Text>
         <View
           style={
@@ -6052,7 +6052,7 @@ Array [
               ]
             }
           >
-            từ
+            From
           </Text>
           <View
             accessible={true}
@@ -6132,7 +6132,7 @@ Array [
               ]
             }
           >
-            đến
+            to
           </Text>
           <View
             accessible={true}
@@ -6342,7 +6342,7 @@ Array [
           ]
         }
       >
-        Hôm nay, 24 tháng 1
+        Today, Jan 24
       </Text>
     </View>
     <View>
@@ -8991,7 +8991,7 @@ Array [
             }
           >
             <RNSVGTSpan
-              content="Chỉ số UV"
+              content="UV Index "
               dx={Array []}
               dy={Array []}
               font={Object {}}
@@ -9108,7 +9108,7 @@ Array [
           ]
         }
       >
-        Khuyến nghị về sức khoẻ:
+        Protection advices:
       </Text>
     </View>
   </View>,
@@ -9152,7 +9152,7 @@ Array [
             ]
           }
         >
-          Lịch sử
+          History
         </Text>
         <View
           style={
@@ -9182,7 +9182,7 @@ Array [
               ]
             }
           >
-            từ
+            From
           </Text>
           <View
             accessible={true}
@@ -9262,7 +9262,7 @@ Array [
               ]
             }
           >
-            đến
+            to
           </Text>
           <View
             accessible={true}
@@ -9472,7 +9472,7 @@ Array [
           ]
         }
       >
-        Hôm nay, 24 tháng 1
+        Today, Jan 24
       </Text>
     </View>
     <View>
@@ -12121,7 +12121,7 @@ Array [
             }
           >
             <RNSVGTSpan
-              content="Chỉ số UV"
+              content="UV Index "
               dx={Array []}
               dy={Array []}
               font={Object {}}
@@ -12215,7 +12215,7 @@ Array [
           ]
         }
       >
-        Khuyến nghị về sức khoẻ:
+        Protection advices:
       </Text>
     </View>
   </View>,
@@ -12259,7 +12259,7 @@ Array [
             ]
           }
         >
-          Lịch sử
+          History
         </Text>
         <View
           style={
@@ -12289,7 +12289,7 @@ Array [
               ]
             }
           >
-            từ
+            From
           </Text>
           <View
             accessible={true}
@@ -12369,7 +12369,7 @@ Array [
               ]
             }
           >
-            đến
+            to
           </Text>
           <View
             accessible={true}
@@ -12579,7 +12579,7 @@ Array [
           ]
         }
       >
-        Hôm nay, 24 tháng 1
+        Today, Jan 24
       </Text>
     </View>
     <View>
@@ -15228,7 +15228,7 @@ Array [
             }
           >
             <RNSVGTSpan
-              content="Chỉ số UV"
+              content="UV Index "
               dx={Array []}
               dy={Array []}
               font={Object {}}
@@ -15267,7 +15267,7 @@ Array [
             }
           >
             <RNSVGTSpan
-              content="Đang tải"
+              content="Loading"
               dx={Array []}
               dy={Array []}
               font={Object {}}
@@ -15322,7 +15322,7 @@ Array [
           ]
         }
       >
-        Khuyến nghị về sức khoẻ:
+        Protection advices:
       </Text>
     </View>
   </View>,
@@ -15366,7 +15366,7 @@ Array [
             ]
           }
         >
-          Lịch sử
+          History
         </Text>
         <View
           style={
@@ -15396,7 +15396,7 @@ Array [
               ]
             }
           >
-            từ
+            From
           </Text>
           <View
             accessible={true}
@@ -15476,7 +15476,7 @@ Array [
               ]
             }
           >
-            đến
+            to
           </Text>
           <View
             accessible={true}
@@ -15686,7 +15686,7 @@ Array [
           ]
         }
       >
-        Hôm nay, 24 tháng 1
+        Today, Jan 24
       </Text>
     </View>
     <View>
@@ -18335,7 +18335,7 @@ Array [
             }
           >
             <RNSVGTSpan
-              content="Chỉ số UV"
+              content="UV Index "
               dx={Array []}
               dy={Array []}
               font={Object {}}
@@ -18452,7 +18452,7 @@ Array [
           ]
         }
       >
-        Khuyến nghị về sức khoẻ:
+        Protection advices:
       </Text>
     </View>
   </View>,
@@ -18496,7 +18496,7 @@ Array [
             ]
           }
         >
-          Lịch sử
+          History
         </Text>
         <View
           style={
@@ -18526,7 +18526,7 @@ Array [
               ]
             }
           >
-            từ
+            From
           </Text>
           <View
             accessible={true}
@@ -18606,7 +18606,7 @@ Array [
               ]
             }
           >
-            đến
+            to
           </Text>
           <View
             accessible={true}

package/src/screens/UnitSummary/components/UvIndex/__test__/index.test.js

@@ -1,7 +1,15 @@
 import React from 'react';
 import { create, act } from 'react-test-renderer';
+import { SCProvider } from '../../../../../context';
+import { mockSCStore } from '../../../../../context/mockStore';
 import UvIndex from '../index';
 
+const wrapComponent = (data) => (
+  <SCProvider initState={mockSCStore({})}>
+    <UvIndex {...data} />
+  </SCProvider>
+);
+
 describe('Test UvIndex', () => {
   let data;
 
@@ -21,7 +29,7 @@ describe('Test UvIndex', () => {
 
   test('render UvIndex', async () => {
     act(() => {
-      tree = create(<UvIndex {...data} />);
+      tree = create(wrapComponent(data));
     });
     expect(tree.toJSON()).toMatchSnapshot();
   });
@@ -29,7 +37,7 @@ describe('Test UvIndex', () => {
   test('render UvIndex with negative uv_value', async () => {
     data.summaryDetail.uv_value = -1;
     act(() => {
-      tree = create(<UvIndex {...data} />);
+      tree = create(wrapComponent(data));
     });
     expect(tree.toJSON()).toMatchSnapshot();
   });
@@ -37,7 +45,7 @@ describe('Test UvIndex', () => {
   test('render UvIndex with high uv_value', async () => {
     data.summaryDetail.uv_value = 11;
     act(() => {
-      tree = create(<UvIndex {...data} />);
+      tree = create(wrapComponent(data));
     });
     expect(tree.toJSON()).toMatchSnapshot();
   });
@@ -45,7 +53,7 @@ describe('Test UvIndex', () => {
   test('render UvIndex with advices', async () => {
     data.summaryDetail.advices = ['Amazing good chop'];
     act(() => {
-      tree = create(<UvIndex {...data} />);
+      tree = create(wrapComponent(data));
     });
     expect(tree.toJSON()).toMatchSnapshot();
   });
@@ -53,7 +61,7 @@ describe('Test UvIndex', () => {
   test('render UvIndex without advices', async () => {
     delete data.summaryDetail.advices;
     act(() => {
-      tree = create(<UvIndex {...data} />);
+      tree = create(wrapComponent(data));
     });
     expect(tree.toJSON()).toMatchSnapshot();
   });
@@ -61,7 +69,7 @@ describe('Test UvIndex', () => {
   test('render UvIndex with undefined uv_value', async () => {
     data.summaryDetail.uv_value = undefined;
     act(() => {
-      tree = create(<UvIndex {...data} />);
+      tree = create(wrapComponent(data));
     });
     expect(tree.toJSON()).toMatchSnapshot();
   });

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

@@ -1,7 +1,7 @@
 import React, { memo, useMemo } from 'react';
 import { StyleSheet, View } from 'react-native';
 import { IconOutline } from '@ant-design/icons-react-native';
-import { t } from 'i18n-js';
+import { useTranslations } from '../../../../hooks/Common/useTranslations';
 
 import { Colors } from '../../../../configs';
 import Text from '../../../../commons/Text';
@@ -10,6 +10,7 @@ import ConfigHistoryChart from '../../../../commons/UnitSummary/ConfigHistoryCha
 import SegmentedRoundDisplay from '../../../../commons/UnitSummary/AirQuality/SegmentedRoundDisplay';
 
 const UvIndex = memo(({ summaryDetail }) => {
+  const t = useTranslations();
   const { uv_id } = summaryDetail;
   const showBoxHistory = useMemo(() => {
     return !!uv_id;

package/src/screens/UnitSummary/components/WaterQuality/__test__/index.test.js

@@ -4,6 +4,8 @@ import { act, create } from 'react-test-renderer';
 import Routes from '../../../../../utils/Route';
 import WaterQuality from '../index';
 import { Section } from '../../../../../commons';
+import { SCProvider } from '../../../../../context';
+import { mockSCStore } from '../../../../../context/mockStore';
 
 const mockedNavigate = jest.fn();
 
@@ -16,6 +18,12 @@ jest.mock('@react-navigation/native', () => {
   };
 });
 
+const wrapComponent = (data) => (
+  <SCProvider initState={mockSCStore({})}>
+    <WaterQuality {...data} />
+  </SCProvider>
+);
+
 describe('Test WaterQualityGuide', () => {
   let data;
 
@@ -36,9 +44,8 @@ describe('Test WaterQualityGuide', () => {
 
   test('render WaterQualityGuide', async () => {
     act(() => {
-      tree = create(<WaterQuality {...data} />);
+      tree = create(wrapComponent(data));
     });
-    expect(tree.toJSON()).toMatchSnapshot();
     const instance = tree.root;
     const sections = instance.findAllByType(Section);
     expect(sections).toHaveLength(2);
@@ -49,9 +56,8 @@ describe('Test WaterQualityGuide', () => {
     data.summaryDetail.tur_id = 0;
     data.summaryDetail.clo_id = 0;
     act(() => {
-      tree = create(<WaterQuality {...data} />);
+      tree = create(wrapComponent(data));
     });
-    expect(tree.toJSON()).toMatchSnapshot();
     const instance = tree.root;
     const sections = instance.findAllByType(Section);
     expect(sections).toHaveLength(1);
@@ -59,7 +65,7 @@ describe('Test WaterQualityGuide', () => {
 
   test('onClickItem waterType', async () => {
     act(() => {
-      tree = create(<WaterQuality {...data} />);
+      tree = create(wrapComponent(data));
     });
     const instance = tree.root;
     const buttons = instance.findAllByType(TouchableOpacity);

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

@@ -1,12 +1,13 @@
 import React, { memo, useMemo } from 'react';
 import { StyleSheet, View } from 'react-native';
-import { t } from 'i18n-js';
+import { useTranslations } from '../../../../hooks/Common/useTranslations';
 import { Today, Section } from '../../../../commons';
 import Text from '../../../../commons/Text';
 import ConfigHistoryChart from '../../../../commons/UnitSummary/ConfigHistoryChart';
 import Item from './Item';
 
 const WaterQuality = memo(({ summaryDetail }) => {
+  const t = useTranslations();
   const { ph_id, tur_id, clo_id } = summaryDetail;
   const showBoxHistory = useMemo(() => {
     return ph_id || tur_id || clo_id ? true : false;

package/src/screens/UnitSummary/components/__test__/TotalPowerConsumption.test.js

@@ -1,20 +1,26 @@
 import React from 'react';
 import renderer, { act } from 'react-test-renderer';
 import { TESTID } from '../../../../configs/Constants';
+import { SCProvider } from '../../../../context';
+import { mockSCStore } from '../../../../context/mockStore';
 import TotalPowerConsumption from '../TotalPowerConsumption/index';
 
+const wrapComponent = () => (
+  <SCProvider initState={mockSCStore({})}>
+    <TotalPowerConsumption
+      total={{
+        value: 10,
+      }}
+    />
+  </SCProvider>
+);
+
 describe('Test Total Power Consumption', () => {
   let tree;
 
   test('render Total Power Consumption', () => {
     act(() => {
-      tree = renderer.create(
-        <TotalPowerConsumption
-          total={{
-            value: 10,
-          }}
-        />
-      );
+      tree = renderer.create(wrapComponent());
     });
     const instance = tree.root;
     const item = instance.find(

package/src/screens/UnitSummary/components/__test__/UnitSummary.test.js

@@ -0,0 +1,67 @@
+import React from 'react';
+import { TouchableOpacity } from 'react-native';
+import { create } from 'react-test-renderer';
+import { act } from 'react-test-renderer';
+import UnitSummary from '../';
+import styles from '../indexstyles';
+
+const mockGoToSummary = jest.fn();
+
+describe('Test UnitSummary', () => {
+  let tree;
+  const defaultProps = {
+    summary: {
+      color_right_text: null,
+      color_left_text: null,
+    },
+    mockGoToSummary: mockGoToSummary,
+  };
+
+  it('Test index = 0', async () => {
+    await act(() => {
+      tree = create(<UnitSummary {...defaultProps} index={0} />);
+    });
+    const instance = tree.root;
+    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
+    expect(TouchableOpacities[0].props.style).toEqual([
+      styles.summaryContainer,
+      { borderTopLeftRadius: 10 },
+    ]);
+  });
+
+  it('Test index = 1', async () => {
+    await act(() => {
+      tree = create(<UnitSummary {...defaultProps} index={1} />);
+    });
+    const instance = tree.root;
+    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
+    expect(TouchableOpacities[0].props.style).toEqual([
+      styles.summaryContainer,
+      { borderTopRightRadius: 10 },
+    ]);
+  });
+
+  it('Test len % 2 === 0 && index = len - 1', async () => {
+    await act(() => {
+      tree = create(<UnitSummary {...defaultProps} index={1} len={2} />);
+    });
+    const instance = tree.root;
+    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
+    expect(TouchableOpacities[0].props.style).toEqual([
+      styles.summaryContainer,
+      { borderBottomRightRadius: 10 },
+    ]);
+  });
+
+  it('Test len % 2 !== 0 && index = len - 1', async () => {
+    await act(() => {
+      tree = create(<UnitSummary {...defaultProps} index={2} len={3} />);
+    });
+    const instance = tree.root;
+    const TouchableOpacities = instance.findAllByType(TouchableOpacity);
+    expect(TouchableOpacities[0].props.style).toEqual([
+      styles.summaryContainer,
+      { borderBottomLeftRadius: 10 },
+    ]);
+  });
+});

package/src/screens/UnitSummary/components/__test__/index.test.js

@@ -0,0 +1,48 @@
+import React from 'react';
+import renderer, { act } from 'react-test-renderer';
+import { Text, TouchableOpacity } from 'react-native';
+import UnitSummary from '..';
+
+describe('UnitSummary components', () => {
+  let tree;
+
+  test('test render UnitSummary components', () => {
+    const summary = {
+      left_value: 'left_value test',
+      left_text: 'left_text test',
+      right_value: 'right_value test',
+      right_text: 'right_text test',
+    };
+    act(() => {
+      tree = renderer.create(<UnitSummary summary={summary} />);
+    });
+    const instance = tree.root;
+    const textElement = instance.findAllByType(Text);
+
+    expect(textElement[0].props.children).toEqual(summary.left_value);
+    expect(textElement[1].props.children).toEqual(summary.left_text);
+    expect(textElement[2].props.children).toEqual(summary.right_value);
+    expect(textElement[3].props.children).toEqual(summary.right_text);
+  });
+
+  test('test onPress goToSummary', () => {
+    const summary = {
+      left_value: 'left_value test',
+      left_text: 'left_text test',
+      right_value: 'right_value test',
+      right_text: 'right_text test',
+    };
+    const mockFuntion = jest.fn();
+    act(() => {
+      tree = renderer.create(
+        <UnitSummary summary={summary} goToSummary={mockFuntion} />
+      );
+    });
+    const instance = tree.root;
+    const touchableOpacity = instance.findByType(TouchableOpacity);
+    act(() => {
+      touchableOpacity.props.onPress();
+    });
+    expect(mockFuntion).toHaveBeenCalled();
+  });
+});

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
 import { Colors } from '../../../configs';
+import styles from './indexstyles';
 
 const UnitSummary = ({ summary, goToSummary, index, len }) => {
   let RadiusProps = {};
@@ -65,41 +66,4 @@ const UnitSummary = ({ summary, goToSummary, index, len }) => {
   );
 };
 
-const styles = StyleSheet.create({
-  summaryContainer: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    borderWidth: 0.5,
-    borderColor: Colors.Gray4,
-    paddingHorizontal: 15,
-    paddingVertical: 10,
-  },
-  leftValue: {
-    fontWeight: 'bold',
-    fontSize: 16,
-    lineHeight: 24,
-  },
-  leftText: {
-    fontStyle: 'normal',
-    fontWeight: 'normal',
-    fontSize: 12,
-    lineHeight: 20,
-  },
-  rightValue: {
-    fontStyle: 'normal',
-    fontWeight: 'normal',
-    fontSize: 12,
-    lineHeight: 20,
-    top: 2,
-  },
-  rightText: {
-    fontStyle: 'normal',
-    fontWeight: 'normal',
-    fontSize: 10,
-    lineHeight: 20,
-    top: 4,
-  },
-});
-
 export default UnitSummary;