improvements

components/LinkViews/LinkCard.tsx

@@ -18,6 +18,7 @@ import useOnScreen from "@/hooks/useOnScreen";
 import { generateLinkHref } from "@/lib/client/generateLinkHref";
 import useAccountStore from "@/store/account";
 import usePermissions from "@/hooks/usePermissions";
+import toast from "react-hot-toast";
 
 type Props = {
   link: LinkIncludingShortenedCollectionAndTags;
@@ -97,15 +98,25 @@ export default function LinkCard({ link, flipDropdown, editMode }: Props) {
   )
     ? "border-primary bg-base-300"
     : "border-neutral-content";
+
   const selectable =
     editMode &&
     (permissions === true || permissions?.canCreate || permissions?.canDelete);
 
+  // const unselectableStyle =
+  //   editMode && !selectable ? "pointer-events-none" : "";
+
   return (
     <div
       ref={ref}
       className={`${selectedStyle} border border-solid border-neutral-content bg-base-200 shadow-md hover:shadow-none duration-100 rounded-2xl relative`}
-      onClick={() => selectable && handleCheckboxClick(link)}
+      onClick={() =>
+        selectable
+          ? handleCheckboxClick(link)
+          : toast.error(
+              "You don't have permission to edit or delete this item."
+            )
+      }
     >
       {!editMode ? (
         <>

components/LinkViews/LinkList.tsx

@@ -49,7 +49,6 @@ export default function LinkCardCompact({
     }
   };
 
-
   let shortendURL;
 
   try {
@@ -82,6 +81,7 @@ export default function LinkCardCompact({
   )
     ? "border border-primary bg-base-300"
     : "border-transparent";
+
   const selectable =
     editMode &&
     (permissions === true || permissions?.canCreate || permissions?.canDelete);

components/ModalContent/EditCollectionSharingModal.tsx

@@ -234,11 +234,8 @@ export default function EditCollectionSharingModal({
                           : undefined;
 
                   return (
-                    <>
-                      <div
-                        key={i}
-                        className="relative p-3 bg-base-200 rounded-xl flex gap-2 justify-between border-none"
-                      >
+                    <React.Fragment key={i}>
+                      <div className="relative p-3 bg-base-200 rounded-xl flex gap-2 justify-between border-none">
                         <div
                           className={"flex items-center justify-between w-full"}
                         >
@@ -433,7 +430,7 @@ export default function EditCollectionSharingModal({
                         </div>
                       </div>
                       <div className="divider my-0 last:hidden h-[3px]"></div>
-                    </>
+                    </React.Fragment>
                   );
                 })}
             </div>