implementation

client-new/src/components/homescreen components/HomeScreenTaskCard.tsx

@@ -3,17 +3,18 @@ import { fetchTaskTag } from '@/services/TaskService';
 import { Text, View } from 'native-base';
 
 import React, { useEffect, useState } from 'react';
-import { Pressable } from 'react-native';
+import { Pressable, TouchableOpacity } from 'react-native';
 
 import RightArrowIcon from '../icons/RightArrowIcon';
 import CircleProgress from '../reusable/CircleProgress';
 
 type HSTCProps = {
   task: ITask;
   isAllTasks?: boolean;
+  handleOnPress?: () => void;
 };
 
-const HomeScreenTaskCard: React.FC<HSTCProps> = ({ task, isAllTasks }) => {
+const HomeScreenTaskCard: React.FC<HSTCProps> = ({ task, isAllTasks, handleOnPress }) => {
   const [tag, setTag] = useState<string | null>(null);
   const [isPending, setIsPending] = useState<boolean>(false);
   const [error, setError] = useState<Error | null>(null);
@@ -39,7 +40,7 @@ const HomeScreenTaskCard: React.FC<HSTCProps> = ({ task, isAllTasks }) => {
   const progress = Math.floor(Math.random() * 100) + 1;
 
   return (
-    <Pressable onPress={() => console.log(`pressed ${task.id}`)}>
+    <TouchableOpacity onPress={handleOnPress}>
       <View
         paddingLeft={5}
         paddingTop={6}
@@ -130,7 +131,7 @@ const HomeScreenTaskCard: React.FC<HSTCProps> = ({ task, isAllTasks }) => {
           </View>
         )}
       </View>
-    </Pressable>
+      </TouchableOpacity>
   );
 };
 

client-new/src/navigation/AppStack.tsx

@@ -1,10 +1,11 @@
 import GuideScreen from '@/screens/app/GuideScreen';
-import TaskScreen from '@/screens/app/TaskScreen';
+import TaskScreen from '@/screens/app/tasks/TaskScreen';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 
 import React from 'react';
 
 import HomeScreen from '../screens/app/BottomTabNavigator';
+import TaskStack from './TaskStack';
 
 const Stack = createNativeStackNavigator();
 

client-new/src/navigation/AuthStack.tsx

@@ -2,10 +2,8 @@ import AccessScreen from '@/screens/auth/AccessScreen';
 import LoginScreen from '@/screens/auth/LoginScreen';
 import SignUpScreen from '@/screens/auth/SignUpScreen';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { View } from 'native-base';
 
 import React from 'react';
-import { ActivityIndicator } from 'react-native';
 
 import { useUser } from '../contexts/UserContext';
 import OnboardingStack from './OnboardingStack';

client-new/src/navigation/TaskStack.tsx

@@ -0,0 +1,28 @@
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import React from 'react';
+import TaskScreen from '@/screens/app/tasks/TaskScreen';
+import SubTaskSummaryScreen from '@/screens/app/tasks/SubTaskSummaryScreen';
+import SubTaskScreen from '@/screens/app/tasks/SubTaskScreen';
+
+const Stack = createNativeStackNavigator();
+/**
+ * The Task Stack contains all the screens related to tasks
+ * - All Tasks Screen
+ *  - Task Summary Screen
+ *     - Subtask Summary Screen
+ * @returns TaskStack
+ */
+export default function TaskStack() {
+  return (
+    <Stack.Navigator
+      initialRouteName="Subtask Summary Screen"
+      screenOptions={{
+        headerShown: false
+      }}
+    >
+      <Stack.Screen name="Task Screen" component={TaskScreen} />
+      <Stack.Screen name="Subtask Summary Screen" component={SubTaskSummaryScreen} />
+      <Stack.Screen name="Subtask Screen" component={SubTaskScreen} />
+    </Stack.Navigator>
+  );
+}

client-new/src/screens/app/BottomTabNavigator.tsx

@@ -8,7 +8,7 @@ import FileCollectionScreen from '@/screens/app/FileCollectionScreen';
 import GuideScreen from '@/screens/app/GuideScreen';
 import HomeScreen from '@/screens/app/HomeScreen';
 import MarketplaceScreen from '@/screens/app/MarketplaceScreen';
-import TaskScreen from '@/screens/app/TaskScreen';
+import TaskScreen from '@/screens/app/tasks/TaskScreen';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 
 import React from 'react';