Merge pull request #14 from CloudGakkai/development

Release v1.0

App/Components/ArrowBack.js

@@ -1,7 +1,7 @@
 import React, {useContext} from 'react'
 import { View, TouchableOpacity } from 'react-native'
 import Icon from "react-native-vector-icons/Feather"
-import {NavigationContext} from "react-navigaton";
+import {NavigationContext} from "react-navigation";
 
 import { apply } from "../Lib/OsmiProvider";
 import styles from './Styles/ArrowBackStyle'
@@ -12,7 +12,7 @@ const ArrowBack = (props) => {
 
   return (
     <TouchableOpacity activeOpacity={0.9} style={styles.container} onPress={() => navigation.goBack()}>
-      <Icon name="chevron-left" size={25} color={apply('gray-900')} />
+      <Icon name="chevron-left" size={35} color={apply('gray-900')} />
     </TouchableOpacity>
   )
 }

App/Components/Button.js

@@ -0,0 +1,14 @@
+import React from 'react'
+import { TouchableOpacity, Text } from 'react-native'
+
+const Button = (props) => {
+  const { textStyle, text, ...restProps } = props
+
+  return (
+    <TouchableOpacity activeOpacity={0.9} {...restProps}>
+      <Text style={textStyle}>{text}</Text>
+    </TouchableOpacity>
+  )
+}
+
+export default Button

App/Components/CardProduct.js

@@ -0,0 +1,25 @@
+import React, { memo, useContext, useState } from 'react'
+import { TouchableOpacity,Image, View, Text } from 'react-native'
+
+import styles from './Styles/CardProduct'
+import { NavigationContext } from "react-navigation"
+import Format from '../Lib/NumberFormat'
+
+const CardProduct = (props) => {
+  const [width, setWidth] = useState(0)
+  const [height, setHeight] = useState(0)
+  const {item, ...restProps} = props
+  const navigation = useContext(NavigationContext)
+
+  return (
+    <TouchableOpacity activeOpacity={0.9} style={styles.card} {...restProps}>
+      <Image source={{ uri: item?.thumbnail }} style={styles.thumb} resizeMode="cover" />
+      <View style={styles.content}>
+        <Text style={styles.price}>{'Rp' + new Format().formatMoney(item?.price ?? 0)}</Text>
+        <Text style={styles.title}>{item?.title}</Text>
+      </View>
+    </TouchableOpacity>
+  )
+}
+
+export default memo(CardProduct)

App/Components/Stories.js

@@ -1,4 +0,0 @@
-import './AlertMessage.story'
-import './DrawerButton.story'
-import './FullButton.story'
-import './RoundedButton.story'

App/Components/Styles/ArrowBackStyle.js

@@ -1,5 +1,5 @@
 import { connect } from "../../Lib/OsmiProvider"
 
 export default connect({
-  container: 'px-5'
+  container: 'pl-3 pr-0'
 })

App/Components/Styles/ButtonStyle.js

@@ -0,0 +1,7 @@
+import { StyleSheet } from 'react-native'
+
+export default StyleSheet.create({
+  container: {
+    flex: 1
+  }
+})

App/Components/Styles/CardProduct.js

@@ -0,0 +1,11 @@
+import { connect } from "../../Lib/OsmiProvider"
+
+export default connect({
+  card: "bg-white rounded-md shadow-sm flex items-start justify-center mx-0.5 my-0.5",
+  thumb: "rounded-t-md full h-150 self-center",
+  content: "flex flex-wrap p-2",
+  title: "text-base font-bold mb-1",
+  price: "text-sm my-1 text-blue-500 font-bold",
+  btnBuy: "bg-blue-500 self-center rounded-md px-3 py-1",
+  btnBuyLabel: "text-white font-bold text-center"
+})