diff --git a/components/Dropdown.tsx b/components/Dropdown.tsx
index d1944c8..90371d8 100644
--- a/components/Dropdown.tsx
+++ b/components/Dropdown.tsx
@@ -61,8 +61,7 @@ export default function Dropdown({
   }, [points, dropdownHeight]);
 
   return (
-    !points ||
-    (pos && (
+    (!points || pos) && (
       <ClickAwayHandler
         onMount={(e) => {
           setDropdownHeight(e.height);
@@ -104,6 +103,6 @@ export default function Dropdown({
           );
         })}
       </ClickAwayHandler>
-    ))
+    )
   );
 }
diff --git a/components/InputSelect/CollectionSelection.tsx b/components/InputSelect/CollectionSelection.tsx
index 64c25d7..81bef39 100644
--- a/components/InputSelect/CollectionSelection.tsx
+++ b/components/InputSelect/CollectionSelection.tsx
@@ -104,7 +104,7 @@ export default function CollectionSelection({
         onChange={onChange}
         options={options}
         styles={styles}
-        defaultValue={showDefaultValue && defaultValue}
+        defaultValue={showDefaultValue ? defaultValue : null}
         components={{
           Option: customOption,
         }}
@@ -120,7 +120,7 @@ export default function CollectionSelection({
         onChange={onChange}
         options={options}
         styles={styles}
-        defaultValue={showDefaultValue && defaultValue}
+        defaultValue={showDefaultValue ? defaultValue : null}
         components={{
           Option: customOption,
         }}
diff --git a/components/LinkViews/LinkComponents/LinkActions.tsx b/components/LinkViews/LinkComponents/LinkActions.tsx
index 9081e47..f93f969 100644
--- a/components/LinkViews/LinkComponents/LinkActions.tsx
+++ b/components/LinkViews/LinkComponents/LinkActions.tsx
@@ -12,22 +12,20 @@ import { useTranslation } from "next-i18next";
 import { useUser } from "@/hooks/store/user";
 import { useDeleteLink, useUpdateLink } from "@/hooks/store/links";
 import toast from "react-hot-toast";
+import LinkDetailModal from "@/components/ModalContent/LinkDetailModal";
+import { useRouter } from "next/router";
 
 type Props = {
   link: LinkIncludingShortenedCollectionAndTags;
   collection: CollectionIncludingMembersAndLinkCount;
   position?: string;
-  toggleShowInfo?: () => void;
-  linkInfo?: boolean;
   alignToTop?: boolean;
   flipDropdown?: boolean;
 };
 
 export default function LinkActions({
   link,
-  toggleShowInfo,
   position,
-  linkInfo,
   alignToTop,
   flipDropdown,
 }: Props) {
@@ -36,6 +34,7 @@ export default function LinkActions({
   const permissions = usePermissions(link.collection.id as number);
 
   const [editLinkModal, setEditLinkModal] = useState(false);
+  const [linkDetailModal, setLinkDetailModal] = useState(false);
   const [deleteLinkModal, setDeleteLinkModal] = useState(false);
   const [preservedFormatsModal, setPreservedFormatsModal] = useState(false);
 
@@ -70,120 +69,137 @@ export default function LinkActions({
     );
   };
 
+  const router = useRouter();
+
+  const isPublicRoute = router.pathname.startsWith("/public") ? true : false;
+
   return (
     <>
-      <div
-        className={`dropdown dropdown-left absolute ${
-          position || "top-3 right-3"
-        } ${alignToTop ? "" : "dropdown-end"} z-20`}
-      >
+      {isPublicRoute ? (
         <div
-          tabIndex={0}
-          role="button"
-          onMouseDown={dropdownTriggerer}
-          className="btn btn-ghost btn-sm btn-square text-neutral"
+          className={`absolute ${position || "top-3 right-3"} ${
+            alignToTop ? "" : "dropdown-end"
+          } z-20`}
+          onClick={() => setLinkDetailModal(true)}
         >
-          <i title="More" className="bi-three-dots text-xl" />
+          <div className="btn btn-ghost btn-sm btn-square text-neutral">
+            <i title="More" className="bi-three-dots text-xl" />
+          </div>
         </div>
-        <ul
-          className={`dropdown-content z-[20] menu shadow bg-base-200 border border-neutral-content rounded-box mr-1 ${
-            alignToTop ? "" : "translate-y-10"
-          }`}
+      ) : (
+        <div
+          className={`dropdown dropdown-left absolute ${
+            position || "top-3 right-3"
+          } ${alignToTop ? "" : "dropdown-end"} z-20`}
         >
-          <li>
-            <div
-              role="button"
-              tabIndex={0}
-              onClick={() => {
-                (document?.activeElement as HTMLElement)?.blur();
-                pinLink();
-              }}
-              className="whitespace-nowrap"
-            >
-              {link?.pinnedBy && link.pinnedBy[0]
-                ? t("unpin")
-                : t("pin_to_dashboard")}
-            </div>
-          </li>
-          {linkInfo !== undefined && toggleShowInfo && (
+          <div
+            tabIndex={0}
+            role="button"
+            onMouseDown={dropdownTriggerer}
+            className="btn btn-ghost btn-sm btn-square text-neutral"
+          >
+            <i title="More" className="bi-three-dots text-xl" />
+          </div>
+          <ul
+            className={`dropdown-content z-[20] menu shadow bg-base-200 border border-neutral-content rounded-box mr-1 ${
+              alignToTop ? "" : "translate-y-10"
+            }`}
+          >
+            {permissions === true ||
+              (permissions?.canUpdate && (
+                <li>
+                  <div
+                    role="button"
+                    tabIndex={0}
+                    onClick={() => {
+                      (document?.activeElement as HTMLElement)?.blur();
+                      pinLink();
+                    }}
+                    className="whitespace-nowrap"
+                  >
+                    {link?.pinnedBy && link.pinnedBy[0]
+                      ? t("unpin")
+                      : t("pin_to_dashboard")}
+                  </div>
+                </li>
+              ))}
             <li>
               <div
                 role="button"
                 tabIndex={0}
                 onClick={() => {
                   (document?.activeElement as HTMLElement)?.blur();
-                  toggleShowInfo();
+                  setLinkDetailModal(true);
                 }}
                 className="whitespace-nowrap"
               >
-                {!linkInfo ? t("show_link_details") : t("hide_link_details")}
+                {t("show_link_details")}
               </div>
             </li>
-          )}
-          {(permissions === true || permissions?.canUpdate) && (
-            <li>
-              <div
-                role="button"
-                tabIndex={0}
-                onClick={() => {
-                  (document?.activeElement as HTMLElement)?.blur();
-                  setEditLinkModal(true);
-                }}
-                className="whitespace-nowrap"
-              >
-                {t("edit_link")}
-              </div>
-            </li>
-          )}
-          {link.type === "url" && (
-            <li>
-              <div
-                role="button"
-                tabIndex={0}
-                onClick={() => {
-                  (document?.activeElement as HTMLElement)?.blur();
-                  setPreservedFormatsModal(true);
-                }}
-                className="whitespace-nowrap"
-              >
-                {t("preserved_formats")}
-              </div>
-            </li>
-          )}
-          {(permissions === true || permissions?.canDelete) && (
-            <li>
-              <div
-                role="button"
-                tabIndex={0}
-                onClick={async (e) => {
-                  (document?.activeElement as HTMLElement)?.blur();
-                  e.shiftKey
-                    ? async () => {
-                        const load = toast.loading(t("deleting"));
+            {(permissions === true || permissions?.canUpdate) && (
+              <li>
+                <div
+                  role="button"
+                  tabIndex={0}
+                  onClick={() => {
+                    (document?.activeElement as HTMLElement)?.blur();
+                    setEditLinkModal(true);
+                  }}
+                  className="whitespace-nowrap"
+                >
+                  {t("edit_link")}
+                </div>
+              </li>
+            )}
+            {link.type === "url" && (
+              <li>
+                <div
+                  role="button"
+                  tabIndex={0}
+                  onClick={() => {
+                    (document?.activeElement as HTMLElement)?.blur();
+                    setPreservedFormatsModal(true);
+                  }}
+                  className="whitespace-nowrap"
+                >
+                  {t("preserved_formats")}
+                </div>
+              </li>
+            )}
+            {(permissions === true || permissions?.canDelete) && (
+              <li>
+                <div
+                  role="button"
+                  tabIndex={0}
+                  onClick={async (e) => {
+                    (document?.activeElement as HTMLElement)?.blur();
+                    e.shiftKey
+                      ? async () => {
+                          const load = toast.loading(t("deleting"));
 
-                        await deleteLink.mutateAsync(link.id as number, {
-                          onSettled: (data, error) => {
-                            toast.dismiss(load);
-
-                            if (error) {
-                              toast.error(error.message);
-                            } else {
-                              toast.success(t("deleted"));
-                            }
-                          },
-                        });
-                      }
-                    : setDeleteLinkModal(true);
-                }}
-                className="whitespace-nowrap"
-              >
-                {t("delete")}
-              </div>
-            </li>
-          )}
-        </ul>
-      </div>
+                          await deleteLink.mutateAsync(link.id as number, {
+                            onSettled: (data, error) => {
+                              toast.dismiss(load);
 
+                              if (error) {
+                                toast.error(error.message);
+                              } else {
+                                toast.success(t("deleted"));
+                              }
+                            },
+                          });
+                        }
+                      : setDeleteLinkModal(true);
+                  }}
+                  className="whitespace-nowrap"
+                >
+                  {t("delete")}
+                </div>
+              </li>
+            )}
+          </ul>
+        </div>
+      )}
       {editLinkModal && (
         <EditLinkModal
           onClose={() => setEditLinkModal(false)}
@@ -202,6 +218,13 @@ export default function LinkActions({
           link={link}
         />
       )}
+      {linkDetailModal && (
+        <LinkDetailModal
+          onClose={() => setLinkDetailModal(false)}
+          onEdit={() => setEditLinkModal(true)}
+          link={link}
+        />
+      )}
     </>
   );
 }
diff --git a/components/ModalContent/EditCollectionSharingModal.tsx b/components/ModalContent/EditCollectionSharingModal.tsx
index 9f84cb1..04c44b0 100644
--- a/components/ModalContent/EditCollectionSharingModal.tsx
+++ b/components/ModalContent/EditCollectionSharingModal.tsx
@@ -132,7 +132,7 @@ export default function EditCollectionSharingModal({
         )}
 
         {collection.isPublic && (
-          <div className={permissions === true ? "pl-5" : ""}>
+          <div>
             <p className="mb-2">{t("sharable_link_guide")}</p>
             <div className="w-full hide-scrollbar overflow-x-auto whitespace-nowrap rounded-md p-2 bg-base-200 border-neutral-content border-solid border flex items-center gap-2 justify-between">
               {publicCollectionURL}
diff --git a/components/ModalContent/UploadFileModal.tsx b/components/ModalContent/UploadFileModal.tsx
index 1627bb1..cf5cf47 100644
--- a/components/ModalContent/UploadFileModal.tsx
+++ b/components/ModalContent/UploadFileModal.tsx
@@ -150,7 +150,7 @@ export default function UploadFileModal({ onClose }: Props) {
           <label className="btn h-10 btn-sm w-full border border-neutral-content hover:border-neutral-content flex justify-between">
             <input
               type="file"
-              accept=".pdf,.png,.jpg,.jpeg,.html"
+              accept=".pdf,.png,.jpg,.jpeg"
               className="cursor-pointer custom-file-input"
               onChange={(e) => e.target.files && setFile(e.target.files[0])}
             />
diff --git a/components/ToggleDarkMode.tsx b/components/ToggleDarkMode.tsx
index 9404d41..28631b9 100644
--- a/components/ToggleDarkMode.tsx
+++ b/components/ToggleDarkMode.tsx
@@ -21,9 +21,8 @@ export default function ToggleDarkMode({ className }: Props) {
   useEffect(() => {
     if (theme) {
       updateSettings({ theme });
-      localStorage.setItem("theme", theme);
     }
-  }, [theme, updateSettings]);
+  }, [theme]);
 
   return (
     <div
diff --git a/lib/api/controllers/migration/exportData.ts b/lib/api/controllers/migration/exportData.ts
index 3829c59..917406c 100644
--- a/lib/api/controllers/migration/exportData.ts
+++ b/lib/api/controllers/migration/exportData.ts
@@ -22,32 +22,5 @@ export default async function exportData(userId: number) {
 
   const { password, id, ...userData } = user;
 
-  function redactIds(data: object | object[]): void {
-    if (Array.isArray(data)) {
-      data.forEach((item) => redactIds(item));
-    } else if (data !== null && typeof data === "object") {
-      const fieldsToRedact = ["id", "parentId", "collectionId", "ownerId"];
-
-      fieldsToRedact.forEach((field) => {
-        if (field in data) {
-          delete (data as any)[field];
-        }
-      });
-
-      // Recursively call redactIds for each property that is an object or an array
-      Object.keys(data).forEach((key) => {
-        const value = (data as any)[key];
-        if (
-          value !== null &&
-          (typeof value === "object" || Array.isArray(value))
-        ) {
-          redactIds(value);
-        }
-      });
-    }
-  }
-
-  redactIds(userData);
-
   return { response: userData, status: 200 };
 }
diff --git a/lib/api/generatePreview.ts b/lib/api/generatePreview.ts
index 2dc325b..1c6ca94 100644
--- a/lib/api/generatePreview.ts
+++ b/lib/api/generatePreview.ts
@@ -16,7 +16,7 @@ const generatePreview = async (
         return;
       }
 
-      image.resize(1280, Jimp.AUTO).quality(20);
+      image.resize(1000, Jimp.AUTO).quality(20);
       const processedBuffer = await image.getBufferAsync(Jimp.MIME_JPEG);
 
       if (
diff --git a/pages/dashboard.tsx b/pages/dashboard.tsx
index e0b107f..0bdb525 100644
--- a/pages/dashboard.tsx
+++ b/pages/dashboard.tsx
@@ -135,7 +135,7 @@ export default function Dashboard() {
 
             <DashboardItem
               name={tags.length === 1 ? t("tag") : t("tags")}
-              value={tags.length * numberOfLinks}
+              value={tags.length}
               icon={"bi-hash"}
             />
           </div>
diff --git a/pages/public/collections/[id].tsx b/pages/public/collections/[id].tsx
index 4c5f777..d49660f 100644
--- a/pages/public/collections/[id].tsx
+++ b/pages/public/collections/[id].tsx
@@ -88,160 +88,162 @@ export default function PublicCollections() {
     (localStorage.getItem("viewMode") as ViewMode) || ViewMode.Card
   );
 
-  if (!collection) return null;
+  if (!collection) return <></>;
+  else
+    return (
+      <div
+        className="h-96"
+        style={{
+          backgroundImage: `linear-gradient(${collection?.color}30 10%, ${
+            settings.theme === "dark" ? "#262626" : "#f3f4f6"
+          } 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
+        }}
+      >
+        {collection && (
+          <Head>
+            <title>{collection.name} | Linkwarden</title>
+            <meta
+              property="og:title"
+              content={`${collection.name} | Linkwarden`}
+              key="title"
+            />
+          </Head>
+        )}
+        <div className="lg:w-3/4 w-full mx-auto p-5 bg">
+          <div className="flex items-center justify-between">
+            <p className="text-4xl font-thin mb-2 capitalize mt-10">
+              {collection.name}
+            </p>
+            <div className="flex gap-2 items-center mt-8 min-w-fit">
+              <ToggleDarkMode />
 
-  return (
-    <div
-      className="h-96"
-      style={{
-        backgroundImage: `linear-gradient(${collection?.color}30 10%, ${
-          settings.theme === "dark" ? "#262626" : "#f3f4f6"
-        } 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
-      }}
-    >
-      {collection && (
-        <Head>
-          <title>{collection.name} | Linkwarden</title>
-          <meta
-            property="og:title"
-            content={`${collection.name} | Linkwarden`}
-            key="title"
-          />
-        </Head>
-      )}
-      <div className="lg:w-3/4 w-full mx-auto p-5 bg">
-        <div className="flex items-center justify-between">
-          <p className="text-4xl font-thin mb-2 capitalize mt-10">
-            {collection.name}
-          </p>
-          <div className="flex gap-2 items-center mt-8 min-w-fit">
-            <ToggleDarkMode />
-
-            <Link href="https://linkwarden.app/" target="_blank">
-              <Image
-                src={`/icon.png`}
-                width={551}
-                height={551}
-                alt="Linkwarden"
-                title={t("list_created_with_linkwarden")}
-                className="h-8 w-fit mx-auto rounded"
-              />
-            </Link>
+              <Link href="https://linkwarden.app/" target="_blank">
+                <Image
+                  src={`/icon.png`}
+                  width={551}
+                  height={551}
+                  alt="Linkwarden"
+                  title={t("list_created_with_linkwarden")}
+                  className="h-8 w-fit mx-auto rounded"
+                />
+              </Link>
+            </div>
           </div>
-        </div>
 
-        <div className="mt-3">
-          <div className={`min-w-[15rem]`}>
-            <div className="flex gap-1 justify-center sm:justify-end items-center w-fit">
-              <div
-                className="flex items-center btn px-2 btn-ghost rounded-full"
-                onClick={() => setEditCollectionSharingModal(true)}
-              >
-                {collectionOwner.id && (
-                  <ProfilePhoto
-                    src={collectionOwner.image || undefined}
-                    name={collectionOwner.name}
-                  />
-                )}
-                {collection.members
-                  .sort((a, b) => (a.userId as number) - (b.userId as number))
-                  .map((e, i) => {
-                    return (
-                      <ProfilePhoto
-                        key={i}
-                        src={e.user.image ? e.user.image : undefined}
-                        className="-ml-3"
-                        name={e.user.name}
-                      />
-                    );
-                  })
-                  .slice(0, 3)}
-                {collection.members.length - 3 > 0 && (
-                  <div className={`avatar drop-shadow-md placeholder -ml-3`}>
-                    <div className="bg-base-100 text-neutral rounded-full w-8 h-8 ring-2 ring-neutral-content">
-                      <span>+{collection.members.length - 3}</span>
-                    </div>
-                  </div>
-                )}
-              </div>
-
-              <p className="text-neutral text-sm">
-                {collection.members.length > 0 &&
-                collection.members.length === 1
-                  ? t("by_author_and_other", {
-                      author: collectionOwner.name,
-                      count: collection.members.length,
+          <div className="mt-3">
+            <div className={`min-w-[15rem]`}>
+              <div className="flex gap-1 justify-center sm:justify-end items-center w-fit">
+                <div
+                  className="flex items-center btn px-2 btn-ghost rounded-full"
+                  onClick={() => setEditCollectionSharingModal(true)}
+                >
+                  {collectionOwner.id && (
+                    <ProfilePhoto
+                      src={collectionOwner.image || undefined}
+                      name={collectionOwner.name}
+                    />
+                  )}
+                  {collection.members
+                    .sort((a, b) => (a.userId as number) - (b.userId as number))
+                    .map((e, i) => {
+                      return (
+                        <ProfilePhoto
+                          key={i}
+                          src={e.user.image ? e.user.image : undefined}
+                          className="-ml-3"
+                          name={e.user.name}
+                        />
+                      );
                     })
-                  : collection.members.length > 0 &&
-                      collection.members.length !== 1
-                    ? t("by_author_and_others", {
+                    .slice(0, 3)}
+                  {collection.members.length - 3 > 0 && (
+                    <div className={`avatar drop-shadow-md placeholder -ml-3`}>
+                      <div className="bg-base-100 text-neutral rounded-full w-8 h-8 ring-2 ring-neutral-content">
+                        <span>+{collection.members.length - 3}</span>
+                      </div>
+                    </div>
+                  )}
+                </div>
+
+                <p className="text-neutral text-sm">
+                  {collection.members.length > 0 &&
+                  collection.members.length === 1
+                    ? t("by_author_and_other", {
                         author: collectionOwner.name,
                         count: collection.members.length,
                       })
-                    : t("by_author", {
-                        author: collectionOwner.name,
-                      })}
-              </p>
+                    : collection.members.length > 0 &&
+                        collection.members.length !== 1
+                      ? t("by_author_and_others", {
+                          author: collectionOwner.name,
+                          count: collection.members.length,
+                        })
+                      : t("by_author", {
+                          author: collectionOwner.name,
+                        })}
+                </p>
+              </div>
             </div>
           </div>
-        </div>
 
-        <p className="mt-5">{collection.description}</p>
+          <p className="mt-5">{collection.description}</p>
 
-        <div className="divider mt-5 mb-0"></div>
+          <div className="divider mt-5 mb-0"></div>
 
-        <div className="flex mb-5 mt-10 flex-col gap-5">
-          <LinkListOptions
-            t={t}
-            viewMode={viewMode}
-            setViewMode={setViewMode}
-            sortBy={sortBy}
-            setSortBy={setSortBy}
-            searchFilter={searchFilter}
-            setSearchFilter={setSearchFilter}
-          >
-            <SearchBar
-              placeholder={
-                collection._count?.links === 1
-                  ? t("search_count_link", {
-                      count: collection._count?.links,
-                    })
-                  : t("search_count_links", {
-                      count: collection._count?.links,
-                    })
+          <div className="flex mb-5 mt-10 flex-col gap-5">
+            <LinkListOptions
+              t={t}
+              viewMode={viewMode}
+              setViewMode={setViewMode}
+              sortBy={sortBy}
+              setSortBy={setSortBy}
+              searchFilter={searchFilter}
+              setSearchFilter={setSearchFilter}
+            >
+              <SearchBar
+                placeholder={
+                  collection._count?.links === 1
+                    ? t("search_count_link", {
+                        count: collection._count?.links,
+                      })
+                    : t("search_count_links", {
+                        count: collection._count?.links,
+                      })
+                }
+              />
+            </LinkListOptions>
+
+            <Links
+              links={
+                links?.map((e, i) => {
+                  const linkWithCollectionData = {
+                    ...e,
+                    collection: collection, // Append collection data
+                  };
+                  return linkWithCollectionData;
+                }) as any
               }
+              layout={viewMode}
+              placeholderCount={1}
+              useData={data}
             />
-          </LinkListOptions>
+            {!data.isLoading && links && !links[0] && (
+              <p>{t("nothing_found")}</p>
+            )}
 
-          <Links
-            links={
-              links?.map((e, i) => {
-                const linkWithCollectionData = {
-                  ...e,
-                  collection: collection, // Append collection data
-                };
-                return linkWithCollectionData;
-              }) as any
-            }
-            layout={viewMode}
-            placeholderCount={1}
-            useData={data}
-          />
-          {!data.isLoading && links && !links[0] && <p>{t("nothing_found")}</p>}
-
-          {/* <p className="text-center text-neutral">
+            {/* <p className="text-center text-neutral">
         List created with <span className="text-black">Linkwarden.</span>
         </p> */}
+          </div>
         </div>
+        {editCollectionSharingModal && (
+          <EditCollectionSharingModal
+            onClose={() => setEditCollectionSharingModal(false)}
+            activeCollection={collection}
+          />
+        )}
       </div>
-      {editCollectionSharingModal && (
-        <EditCollectionSharingModal
-          onClose={() => setEditCollectionSharingModal(false)}
-          activeCollection={collection}
-        />
-      )}
-    </div>
-  );
+    );
 }
 
 export { getServerSideProps };