merge with staging

Generation-Bridge · Sep 10, 2020 · 30ad0e7 · 30ad0e7
2 parents 1248b38 + 524e5e9
commit 30ad0e7
Show file tree

Hide file tree

Showing 12 changed files with 553 additions and 167 deletions.
diff --git a/.expo/packager-info.json b/.expo/packager-info.json
@@ -1,10 +1 @@
-{
-  "devToolsPort": 19003,
-  "expoServerPort": 19000,
-  "packagerPort": 19005,
-  "packagerPid": 55473,
-  "expoServerNgrokUrl": null,
-  "packagerNgrokUrl": null,
-  "ngrokPid": null,
-  "webpackServerPort": null
-}
+{}
diff --git a/App.tsx b/App.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useState, createContext} from 'react';
 import {NavigationContainer, StackActions} from '@react-navigation/native';
 import {createStackNavigator} from '@react-navigation/stack';
 import {ApolloClient, InMemoryCache, ApolloProvider} from '@apollo/client';
@@ -13,30 +13,45 @@ import LoginPage from './components/LoginPage';
 import NewTicket from './components/NewTicket';
 import NewTicketDesc from './components/NewTicketDesc';
 
-
-
 const client = new ApolloClient({
   uri: 'http://localhost:3000/graphql',
   cache: new InMemoryCache(),
 });
 
 const Stack = createStackNavigator();
