From 2112176d6e237ec75f9b5a1fbc97e06df946e5dd Mon Sep 17 00:00:00 2001
From: Isaac Wise <iamisaacwise2006@gmail.com>
Date: Sun, 11 Feb 2024 02:48:34 -0600
Subject: [PATCH] Fixed disabled buttons

---
 components/LinkViews/LinkCard.tsx |  6 --
 pages/collections/[id].tsx        | 94 +++++++++++++++---------------
 pages/links/index.tsx             | 96 ++++++++++++++++---------------
 pages/links/pinned.tsx            | 94 +++++++++++++++---------------
 pages/tags/[id].tsx               | 38 ++++++------
 5 files changed, 164 insertions(+), 164 deletions(-)

diff --git a/components/LinkViews/LinkCard.tsx b/components/LinkViews/LinkCard.tsx
index 29c7f87..d5f6ada 100644
--- a/components/LinkViews/LinkCard.tsx
+++ b/components/LinkViews/LinkCard.tsx
@@ -135,12 +135,6 @@ export default function LinkCard({
                 <div className="duration-100 h-40 bg-opacity-80 skeleton rounded-none"></div>
               )}
               <div
-                style={
-                  {
-                    // background:
-                    //   "radial-gradient(circle, rgba(255, 255, 255, 0.5), transparent)",
-                  }
-                }
                 className="absolute top-0 left-0 right-0 bottom-0 rounded-t-2xl flex items-center justify-center shadow rounded-md"
               >
                 <LinkIcon link={link} />
