From ddc7e5dbfc31b3e5b189c61883e1cc737fefd2ee Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Sun, 1 Sep 2024 17:44:09 +0000
Subject: feature(web): Allow adding to lists in bulk actions. #368

---
 apps/web/components/dashboard/BulkBookmarksAction.tsx | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

(limited to 'apps/web/components/dashboard/BulkBookmarksAction.tsx')

diff --git a/apps/web/components/dashboard/BulkBookmarksAction.tsx b/apps/web/components/dashboard/BulkBookmarksAction.tsx
index bed1bda8..5dd31fa5 100644
--- a/apps/web/components/dashboard/BulkBookmarksAction.tsx
+++ b/apps/web/components/dashboard/BulkBookmarksAction.tsx
@@ -8,13 +8,14 @@ import {
 import ActionConfirmingDialog from "@/components/ui/action-confirming-dialog";
 import { useToast } from "@/components/ui/use-toast";
 import useBulkActionsStore from "@/lib/bulkActions";
-import { Pencil, Trash2, X } from "lucide-react";
+import { List, Pencil, Trash2, X } from "lucide-react";
 
 import {
   useDeleteBookmark,
   useUpdateBookmark,
 } from "@hoarder/shared-react/hooks/bookmarks";
 
+import BulkManageListsModal from "./bookmarks/BulkManageListsModal";
 import { ArchivedActionIcon, FavouritedActionIcon } from "./bookmarks/icons";
 
 export default function BulkBookmarksAction() {
@@ -24,6 +25,7 @@ export default function BulkBookmarksAction() {
   );
   const { toast } = useToast();
   const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false);
+  const [manageListsModal, setManageListsModalOpen] = useState(false);
 
   useEffect(() => {
     setIsBulkEditEnabled(false); // turn off toggle + clear selected bookmarks on mount
@@ -95,6 +97,13 @@ export default function BulkBookmarksAction() {
     selectedBookmarks.every((item) => item.archived === true);
 
   const actionList = [
+    {
+      name: "Add to List",
+      icon: <List size={18} />,
+      action: () => setManageListsModalOpen(true),
+      isPending: false,
+      hidden: !isBulkEditEnabled,
+    },
     {
       name: alreadyFavourited ? "Unfavourite" : "Favourite",
       icon: <FavouritedActionIcon favourited={!!alreadyFavourited} size={18} />,
@@ -149,6 +158,11 @@ export default function BulkBookmarksAction() {
           </ActionButton>
         )}
       />
+      <BulkManageListsModal
+        bookmarkIds={selectedBookmarks.map((b) => b.id)}
+        open={manageListsModal}
+        setOpen={setManageListsModalOpen}
+      />
       <div className="flex">
         {actionList.map(
           ({ name, icon: Icon, action, isPending, hidden, alwaysEnable }) => (
-- 
cgit v1.2.3-70-g09d2

