initalCommit

Author: pavan709

.expo-shared/assets.json

@@ -0,0 +1,4 @@
+{
+  "12bb71342c6255bbf50437ec8f4441c083f47cdb74bd89160c15e4f43e52a1cb": true,
+  "40b842e832070c58deac6aa9e08fa459302ee3f9da492c7e77d93d2fbf4a56fd": true
+}

.gitignore

@@ -0,0 +1,13 @@
+node_modules/
+.expo/
+npm-debug.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+*.orig.*
+web-build/
+
+# macOS
+.DS_Store

App.js

@@ -0,0 +1,61 @@
+import 'react-native-gesture-handler';
+import React, {  useState } from 'react';
+import { StyleSheet} from 'react-native';
+import { createStore, combineReducers, applyMiddleware } from 'redux';
+import { Provider } from 'react-redux';
+import productsReducer from './store/reducers/products';
+import cartReducer from './store/reducers/cart';
+import orderReducer from './store/reducers/orders';
+import authReducer from './store/reducers/auth';
+import AppNavigator from './navigation/AppNavigator';
+import * as Font from 'expo-font';
+import AppLoading from 'expo-app-loading';
+import ReduxThunk from 'redux-thunk';
+
+
+
+
+
+
+const rootReducer = combineReducers({
+  products: productsReducer,
+  cart: cartReducer,
+  orders: orderReducer,
+  auth: authReducer
+})
+
+const store = createStore(rootReducer, applyMiddleware(ReduxThunk));
+
+const fetchFonts = () => {
+  return Font.loadAsync({
+    'open-sans': require('./assets/fonts/OpenSans-Regular.ttf'),
+    'open-sans-bold': require('./assets/fonts/OpenSans-Bold.ttf'),
+  })
+}
+
+export default function App() {
+
+  const [fontLoaded, setFontLoaded] = useState(false);
+
+
+  if (!fontLoaded) {
+    return <AppLoading startAsync={fetchFonts} onFinish={() => setFontLoaded(true)} onError={(err) => console.log(err)} />
+  }
+
+
+
+  return (
+    <Provider store={store}>
+      <AppNavigator />
+    </Provider>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#fff',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+});

app.json

@@ -0,0 +1,49 @@
+{
+  "expo": {
+    "name": "React Native Shop",
+    "slug": "react-native-shop",
+
+
+    "version": "1.0.0",
+
+    "description":"this is description only show in the expo cloud",
+    "orientation": "portrait",
+
+
+    "icon": "./assets/icon.png",
+    "splash": {
+      "image": "./assets/splash.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+
+    "updates": {
+      "fallbackToCacheTimeout": 0
+    },
+
+    "assetBundlePatterns": [
+      "**/*"
+    ],
+    "ios": {
+      "bundleIdentifier": "com.pavan709.react-native-shop",
+      "supportsTablet": true,
+      "buildNumber":"1.0.0"
+
+    },
+    "android": {
+      "package":"com.pavan709.react_native_shop",
+      "versionCode":1,
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#FFFFFF"
+      },
+       "permissions":[]
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    }
+
+  }
+}
+
+

assets/adaptive-icon.png

@@ -0,0 +1,6 @@
+module.exports = function(api) {
+  api.cache(true);
+  return {
+    presets: ['babel-preset-expo'],
+  };
+};

assets/favicon.png

@@ -0,0 +1,22 @@
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+
+const Card = props => {
+   return <View style={{...styles.card, ...props.style}}>
+        {props.children}
+    </View>
+}
+
+const styles = StyleSheet.create({
+    card:{
+        shadowColor: 'black',
+        shadowOpacity: 0.26,
+        shadowOffset: { width: 0, height: 2 },
+        shadowRadius:8,
+        elevation: 5,
+        borderRadius: 10,
+        backgroundColor: 'white',
+    }
+})
+
+export default Card;

assets/fonts/OpenSans-Bold.ttf

@@ -0,0 +1,14 @@
+import React from 'react';
+import { HeaderButton } from 'react-navigation-header-buttons';
+import Colors from '../../constants/Colors';
+import { Platform } from 'react-native';
+import {Ionicons} from '@expo/vector-icons';
+const CustomHeaderButton = props => {
+    return <HeaderButton 
+    {...props} 
+    IconComponent={Ionicons} 
+    iconSize={23} 
+    color={Platform.OS === 'android' ? 'white' : Colors.blue12} />
+}
+
+export default CustomHeaderButton;

assets/fonts/OpenSans-Regular.ttf

@@ -0,0 +1,114 @@
+import React, { useReducer, useEffect } from 'react';
+import { View, Text, TextInput, StyleSheet } from 'react-native';
+import Colors from '../../constants/Colors';
+import { Entypo } from '@expo/vector-icons'; 
+
+const INPUT_CHANGE = 'INPUT_CHANGE';
+const INPUT_BLUR = 'INPUT_BLUR';
+
+const inputReducer = (state, action) => {
+    switch (action.type) {
+        case INPUT_CHANGE:
+            return {
+                ...state,
+                value: action.value,
+                isValid: action.isValid,
+                touched:action.isTouched,
+            };
+        case INPUT_BLUR:
+            return {
+                ...state,
+                touched: true
+            };
+        default:
+            return state;
+    }
+};
+
+const Input = props => {
+    const [inputState, dispatch] = useReducer(inputReducer, {
+        value: props.initialValue ? props.initialValue : '',
+        isValid: props.initiallyValid,
+        touched: false
+    });
+
+    const { onInputChange, id } = props;
+
+    useEffect(() => {
+        if (inputState.touched) {
+            onInputChange(id, inputState.value, inputState.isValid);
+        }
+    }, [inputState, onInputChange, id]);
+
+    const textChangeHandler = text => {
+        const emailRegex = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        let isValid = true;
+        if (props.required && text.trim().length === 0) {
+            isValid = false;
+        }
+        if (props.email && !emailRegex.test(text.toLowerCase())) {
+            isValid = false;
+        }
+        if (props.min && (+text < props.min || isNaN(text))) {
+            isValid = false;
+        }
+        if (props.max != null && +text > props.max) {
+            isValid = false;
+        }
+        if (props.minLength != null && text.length < props.minLength) {
+            isValid = false;
+        }
+        dispatch({ type: INPUT_CHANGE, value: text, isValid: isValid, isTouched:true });
+    };
+
+    const lostFocusHandler = () => {
+        dispatch({ type: INPUT_BLUR });
+    };
+
+    return (
+            <View style={styles.formControl}>
+                <Text style={styles.label}>{props.label}</Text>
+                <TextInput
+                    {...props}
+                    style={{...styles.input,borderColor: (inputState.touched ? inputState.isValid ? Colors.green1 : Colors.red1 : Colors.fancy12),}}
+                    value={inputState.value}
+                    onChangeText={textChangeHandler}
+                />
+                {inputState.touched && !inputState.isValid && (
+                    <View style={styles.errorContainer}>
+                        {/* <Entypo name="circle-with-cross" size={19} color={Colors.red1} /> */}
+                        <Text style={styles.errorText}>{props.errorText}</Text>
+                    </View>
+                )}
+            </View>
+    );
+};
+
+const styles = StyleSheet.create({
+    formControl: {
+        width: '100%'
+    },
+    label: {
+        fontFamily: 'open-sans-bold',
+        marginVertical: 8
+    },
+    input: {
+        paddingHorizontal: 2,
+        paddingVertical: 5,
+        borderWidth:1,
+        borderRadius:4,
+        
+    },
+    errorContainer: {
+        marginVertical: 5,
+        flexDirection:'row',
+        justifyContent:'space-between',
+    },
+    errorText: {
+        fontFamily: 'open-sans',
+        color: 'red',
+        fontSize: 13
+    }
+});
+
+export default Input;

assets/icon.png

@@ -0,0 +1,50 @@
+import React from "react";
+import { View, Text, StyleSheet, Platform, TouchableOpacity, TouchableNativeFeedback } from 'react-native';
+import { Ionicons } from "@expo/vector-icons";
+
+const CartItem = props => {
+    return (
+        <View style={styles.cartItem}>
+            <Text style={styles.itemData}>
+                <Text style={styles.quantity}>{props.quantity} </Text> <Text style={styles.mainText}>{props.title}</Text>
+            </Text>
+
+            <View style={styles.itemData}>
+                <Text style={styles.mainText}>${props.amount.toFixed(2)}</Text>
+
+                {props.deletable && <TouchableOpacity onPress={props.onRemove} style={styles.deleteButton}>
+                    <Ionicons name={Platform.OS === 'android' ? 'md-trash' : 'ios-trash'} size={23} color='red' />
+                </TouchableOpacity>}
+            </View>
+        </View>
+    )
+}
+
+const styles = StyleSheet.create({
+    cartItem: {
+        padding: 10,
+        backgroundColor: 'white',
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+        marginVertical: 20,
+    },
+    itemData: {
+        flexDirection: 'row',
+        alignItems: 'center',
+    },
+    quantity: {
+        fontFamily: 'open-sans',
+        color: '#888',
+        fontSize: 16,
+    },
+    mainText: {
+        fontFamily: 'open-sans-bold',
+        fontSize: 16,
+    },
+    delete: {},
+    deleteButton: {
+        marginLeft: 20,
+    },
+})
+
+export default CartItem;