improve link refresh logic + many changes and improvements

pages/collections/[id].tsx

@@ -55,6 +55,8 @@ export default function Index() {
     name: "",
     username: "",
     image: "",
+    archiveAsScreenshot: undefined as unknown as boolean,
+    archiveAsPDF: undefined as unknown as boolean,
   });
 
   useEffect(() => {
@@ -70,6 +72,8 @@ export default function Index() {
           name: account.name,
           username: account.username as string,
           image: account.image as string,
+          archiveAsScreenshot: account.archiveAsScreenshot as boolean,
+          archiveAsPDF: account.archiveAsPDF as boolean,
         });
       }
     };
@@ -118,7 +122,7 @@ export default function Index() {
               </p>
             </div>
 
-            <div className="dropdown dropdown-bottom dropdown-end">
+            <div className="dropdown dropdown-bottom dropdown-end mt-2">
               <div
                 tabIndex={0}
                 role="button"

pages/collections/index.tsx

@@ -56,19 +56,11 @@ export default function Collections() {
 
         {sortedCollections.filter((e) => e.ownerId !== data?.user.id)[0] ? (
           <>
-            <div className="flex items-center gap-3 my-5">
-              <i className="bi-folder text-3xl sm:text-2xl text-primary drop-shadow"></i>
-
-              <div>
-                <p className="text-3xl capitalize font-thin">
-                  Other Collections
-                </p>
-
-                <p className="sm:text-sm text-xs">
-                  Shared collections you&apos;re a member of
-                </p>
-              </div>
-            </div>
+            <PageHeader
+              icon={"bi-folder"}
+              title={"Other Collections"}
+              description={"Shared collections you're a member of"}
+            />
 
             <div className="grid xl:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-5">
               {sortedCollections