@eohjsc/react-native-smart-city 0.7.3-rc17 → 0.7.3-rc19

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eohjsc/react-native-smart-city",
   "title": "React Native Smart Home",
-  "version": "0.7.3-rc17",
+  "version": "0.7.3-rc19",
   "description": "TODO",
   "main": "index.js",
   "files": [

package/src/commons/ActionGroup/SliderRangeTemplate.js

@@ -48,18 +48,20 @@ const SliderRangeTemplate = memo(
       clearTimeout(timeout.current);
       if (value) {
         const data = parseInt(value, 10);
+        const numericValue = Math.min(max_value, Math.max(min_value, data));
+        setValue(numericValue);
         await doAction(
           action_data,
           JSON.stringify({
-            value_brness: data,
-            value: data,
+            value_brness: numericValue,
+            value: numericValue,
           })
         );
       }
       timeout.current = setTimeout(() => {
         setProcessing(false);
       }, 3000);
-    }, [action_data, doAction, value]);
+    }, [action_data, doAction, max_value, min_value, value]);
 
     useEffect(() => {
       if (!processing) {
@@ -72,12 +74,10 @@ const SliderRangeTemplate = memo(
 
     const onInputChange = (text) => {
       if (text === '' || isNaN(text)) {
-        setValue(min_value);
+        setValue(0);
         return;
       }
-
-      const numericValue = Number(text);
-      setValue(Math.min(max_value, Math.max(min_value, numericValue)));
+      setValue(Number(text));
     };
 
     return (

package/src/commons/Automate/ItemAutomate.js

@@ -18,10 +18,11 @@ const ItemAutomate = ({
   enableScript = true,
 }) => {
   const t = useTranslations();
-  const item = AUTOMATES[automate?.type];
-  const isItemOneTap = AUTOMATES[automate?.type] === AUTOMATES.one_tap;
-  const Icon = item?.icon;
-  const valueEvaluations = useGetEvaluateValue(automate?.config, automate.unit);
+  const { type, config, unit } = automate;
+  const item = AUTOMATES[type];
+  const { icon: Icon, title, explanation } = item || {};
+  const isItemOneTap = AUTOMATES[type] === AUTOMATES.one_tap;
+  const valueEvaluations = useGetEvaluateValue(config, unit);
 
   const textCondition = useMemo(() => {
     return generateAutomationConditionText(automate, valueEvaluations, t);
@@ -33,9 +34,9 @@ const ItemAutomate = ({
     } else if (isSelected && isItemOneTap) {
       return t('quick_button_create_at_dashboard');
     } else {
-      return t(item?.explanation);
+      return t(explanation);
     }
-  }, [isItemOneTap, isSelected, item?.explanation, t, textCondition]);
+  }, [isItemOneTap, isSelected, explanation, t, textCondition]);
 
   const handleSelectIndex = useCallback(() => {
     if (onPress) {
@@ -63,7 +64,7 @@ const ItemAutomate = ({
             bold
             color={enableScript ? Colors.Black : Colors.Gray7}
           >
-            {t(item?.title)}
+            {t(title)}
           </Text>
           <Text type="Label" color={Colors.Gray8} numberOfLines={1}>
             {renderText}

package/src/commons/SubUnit/OneTap/ItemOneTap.js

@@ -27,10 +27,9 @@ const ItemOneTap = memo(({ automate = {}, wrapSyles, onPressItem }) => {
 
   const goToDetail = useCallback(() => {
     navigate(Routes.ScriptDetail, {
-      id,
       preAutomate: automate,
     });
-  }, [automate, navigate, id]);
+  }, [automate, navigate]);
 
   const handleScriptAction = useCallback(async () => {
     const { success } = await axiosPost(API.AUTOMATE.ACTION_ONE_TAP(id));

package/src/commons/SubUnit/OneTap/__test__/SubUnitAutomate.test.js

@@ -107,7 +107,6 @@ describe('test Item', () => {
       await goDetail[0].props.onPress();
     });
     expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
-      id: 1,
       preAutomate: data.listAutomate[0].data[0],
     });
 
@@ -194,7 +193,6 @@ describe('test Item', () => {
       await goDetail[0].props.onPress();
     });
     expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
-      id: 1,
       preAutomate: data.listAutomate[0].data[0],
     });
   });

package/src/navigations/EmergencyContactsStack.js

@@ -32,6 +32,8 @@ export const EmergencyContactsStack = memo(() => {
           borderBottomWidth: Device.isIOS === 'android' ? 1 : 0,
           borderColor: Colors.Gray4,
         },
+        headerTintColor: Colors.Black,
+        headerBackTitleVisible: false,
       }}
     >
       <Stack.Screen

package/src/navigations/UnitStack.js

@@ -186,6 +186,8 @@ export const UnitStack = memo((props) => {
           borderBottomWidth: Device.isIOS === 'android' ? 1 : 0,
           borderColor: Colors.Gray4,
         },
+        headerTintColor: Colors.Black,
+        headerBackTitleVisible: false,
       }}
     >
       <Stack.Screen
@@ -285,22 +287,28 @@ export const UnitStack = memo((props) => {
         name={Route.UVIndexGuide}
         component={UVIndexGuide}
         options={{
-          title: t('UV Index Guide'),
+          headerTitle: t('uv_index_guide'),
         }}
       />
       <Stack.Screen
         name={Route.TDSGuide}
         component={TDSGuide}
         options={{
-          title: t('tds_information'),
+          headerTitle: t('tds_information'),
+        }}
+      />
+      <Stack.Screen
+        name={Route.AQIGuide}
+        component={AQIGuide}
+        options={{
+          headerTitle: t('aqi_guide'),
         }}
       />
-      <Stack.Screen name={Route.AQIGuide} component={AQIGuide} />
       <Stack.Screen
         name={Route.WaterQualityGuide}
         component={WaterQualityGuide}
         options={{
-          title: t('water_quality_guide'),
+          headerTitle: t('water_quality_guide'),
         }}
       />
       <Stack.Screen

package/src/screens/AQIGuide/index.js

@@ -4,7 +4,6 @@ import { getBottomSpace } from 'react-native-iphone-x-helper';
 
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import { Colors, Theme } from '../../configs';
-import useTitleHeader from '../../hooks/Common/useTitleHeader';
 import { AccessibilityLabel } from '../../configs/Constants';
 import Text from '../../commons/Text';
 import SvgSmile from '../../../assets/images/Feeling/smile.svg';
@@ -16,7 +15,6 @@ import { useSCContextSelector } from '../../context';
 
 const AQIGuide = memo(() => {
   const t = useTranslations();
-  useTitleHeader(t('AQI Guide'));
   const language = useSCContextSelector((state) => state.language);
   const data = useMemo(
     () => ({

package/src/screens/AddNewGateway/SelectDeviceType.js

@@ -192,7 +192,7 @@ const SelectDeviceType = ({ route }) => {
   useEffect(() => {
     const fetchCountSummary = async () => {
       const { success, data } = await axiosGet(API.DEV_MODE.GATEWAY.COUNT(), {
-        unit: unit?.id,
+        params: { unit: unit?.id },
       });
       if (success) {
         setUnitCountSummary(data);

package/src/screens/Automate/AddNewAutoSmart/AddTypeSmart.js

@@ -31,7 +31,7 @@ const AddTypeSmart = ({ smartTypes, route }) => {
         closeScreen: closeScreen,
       };
 
-      if (!unit && dataAutomate.type !== AUTOMATE_TYPE.SCHEDULE) {
+      if (!unit && dataAutomate.type === AUTOMATE_TYPE.VALUE_CHANGE) {
         navigate(Routes.SelectUnit, params);
         return;
       }

package/src/screens/Automate/Components/InputName.js

@@ -9,12 +9,14 @@ import styles from './InputNameStyles';
 import { useTranslations } from '../../../hooks/Common/useTranslations';
 import { axiosPost, axiosPut } from '../../../utils/Apis/axios';
 import NewActionWrapper from '../../Automate/AddNewAction/NewActionWrapper';
+import Routes from '../../../utils/Route';
 
 const InputName = ({ title, placeholder }) => {
-  const { automate, closeScreen } = useRoute().params;
+  const { automate = {}, closeScreen } = useRoute().params;
+  const { id: automateNameId, name: automateName } = automate;
   const t = useTranslations();
   const { navigate } = useNavigation();
-  const [name, setName] = useState(automate?.name);
+  const [name, setName] = useState(automateName);
   const [processing, setProcessing] = useState(false);
   const handleContinue = useCallback(async () => {
     if (processing) {
@@ -29,21 +31,22 @@ const InputName = ({ title, placeholder }) => {
       name: name,
     };
 
-    const { success, data } = automate?.id
-      ? await axiosPut(API.AUTOMATE.UPDATE_AUTOMATE(automate?.id), params)
+    const { success, data } = automateNameId
+      ? await axiosPut(API.AUTOMATE.UPDATE_AUTOMATE(automateNameId), params)
       : await axiosPost(API.AUTOMATE.CREATE_AUTOMATE(), params);
 
     if (success) {
       navigate({
-        name: closeScreen,
+        name: Routes.ScriptDetail,
         merge: true,
         params: {
-          newAutomate: data,
+          preAutomate: data,
+          closeScreen: closeScreen,
         },
       });
     }
     setProcessing(false);
-  }, [processing, automate, name, navigate, closeScreen]);
+  }, [processing, automate, name, automateNameId, navigate, closeScreen]);
 
   return (
     <NewActionWrapper

package/src/screens/Automate/MultiUnits.js

@@ -25,9 +25,12 @@ const MultiUnits = () => {
   const isFocused = useIsFocused();
   const { navigate } = useNavigation();
   const { params = {}, name: currentRouteName } = useRoute();
-  const { unit, newAutomate } = params;
+  const { unit = {} } = params;
+  const { id: unitId, name } = unit;
   const [data, setData] = useState([]);
   const permissions = useBackendPermission();
+  const { smart_script_for_multi_unit, max_automations_per_unit } =
+    permissions || {};
 
   const [tabActive, setTabActive] = useState(AUTOMATE_TABS.SCENARIO);
 
@@ -37,8 +40,8 @@ const MultiUnits = () => {
 
   const getData = useCallback(
     async (fetchParams) => {
-      if (unit?.id) {
-        await fetchWithCache(API.UNIT.AUTOMATE(unit?.id), {}, (response) => {
+      if (unitId) {
+        await fetchWithCache(API.UNIT.AUTOMATE(unitId), {}, (response) => {
           const { success, data: automateData } = response;
           success && setData(automateData);
         });
@@ -50,7 +53,7 @@ const MultiUnits = () => {
         success && setData(automateData);
       }
     },
-    [unit?.id]
+    [unitId]
   );
 
   const onPressTabName = (tab) => () => {
@@ -62,32 +65,26 @@ const MultiUnits = () => {
       navigate(Routes.UnitStack, {
         screen: Routes.ScriptDetail,
         params: {
-          id: item?.id,
-          unitId: unit?.id,
           preAutomate: item,
         },
       });
     },
-    [navigate, unit?.id]
+    [navigate]
   );
 
-  useEffect(() => {
-    newAutomate && onPressItem(newAutomate);
-  }, [newAutomate, onPressItem]);
-
   const handleOnAddNew = useCallback(() => {
-    if (unit?.id) {
-      if (permissions?.max_automations_per_unit <= data.length) {
+    if (unitId) {
+      if (max_automations_per_unit <= data.length) {
         ToastBottomHelper.error(
           t('reach_max_automations_per_unit', {
-            length: permissions.max_automations_per_unit,
+            length: max_automations_per_unit,
           }),
           '',
           7000
         );
         return;
       }
-    } else if (!permissions?.smart_script_for_multi_unit) {
+    } else if (!smart_script_for_multi_unit) {
       ToastBottomHelper.error(
         t('no_permission_smart_script_for_multi_unit'),
         '',
@@ -99,7 +96,7 @@ const MultiUnits = () => {
       navigate(Routes.UnitStack, {
         screen: Routes.ScenarioName,
         params: {
-          automate: { type: AUTOMATE_TYPE.ONE_TAP, unit: unit?.id },
+          automate: { type: AUTOMATE_TYPE.ONE_TAP, unit: unitId },
           closeScreen: currentRouteName,
         },
       });
@@ -107,9 +104,9 @@ const MultiUnits = () => {
     }
 
     navigate(Routes.UnitStack, {
-      screen: Routes.AddUnknownTypeSmart,
+      screen: Routes.AddAutomationTypeSmart,
       params: {
-        automate: { unit: unit?.id },
+        automate: { unit: unitId },
         closeScreen: currentRouteName,
       },
     });
@@ -117,11 +114,11 @@ const MultiUnits = () => {
     currentRouteName,
     data.length,
     navigate,
-    permissions?.max_automations_per_unit,
-    permissions?.smart_script_for_multi_unit,
+    max_automations_per_unit,
+    smart_script_for_multi_unit,
     t,
     tabActive,
-    unit?.id,
+    unitId,
   ]);
 
   const renderContent = useMemo(() => {
@@ -166,7 +163,7 @@ const MultiUnits = () => {
   return (
     <View style={styles.wrap}>
       <WrapHeaderScrollable
-        title={unit?.id ? unit?.name : t('multi_units_automate')}
+        title={unitId ? name : t('multi_units_automate')}
         headerAniStyle={styles.headerAniStyle}
       >
         <View style={styles.wrapContent}>

package/src/screens/Automate/OneTap/__test__/AddNewOneTap.test.js

@@ -81,7 +81,8 @@ describe('test OneTap', () => {
       merge: true,
       name: Routes.ScriptDetail,
       params: {
-        newAutomate: {
+        closeScreen: Routes.ScriptDetail,
+        preAutomate: {
           id: 1,
           script: { id: 1, name: 'William Miller' },
           type: 'one_tap',

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

@@ -45,11 +45,10 @@ const ScriptDetail = ({ route }) => {
     usePopover();
   const t = useTranslations();
   const {
-    id,
     saveAt,
     preAutomate = {}, // pre-loaded automate data
-    newAutomate, // updated automate data
     newActionsList, // updated actions list
+    closeScreen,
   } = params;
   const [automate, setAutomate] = useState(preAutomate);
   const isFocused = useIsFocused();
@@ -63,7 +62,7 @@ const ScriptDetail = ({ route }) => {
   const [enableScript, setEnableScript] = useState(enable);
   const onShowActivityLog = useCallback(() => {
     navigate(Routes.ActivityLog, {
-      id: id,
+      id: automateId,
       type:
         type === AUTOMATE_TYPE.ONE_TAP
           ? `automate.${AUTOMATE_TYPE.ONE_TAP}`
@@ -74,7 +73,7 @@ const ScriptDetail = ({ route }) => {
         user: Boolean(unit),
       },
     });
-  }, [navigate, id, type, unit]);
+  }, [navigate, automateId, type, unit]);
 
   const listMenuItem = useMemo(
     () => [
@@ -107,39 +106,41 @@ const ScriptDetail = ({ route }) => {
 
   const fetchAutomateActions = useCallback(async () => {
     const { success, data: automateData } = await axiosGet(
-      API.AUTOMATE.SCRIPT_ITEMS(id)
+      API.AUTOMATE.SCRIPT_ITEMS(automateId)
     );
     if (success) {
       setData(automateData.script_items || []);
     }
-  }, [id]);
+  }, [automateId]);
 
   const fetchAutomate = useCallback(async () => {
     const { success, data: automateData } = await axiosGet(
-      API.AUTOMATE.FETCH_AUTOMATE(id)
+      API.AUTOMATE.FETCH_AUTOMATE(automateId)
     );
     if (success) {
       setAutomate(automateData);
       setEnableScript(automateData.script.enable);
     }
-  }, [id]);
+  }, [automateId]);
 
   const onPressEdit = useCallback(() => {
     navigate(Routes.EditActionsList, {
       data,
-      id,
+      id: automateId,
       unitId: automate.unit,
     });
-  }, [navigate, data, id, automate.unit]);
+  }, [navigate, data, automateId, automate.unit]);
 
   const handleScriptAction = useCallback(async () => {
-    const { success } = await axiosPost(API.AUTOMATE.ACTION_ONE_TAP(id));
+    const { success } = await axiosPost(
+      API.AUTOMATE.ACTION_ONE_TAP(automateId)
+    );
     if (success) {
       ToastBottomHelper.success(t('activated_successfully'));
     } else {
       ToastBottomHelper.error(t('activation_failed'));
     }
-  }, [id, t]);
+  }, [automateId, t]);
 
   const handleUpdateAutomate = useCallback(async () => {
     if (!can_edit) {
@@ -158,6 +159,19 @@ const ScriptDetail = ({ route }) => {
     });
   }, [automate, can_edit, enableScript, navigate, route.name, t]);
 
+  const handleGoBack = useCallback(async () => {
+    if (closeScreen === Routes.UnitDetail) {
+      navigate(closeScreen, { unitId: unit });
+    } else if (
+      closeScreen === Routes.MultiUnits ||
+      closeScreen === Routes.Automate
+    ) {
+      navigate(closeScreen, {});
+    } else {
+      goBack();
+    }
+  }, [closeScreen, goBack, navigate, unit]);
+
   const onChangeSwitch = useCallback(
     async (checked) => {
       setEnableScript(checked);
@@ -210,17 +224,13 @@ const ScriptDetail = ({ route }) => {
     saveAt && fetchAutomateActions();
   }, [saveAt, fetchAutomateActions]);
 
-  useEffect(() => {
-    newAutomate && setAutomate(newAutomate);
-  }, [newAutomate]);
-
   return (
     <View style={styles.wrap}>
       <WrapHeaderScrollable
         title={name}
         headerAniStyle={styles.headerAniStyle}
         rightComponent={rightComponent}
-        onGoBack={goBack}
+        onGoBack={handleGoBack}
       >
         <View style={styles.wrapContent}>
           {!!can_edit && (

package/src/screens/Automate/__test__/MultiUnits.test.js

@@ -76,7 +76,6 @@ describe('Test MultiUnits', () => {
       params: {
         isMultiUnits: true,
         unitName: null,
-        unit: null,
       },
     });
     await act(async () => {
@@ -111,7 +110,6 @@ describe('Test MultiUnits', () => {
     expect(global.mockedNavigate).toBeCalledWith(Routes.UnitStack, {
       screen: Routes.ScriptDetail,
       params: {
-        id: response[1].id,
         preAutomate: response[1],
       },
     });
@@ -120,7 +118,7 @@ describe('Test MultiUnits', () => {
       ItemAddNews[0].props.onAddNew();
     });
     expect(global.mockedNavigate).toBeCalledWith(Routes.UnitStack, {
-      screen: Routes.AddUnknownTypeSmart,
+      screen: Routes.AddAutomationTypeSmart,
       params: {
         automate: { unit: undefined },
         closeScreen: undefined,
@@ -264,7 +262,6 @@ describe('Test MultiUnits', () => {
       params: {
         isMultiUnits: true,
         unitName: null,
-        unit: null,
       },
     });
     await act(async () => {

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

@@ -173,7 +173,6 @@ describe('Test Automate', () => {
       params: {
         preAutomate: response.data[0].automates[0],
         closeScreen: undefined,
-        id: 1,
       },
     });
   });

package/src/screens/Automate/index.js

@@ -75,7 +75,6 @@ const Automate = () => {
       navigate(Routes.UnitStack, {
         screen: Routes.ScriptDetail,
         params: {
-          id: item?.id,
           closeScreen: currentRouteName,
           preAutomate: item, // pre-loaded automate data
         },

package/src/screens/Device/hooks/useEvaluateValue.js

@@ -129,7 +129,7 @@ export const useGetEvaluateValue = (configId, unitId) => {
   if (configId && valueEvaluations[configId] === undefined) {
     (async () => {
       const { success, data } = await axiosGet(API.VALUE_EVALUATIONS(), {
-        configs__id: configId,
+        params: { configs__id: configId },
       });
       if (success) {
         setAction(Action.INIT_VALUE_EVALUATIONS, {

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

@@ -438,7 +438,7 @@ const NotificationItem = memo(({ item }) => {
             navigation.navigate(Routes.UnitStack, {
               screen: Routes.ScriptDetail,
               params: {
-                id: automate_id,
+                preAutomate: { id: automate_id },
               },
             });
           },

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

@@ -158,7 +158,7 @@ describe('Test Select unit screen', () => {
       await iconClose[0].props.onPress();
     });
     expect(global.mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
-      id: 1,
+      automate: { id: 1 },
       havePermission: true,
       isMultiUnits: undefined,
       name: '1',

package/src/screens/SelectUnit/index.js

@@ -50,7 +50,7 @@ const SelectUnit = () => {
   const handleOnGoBackAndClose = useCallback(() => {
     if (automateId) {
       navigate(Routes.ScriptDetail, {
-        id: automateId,
+        automate: { id: automateId },
         name: scriptName,
         type: oldType,
         havePermission: true,

package/src/screens/UVIndexGuide/index.js

@@ -2,16 +2,14 @@ import React, { memo, useMemo } from 'react';
 import { ScrollView, StyleSheet, TouchableOpacity, View } from 'react-native';
 import { getStatusBarHeight } from 'react-native-iphone-x-helper';
 
-import { useTranslations } from '../../hooks/Common/useTranslations';
-import { Colors, Theme } from '../../configs';
 import Text from '../../commons/Text';
+import { Colors, Theme } from '../../configs';
 import { AccessibilityLabel } from '../../configs/Constants';
 import { useSCContextSelector } from '../../context';
-import useTitleHeader from '../../hooks/Common/useTitleHeader';
+import { useTranslations } from '../../hooks/Common/useTranslations';
 
 const UVIndexGuide = memo(() => {
   const t = useTranslations();
-  useTitleHeader(t('UV Index Guide'));
   const language = useSCContextSelector((state) => state.language);
 
   const data = useMemo(

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

@@ -238,6 +238,8 @@ export default {
     'Overall Water quality is based on below those conditions',
   water_quality_guide: 'Water Quality Guide',
   clo_guide: 'Chlorine Residual Guide',
+  aqi_guide: 'AQI Guide',
+  uv_index_guide: 'UV Index Guide',
   what_is_clo: 'What is Chlorine residual?',
   text_what_clo:
     'Residual chlorine is the low level amount of chlorine remaining in the water after a certain period of ' +

package/src/utils/I18n/translations/vi.js

@@ -197,7 +197,8 @@ export default {
   text_name: 'Tên',
   left_menu_notifications: 'Thông báo',
   text_settings: 'Cài đặt',
-  'AQI Guide': 'Chỉ số AQI',
+  aqi_guide: 'Chỉ số AQI',
+  uv_index_guide: 'Chỉ số UV',
   'What is AQI?': 'Chỉ số AQI là gì?',
   text_what_aqi:
     'AQI là các chữ cái viết tắt của “Air Quality Index” – chỉ số chất lượng không khí. Chỉ số này được sử dụng để ' +