edited

app/components/Public/commonTextInput.js

@@ -0,0 +1,53 @@
+import React from "react";
+import { TextInput, View } from "react-native";
+import { scale, verticalScale, moderateScale } from "react-native-size-matters";
+import Size from "../../config/size";
+const size = new Size();
+import theme from "../../config/colors";
+import { width, height } from "../../config/screen";
+import {Fonts} from "../../config/fonts"
+
+const CommonTextInput = props => {
+  return (
+    <View
+      style={{
+        backgroundColor: theme.inputBgc,
+        marginLeft: 20,
+        marginRight: 20,
+        marginTop: 30,
+        height: verticalScale(40),
+        borderRadius:5
+      }}
+    >
+      <TextInput
+        style={{
+          // backgroundColor:theme.inputBgc,
+          color: theme.foodNameColor,
+          height: verticalScale(35),
+          marginBottom: moderateScale(30),
+          paddingBottom:0,
+          fontSize: size.getSize(15),
+          paddingRight: 20,
+          paddingLeft: 20,
+          fontFamily:Fonts.century
+        }}
+        key = {props.key}
+        value={props.value}
+        underlineColorAndroid="rgba(0,0,0,0)"
+        onChangeText={props.onChangeText}
+        placeholder={props.placeholder}
+        placeholderStyle={{fontWeight: 'bold',  fontFamily:Fonts.century}}
+        placeholderTextColor = {theme.foodNameColor}
+        secureTextEntry={props.secureTextEntry}
+        blurOnSubmit={false}
+        {...props}
+        ref={(input) => props.inputRef && props.inputRef(input)}
+        returnKeyType = {props.returnKeyType}
+        onSubmitEditing = {props.onSubmitEditing && props.onSubmitEditing}
+        onFocus={props.onFocus}
+      />
+    </View>
+  );
+};
+
+export default CommonTextInput;

app/components/Public/commonTextView.js

@@ -0,0 +1,61 @@
+import React from "react";
+import { View, TextInput, TouchableOpacity } from "react-native";
+import Text from "react-native-text";
+import { scale, verticalScale, moderateScale } from "react-native-size-matters";
+import Size from "../../config/size";
+import { Fonts } from "../../config/fonts";
+import theme from "../../config/colors";
+const size = new Size();
+import { width, height } from "../../config/screen";
+
+const CommonTextView = props => {
+  return (
+    <View
+      style={{
+        borderBottomColor: "black",
+        borderBottomWidth: 1,
+        marginTop: 15,
+        marginBottom: 10,
+        width: "70%"
+      }}
+    >
+      <Text
+        style={{
+          color: theme.coolGrey,
+          fontFamily: Fonts.century,
+          fontSize: 13
+        }}
+      >
+        {props.title}
+      </Text>
+      {!props.input ? (
+        <Text
+          style={{
+            marginTop: 5,
+            color: theme.coolGrey,
+            fontFamily: Fonts.century,
+            fontSize: 13
+          }}
+        >
+          {props.content}
+        </Text>
+      ) : (
+        <View style={{ flexDirection: "row", justifyContent: "space-between" }}>
+          <TextInput placeholder={"text here"} />
+          <TouchableOpacity
+            style={{
+              justifyContent: "center",
+              alignItems: "center",
+              borderWidth: 1,
+              borderColor: "black"
+            }}
+          >
+            <Text>{props.buttonTitle}</Text>
+          </TouchableOpacity>
+        </View>
+      )}
+    </View>
+  );
+};
+
+export default CommonTextView;

app/components/Public/drawerNavigationHeader.js

@@ -0,0 +1,75 @@
+import React, { Component } from 'react';
+import { Platform, StyleSheet, View, TouchableOpacity } from 'react-native';
+import { scale, verticalScale, moderateScale } from 'react-native-size-matters';
+import Icon from 'react-native-vector-icons/dist/Ionicons';
+import Icon2 from 'react-native-vector-icons/dist/MaterialCommunityIcons';
+import Text from 'react-native-text';
+//function
+import { width, height } from '../../config/screen';
+import Size from '../../config/size'
+const size = new Size;
+
+export default class DrawerNavigationHeader extends Component {
+
+
+    logoutIcon() {
+        if (this.props.logout == true) {
+          return(
+            <Icon2 name="logout-variant" size={size.getSize(50)} color='black' 
+            onPress = {()=> this.props.onPress && this.props.onPress()} />
+          )
+        }
+    }
+
+    render() {
+        return (
+            <View style={{
+                width: width,
+                height: '10%',
+                alignItems: 'center',
+                justifyContent: 'center',
+                marginTop: 20,
+                flexDirection: 'row',
+            }}>
+
+                <View style={{
+                    width: '30%',
+                    height: '100%',
+                    justifyContent: 'center',
+                    paddingLeft:5,
+                }}>
+
+                    <Icon name="md-menu" size={size.getSize(50)} color='black'
+                        onPress={() => { this.props.navigation.navigate('DrawerOpen'); }} />
+                </View>
+
+                <View style={{
+                    width: '40%',
+                    height: '100%',
+                    justifyContent: 'center',
+                    alignItems: 'center'
+                }}>
+                    <Text style={{ fontSize: 22, }}>
+                        {this.props.title}
+                    </Text>
+
+                </View>
+
+                <View style={{
+                    width: '30%',
+                    paddingRight: 5,
+                    height: '100%',
+                    flexDirection: 'row',
+                    justifyContent: 'flex-end',
+                    alignItems: 'center'
+                }}>
+
+                    {this.logoutIcon()}
+
+                </View>
+
+            </View>
+        );
+    }
+}
+

app/components/Public/header.js