-
+// export const AuthContext = createContext({});
 export default function App() {
+  // global state for whoever's ID
+  const [authID, setAuthID] = useState(null);
   return (
     <ApolloProvider client={client}>
       <NavigationContainer>
+        {/* <AuthContext.Provider value={{authID, setAuthID}}> */}
         <Stack.Navigator>
           <Stack.Screen name="Splash" component={Splash} />
           <Stack.Screen name="StartingPage" component={StartingPage} />
-          <Stack.Screen name="SeniorSignup" component={SeniorSignup} />
+          {/* <Stack.Screen name="SeniorSignup" component={SeniorSignup} /> */}
+          <Stack.Screen name="SeniorSignup">
+            {props => (
+              <SeniorSignup {...props} authID={authID} setAuthID={setAuthID} />
+            )}
+          </Stack.Screen>
           <Stack.Screen name="SeniorDash" component={SeniorDash} />
-          <Stack.Screen name="JuniorSignup" component={JuniorSignup} />
-          <Stack.Screen name="JuniorDash" component={JuniorDash} />
+          <Stack.Screen name="JuniorSignup">
+            {props => (
+              <JuniorSignup {...props} authID={authID} setAuthID={setAuthID} />
+            )}
+          </Stack.Screen>
+          <Stack.Screen name="JuniorDash">
+            {props => (
+              <JuniorDash {...props} authID={authID} setAuthID={setAuthID} />
+            )}
+          </Stack.Screen>
           <Stack.Screen name="LoginPage" component={LoginPage} />
           <Stack.Screen name="NewTicket" component={NewTicket} />
           <Stack.Screen name="NewTicketDesc" component={NewTicketDesc} />
         </Stack.Navigator>
+        {/* </AuthContext.Provider> */}
       </NavigationContainer>
     </ApolloProvider>
   );

diff --git a/components/JuniorDash.tsx b/components/JuniorDash.tsx
@@ -9,7 +9,8 @@ import JuniorProfile from './JuniorProfile';
 
 const Tab = createBottomTabNavigator();
 
-export default function JuniorDash() {
+export default function JuniorDash({authID}) {
+  console.log('authID in dash after signing up', authID);
   return (
     <Tab.Navigator
       screenOptions={({route}) => ({
@@ -36,13 +37,23 @@ export default function JuniorDash() {
         inactiveTintColor: 'gray',
         showLabel: false,
       }}>
-      <Tab.Screen name="Feed" component={JuniorFeed} />
-      <Tab.Screen name="JuniorTickets" component={JuniorTickets} />
+      <Tab.Screen name="Feed">
+        {props => <JuniorFeed {...props} authID={authID} />}
+      </Tab.Screen>
+      <Tab.Screen name="JuniorTickets">
+        {props => <JuniorTickets {...props} authID={authID} />}
+      </Tab.Screen>
       <Tab.Screen name="JuniorProfile" component={JuniorProfile} />
     </Tab.Navigator>
   );
 }
 
+/*<Stack.Screen name="JuniorSignup">
+{props => (
+  <JuniorSignup {...props} authID={authID} setAuthID={setAuthID} />
+)}
+</Stack.Screen>
+*/
 const styles = StyleSheet.create({
   container: {
     flex: 1,

diff --git a/components/JuniorFeed.tsx b/components/JuniorFeed.tsx
@@ -13,7 +13,9 @@ const GET_TASKS = gql`
     }
   }
 `;
-const JuniorFeed = () => {
+
+const JuniorFeed = ({authID}) => {
+  console.log('authID in JuniorFeed', authID);
   const {loading, error, data} = useQuery(GET_TASKS);
   if (loading) return <Text>Loading...</Text>;
   if (error) {
@@ -23,10 +25,13 @@ const JuniorFeed = () => {
   // console.log('data', data);
 
   // const tickets = data.helpers[0].map( task => <SeniorTicket task={task}/>)
-  const tickets = data.tasks.map(task => <Ticket task={task} key={task.id} />);
+  const tickets = data.tasks.map(task => (
+    <Ticket task={task} key={task.id} authID={authID} />
+  ));
   // console.log('tickets', tickets)
   return (
     <ScrollView style={styles.container}>
+      <Text style={styles.text}>CLAIM YOUR TICKETS</Text>
       {tickets}
       {/* <SeniorTicket/>
         <SeniorTicket/>
@@ -39,6 +44,11 @@ export default JuniorFeed;
 
 const styles = StyleSheet.create({
   container: {
-    width: '80%',
+    width: '100%',
+  },
+  text: {
+    marginVertical: 10,
+    fontSize: 25,
+    alignSelf: 'center',
   },
 });
diff --git a/components/JuniorSignup.tsx b/components/JuniorSignup.tsx
@@ -38,14 +38,16 @@ const ADD_HELPER = gql`
   }
 `;
 
-const JuniorSignup = ({navigation}) => {
+const JuniorSignup = ({navigation, authID, setAuthID}) => {
+  // const {setAuthID} = useContext(AuthContext);
   const initialState: signupState = {
     name: '',
     email: '',
     phoneNumber: '',
     password: '',
     zipCode: '',
   };
+  // console.log('authID in signup', authID);
 
   // state for the forms
   const [form, setForm] = useState<signupState>(initialState);
@@ -67,6 +69,9 @@ const JuniorSignup = ({navigation}) => {
           zipCode: numberedZip,
         },
       });
+      console.log('data', data.addHelper.id);
+      const uID = Number(data.addHelper.id);
+      setAuthID(uID);
       setForm(initialState);
       navigation.navigate('JuniorDash');
     } catch (error) {

diff --git a/components/JuniorTickets.tsx b/components/JuniorTickets.tsx
@@ -1,20 +1,48 @@
 import React from 'react';
-import {StyleSheet, Text, View} from 'react-native';
+import {StyleSheet, Text, View, TouchableOpacity} from 'react-native';
+import {gql, useQuery} from '@apollo/client';
 
+import Ticket from './Ticket';
 // TODO: get ID of whoever is logged in so that we can query the tasks assigned to specific id
 
-const JuniorTickets = () => {
-  return (
-    <View>
-      <Text style={styles.text}>My Tickets</Text>
-    </View>
-  );
+const GET_TASK_FOR_HELPER = gql`
+  query Helper($id: Int!) {
+    helper(id: $id) {
+      tasks {
+        seniorname
+        description
+        type
+      }
+    }
+  }
+`;
+
+const JuniorTickets = ({authID}) => {
+  console.log('authID in junior ticketss', authID);
+  const {loading, error, data} = useQuery(GET_TASK_FOR_HELPER, {
+    // userID hardcoded to 34, we need to figure out why dynamic authID isn't working
+    variables: {id: 34},
+  });
+  if (error) return <Text>`Error! ${error.message}`</Text>;
+
+  console.log('data from query', data);
+
+  const tickets = data.helper.tasks.map(task => (
+    <Ticket task={task} key={task.id} />
+  ));
+
+  return <View style={styles.container}>{tickets}</View>;
 };
 
 export default JuniorTickets;
 
 const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+  },
   text: {
-    fontSize: 20,
+    marginVertical: 10,
+    fontSize: 25,
+    alignSelf: 'center',
   },
 });
diff --git a/components/NewTicketDesc.tsx b/components/NewTicketDesc.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react'
-import { StyleSheet, Text, View, TextInput, TouchableOpacity } from 'react-native'
+import { StyleSheet, Text, View, TextInput, TouchableOpacity} from 'react-native'
 import { gql, useMutation } from '@apollo/client'
-import { ScrollView } from 'react-native-gesture-handler'
 
 
 const ADD_TASK = gql`

diff --git a/components/SeniorSignup.tsx b/components/SeniorSignup.tsx
@@ -1,4 +1,5 @@
 import React, {useState} from 'react';
+import {useQuery, gql, useMutation} from '@apollo/client';
 import {
   StyleSheet,
   Text,
@@ -12,27 +13,77 @@ import {TextInput} from 'react-native-gesture-handler';
 interface signUpState {
   firstName: string;
   lastName: string;
+  email: string;
   phoneNumber: string;
   zipCode: string;
   password: string;
 }
 
+const ADD_SENIOR = gql`
+  mutation addSenior(
+    $name: String!
+    $phone: String!
+    $password: String!
+    $zipCode: Int!
+    $email: String
+  ) {
+    addSenior(
+      name: $name
+      phone: $phone
+      password: $password
+      zipcode: $zipCode
+      email: $email
+    ) {
+      id
+    }
+  }
+`;
+
+
 const SeniorSignup: React.FC = ({navigation}) => {
   // inital state for the forms
+  const [addSenior, {data, error}] = useMutation(ADD_SENIOR);
+
+
   const initialState: signUpState = {
     firstName: '',
     lastName: '',
+    email: '',
     phoneNumber: '',
     zipCode: '',
     password: '',
   };
 
+  // if (loading) return 'Loading...';
+  // if (error) return `Error! ${error.message}`;
+
   // state for the forms
   const [form, setForm] = useState<signUpState>(initialState);
   // console.log('state change', form);
 
   // handle submit when submit button is clicked
-  const handleSubmit = (): void => {};
+  const handleSubmit = async () => {
+    console.log('form', form)
+    const {firstName, lastName, phoneNumber, password, zipCode, email} = form;
+    const numberedZip = Number(zipCode);
+    const name = `${firstName} ${lastName}`
+    // TODO : need some sort of validation for the forms before we send to DB
+    try {
+      const {data} = await addSenior({
+        variables: {
+          name,
+          phone: phoneNumber,
+          email,
+          password,
+          zipCode: numberedZip,
+        },
+      });
+      setForm(initialState);
+      navigation.navigate('SeniorDash');
+    } catch (error) {
+      console.log('error', error);
+    }
+  };
 
   return (
     <TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
@@ -52,6 +103,13 @@ const SeniorSignup: React.FC = ({navigation}) => {
           onChangeText={text => setForm({...form, lastName: text})}
           value={form.lastName}
         />
+        <Text style={styles.labels}>Email</Text>
+        <TextInput
+          style={styles.inputFields}
+          placeholder="Email"
+          onChangeText={text => setForm({...form, email: text})}
+          value={form.email}
+        />
         <Text style={styles.labels}>Phone Number</Text>
         <TextInput
           style={styles.inputFields}
@@ -78,7 +136,7 @@ const SeniorSignup: React.FC = ({navigation}) => {
         />
         <TouchableOpacity
           style={styles.button}
-          onPress={() => navigation.navigate('SeniorDash')}>
+          onPress={handleSubmit}>
           <Text style={styles.buttonText}>Submit</Text>
         </TouchableOpacity>
       </View>