refactor(mobile): intial addin of dockdoor scanning on mobile

lstMobile/src/app/dock/scans/[scanner].tsx

@@ -0,0 +1,71 @@
+import { useSuspenseQuery } from "@tanstack/react-query";
+import { useLocalSearchParams, useRouter } from "expo-router";
+import { Pressable, Text, View } from "react-native";
+import { SafeAreaView } from "react-native-safe-area-context";
+import { Card } from "../../../components/ui/card";
+import { useSocketRoom } from "../../../hooks/socket.io.hook";
+import { getActiveLoadingOrders } from "../../../lib/queryStuff/getActiveLoadingOrders";
+
+export default function DockPage() {
+	const { scanner } = useLocalSearchParams<{
+		scanner: string;
+	}>();
+	const { data: loadingOrders, isLoading } = useSuspenseQuery(
+		getActiveLoadingOrders(),
+	);
+	const { data } = useSocketRoom<any>(
+		`dockDoorLoading:${scanner}`,
+		undefined,
+		"append",
+	) as any;
+	const dockFilter = loadingOrders.filter(
+		(i: any) => i.dockId === Number(scanner),
+	);
+	const router = useRouter();
+
+	if (isLoading)
+		return (
+			<SafeAreaView>
+				<Text>Loading...</Text>
+			</SafeAreaView>
+		);
+	return (
+		<SafeAreaView className="w-full">
+			<View className="flex flex-row justify-between gap-1 ml-1 mr-1">
+				<View>
+					<Pressable
+						onPress={() => router.back()}
+						className="self-start rounded-xl bg-gray-200 px-4 py-2"
+					>
+						<Text className="font-semibold">← Back</Text>
+					</Pressable>
+				</View>
+
+				<Text className="text-xl mt-1">{dockFilter[0].dockDescription}</Text>
+				<View>
+					<Pressable
+						onPress={() =>
+							router.replace({
+								pathname: "/(tabs)/dockScan",
+							})
+						}
+						className="self-start rounded-xl bg-gray-200 px-4 py-2"
+					>
+						<Text className="font-semibold">Docks</Text>
+					</Pressable>
+				</View>
+				<View>
+					{data.map((i: any, index: any) => {
+						return (
+							<View key={index} className="m-2">
+								<Card>
+									<Text>{JSON.stringify(i)}</Text>
+								</Card>
+							</View>
+						);
+					})}
+				</View>
+			</View>
+		</SafeAreaView>
+	);
+}