@@ -0,0 +1,48 @@
+import React, {Component} from 'react';
+import {Platform, StyleSheet, View, TouchableOpacity} from 'react-native';
+import {scale, verticalScale, moderateScale } from 'react-native-size-matters';
+import Icon from 'react-native-vector-icons/dist/Ionicons';
+import Text from 'react-native-text';
+import { width, height } from '../../config/screen';
+import Size from '../../config/size'
+const size = new Size;
+export default class Header extends Component {
+
+  backAction(){
+    if(this.props.login){
+      this.props.navigation.navigate('menu')
+    }else{
+      this.props.navigation.goBack()
+    }
+  }
+
+  render() {
+    return (
+      <View style={{width:width,height:verticalScale(70),alignItems:'center',
+      justifyContent:'center', marginTop:20}}>
+        <Text style = {{fontSize: 22,}}>
+        {this.props.title}
+        </Text>
+        { !this.props.order?(
+        <TouchableOpacity
+         style = {{position: 'absolute', left:scale(5),width:scale(40),
+         height:scale(40),alignItems:'center',justifyContent: 'center',}}
+         onPress = {()=>this.backAction()}>
+        <Icon name="ios-arrow-back-outline" size={size.getSize(40)} color={'black'}
+       /> 
+    </TouchableOpacity>
+        ):(
+          <TouchableOpacity
+          style = {{position: 'absolute', left:scale(5),width:scale(40),
+          height:scale(40),alignItems:'center',justifyContent: 'center',}}
+          onPress = {()=> this.props.onPress && this.props.onPress()} >
+         <Icon name="ios-arrow-back-outline" size={size.getSize(40)} color={'black'}
+        /> 
+     </TouchableOpacity>
+        )
+        }
+      </View>
+    );
+  }
+}
+

app/components/Public/loader.js

@@ -0,0 +1,50 @@
+import React, { Component } from 'react';
+import {
+  StyleSheet,
+  View,
+  Modal,
+  ActivityIndicator
+} from 'react-native';
+
+const Loader = props => {
+  const {
+    loading,
+    ...attributes
+  } = props;
+
+  return (
+    <Modal
+      transparent={true}
+      animationType={'none'}
+      visible={loading}
+      onRequestClose={() => {console.log('c lose modal')}}>
+      <View style={styles.modalBackground}>
+        <View style={styles.activityIndicatorWrapper}>
+          <ActivityIndicator
+            animating={loading} />
+        </View>
+      </View>
+    </Modal>
+  )
+}
+
+const styles = StyleSheet.create({
+  modalBackground: {
+    flex: 1,
+    alignItems: 'center',
+    flexDirection: 'column',
+    justifyContent: 'space-around',
+    backgroundColor: '#00000040'
+  },
+  activityIndicatorWrapper: {
+    backgroundColor: '#FFFFFF',
+    height: 100,
+    width: 100,
+    borderRadius: 10,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-around'
+  }
+});
+
+export default Loader;

app/components/Public/signInUpHeader.js

@@ -0,0 +1,64 @@
+import React, { Component } from "react";
+import {
+  Platform,
+  StyleSheet,
+  View,
+  TouchableOpacity,
+  Image
+} from "react-native";
+import { scale, verticalScale, moderateScale } from "react-native-size-matters";
+import Icon from "react-native-vector-icons/dist/MaterialCommunityIcons";
+import Text from "react-native-text";
+import { width, height } from "../../config/screen";
+import Size from "../../config/size";
+import theme from "../../config/colors";
+const size = new Size();
+export default class SignInUpHeader extends Component {
+  backAction() {
+    this.props.navigation.goBack();
+  }
+
+  render() {
+    return (
+      <View
+        style={{
+          ...Platform.select({
+            ios: {
+              height: verticalScale(100)
+            },
+            android: {
+              height: verticalScale(130)
+            }
+          }),
+          alignItems: "center",
+          justifyContent: "center",
+          backgroundColor: theme.mainColor
+        }}
+      >
+        <Image
+          style={{
+            tintColor: "white",
+            height: verticalScale(70),
+            width: scale(70)
+          }}
+          source={require("../../images/appicon.png")}
+          resizeMode={"contain"}
+        />
+        <View style={{ position: "absolute", left: 10 }}>
+          {this.props.back ? (
+            <Icon
+              name="chevron-left"
+              size={size.getSize(40)}
+              color={'white'}
+              style={{ marginLeft: 10 }}
+              onPress={() => this.backAction()}
+            />
+     
+          ) : (
+            <View />
+          )}
+        </View>
+      </View>
+    );
+  }
+}

app/components/Public/statusBar.js

@@ -0,0 +1,30 @@
+import React, { Component } from 'react';
+import {
+  StyleSheet,
+  View,
+  StatusBar,
+  Platform,
+} from 'react-native';
+import { ifIphoneX } from 'react-native-iphone-x-helper'
+import { scale, verticalScale, moderateScale } from "react-native-size-matters";
+const MyStatusBar = ({backgroundColor, ...props}) => (
+    <View style={[styles.statusBar, { backgroundColor }]}>
+      <StatusBar translucent backgroundColor={backgroundColor} {...props} />
+    </View>
+)
+
+ 
+const STATUSBAR_HEIGHT = Platform.OS === 'ios' ?verticalScale(10)  : StatusBar.height;
+const APPBAR_HEIGHT = Platform.OS === 'ios' ? verticalScale(44) : verticalScale(56);
+const styles = StyleSheet.create({
+    statusBar: {
+      ...ifIphoneX({
+        height:0,
+      },
+        {
+          height:15,
+      })
+      },
+})
+
+export default MyStatusBar;