workout modal done

RicaRodz · Jul 23, 2024 · dda7cc1 · dda7cc1
1 parent 5366937
commit dda7cc1
Show file tree

Hide file tree

Showing 4 changed files with 239 additions and 193 deletions.
diff --git a/src/app/user_workouts/WorkoutsList.jsx b/src/app/user_workouts/WorkoutsList.jsx
@@ -6,15 +6,14 @@ import {
   SafeAreaView,
   ScrollView,
   ActivityIndicator,
-  TouchableOpacity,
 } from "react-native";
-import { Link, useRouter } from "expo-router";
-import { gql } from 'graphql-tag';
+import { useRouter } from "expo-router";
+import { gql } from "graphql-tag";
 import { useQuery } from "@tanstack/react-query";
 import client from "../../graphqlClient";
 import BackButton from "../../components/BackButton";
 import WorkoutCard from "../../components/WorkoutCard";
-import { useNavigation } from "@react-navigation/native";
+
 
 
 const { height, width } = Dimensions.get("window");
@@ -36,49 +35,36 @@ const WorkoutsListQuery = gql`
 
 const WorkoutsList = () => {
 
-  const navigation = useNavigation();
+  const router = useRouter();
+
+  const handlePress = (workout) => {
+    router.push({
+      pathname: '/user_workouts/[workout]',
+      params: { workout: workout._id, workoutData: JSON.stringify(workout) }
+    });
+  };
 
   const { data, isLoading, error } = useQuery({
-    queryKey: ['workouts'],
+    queryKey: ["workouts"],
     queryFn: () => client.request(WorkoutsListQuery),
   });
-
-  if (isLoading) {
-    return <ActivityIndicator size="large" color="#FFFFFF" />;
-  }
-
-  if (error) {
-    return <Text style={styles.errorText}>Failed to fetch data.</Text>;
-  }
-
+
+  if (isLoading) return <ActivityIndicator />;
+  if (error) return <Text>Error: {error.message}</Text>;
+
   const workouts = data.workouts.documents;
 
-  const router = useRouter();
-
-  const handleWorkoutPress = (workout) => {
-    navigation.navigate('/user_workouts/[workout]', { id: workout._id, workoutData: workout });
-    // return router.push('/user_workouts/[workout]', { id: workout._id, workoutData: workout });
-  };
-
   return (
     <SafeAreaView style={styles.container}>
       <ScrollView contentContainerStyle={styles.scrollContent}>
         <View style={styles.header}>
           <BackButton />
           <Text style={styles.headerTitle}>Workouts</Text>
         </View>
-        
+
         {workouts.map((workout) => (
-          <TouchableOpacity 
-            key={workout._id} 
-            onPress={() => handleWorkoutPress(workout)}
-          >
-            <WorkoutCard workout={workout} />
-          </TouchableOpacity>
+          <WorkoutCard key={workout._id} workout={workout} onPress={() => handlePress(workout)} />
         ))}
-
-
-
       </ScrollView>
     </SafeAreaView>
   );
@@ -114,7 +100,7 @@ const styles = StyleSheet.create({
   errorText: {
     color: "#FFFFFF",
     fontSize: 16,
-    textAlign: 'center',
+    textAlign: "center",
     marginTop: 20,
   },
-});
+});