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

package/src/commons/RowItem/styles.js

@@ -0,0 +1,53 @@
+import { Colors } from '../../configs';
+import { StyleSheet } from 'react-native';
+
+export default StyleSheet.create({
+  wrap: {
+    flex: 1,
+    backgroundColor: Colors.White,
+  },
+  columeFlex: {
+    paddingLeft: 16,
+    flexDirection: 'column',
+  },
+  rowFlex: {
+    flexDirection: 'row',
+  },
+  endFlex: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'flex-end',
+    paddingRight: 16,
+  },
+  Border: {
+    display: 'flex',
+    width: '100%',
+    borderWidth: 0,
+    borderColor: Colors.Gray4,
+    borderBottomWidth: 1,
+    borderStyle: 'solid',
+    flexDirection: 'row',
+    paddingTop: 16,
+    paddingBottom: 16,
+  },
+  titleName: {
+    fontSize: 16,
+    lineHeight: 24,
+    fontStyle: 'normal',
+    fontWeight: '400',
+    color: Colors.Gray9,
+  },
+  status: {
+    fontSize: 12,
+    lineHeight: 20,
+    fontStyle: 'normal',
+    fontWeight: '400',
+    color: Colors.Gray7,
+  },
+  container: {
+    paddingTop: 0,
+  },
+  paddingLeft16: {
+    paddingLeft: 16,
+  },
+});

package/src/commons/Sharing/WrapHeaderScrollable.js

@@ -14,82 +14,86 @@ import { Colors, Theme } from '../../configs';
 import HeaderAni, { heightHeader } from '../../commons/HeaderAni';
 import Text from '../../commons/Text';
 
