ui changes and mutation connection

Generation-Bridge · Sep 10, 2020 · 1248b38 · 1248b38
1 parent 041d8d1
commit 1248b38
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 24 deletions.
diff --git a/.expo/packager-info.json b/.expo/packager-info.json
@@ -1,8 +1,8 @@
 {
-  "devToolsPort": 19002,
+  "devToolsPort": 19003,
   "expoServerPort": 19000,
-  "packagerPort": 19003,
-  "packagerPid": 49692,
+  "packagerPort": 19005,
+  "packagerPid": 55473,
   "expoServerNgrokUrl": null,
   "packagerNgrokUrl": null,
   "ngrokPid": null,

diff --git a/components/Feed.tsx b/components/Feed.tsx
@@ -1,7 +1,8 @@
-import React from 'react'
-import { StyleSheet, Text, View } from 'react-native'
+import React, {useEffect, useState} from 'react'
+import { StyleSheet, Text, View, RefreshControl } from 'react-native'
 import SeniorTicket from './SeniorTicket'
 import { useQuery, gql } from '@apollo/client';
+import { ScrollView } from 'react-native-gesture-handler';
 
 
 const GET_TEST = gql`
@@ -15,37 +16,50 @@ query {
   }
 }`
 const Feed = () => {
+  // useEffect(() => {
+  //   console.log('useeffect')
+  // }, [])
+  const [refreshing, useRefresh] = useState('false');
+  const onRefresh = () => {
+    console.log('refreshing');
+  }
+
+  //wrapper for useQuery
+
+
+
   const { loading, error, data } = useQuery(GET_TEST);
   if (loading) return <Text>Loading...</Text>;
   if (error) {
     console.log('error', error)
     return <Text>Error :( </Text>;
     }
-  console.log('data', data)
-  // const tickets = data.helpers[0].map( task => <SeniorTicket task={task}/>)
   let tickets;
   try {
-    tickets = data.tasks.map( task => <SeniorTicket key={task.id} task={task}/>)
+    tickets = data.tasks.map( task => <SeniorTicket key={task.id} task={task}/>).reverse();
   } catch (e) {
     console.log('error in gql feed', e);
   }
   // console.log('tickets', tickets)
   return (
-    <View style={styles.container}>
+    <ScrollView 
+    contentContainerStyle={styles.container}
+    refreshControl={
+      <RefreshControl
+        refreshing={refreshing}
+        onRefresh={onRefresh}
+        />}
+      >
         {tickets}
-        {/* <SeniorTicket/>
-        <SeniorTicket/>
-        <SeniorTicket/> */}
-      </View>
+      </ScrollView>
   )
 }
 
 export default Feed
 
 const styles = StyleSheet.create({
   container: {
-    width: '81%',
-    alignSelf: 'center',
+    width: '100%',
   }
 })
 
diff --git a/components/NewTicketDesc.tsx b/components/NewTicketDesc.tsx
@@ -33,7 +33,7 @@ const NewTicketDesc = ({navigation, route}) => {
           description: value
         },
       });
-      navigation.navigate('SeniorDash');
+      navigation.navigate('SeniorDash', {fetch: true});
     } catch (e) {
       console.log('error in addTask', e)
     }

diff --git a/components/SeniorDash.tsx b/components/SeniorDash.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import {StyleSheet, Text, View, TouchableOpacity} from 'react-native';
 import Feed from './Feed'
-import {useQuery, gql} from '@apollo/client';
 
-export default function SeniorDash({navigation}) {
+export default function SeniorDash({navigation, route}) {
+  console.log('navigation', navigation)
+  console.log('route', route)
   return (
     <View style={styles.container}>
       <TouchableOpacity 

diff --git a/components/SeniorTicket.tsx b/components/SeniorTicket.tsx
@@ -3,12 +3,10 @@ import { Text, View, StyleSheet } from 'react-native'
 
 
 const SeniorTicket = ({task}) => {
-  const date = task.deadline
   return (
     <View style={styles.container}>
-        <Text style={styles.text}>Deadline: {task.deadline}  </Text>
-        <Text style={styles.text}>Type {task.type}</Text>
-        <Text style={styles.text}>Description {task.description}</Text>
+        <Text style={styles.text}>Type: {task.type}</Text>
+        <Text style={styles.text}>Description: {task.description}</Text>
       </View>
     )
   }
@@ -18,7 +16,6 @@ const styles = StyleSheet.create({
     flexDirection: 'column',
     alignItems: 'flex-start',
     justifyContent: 'center',
-    width: '100%',
     backgroundColor: 'lightblue',
     margin: 5,
     borderStyle: 'solid',
@@ -28,7 +25,8 @@ const styles = StyleSheet.create({
     display: 'flex',
   },
   text: {
-    fontSize: 25
+    fontSize: 25,
+    fontWeight: 'bold'
   }
 })