diff --git a/pages/collections/[id].tsx b/pages/collections/[id].tsx
index 2d58286..e1dfd58 100644
--- a/pages/collections/[id].tsx
+++ b/pages/collections/[id].tsx
@@ -329,53 +329,57 @@ export default function Index() {
           </div>
         </div>
 
-        <div className={editMode ? "w-full flex justify-between items-center min-h-[32px]" : "w-full flex justify-end items-center min-h-[32px]"}>
-          {links.length > 0 && editMode && (
-            <div className="flex gap-3 ml-3">
-              <input
-                type="checkbox"
-                className="checkbox checkbox-primary"
-                onChange={() => handleSelectAll()}
-                checked={
-                  selectedLinks.length === links.length && links.length > 0
-                }
-              />
-              {selectedLinks.length > 0 ? (
-                <span>
-                  {selectedLinks.length}{" "}
-                  {selectedLinks.length === 1 ? "link" : "links"} selected
-                </span>
-              ) : (
-                <span>Nothing selected</span>
-              )}
+        {editMode && (
+          <div className="w-full flex justify-between items-center min-h-[32px]">
+            {links.length > 0 && (
+              <div className="flex gap-3 ml-3">
+                <input
+                  type="checkbox"
+                  className="checkbox checkbox-primary"
+                  onChange={() => handleSelectAll()}
+                  checked={
+                    selectedLinks.length === links.length && links.length > 0
+                  }
+                />
+                {selectedLinks.length > 0 ? (
+                  <span>
+                    {selectedLinks.length}{" "}
+                    {selectedLinks.length === 1 ? "link" : "links"} selected
+                  </span>
+                ) : (
+                  <span>Nothing selected</span>
+                )}
+              </div>
+            )}
+            <div className="flex gap-3">
+              {(permissions === true ||
+                permissions?.canUpdate) && (
+                  <button
+                    onClick={() => setBulkEditLinksModal(true)}
+                    className="btn btn-sm btn-accent text-white w-fit ml-auto"
+                    disabled={selectedLinks.length === 0}
+                  >
+                    Edit
+                  </button>
+                )}
+              {(permissions === true ||
+                permissions?.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>
+                )}
             </div>
-          )}
-          <div className="flex gap-3">
-            {(permissions === true || permissions?.canUpdate) && (
-              <button
-                onClick={() => setBulkEditLinksModal(true)}
-                className="btn btn-sm btn-accent  text-white w-fit ml-auto"
-                disabled={!editMode || selectedLinks.length === 0}
-              >
-                Edit
-              </button>
-            )}
-            {(permissions === true || permissions?.canDelete) && (
-              <button
-                onClick={(e) => {
-                  (document?.activeElement as HTMLElement)?.blur();
-                  e.shiftKey
-                    ? bulkDeleteLinks()
-                    : setBulkDeleteLinksModal(true);
-                }}
-                disabled={!editMode || selectedLinks.length === 0}
-                className="btn btn-sm bg-red-400 hover:bg-red-500 text-white w-fit ml-auto"
-              >
-                Delete
-              </button>
-            )}
           </div>
-        </div>
+        )}
 
         {links.some((e) => e.collectionId === Number(router.query.id)) ? (
           <LinkComponent
diff --git a/pages/links/index.tsx b/pages/links/index.tsx
index e936500..6518d9b 100644
--- a/pages/links/index.tsx
+++ b/pages/links/index.tsx
@@ -101,55 +101,57 @@ export default function Links() {
           </div>
         </div>
 
-        <div className={editMode ? "w-full flex justify-between items-center min-h-[32px]" : "w-full flex justify-end items-center min-h-[32px]"}>
-          {links.length > 0 && editMode && (
-            <div className="flex gap-3 ml-3">
-              <input
-                type="checkbox"
-                className="checkbox checkbox-primary"
-                onChange={() => handleSelectAll()}
-                checked={
-                  selectedLinks.length === links.length && links.length > 0
-                }
-              />
-              {selectedLinks.length > 0 ? (
-                <span>
-                  {selectedLinks.length}{" "}
-                  {selectedLinks.length === 1 ? "link" : "links"} selected
-                </span>
-              ) : (
-                <span>Nothing selected</span>
-              )}
+        {editMode && (
+          <div className="w-full flex justify-between items-center min-h-[32px]">
+            {links.length > 0 && (
+              <div className="flex gap-3 ml-3">
+                <input
+                  type="checkbox"
+                  className="checkbox checkbox-primary"
+                  onChange={() => handleSelectAll()}
+                  checked={
+                    selectedLinks.length === links.length && links.length > 0
+                  }
+                />
+                {selectedLinks.length > 0 ? (
+                  <span>
+                    {selectedLinks.length}{" "}
+                    {selectedLinks.length === 1 ? "link" : "links"} selected
+                  </span>
+                ) : (
+                  <span>Nothing selected</span>
+                )}
+              </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>
+                )}
             </div>
-          )}
-          <div className="flex gap-3">
-            {(collectivePermissions === true ||
-              collectivePermissions?.canUpdate) && (
-                <button
-                  onClick={() => setBulkEditLinksModal(true)}
-                  disabled={!editMode}
-                  className="btn btn-sm btn-accent text-white w-fit ml-auto"
-                >
-                  Edit
-                </button>
-              )}
-            {(collectivePermissions === true ||
-              collectivePermissions?.canDelete) && (
-                <button
-                  onClick={(e) => {
-                    (document?.activeElement as HTMLElement)?.blur();
-                    e.shiftKey
-                      ? bulkDeleteLinks()
-                      : setBulkDeleteLinksModal(true);
-                  }}
-                  disabled={!editMode}
-                  className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
-                >
-                  Delete
-                </button>
-              )}
           </div>
-        </div>
+        )}
 
         {links[0] ? (
           <LinkComponent editMode={editMode} links={links} />
diff --git a/pages/links/pinned.tsx b/pages/links/pinned.tsx
index f456653..6714554 100644
--- a/pages/links/pinned.tsx
+++ b/pages/links/pinned.tsx
@@ -100,53 +100,57 @@ export default function PinnedLinks() {
           </div>
         </div>
 
-        <div className={editMode ? "w-full flex justify-between items-center min-h-[32px]" : "w-full flex justify-end items-center min-h-[32px]"}>
-          {links.length > 0 && editMode && (
-            <div className="flex gap-3 ml-3">
-              <input
-                type="checkbox"
-                className="checkbox checkbox-primary"
-                onChange={() => handleSelectAll()}
-                checked={
-                  selectedLinks.length === links.length && links.length > 0
-                }
-              />
-              {selectedLinks.length > 0 ? (
-                <span>
-                  {selectedLinks.length}{" "}
-                  {selectedLinks.length === 1 ? "link" : "links"} selected
-                </span>
-              ) : (
-                <span>Nothing selected</span>
-              )}
+        {editMode && (
+          <div className="w-full flex justify-between items-center min-h-[32px]">
+            {links.length > 0 && (
+              <div className="flex gap-3 ml-3">
+                <input
+                  type="checkbox"
+                  className="checkbox checkbox-primary"
+                  onChange={() => handleSelectAll()}
+                  checked={
+                    selectedLinks.length === links.length && links.length > 0
+                  }
+                />
+                {selectedLinks.length > 0 ? (
+                  <span>
+                    {selectedLinks.length}{" "}
+                    {selectedLinks.length === 1 ? "link" : "links"} selected
+                  </span>
+                ) : (
+                  <span>Nothing selected</span>
+                )}
+              </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>
+                )}
             </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={!editMode || selectedLinks.length === 0}
-              >
-                Edit
-              </button>
-            )}
-            {(collectivePermissions === true || collectivePermissions?.canDelete) && (
-              <button
-                onClick={(e) => {
-                  (document?.activeElement as HTMLElement)?.blur();
-                  e.shiftKey
-                    ? bulkDeleteLinks()
-                    : setBulkDeleteLinksModal(true);
-                }}
-                disabled={!editMode || selectedLinks.length === 0}
-                className="btn btn-sm bg-red-400 hover:bg-red-500 text-white w-fit ml-auto"
-              >
-                Delete
-              </button>
-            )}
           </div>
-        </div>
+        )}
 
         {links.some((e) => e.pinnedBy && e.pinnedBy[0]) ? (
           <LinkComponent editMode={editMode} links={links} />
diff --git a/pages/tags/[id].tsx b/pages/tags/[id].tsx
index b6dfaf3..2ba7a58 100644
--- a/pages/tags/[id].tsx
+++ b/pages/tags/[id].tsx
@@ -115,8 +115,7 @@ export default function Index() {
 
   const bulkDeleteLinks = async () => {
     const load = toast.loading(
-      `Deleting ${selectedLinks.length} Link${
-        selectedLinks.length > 1 ? "s" : ""
+      `Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
       }...`
     );
 
@@ -128,8 +127,7 @@ export default function Index() {
 
     response.ok &&
       toast.success(
-        `Deleted ${selectedLinks.length} Link${
-          selectedLinks.length > 1 ? "s" : ""
+        `Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
         }!`
       );
   };
@@ -188,11 +186,10 @@ export default function Index() {
                   </p>
                   <div className="relative">
                     <div
-                      className={`dropdown dropdown-bottom font-normal ${
-                        activeTag?.name.length && activeTag?.name.length > 8
-                          ? "dropdown-end"
-                          : ""
-                      }`}
+                      className={`dropdown dropdown-bottom font-normal ${activeTag?.name.length && activeTag?.name.length > 8
+                        ? "dropdown-end"
+                        : ""
+                        }`}
                     >
                       <div
                         tabIndex={0}
@@ -244,11 +241,10 @@ export default function Index() {
                 setEditMode(!editMode);
                 setSelectedLinks([]);
               }}
-              className={`btn btn-square btn-sm btn-ghost ${
-                editMode
-                  ? "bg-primary/20 hover:bg-primary/20"
-                  : "hover:bg-neutral/20"
-              }`}
+              className={`btn btn-square btn-sm btn-ghost ${editMode
+                ? "bg-primary/20 hover:bg-primary/20"
+                : "hover:bg-neutral/20"
+                }`}
             >
               <i className="bi-pencil-fill text-neutral text-xl"></i>
             </div>
@@ -279,19 +275,18 @@ export default function Index() {
               </div>
             )}
             <div className="flex gap-3">
-              {selectedLinks.length > 0 &&
-                (collectivePermissions === true ||
-                  collectivePermissions?.canUpdate) && (
+              {(collectivePermissions === true ||
+                collectivePermissions?.canUpdate) && (
                   <button
                     onClick={() => setBulkEditLinksModal(true)}
-                    className="btn btn-sm btn-accent dark:border-violet-400 text-white w-fit ml-auto"
+                    className="btn btn-sm btn-accent text-white w-fit ml-auto"
+                    disabled={selectedLinks.length === 0}
                   >
                     Edit
                   </button>
                 )}
-              {selectedLinks.length > 0 &&
-                (collectivePermissions === true ||
-                  collectivePermissions?.canDelete) && (
+              {(collectivePermissions === true ||
+                collectivePermissions?.canDelete) && (
                   <button
                     onClick={(e) => {
                       (document?.activeElement as HTMLElement)?.blur();
@@ -300,6 +295,7 @@ export default function Index() {
                         : 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>