diff options
| author | MohamedBassem <me@mbassem.com> | 2024-04-23 20:11:25 +0100 |
|---|---|---|
| committer | MohamedBassem <me@mbassem.com> | 2024-04-23 20:11:25 +0100 |
| commit | 88b92d8eb2a203f7092314a5d9c9a7070b568b6d (patch) | |
| tree | eb8de4a1118d37f4aac3ccd93a0a0df97d415f71 /apps/web/components/dashboard/bookmarks/AddToListModal.tsx | |
| parent | c1baada542c1970813b46a232ff930aff1b5bad2 (diff) | |
| download | karakeep-88b92d8eb2a203f7092314a5d9c9a7070b568b6d.tar.zst | |
feature(web): Change the AddList modal to allow adding and removing bookmarks from lists
Diffstat (limited to 'apps/web/components/dashboard/bookmarks/AddToListModal.tsx')
| -rw-r--r-- | apps/web/components/dashboard/bookmarks/AddToListModal.tsx | 132 |
1 files changed, 0 insertions, 132 deletions
diff --git a/apps/web/components/dashboard/bookmarks/AddToListModal.tsx b/apps/web/components/dashboard/bookmarks/AddToListModal.tsx deleted file mode 100644 index 3b8a6700..00000000 --- a/apps/web/components/dashboard/bookmarks/AddToListModal.tsx +++ /dev/null @@ -1,132 +0,0 @@ -import { useState } from "react"; -import { ActionButton } from "@/components/ui/action-button"; -import { Button } from "@/components/ui/button"; -import { - Dialog, - DialogClose, - DialogContent, - DialogFooter, - DialogHeader, - DialogTitle, -} from "@/components/ui/dialog"; -import { - Form, - FormControl, - FormField, - FormItem, - FormMessage, -} from "@/components/ui/form"; -import { toast } from "@/components/ui/use-toast"; -import { zodResolver } from "@hookform/resolvers/zod"; -import { useForm } from "react-hook-form"; -import { z } from "zod"; - -import { useAddBookmarkToList } from "@hoarder/shared-react/hooks/lists"; - -import { BookmarkListSelector } from "../lists/BookmarkListSelector"; - -export default function AddToListModal({ - bookmarkId, - open, - setOpen, -}: { - bookmarkId: string; - open: boolean; - setOpen: (open: boolean) => void; -}) { - const formSchema = z.object({ - listId: z.string({ - required_error: "Please select a list", - }), - }); - const form = useForm<z.infer<typeof formSchema>>({ - resolver: zodResolver(formSchema), - }); - - const { mutate: addToList, isPending: isAddingToListPending } = - useAddBookmarkToList({ - onSuccess: () => { - toast({ - description: "List has been updated!", - }); - setOpen(false); - }, - onError: (e) => { - if (e.data?.code == "BAD_REQUEST") { - toast({ - variant: "destructive", - description: e.message, - }); - } else { - toast({ - variant: "destructive", - title: "Something went wrong", - }); - } - }, - }); - - return ( - <Dialog open={open} onOpenChange={setOpen}> - <DialogContent> - <Form {...form}> - <form - onSubmit={form.handleSubmit((value) => { - addToList({ - bookmarkId: bookmarkId, - listId: value.listId, - }); - })} - > - <DialogHeader> - <DialogTitle>Add to List</DialogTitle> - </DialogHeader> - - <div className="py-4"> - <FormField - control={form.control} - name="listId" - render={({ field }) => { - return ( - <FormItem> - <FormControl> - <BookmarkListSelector onChange={field.onChange} /> - </FormControl> - <FormMessage /> - </FormItem> - ); - }} - /> - </div> - <DialogFooter className="sm:justify-end"> - <DialogClose asChild> - <Button type="button" variant="secondary"> - Close - </Button> - </DialogClose> - <ActionButton - type="submit" - loading={isAddingToListPending} - disabled={isAddingToListPending} - > - Add - </ActionButton> - </DialogFooter> - </form> - </Form> - </DialogContent> - </Dialog> - ); -} - -export function useAddToListModal(bookmarkId: string) { - const [open, setOpen] = useState(false); - - return { - open, - setOpen, - content: ( - <AddToListModal bookmarkId={bookmarkId} open={open} setOpen={setOpen} /> - ), - }; -} |