-const WrapHeaderScrollable = memo(
-  ({
-    children,
-    title,
-    subTitle,
-    rightComponent,
-    loading = false,
-    onRefresh,
-    styleScrollView,
-    contentContainerStyle,
-    onLoadMore,
-    headerAniStyle,
-  }) => {
-    const animatedScrollYValue = useRef(new Animated.Value(0)).current;
-    const [loadingMore, setLoadingMore] = useState(false);
-    const loadMore = useCallback(() => {
-      if (onLoadMore) {
-        setLoadingMore(true);
-        onLoadMore(() => setLoadingMore(false));
-      }
-    }, [onLoadMore]);
+const WrapHeaderScrollable = ({
+  children,
+  title,
+  subTitle,
+  rightComponent,
+  loading = false,
+  onRefresh,
+  styleScrollView,
+  contentContainerStyle,
+  onLoadMore,
+  headerAniStyle,
+  headerAniCenterStyle,
+  onGoBack,
+}) => {
+  const animatedScrollYValue = useRef(new Animated.Value(0)).current;
+  const [loadingMore, setLoadingMore] = useState(false);
+  const loadMore = useCallback(() => {
+    if (onLoadMore) {
+      setLoadingMore(true);
+      onLoadMore(() => setLoadingMore(false));
+    }
+  }, [onLoadMore]);
 
-    return (
-      <SafeAreaView style={[styles.container, headerAniStyle]}>
-        <HeaderAni
-          scrollY={animatedScrollYValue}
-          title={title}
-          rightComponent={rightComponent}
-          headerStyle={headerAniStyle}
-        />
-        <Animated.ScrollView
-          scrollEventThrottle={16}
-          onScroll={Animated.event(
-            [{ nativeEvent: { contentOffset: { y: animatedScrollYValue } } }],
-            {
-              useNativeDriver: false,
-            }
-          )}
-          style={[styles.scrollView, styleScrollView]}
-          contentContainerStyle={[
-            styles.contentContainerStyle,
-            contentContainerStyle && contentContainerStyle,
-          ]}
-          refreshControl={
-            <RefreshControl
-              refreshing={loading}
-              onRefresh={onRefresh}
-              progressViewOffset={heightHeader}
-            />
+  return (
+    <SafeAreaView style={[styles.container, headerAniStyle]}>
+      <HeaderAni
+        scrollY={animatedScrollYValue}
+        title={title}
+        rightComponent={rightComponent}
+        headerAniCenterStyle={headerAniCenterStyle}
+        headerStyle={headerAniStyle}
+        onLeft={onGoBack}
+      />
+      <Animated.ScrollView
+        scrollEventThrottle={16}
+        onScroll={Animated.event(
+          [{ nativeEvent: { contentOffset: { y: animatedScrollYValue } } }],
+          {
+            useNativeDriver: false,
           }
-          contentInset={{
-            top: heightHeader - (isIphoneX() ? 32 : 0),
-          }}
-          contentOffset={{
-            y: -heightHeader,
-          }}
-          showsVerticalScrollIndicator={false}
-          onMomentumScrollEnd={loadMore}
-        >
-          {!!subTitle && (
-            <Text type={'Body'} color={Colors.Gray8} style={styles.subTitle}>
-              {subTitle}
-            </Text>
-          )}
-          {children}
-          {loadingMore && (
-            <View style={styles.bottomLoading}>
-              <ActivityIndicator size="small" color={Colors.Black} />
-            </View>
-          )}
-        </Animated.ScrollView>
-      </SafeAreaView>
-    );
-  }
-);
-export default WrapHeaderScrollable;
+        )}
+        style={[styles.scrollView, styleScrollView]}
+        contentContainerStyle={[
+          styles.contentContainerStyle,
+          contentContainerStyle && contentContainerStyle,
+        ]}
+        refreshControl={
+          <RefreshControl
+            refreshing={loading}
+            onRefresh={onRefresh}
+            progressViewOffset={heightHeader}
+          />
+        }
+        contentInset={{
+          top: heightHeader - (isIphoneX() ? 32 : 0),
+        }}
+        contentOffset={{
+          y: -heightHeader,
+        }}
+        showsVerticalScrollIndicator={false}
+        onMomentumScrollEnd={loadMore}
+      >
+        {!!subTitle && (
+          <Text type={'Body'} color={Colors.Gray8} style={styles.subTitle}>
+            {subTitle}
+          </Text>
+        )}
+        {children}
+        {loadingMore && (
+          <View style={styles.bottomLoading}>
+            <ActivityIndicator size="small" color={Colors.Black} />
+          </View>
+        )}
+      </Animated.ScrollView>
+    </SafeAreaView>
+  );
+};
+
+export default memo(WrapHeaderScrollable);
+
 const styles = StyleSheet.create({
   container: {
     flex: 1,

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

@@ -15,83 +15,87 @@ import { useTranslations } from '../../../hooks/Common/useTranslations';
 import { useNavigation } from '@react-navigation/native';
 import Routes from '../../../utils/Route';
 import { useGetIdUser } from '../../../hooks/Common';
-import { TESTID } from '../../../configs/Constants';
+import { AUTOMATE_TYPE, TESTID } from '../../../configs/Constants';
 
-const ItemOneTap = memo(({ isOwner, automate, unit }) => {
-  const { navigate } = useNavigation();
-  const { id, type, user, script, activate_at } = automate;
-  const t = useTranslations();
-  const idUser = useGetIdUser();
+const ItemOneTap = memo(
+  ({ isOwner, automate, unit, wrapSyles, onPressItem }) => {
+    const { navigate } = useNavigation();
+    const { id, type, user, script, activate_at } = automate;
+    const t = useTranslations();
+    const idUser = useGetIdUser();
 
-  const goToDetail = useCallback(() => {
-    navigate(Routes.ScriptDetail, {
-      id,
-      name: script?.name,
-      type: type,
-      havePermission: isOwner || user === idUser,
-      unit,
-    });
-  }, [isOwner, user, idUser, navigate, id, script, type, unit]);
+    const goToDetail = useCallback(() => {
+      navigate(Routes.ScriptDetail, {
+        id,
+        name: script?.name,
+        type: type,
+        havePermission: isOwner || user === idUser,
+        unit,
+      });
+    }, [isOwner, user, idUser, navigate, id, script, type, unit]);
 
-  const handleScriptAction = useCallback(async () => {
-    const { success } = await axiosPost(API.AUTOMATE.ACTION_ONE_TAP(id));
-    if (success) {
-      ToastBottomHelper.success(t('Activated successfully.'));
-    } else {
-      ToastBottomHelper.error(t('Activation failed.'));
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [id]);
+    const handleScriptAction = useCallback(async () => {
+      const { success } = await axiosPost(API.AUTOMATE.ACTION_ONE_TAP(id));
+      if (success) {
+        ToastBottomHelper.success(t('Activated successfully.'));
+      } else {
+        ToastBottomHelper.error(t('Activation failed.'));
+      }
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [id]);
 
-  const displayIcon = () => {
-    const iconKit = script?.icon_kit;
-    return iconKit ? (
-      <FImage source={{ uri: iconKit }} style={styles.iconSensor} />
-    ) : (
-      <OneTap />
-    );
-  };
-  const activateAt = activate_at
-    ? timeDifference(new Date(), moment(activate_at), true)
-    : null;
-  return (
-    <TouchableWithoutFeedback onPress={goToDetail}>
-      <View style={styles.container}>
-        <View style={styles.boxIcon}>
-          {displayIcon()}
-          <TouchableOpacity
-            testID={TESTID.AUTOMATE_SCRIPT_ACTION}
-            onPress={handleScriptAction}
-          >
-            <CheckCircle />
-          </TouchableOpacity>
-        </View>
-        <TouchableOpacity testID={TESTID.GO_DETAIL} onPress={goToDetail}>
-          <Text
-            numberOfLines={1}
-            semibold
-            size={14}
-            color={Colors.Gray9}
-            type="Body"
-          >
-            {script?.name}
-          </Text>
-          <View style={styles.descriptionContainer}>
+    const displayIcon = () => {
+      const iconKit = script?.icon_kit;
+      return iconKit ? (
+        <FImage source={{ uri: iconKit }} style={styles.iconSensor} />
+      ) : (
+        <OneTap />
+      );
+    };
+    const activateAt = activate_at
+      ? timeDifference(new Date(), moment(activate_at), true)
+      : null;
+    return (
+      <TouchableWithoutFeedback onPress={onPressItem || goToDetail}>
+        <View style={[styles.container, wrapSyles]}>
+          <View style={styles.boxIcon}>
+            {displayIcon()}
+            {type === AUTOMATE_TYPE.ONE_TAP && (
+              <TouchableOpacity
+                testID={TESTID.AUTOMATE_SCRIPT_ACTION}
+                onPress={handleScriptAction}
+              >
+                <CheckCircle />
+              </TouchableOpacity>
+            )}
+          </View>
+          <TouchableOpacity testID={TESTID.GO_DETAIL} onPress={goToDetail}>
             <Text
               numberOfLines={1}
               semibold
-              size={12}
-              color={Colors.Gray8}
-              type="Label"
+              size={14}
+              color={Colors.Gray9}
+              type="Body"
             >
-              {activateAt && t('activated_time', { time: activateAt })}
+              {script?.name}
             </Text>
-            <IconOutline name="right" size={12} />
-          </View>
-        </TouchableOpacity>
-      </View>
-    </TouchableWithoutFeedback>
-  );
-});
+            <View style={styles.descriptionContainer}>
+              <Text
+                numberOfLines={1}
+                semibold
+                size={12}
+                color={Colors.Gray8}
+                type="Label"
+              >
+                {activateAt && t('activated_time', { time: activateAt })}
+              </Text>
+              <IconOutline name="right" size={12} />
+            </View>
+          </TouchableOpacity>
+        </View>
+      </TouchableWithoutFeedback>
+    );
+  }
+);
 
 export default ItemOneTap;

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

@@ -117,7 +117,8 @@ describe('test Item', () => {
     });
   });
 
-  test('render SubUnitAutomate handleScriptAction fail', async () => {
+  test('render SubUnitAutomate not is owner handleScriptAction fail', async () => {
+    data.isOwner = false;
     const response = {
       status: 400,
     };
@@ -146,4 +147,49 @@ describe('test Item', () => {
       visibilityTime: 1000,
     });
   });
+
+  test('render SubUnitAutomate script value_change', async () => {
+    data.isOwner = false;
+    data.type = 'value_change';
+    data.automates = [
+      {
+        id: 1,
+        user: 6,
+        type: 'value_change',
+        activate_at: null,
+        script: {
+          name: 'Rain',
+          icon: '',
+          icon_kit: 'https://www.figma.com/',
+        },
+      },
+    ];
+    const response = {
+      status: 200,
+    };
+
+    axios.post.mockImplementation(async () => {
+      return response;
+    });
+
+    await act(async () => {
+      tree = await create(wrapComponent(data));
+    });
+
+    const goDetail = tree.root.findAll(
+      (el) =>
+        el.props.testID === TESTID.GO_DETAIL && el.type === TouchableOpacity
+    );
+    expect(goDetail).toHaveLength(1);
+    await act(async () => {
+      await goDetail[0].props.onPress();
+    });
+    expect(mockedNavigate).toHaveBeenCalledWith(Routes.ScriptDetail, {
+      havePermission: false,
+      id: 1,
+      name: 'Rain',
+      type: 'value_change',
+      unit: undefined,
+    });
+  });
 });

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

@@ -10,7 +10,7 @@ import { useNavigation } from '@react-navigation/native';
 import Routes from '../../../utils/Route/index.js';
 import { AUTOMATE_TYPE } from '../../../configs/Constants';
 
-const SubUnitAutomate = ({ isOwner, type, automates, unit }) => {
+const SubUnitAutomate = ({ isOwner, type, automates, unit, isScript }) => {
   const t = useTranslations();
   const { navigate } = useNavigation();
   const handleOnAddNew = () => {
@@ -19,7 +19,7 @@ const SubUnitAutomate = ({ isOwner, type, automates, unit }) => {
         navigate(Routes.AddNewOneTap, { type: type, unit });
         break;
       case AUTOMATE_TYPE.VALUE_CHANGE:
-        navigate(Routes.AddNewAutoSmart, { type: type });
+        navigate(Routes.AddNewAutoSmart, { type, unit, isScript });
         break;
     }
   };