Some refactoring and a new screen

uilian · Oct 1, 2017 · fb3ffec · fb3ffec
1 parent 95970d8
commit fb3ffec
Show file tree

Hide file tree

Showing 7 changed files with 79 additions and 38 deletions.
diff --git a/src/components/EmployeeCreate.js b/src/components/EmployeeCreate.js
@@ -0,0 +1,21 @@
+import React, { Component } from 'react';
+import { View, Text } from 'react-native';
+
+class EmployeeCreate extends Component {
+  static navigationOptions = {
+    title: 'Create Employee',
+    //header: null,
+  };
+
+  render() { 
+    return (
+        <View>
+          <Text>
+            Employee Form
+          </Text>
+        </View>
+    );
+  }
+}
+
+export default EmployeeCreate;
diff --git a/src/components/EmployeeDetail.js b/src/components/EmployeeDetail.js
diff --git a/src/components/EmployeeList.js b/src/components/EmployeeList.js
@@ -1,13 +1,22 @@
 import React, { Component } from 'react';
-import { View, Text } from 'react-native';
+import { View, Text, TouchableOpacity } from 'react-native';
+import { NavigationActions } from 'react-navigation';
+import Icon from 'react-native-vector-icons/FontAwesome';
 
-const EmployeeList = () => {
-  const navigationOptions = {
+
+class EmployeeList extends Component {
+  static navigationOptions = {
     title: 'Employee List',
+    headerRight: 
+      <TouchableOpacity style={{ marginLeft: 5, marginRight: 5 }}
+        onPress={() => NavigationActions.navigate({routeName: 'EmployeeCreate'})} >
+        <Icon name="plus" size={30} color="#3b5998" />
+      </TouchableOpacity>,
     //header: null,
   };
 
-  return (
+  render() { 
+    return (
       <View>
         <Text>
           Employee
@@ -22,7 +31,9 @@ const EmployeeList = () => {
           Employee
         </Text>
       </View>
-  );
-};
+    );
+  }
+}
+
 
 export default EmployeeList;
diff --git a/src/components/LoginForm.js b/src/components/LoginForm.js
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { Text, TouchableOpacity } from 'react-native';
 import { connect } from 'react-redux';
-import Icon from 'react-native-vector-icons/FontAwesome';
+//import Icon from 'react-native-vector-icons/FontAwesome';
 
 import { emailChanged, passwordChanged, loginUser } from '../actions';
 import { Card, CardSection, Input, Button, Spinner } from './common';
@@ -10,6 +10,7 @@ import { Card, CardSection, Input, Button, Spinner } from './common';
 class LoginForm extends Component {
   static navigationOptions = {
     title: 'Please Log In',
+    header: null
     // headerLeft: 
     //   <TouchableOpacity style={{ marginLeft: 5, marginRight: 5 }}>
     //     <Icon name="rocket" size={30} color="#3b5998" />

diff --git a/src/navigation/EmployeeNav.js b/src/navigation/EmployeeNav.js
@@ -1,10 +1,10 @@
 import { StackNavigator } from 'react-navigation';
 import EmployeeList from '../components/EmployeeList';
-import EmployeeDetail from '../components/EmployeeDetail';
+import EmployeeCreate from '../components/EmployeeCreate';
 
 const routes = {
   EmployeeList: { screen: EmployeeList },
-  EmployeeDetail: { screen: EmployeeDetail }
+  EmployeeCreate: { screen: EmployeeCreate }
 };
 
 const stackNavigatorConfiguration = {

diff --git a/src/navigation/RootNav.js b/src/navigation/RootNav.js
@@ -12,7 +12,7 @@ const routes = {
 };
 
 const stackNavigatorConfiguration = {
-  initialRouteName: 'LoginForm'  
+  initialRouteName: 'LoginForm',  
 };
 
 const RootStack = StackNavigator(routes, stackNavigatorConfiguration);

diff --git a/yarn.lock b/yarn.lock
@@ -1428,6 +1428,10 @@ decamelize@^1.0.0, decamelize@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
 
+deep-diff@^0.3.5:
+  version "0.3.8"
+  resolved "https://registry.yarnpkg.com/deep-diff/-/deep-diff-0.3.8.tgz#c01de63efb0eec9798801d40c7e0dae25b582c84"
+
 deep-extend@~0.4.0:
   version "0.4.2"
   resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.4.2.tgz#48b699c27e334bf89f10892be432f6e4c7d34a7f"
@@ -4113,6 +4117,14 @@ react-native-tab-view@^0.0.65:
   dependencies:
     prop-types "^15.5.8"
 
+react-native-vector-icons@^4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/react-native-vector-icons/-/react-native-vector-icons-4.4.0.tgz#cdfc1cd86ab495b2a4926bcec8f08c155475cbf1"
+  dependencies:
+    lodash "^4.0.0"
+    prop-types "^15.5.10"
+    yargs "^8.0.2"
+
 [email protected]:
   version "0.48.4"
   resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.48.4.tgz#f305e9fef069a5b3f6a7250ddd50f603cf30ab2d"
@@ -4328,6 +4340,12 @@ rechoir@^0.6.2:
   dependencies:
     resolve "^1.1.6"
 
+redux-logger@^3.0.6:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/redux-logger/-/redux-logger-3.0.6.tgz#f7555966f3098f3c88604c449cf0baf5778274bf"
+  dependencies:
+    deep-diff "^0.3.5"
+
 redux-thunk@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.2.0.tgz#e615a16e16b47a19a515766133d1e3e99b7852e5"
@@ -5371,6 +5389,24 @@ yargs@^6.4.0:
     y18n "^3.2.1"
     yargs-parser "^4.2.0"
 
+yargs@^8.0.2:
+  version "8.0.2"
+  resolved "https://registry.yarnpkg.com/yargs/-/yargs-8.0.2.tgz#6299a9055b1cefc969ff7e79c1d918dceb22c360"
+  dependencies:
+    camelcase "^4.1.0"
+    cliui "^3.2.0"
+    decamelize "^1.1.1"
+    get-caller-file "^1.0.1"
+    os-locale "^2.0.0"
+    read-pkg-up "^2.0.0"
+    require-directory "^2.1.1"
+    require-main-filename "^1.0.1"
+    set-blocking "^2.0.0"
+    string-width "^2.0.0"
+    which-module "^2.0.0"
+    y18n "^3.2.1"
+    yargs-parser "^7.0.0"
+
 yargs@^9.0.0:
   version "9.0.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-9.0.1.tgz#52acc23feecac34042078ee78c0c007f5085db4c"