@eohjsc/react-native-smart-city 0.4.89 → 0.4.91

package/package.json

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

package/src/commons/Device/ProgressBar/index.js

@@ -10,12 +10,23 @@ import styles from './styles';
 const ProgressBar = memo(({ data = [], item, isWidgetOrder }) => {
   const t = useTranslations();
 
+  const minValue = useMemo(() => {
+    return Number(item?.configuration?.min_value) || 0;
+  }, [item?.configuration?.min_value]);
   const maxValue = useMemo(() => {
     return Number(item?.configuration?.max_value) || 60;
   }, [item?.configuration?.max_value]);
-  const { value = 0, measure, unit } = data.length ? data[0] : {};
-  const percent = value / maxValue; // a number between 0 and 1
+
+  let { value = 0, measure, unit } = data.length ? data[0] : {};
   const isNotValue = ['', null, undefined, NaN].includes(value);
+
+  if (isNotValue) {
+    value = minValue;
+  }
+
+  const distance = maxValue - minValue;
+  const percent = (value - minValue) / distance;
+
   return (
     <View style={(isWidgetOrder && styles.wrapOrderItem) || styles.container}>
       <Text size={16} style={styles.textLabel}>

package/src/commons/Device/WindSpeed/Anemometer/index.js

@@ -1,19 +1,19 @@
 import React, { memo, useCallback, useMemo, useState } from 'react';
-import Svg, { Path, Text, Circle } from 'react-native-svg';
-import { View, StyleSheet, Text as ReactText } from 'react-native';
+import { Text as ReactText, StyleSheet, View } from 'react-native';
+import Svg, { Circle, Path, Text } from 'react-native-svg';
 
+import { Colors, Fonts } from '../../../../configs';
+import AccessibilityLabel from '../../../../configs/AccessibilityLabel';
 import {
   drawArc,
   polarToCartesian,
 } from '../../../UnitSummary/AirQuality/SegmentedRoundDisplay/helper';
-import { Colors, Fonts } from '../../../../configs';
-import AccessibilityLabel from '../../../../configs/AccessibilityLabel';
 
 const { PI } = Math;
 
 const Anemometer = memo(
   ({
-    data = [],
+    data = [{ value: 0 }],
     width = 240,
     size = 170,
     strokeWidth = 16,
@@ -29,11 +29,19 @@ const Anemometer = memo(
       y: size / 2,
     };
 
+    const minValue = useMemo(() => {
+      return Number(item?.configuration?.min_value) || 0;
+    }, [item?.configuration?.min_value]);
+
     const maxValue = useMemo(() => {
       return Number(item?.configuration?.max_value) || 60;
     }, [item?.configuration?.max_value]);
 
-    const value = data.length && data[0]?.value ? data[0].value : 0;
+    const configValue = data.length && data[0]?.value;
+
+    const isValidValue = ![null, undefined, NaN].includes(configValue);
+    const value = isValidValue ? configValue : minValue;
+
     const measure = data.length ? data[0].unit || data[0].measure : 'm/s';
 
     const radius = (size - strokeWidth) / 2;
@@ -44,7 +52,10 @@ const Anemometer = memo(
     const strokeLength = (strokeAngle * circumference) / 360 - 1;
     const strokeDasharrayBg = `${strokeLength} 1`;
     const arc = circumference * 0.75;
-    const offset = arc - (value / maxValue) * arc;
+
+    const total = minValue + maxValue;
+    const distance = maxValue - minValue;
+    const offset = arc - (((value || 0) - minValue) / distance) * arc;
 
     const textAngles = useCallback(() => {
       let arr = [];
@@ -67,7 +78,7 @@ const Anemometer = memo(
               fontFamily={Fonts.Regular}
               key={i.toString()}
             >
-              {(i / numberOfSection) * maxValue}
+              {minValue}
             </Text>
           );
         }
@@ -88,7 +99,7 @@ const Anemometer = memo(
               textAnchor="middle"
               fontFamily={Fonts.Regular}
             >
-              {(i / numberOfSection) * maxValue}
+              {0.5 * total}
             </Text>
           );
         }
@@ -116,13 +127,15 @@ const Anemometer = memo(
       }
       return arr;
     }, [
+      size,
       numberOfSection,
+      width,
       startAngle,
       strokeAngle,
-      size,
-      width,
-      maxValue,
       txtColor,
+      minValue,
+      total,
+      maxValue,
     ]);
 
     // eslint-disable-next-line no-shadow
@@ -188,9 +201,11 @@ const Anemometer = memo(
               onPressOut={handleShowToolTip(false)}
               accessibilityLabel={AccessibilityLabel.GAUGE_VALUE}
             >
-              {value.toString().length > 10
-                ? value.toString().substring(0, 10) + '...'
-                : value}
+              {isValidValue
+                ? value.toString().length > 10
+                  ? value.toString().substring(0, 10) + '...'
+                  : value
+                : '--'}
             </Text>
           </Svg>
           {isShowToolTip && (

package/src/screens/Automate/AddNewAction/SetupScriptDelay.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useMemo, useState } from 'react';
-import { View } from 'react-native';
+import { Keyboard, TouchableWithoutFeedback, View } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import styles from './Styles/SetupScriptDelayStyles';
 import { HeaderCustom } from '../../../commons';
@@ -55,25 +55,27 @@ const SetupScriptDelay = ({ route }) => {
   return (
     <View style={styles.wrap}>
       <HeaderCustom isShowClose onClose={goBack} title={t('wait')} />
-      <View style={styles.container}>
-        <_TextInput
-          label={t('set_timeout_seconds')}
-          placeholder={t('maximum_3600_seconds')}
-          keyboardType="numeric"
-          textInputStyle={styles.inputNumber}
-          value={delay}
-          onChange={onChangeTitle}
-          maxLength={4}
-          accessibilityLabel={AccessibilityLabel.AUTOMATE_INPUT_DELAY}
-          autoFocus
-        />
-        <BottomButtonView
-          style={styles.bottomButtonView}
-          mainTitle={t('save')}
-          onPressMain={onNext}
-          typeMain={canSave ? 'primary' : 'disabled'}
-        />
-      </View>
+      <TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
+        <View style={styles.container}>
+          <_TextInput
+            label={t('set_timeout_seconds')}
+            placeholder={t('maximum_3600_seconds')}
+            keyboardType="numeric"
+            textInputStyle={styles.inputNumber}
+            value={delay}
+            onChange={onChangeTitle}
+            maxLength={4}
+            accessibilityLabel={AccessibilityLabel.AUTOMATE_INPUT_DELAY}
+            autoFocus
+          />
+          <BottomButtonView
+            style={styles.bottomButtonView}
+            mainTitle={t('save')}
+            onPressMain={onNext}
+            typeMain={canSave ? 'primary' : 'disabled'}
+          />
+        </View>
+      </TouchableWithoutFeedback>
     </View>
   );
 };

package/src/screens/Automate/AddNewAction/SetupScriptNotify.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useMemo, useState } from 'react';
-import { View } from 'react-native';
+import { Keyboard, TouchableWithoutFeedback, View } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import styles from './Styles/SetupScriptNotifyStyles';
 import { HeaderCustom } from '../../../commons';
@@ -59,32 +59,33 @@ const SetupScriptNotify = ({ route }) => {
   return (
     <View style={styles.wrap}>
       <HeaderCustom isShowClose onClose={goBack} title={t('notification')} />
-      <View style={styles.container}>
-        <_TextInput
-          placeholder={t('title_notification')}
-          onChange={onChangeTitle}
-          textInputStyle={styles.textTitle}
-          value={notify?.title}
-          accessibilityLabel={AccessibilityLabel.AUTOMATE_TITLE_NOTIFY}
-          autoFocus
-        />
-        <_TextInput
-          placeholder={t('message_notification')}
-          onChange={onChangeMessage}
-          textInputStyle={styles.textMessage}
-          value={notify?.message}
-          accessibilityLabel={AccessibilityLabel.AUTOMATE_MESSAGE_NOTIFY}
-          multiline={true}
-          maxLength={255}
-        />
-
-        <BottomButtonView
-          style={styles.bottomButtonView}
-          mainTitle={t('save')}
-          onPressMain={onNext}
-          typeMain={canSave ? 'primary' : 'disabled'}
-        />
-      </View>
+      <TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
+        <View style={styles.container}>
+          <_TextInput
+            placeholder={t('title_notification')}
+            onChange={onChangeTitle}
+            textInputStyle={styles.textTitle}
+            value={notify?.title}
+            accessibilityLabel={AccessibilityLabel.AUTOMATE_TITLE_NOTIFY}
+            autoFocus
+          />
+          <_TextInput
+            placeholder={t('message_notification')}
+            onChange={onChangeMessage}
+            textInputStyle={styles.textMessage}
+            value={notify?.message}
+            accessibilityLabel={AccessibilityLabel.AUTOMATE_MESSAGE_NOTIFY}
+            multiline={true}
+            maxLength={255}
+          />
+          <BottomButtonView
+            style={styles.bottomButtonView}
+            mainTitle={t('save')}
+            onPressMain={onNext}
+            typeMain={canSave ? 'primary' : 'disabled'}
+          />
+        </View>
+      </TouchableWithoutFeedback>
     </View>
   );
 };

package/src/screens/Automate/AddNewAction/Styles/SetupScriptNotifyStyles.js

@@ -21,6 +21,7 @@ export default StyleSheet.create({
   },
   textMessage: {
     height: 500,
+    textAlignVertical: 'top',
     borderWidth: 1,
     borderColor: Colors.Gray4,
     borderStyle: 'solid',

package/src/screens/Automate/AddNewAction/__test__/SetupScriptDelay.test.js

@@ -11,6 +11,7 @@ import _TextInput from '../../../../commons/Form/TextInput';
 import BottomButtonView from '../../../../commons/BottomButtonView';
 import { ToastBottomHelper } from '../../../../utils/Utils';
 import SetupScriptDelay from '../SetupScriptDelay';
+import { TouchableWithoutFeedback } from 'react-native';
 
 const mock = new MockAdapter(api.axiosInstance);
 
@@ -55,6 +56,10 @@ describe('Test SetupScriptDelay', () => {
       inputs[0].props.onChange('u');
     });
     expect(button.props.typeMain).toEqual('disabled');
+    const touchable = instance.findAllByType(TouchableWithoutFeedback);
+    await act(async () => {
+      touchable[0].props.onPress();
+    });
     await act(async () => {
       inputs[0].props.onChange('0');
     });

package/src/screens/Automate/AddNewAction/__test__/SetupScriptNotify.test.js

@@ -11,6 +11,7 @@ import SetupScriptNotify from '../SetupScriptNotify';
 import _TextInput from '../../../../commons/Form/TextInput';
 import BottomButtonView from '../../../../commons/BottomButtonView';
 import { ToastBottomHelper } from '../../../../utils/Utils';
+import { TouchableWithoutFeedback } from 'react-native';
 
 const mock = new MockAdapter(api.axiosInstance);
 
@@ -53,6 +54,12 @@ describe('Test SetupScriptNotify', () => {
 
     await act(async () => {
       inputs[0].props.onChange('Title');
+    });
+    const touchable = instance.findAllByType(TouchableWithoutFeedback);
+    await act(async () => {
+      touchable[0].props.onPress();
+    });
+    await act(async () => {
       inputs[1].props.onChange('Message');
     });
     const button = instance.findByType(BottomButtonView);

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

@@ -218,12 +218,14 @@ const ScriptDetail = ({ route }) => {
         onGoBack={goBack}
       >
         <View style={styles.wrapContent}>
-          <View style={styles.row}>
-            <Text type="H3" semibold>
-              {t('enable_this_script')}
-            </Text>
-            <Switch checked={enableScript} onChange={onChangeSwitch} />
-          </View>
+          {!!can_edit && !!enableScript && (
+            <View style={styles.row}>
+              <Text type="H3" semibold>
+                {t('enable_this_script')}
+              </Text>
+              <Switch checked={enableScript} onChange={onChangeSwitch} />
+            </View>
+          )}
           <Text type="H3" semibold>
             {t('how_to_start')}
           </Text>

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

@@ -1,26 +1,26 @@
 import React, { useCallback, useState } from 'react';
 import { View } from 'react-native';
 import ActionGroup from '../../../commons/ActionGroup';
-import { AccessibilityLabel } from '../../../configs/Constants';
-import { DetailHistoryChart } from './DetailHistoryChart';
-import CurrentRainSensor from '../../../commons/Device/RainningSensor/CurrentRainSensor';
-import PMSensorIndicator from '../../../commons/Device/PMSensor/PMSensorIndicator';
-import Anemometer from '../../../commons/Device/WindSpeed/Anemometer';
-import styles from '../styles';
-import Compass from '../../../commons/Device/WindDirection/Compass';
 import DeviceAlertStatus from '../../../commons/Device/DeviceAlertStatus';
-import FlatListItems from '../../../commons/Device/FlatListItems';
-import ListQualityIndicator from '../../../commons/Device/WaterQualitySensor/ListQualityIndicator';
-import EmergencyDetail from '../../../commons/Device/Emergency/EmergencyDetail';
 import EmergencyButton from '../../../commons/Device/Emergency/EmergencyButton';
+import EmergencyDetail from '../../../commons/Device/Emergency/EmergencyDetail';
+import FlatListItems from '../../../commons/Device/FlatListItems';
 import FooterInfo from '../../../commons/Device/FooterInfo';
+import PMSensorIndicator from '../../../commons/Device/PMSensor/PMSensorIndicator';
+import ProgressBar from '../../../commons/Device/ProgressBar';
+import CurrentRainSensor from '../../../commons/Device/RainningSensor/CurrentRainSensor';
+import ListQualityIndicator from '../../../commons/Device/WaterQualitySensor/ListQualityIndicator';
+import Compass from '../../../commons/Device/WindDirection/Compass';
+import Anemometer from '../../../commons/Device/WindSpeed/Anemometer';
 import MediaPlayerDetail from '../../../commons/MediaPlayerDetail';
-import SmartIr from '../../../screens/SmartIr';
+import { AccessibilityLabel } from '../../../configs/Constants';
 import { useSCContextSelector } from '../../../context';
 import { useRemoteControl } from '../../../hooks/IoT';
 import { useConfigGlobalState } from '../../../iot/states';
+import SmartIr from '../../../screens/SmartIr';
 import { useEvaluateValue } from '../hooks/useEvaluateValue';
-import ProgressBar from '../../../commons/Device/ProgressBar';
+import styles from '../styles';
+import { DetailHistoryChart } from './DetailHistoryChart';
 import VisualChart from './VisualChart';
 
 export const SensorDisplayItem = ({