feat(mobile): clickable dashboard stats

apps/mobile/components/DashboardItem.tsx

@@ -1,18 +1,24 @@
-import { Text, View } from "react-native";
+import { Href, router } from "expo-router";
+import { Text, TouchableOpacity, View } from "react-native";
 
 export default function DashboardItem({
   name,
   value,
   icon,
   color,
+  to,
 }: {
   name: string;
   value: number;
   icon: React.ReactNode;
   color: string;
+  to: Href;
 }) {
   return (
-    <View className="flex-1 flex-col gap-2 rounded-xl bg-base-200 p-3">
+    <TouchableOpacity
+      className="flex-1 flex-col gap-2 rounded-xl bg-base-200 p-3"
+      onPress={() => router.push(to as Href)}
+    >
       <View className="flex-row justify-between">
         <View
           className="flex-col gap-2 rounded-full aspect-square flex justify-center items-center"
@@ -30,6 +36,6 @@ export default function DashboardItem({
         </Text>
       </View>
       <Text className="font-semibold text-neutral">{name}</Text>
-    </View>
+    </TouchableOpacity>
   );
 }

apps/mobile/components/DashboardSection.tsx

@@ -60,12 +60,14 @@ const DashboardSection: React.FC<DashboardSectionProps> = ({
               value={numberOfLinks}
               icon={<Link size={23} color="white" />}
               color="#9c00cc"
+              to="/(tabs)/links"
             />
             <DashboardItem
               name={collectionsLength === 1 ? "Collection" : "Collections"}
               value={collectionsLength}
               icon={<Folder size={23} color="white" fill="white" />}
               color="#0096cc"
+              to="/(tabs)/collections"
             />
           </View>
           <View className="flex-row gap-4">
@@ -74,12 +76,14 @@ const DashboardSection: React.FC<DashboardSectionProps> = ({
               value={tagsLength}
               icon={<Hash size={23} color="white" />}
               color="#00cc99"
+              to="/(tabs)/tags"
             />
             <DashboardItem
               name={"Pinned Links"}
               value={numberOfPinnedLinks}
               icon={<Pin size={23} color="white" fill="white" />}
               color="#cc6d00"
+              to="/dashboard/pinned-links"
             />
           </View>
         </View>