aboutsummaryrefslogtreecommitdiffstats
path: root/apps/mobile/app
diff options
context:
space:
mode:
Diffstat (limited to 'apps/mobile/app')
-rw-r--r--apps/mobile/app/_layout.tsx17
-rw-r--r--apps/mobile/app/dashboard/(tabs)/_layout.tsx4
-rw-r--r--apps/mobile/app/dashboard/bookmarks/[slug]/info.tsx65
-rw-r--r--apps/mobile/app/dashboard/bookmarks/[slug]/manage_tags.tsx38
-rw-r--r--apps/mobile/app/sharing.tsx35
5 files changed, 76 insertions, 83 deletions
diff --git a/apps/mobile/app/_layout.tsx b/apps/mobile/app/_layout.tsx
index 62c29c27..3a8f99a1 100644
--- a/apps/mobile/app/_layout.tsx
+++ b/apps/mobile/app/_layout.tsx
@@ -33,9 +33,9 @@ export default function RootLayout() {
}, [settings.theme]);
return (
- <ShareIntentProvider>
- <Providers>
- <GestureHandlerRootView style={{ flex: 1 }}>
+ <GestureHandlerRootView style={{ flex: 1 }}>
+ <ShareIntentProvider>
+ <Providers>
<View
className={cn(
"w-full flex-1 bg-gray-100 text-foreground dark:bg-background",
@@ -60,10 +60,7 @@ export default function RootLayout() {
}}
/>
<Stack.Screen name="server-address" />
- <Stack.Screen
- name="sharing"
- options={{ presentation: "modal" }}
- />
+ <Stack.Screen name="sharing" />
<Stack.Screen
name="test-connection"
options={{
@@ -75,8 +72,8 @@ export default function RootLayout() {
</StyledStack>
<StatusBar style="auto" />
</View>
- </GestureHandlerRootView>
- </Providers>
- </ShareIntentProvider>
+ </Providers>
+ </ShareIntentProvider>
+ </GestureHandlerRootView>
);
}
diff --git a/apps/mobile/app/dashboard/(tabs)/_layout.tsx b/apps/mobile/app/dashboard/(tabs)/_layout.tsx
index cf1eb01f..46bf0f77 100644
--- a/apps/mobile/app/dashboard/(tabs)/_layout.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/_layout.tsx
@@ -6,8 +6,8 @@ import { ClipboardList, Home, Settings } from "lucide-react-native";
export default function TabLayout() {
return (
<StyledTabs
- tabBarClassName="bg-gray-100 dark:bg-background pt-3"
- sceneContainerClassName="bg-gray-100 dark:bg-background"
+ tabBarClassName="bg-gray-100 dark:bg-background"
+ sceneClassName="bg-gray-100 dark:bg-background"
screenOptions={{
headerShown: false,
}}
diff --git a/apps/mobile/app/dashboard/bookmarks/[slug]/info.tsx b/apps/mobile/app/dashboard/bookmarks/[slug]/info.tsx
index e1b1bdbc..d573df21 100644
--- a/apps/mobile/app/dashboard/bookmarks/[slug]/info.tsx
+++ b/apps/mobile/app/dashboard/bookmarks/[slug]/info.tsx
@@ -2,11 +2,11 @@ import React from "react";
import {
Keyboard,
Pressable,
+ ScrollView,
Text,
TouchableWithoutFeedback,
View,
} from "react-native";
-import { ScrollView } from "react-native-gesture-handler";
import { router, Stack, useLocalSearchParams } from "expo-router";
import TagPill from "@/components/bookmarks/TagPill";
import FullPageError from "@/components/FullPageError";
@@ -14,10 +14,12 @@ import CustomSafeAreaView from "@/components/ui/CustomSafeAreaView";
import FullPageSpinner from "@/components/ui/FullPageSpinner";
import { Input } from "@/components/ui/Input";
import { Skeleton } from "@/components/ui/Skeleton";
-import { api } from "@/lib/trpc";
import { ChevronRight } from "lucide-react-native";
-import { useUpdateBookmark } from "@hoarder/shared-react/hooks/bookmarks";
+import {
+ useAutoRefreshingBookmarkQuery,
+ useUpdateBookmark,
+} from "@hoarder/shared-react/hooks/bookmarks";
import { isBookmarkStillTagging } from "@hoarder/shared-react/utils/bookmarkUtils";
import { BookmarkTypes, ZBookmark } from "@hoarder/shared/types/bookmarks";
@@ -25,32 +27,31 @@ function TagList({ bookmark }: { bookmark: ZBookmark }) {
return (
<View className="flex gap-4">
<Text className="text-lg text-foreground">Tags</Text>
- {isBookmarkStillTagging(bookmark) ? (
- <>
- <Skeleton className="h-4 w-full" />
- <Skeleton className="h-4 w-full" />
- </>
- ) : bookmark.tags.length > 0 ? (
- <View className="flex flex-col gap-2">
+ <View className="flex gap-2">
+ {isBookmarkStillTagging(bookmark) ? (
+ <View className="flex gap-4 pb-3">
+ <Skeleton className="h-4 w-full" />
+ <Skeleton className="h-4 w-full" />
+ </View>
+ ) : bookmark.tags.length > 0 ? (
<View className="flex flex-row flex-wrap gap-2 rounded-lg bg-background p-4">
{bookmark.tags.map((t) => (
<TagPill key={t.id} tag={t} />
))}
</View>
-
- <Pressable
- onPress={() =>
- router.push(`/dashboard/bookmarks/${bookmark.id}/manage_tags`)
- }
- className="flex w-full flex-row justify-between gap-3 rounded-lg bg-white px-4 py-2 dark:bg-accent"
- >
- <Text className="text-lg text-accent-foreground">Manage Tags</Text>
- <ChevronRight color="rgb(0, 122, 255)" />
- </Pressable>
- </View>
- ) : (
- <Text className="text-foreground">No tags</Text>
- )}
+ ) : (
+ <Text className="text-foreground">No tags</Text>
+ )}
+ <Pressable
+ onPress={() =>
+ router.push(`/dashboard/bookmarks/${bookmark.id}/manage_tags`)
+ }
+ className="flex w-full flex-row justify-between gap-3 rounded-lg bg-white px-4 py-2 dark:bg-accent"
+ >
+ <Text className="text-lg text-accent-foreground">Manage Tags</Text>
+ <ChevronRight color="rgb(0, 122, 255)" />
+ </Pressable>
+ </View>
</View>
);
}
@@ -133,11 +134,12 @@ const ViewBookmarkPage = () => {
if (typeof slug !== "string") {
throw new Error("Unexpected param type");
}
+
const {
data: bookmark,
isPending,
refetch,
- } = api.bookmarks.getBookmark.useQuery({ bookmarkId: slug });
+ } = useAutoRefreshingBookmarkQuery({ bookmarkId: slug });
if (isPending) {
return <FullPageSpinner />;
@@ -167,6 +169,19 @@ const ViewBookmarkPage = () => {
options={{
headerShown: true,
headerTitle: title ?? "Untitled",
+ headerRight: () => (
+ <Pressable
+ onPress={() => {
+ if (router.canGoBack()) {
+ router.back();
+ } else {
+ router.replace("dashboard");
+ }
+ }}
+ >
+ <Text className="text-foreground">Done</Text>
+ </Pressable>
+ ),
}}
/>
<ScrollView className="h-screen w-full p-4">
diff --git a/apps/mobile/app/dashboard/bookmarks/[slug]/manage_tags.tsx b/apps/mobile/app/dashboard/bookmarks/[slug]/manage_tags.tsx
index 8429e4ba..3f24237b 100644
--- a/apps/mobile/app/dashboard/bookmarks/[slug]/manage_tags.tsx
+++ b/apps/mobile/app/dashboard/bookmarks/[slug]/manage_tags.tsx
@@ -8,7 +8,10 @@ import { Input } from "@/components/ui/Input";
import { useToast } from "@/components/ui/Toast";
import { Check, Plus } from "lucide-react-native";
-import { useUpdateBookmarkTags } from "@hoarder/shared-react/hooks/bookmarks";
+import {
+ useAutoRefreshingBookmarkQuery,
+ useUpdateBookmarkTags,
+} from "@hoarder/shared-react/hooks/bookmarks";
import { api } from "@hoarder/shared-react/trpc";
const NEW_TAG_ID = "new-tag";
@@ -47,28 +50,21 @@ const ListPickerPage = () => {
),
},
);
- const { data: existingTags } = api.bookmarks.getBookmark.useQuery(
- {
- bookmarkId,
- },
- {
- select: React.useCallback(
- (data: { tags: { id: string; name: string }[] }) =>
- data.tags.map((t) => ({
- id: t.id,
- name: t.name,
- lowered: t.name.toLowerCase(),
- })),
- [],
- ),
- },
- );
+ const { data: existingTags } = useAutoRefreshingBookmarkQuery({
+ bookmarkId,
+ });
- const [optimisticTags, setOptimisticTags] = React.useState(
- existingTags ?? [],
- );
+ const [optimisticTags, setOptimisticTags] = React.useState<
+ { id: string; name: string; lowered: string }[]
+ >([]);
React.useEffect(() => {
- setOptimisticTags(existingTags ?? []);
+ setOptimisticTags(
+ existingTags?.tags.map((t) => ({
+ id: t.id,
+ name: t.name,
+ lowered: t.name.toLowerCase(),
+ })) ?? [],
+ );
}, [existingTags]);
const { mutate: updateTags } = useUpdateBookmarkTags({
diff --git a/apps/mobile/app/sharing.tsx b/apps/mobile/app/sharing.tsx
index 3551aea9..e2e1823b 100644
--- a/apps/mobile/app/sharing.tsx
+++ b/apps/mobile/app/sharing.tsx
@@ -52,7 +52,7 @@ function SaveBookmark({ setMode }: { setMode: (mode: Mode) => void }) {
}
} else if (!isPending && shareIntent?.files) {
uploadAsset({
- type: shareIntent.files[0].type,
+ type: shareIntent.files[0].mimeType,
name: shareIntent.files[0].fileName ?? "",
uri: shareIntent.files[0].path,
});
@@ -96,30 +96,15 @@ export default function Sharing() {
<Text className="text-4xl text-foreground">
{mode.type === "alreadyExists" ? "Already Hoarded!" : "Hoarded!"}
</Text>
- <View className="flex flex-row gap-2">
- <Button
- label="Add to List"
- onPress={() => {
- router.push(
- `/dashboard/bookmarks/${mode.bookmarkId}/manage_lists`,
- );
- if (autoCloseTimeoutId) {
- clearTimeout(autoCloseTimeoutId);
- }
- }}
- />
- <Button
- label="Manage Tags"
- onPress={() => {
- router.push(
- `/dashboard/bookmarks/${mode.bookmarkId}/manage_tags`,
- );
- if (autoCloseTimeoutId) {
- clearTimeout(autoCloseTimeoutId);
- }
- }}
- />
- </View>
+ <Button
+ label="Manage"
+ onPress={() => {
+ router.replace(`/dashboard/bookmarks/${mode.bookmarkId}/info`);
+ if (autoCloseTimeoutId) {
+ clearTimeout(autoCloseTimeoutId);
+ }
+ }}
+ />
<Pressable onPress={() => router.replace("dashboard")}>
<Text className="text-muted-foreground">Dismiss</Text>
</Pressable>