improvements

pages/links/pinned.tsx

@@ -2,7 +2,7 @@ import SortDropdown from "@/components/SortDropdown";
 import useLinks from "@/hooks/useLinks";
 import MainLayout from "@/layouts/MainLayout";
 import useLinkStore from "@/store/links";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import PageHeader from "@/components/PageHeader";
 import { Sort, ViewMode } from "@/types/global";
 import ViewDropdown from "@/components/ViewDropdown";
@@ -13,6 +13,7 @@ import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
 import useCollectivePermissions from "@/hooks/useCollectivePermissions";
 import toast from "react-hot-toast";
 // import GridView from "@/components/LinkViews/Layouts/GridView";
+import { useRouter } from "next/router";
 
 export default function PinnedLinks() {
   const { links, selectedLinks, deleteLinksById, setSelectedLinks } =
@@ -25,9 +26,16 @@ export default function PinnedLinks() {
 
   useLinks({ sort: sortBy, pinnedOnly: true });
 
+  const router = useRouter();
   const [bulkDeleteLinksModal, setBulkDeleteLinksModal] = useState(false);
   const [bulkEditLinksModal, setBulkEditLinksModal] = useState(false);
   const [editMode, setEditMode] = useState(false);
+  useEffect(() => {
+    return () => {
+      setEditMode(false);
+    };
+  }, [router]);
+
   const collectivePermissions = useCollectivePermissions(
     selectedLinks.map((link) => link.collectionId as number)
   );
@@ -124,31 +132,37 @@ export default function PinnedLinks() {
               </div>
             )}
             <div className="flex gap-3">
-              {(collectivePermissions === true ||
-                collectivePermissions?.canUpdate) && (
-                <button
-                  onClick={() => setBulkEditLinksModal(true)}
-                  className="btn btn-sm btn-accent text-white w-fit ml-auto"
-                  disabled={selectedLinks.length === 0}
-                >
-                  Edit
-                </button>
-              )}
-              {(collectivePermissions === true ||
-                collectivePermissions?.canDelete) && (
-                <button
-                  onClick={(e) => {
-                    (document?.activeElement as HTMLElement)?.blur();
-                    e.shiftKey
-                      ? bulkDeleteLinks()
-                      : setBulkDeleteLinksModal(true);
-                  }}
-                  className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
-                  disabled={selectedLinks.length === 0}
-                >
-                  Delete
-                </button>
-              )}
+              <button
+                onClick={() => setBulkEditLinksModal(true)}
+                className="btn btn-sm btn-accent text-white w-fit ml-auto"
+                disabled={
+                  selectedLinks.length === 0 ||
+                  !(
+                    collectivePermissions === true ||
+                    collectivePermissions?.canUpdate
+                  )
+                }
+              >
+                Edit
+              </button>
+              <button
+                onClick={(e) => {
+                  (document?.activeElement as HTMLElement)?.blur();
+                  e.shiftKey
+                    ? bulkDeleteLinks()
+                    : setBulkDeleteLinksModal(true);
+                }}
+                className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
+                disabled={
+                  selectedLinks.length === 0 ||
+                  !(
+                    collectivePermissions === true ||
+                    collectivePermissions?.canDelete
+                  )
+                }
+              >
+                Delete
+              </button>
             </div>
           </div>
         )}