allowing users to navigate only when scrolling is stopped

apps/mobile/app/screens/Authenticated/TeamScreen/components/ListCardItem.tsx

@@ -9,7 +9,7 @@
 	StyleSheet,
 	TouchableWithoutFeedback,
 } from "react-native"
 import { Ionicons, Entypo } from "@expo/vector-icons"
 
 // COMPONENTS
 import { Card, ListItem } from "../../../../components"
@@ -46,7 +46,7 @@
 	member: OT_Member
 }
 
 interface IcontentProps {
 	memberInfo: I_TeamMemberCardHook
 	taskEdition: I_TMCardTaskEditHook
 	onPressIn?: (isTaskScreen?: boolean) => void
@@ -57,9 +57,10 @@
 	openMenuIndex: number | null
 	setOpenMenuIndex: React.Dispatch<React.SetStateAction<number | null>>
 	currentTeam: IOrganizationTeamWithMStatus | null
+	canNavigate: boolean
 }
 
 export const ListItemContent: React.FC<IcontentProps> = observer(
 	({ memberInfo, taskEdition, onPressIn }) => {
 		// HOOKS
 		const { colors, dark } = useAppTheme()
@@ -152,12 +153,15 @@
 		taskEdition.setEditMode(false)
 		taskEdition.setEstimateEditMode(false)
 		props.setOpenMenuIndex(null)
-		isTaskScreen
-			? navigation.navigate("TaskScreen", { taskId: memberInfo?.memberTask?.id })
-			: navigation.navigate("Profile", {
-					userId: memberInfo.memberUser.id,
-					activeTab: "worked",
-			  })
+
+		if (memberInfo.memberTask && props.canNavigate) {
+			isTaskScreen
+				? navigation.navigate("TaskScreen", { taskId: memberInfo.memberTask?.id })
+				: navigation.navigate("Profile", {
+						userId: memberInfo.memberUser.id,
+						activeTab: "worked",
+				  })
+		}
 	}
 	const currentMember = props.currentTeam?.members.find(
 		(currentMember) => currentMember.id === props.member.id,
@@ -335,7 +339,7 @@
 									setShowUnassignedList(false)
 								}}
 							>
 								<Ionicons name="chevron-back" size={24} color={colors.primary} />
 							</TouchableOpacity>
 						) : (
 							<TouchableOpacity
@@ -346,13 +350,13 @@
 								}
 							>
 								{props.openMenuIndex !== props.index ? (
 									<Ionicons
 										name="ellipsis-vertical-outline"
 										size={24}
 										color={colors.primary}
 									/>
 								) : (
 									<Entypo name="cross" size={24} color={colors.primary} />
 								)}
 							</TouchableOpacity>
 						)}