diff options
Diffstat (limited to 'apps/mobile/components/bookmarks/ViewBookmarkModal.tsx')
| -rw-r--r-- | apps/mobile/components/bookmarks/ViewBookmarkModal.tsx | 119 |
1 files changed, 0 insertions, 119 deletions
diff --git a/apps/mobile/components/bookmarks/ViewBookmarkModal.tsx b/apps/mobile/components/bookmarks/ViewBookmarkModal.tsx deleted file mode 100644 index df513a89..00000000 --- a/apps/mobile/components/bookmarks/ViewBookmarkModal.tsx +++ /dev/null @@ -1,119 +0,0 @@ -import React from "react"; -import { Keyboard, Text } from "react-native"; -import { - BottomSheetBackdrop, - BottomSheetModal, - BottomSheetModalProps, - BottomSheetScrollView, - BottomSheetView, - TouchableWithoutFeedback, -} from "@gorhom/bottom-sheet"; - -import { useUpdateBookmark } from "@hoarder/shared-react/hooks/bookmarks"; -import { isBookmarkStillTagging } from "@hoarder/shared-react/utils/bookmarkUtils"; -import { BookmarkTypes, ZBookmark } from "@hoarder/shared/types/bookmarks"; - -import { Input } from "../ui/Input"; -import PageTitle from "../ui/PageTitle"; -import { Skeleton } from "../ui/Skeleton"; -import TagPill from "./TagPill"; - -function TagList({ bookmark }: { bookmark: ZBookmark }) { - return ( - <BottomSheetView className="flex flex-row items-center gap-4"> - <Text>Tags</Text> - {isBookmarkStillTagging(bookmark) ? ( - <> - <Skeleton className="h-4 w-full" /> - <Skeleton className="h-4 w-full" /> - </> - ) : bookmark.tags.length > 0 ? ( - <BottomSheetView className="flex flex-row flex-wrap gap-2"> - {bookmark.tags.map((t) => ( - <TagPill key={t.id} tag={t} /> - ))} - </BottomSheetView> - ) : ( - <Text>No tags</Text> - )} - </BottomSheetView> - ); -} - -function NotesEditor({ bookmark }: { bookmark: ZBookmark }) { - const { mutate, isPending } = useUpdateBookmark(); - return ( - <BottomSheetView className="flex flex-row items-center gap-4"> - <Text>Notes</Text> - - <Input - className="flex-1" - editable={!isPending} - multiline={true} - numberOfLines={3} - loading={isPending} - placeholder="Notes" - textAlignVertical="top" - onEndEditing={(ev) => - mutate({ - bookmarkId: bookmark.id, - note: ev.nativeEvent.text, - }) - } - defaultValue={bookmark.note ?? ""} - /> - </BottomSheetView> - ); -} - -const ViewBookmarkModal = React.forwardRef< - BottomSheetModal, - Omit< - BottomSheetModalProps, - "children" | "backdropComponent" | "onDismiss" - > & { - bookmark: ZBookmark; - } ->(({ bookmark, ...props }, ref) => { - let title = null; - switch (bookmark.content.type) { - case BookmarkTypes.LINK: - title = bookmark.title ?? bookmark.content.title; - break; - case BookmarkTypes.TEXT: - title = bookmark.title; - break; - case BookmarkTypes.ASSET: - title = bookmark.title ?? bookmark.content.fileName; - break; - } - return ( - <BottomSheetModal - ref={ref} - backdropComponent={(props) => ( - <BottomSheetBackdrop - appearsOnIndex={0} - disappearsOnIndex={-1} - {...props} - /> - )} - {...props} - > - <BottomSheetScrollView className="flex flex-1"> - <TouchableWithoutFeedback onPress={Keyboard.dismiss}> - <BottomSheetView className="flex flex-1"> - <PageTitle title={title ?? "Untitled"} className="line-clamp-2" /> - <BottomSheetView className="gap-4 px-4"> - <TagList bookmark={bookmark} /> - <NotesEditor bookmark={bookmark} /> - </BottomSheetView> - </BottomSheetView> - </TouchableWithoutFeedback> - </BottomSheetScrollView> - </BottomSheetModal> - ); -}); - -ViewBookmarkModal.displayName = "ViewBookmarkModal"; - -export default ViewBookmarkModal; |
