From 0dfd2664874d8b786e7fb5976010f34c377888f3 Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Sun, 23 Jul 2023 14:27:12 -0400
Subject: [PATCH 1/8] bug fix

---
 lib/api/controllers/collections/postCollection.ts | 2 +-
 lib/api/controllers/links/postLink.ts             | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/api/controllers/collections/postCollection.ts b/lib/api/controllers/collections/postCollection.ts
index 8e4cc99..917f02f 100644
--- a/lib/api/controllers/collections/postCollection.ts
+++ b/lib/api/controllers/collections/postCollection.ts
@@ -37,7 +37,7 @@ export default async function postCollection(
           id: userId,
         },
       },
-      name: collection.name,
+      name: collection.name.trim(),
       description: collection.description,
       color: collection.color,
       members: {
diff --git a/lib/api/controllers/links/postLink.ts b/lib/api/controllers/links/postLink.ts
index 2991235..7a1bf56 100644
--- a/lib/api/controllers/links/postLink.ts
+++ b/lib/api/controllers/links/postLink.ts
@@ -57,7 +57,7 @@ export default async function postLink(
             },
           },
           create: {
-            name: link.collection.name,
+            name: link.collection.name.trim(),
             ownerId: userId,
           },
         },

From 400939cb0b2a0c94eef50a9a889762793833f9c1 Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Sun, 23 Jul 2023 15:52:08 -0400
Subject: [PATCH 2/8] minor fix

---
 lib/api/controllers/collections/updateCollection.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/api/controllers/collections/updateCollection.ts b/lib/api/controllers/collections/updateCollection.ts
index 16a7d7f..7cafedd 100644
--- a/lib/api/controllers/collections/updateCollection.ts
+++ b/lib/api/controllers/collections/updateCollection.ts
@@ -37,7 +37,7 @@ export default async function updateCollection(
       },
 
       data: {
-        name: collection.name,
+        name: collection.name.trim(),
         description: collection.description,
         color: collection.color,
         isPublic: collection.isPublic,

From 6708be2dfde063353764056dbe2b7e32d7641298 Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Mon, 24 Jul 2023 07:25:15 -0400
Subject: [PATCH 3/8] improved responsiveness

---
 pages/collections/[id].tsx | 2 +-
 pages/tags/[id].tsx        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/pages/collections/[id].tsx b/pages/collections/[id].tsx
index 798a98a..097e4f1 100644
--- a/pages/collections/[id].tsx
+++ b/pages/collections/[id].tsx
@@ -236,7 +236,7 @@ export default function Index() {
           </div>
         </div>
         {links[0] ? (
-          <div className="grid 2xl:grid-cols-3 xl:grid-cols-2 gap-5">
+          <div className="grid grid-cols-1 2xl:grid-cols-3 xl:grid-cols-2 gap-5">
             {links
               .filter((e) => e.collectionId === Number(router.query.id))
               .map((e, i) => {
diff --git a/pages/tags/[id].tsx b/pages/tags/[id].tsx
index 0571b4a..afbd1a5 100644
--- a/pages/tags/[id].tsx
+++ b/pages/tags/[id].tsx
@@ -66,7 +66,7 @@ export default function Index() {
             ) : null}
           </div>
         </div>
-        <div className="grid 2xl:grid-cols-3 xl:grid-cols-2 gap-5">
+        <div className="grid grid-cols-1 2xl:grid-cols-3 xl:grid-cols-2 gap-5">
           {links
             .filter((e) => e.tags.some((e) => e.id === Number(router.query.id)))
             .map((e, i) => {

From cbf53f6e3075ef95e787075ac9e1a6a316950c61 Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Mon, 24 Jul 2023 09:39:51 -0400
Subject: [PATCH 4/8] improvements + better error handling

---
 components/LinkCard.tsx                 | 20 +++++++++++--
 components/Modal/Link/AddOrEditLink.tsx | 37 ++++++++++++-------------
 lib/api/controllers/links/postLink.ts   | 20 +++++++++----
 lib/api/getTitle.ts                     |  2 +-
 4 files changed, 51 insertions(+), 28 deletions(-)

diff --git a/components/LinkCard.tsx b/components/LinkCard.tsx
index 873966f..2dd2b47 100644
--- a/components/LinkCard.tsx
+++ b/components/LinkCard.tsx
@@ -2,7 +2,11 @@ import {
   CollectionIncludingMembersAndLinkCount,
   LinkIncludingShortenedCollectionAndTags,
 } from "@/types/global";
-import { faFolder, faEllipsis } from "@fortawesome/free-solid-svg-icons";
+import {
+  faFolder,
+  faEllipsis,
+  faLink,
+} from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { useEffect, useState } from "react";
 import Image from "next/image";
@@ -33,6 +37,14 @@ export default function LinkCard({ link, count, className }: Props) {
 
   const { account } = useAccountStore();
 
+  let shortendURL;
+
+  try {
+    shortendURL = new URL(link.url).host.toLowerCase();
+  } catch (error) {
+    console.log(error);
+  }
+
   const [collection, setCollection] =
     useState<CollectionIncludingMembersAndLinkCount>(
       collections.find(
@@ -144,7 +156,7 @@ export default function LinkCard({ link, count, className }: Props) {
             <div className="flex items-baseline gap-1">
               <p className="text-sm text-sky-500 font-bold">{count + 1}.</p>
               <p className="text-lg text-sky-700 font-bold truncate capitalize w-full pr-8">
-                {link.name}
+                {link.name || link.description}
               </p>
             </div>
             <div className="flex gap-3 items-center my-3">
@@ -159,6 +171,10 @@ export default function LinkCard({ link, count, className }: Props) {
                 </p>
               </div>
             </div>
+            <div className="flex items-center gap-1 w-full pr-20 text-gray-500">
+              <FontAwesomeIcon icon={faLink} className="mt-1 w-4 h-4" />
+              <p className="truncate w-full">{shortendURL}</p>
+            </div>
             <div className="flex items-center gap-1 text-gray-500">
               <FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" />
               <p>{formattedDate}</p>
diff --git a/components/Modal/Link/AddOrEditLink.tsx b/components/Modal/Link/AddOrEditLink.tsx
index f1d2f85..205513c 100644
--- a/components/Modal/Link/AddOrEditLink.tsx
+++ b/components/Modal/Link/AddOrEditLink.tsx
@@ -11,6 +11,7 @@ import useCollectionStore from "@/store/collections";
 import { useRouter } from "next/router";
 import SubmitButton from "../../SubmitButton";
 import { toast } from "react-hot-toast";
+import Link from "next/link";
 
 type Props =
   | {
@@ -70,8 +71,6 @@ export default function AddOrEditLink({
     }
   }, []);
 
-  // const shortendURL = method === "UPDATE" ? new URL(link.url).host.toLowerCase() : undefined;
-
   const setTags = (e: any) => {
     const tagNames = e.map((e: any) => {
       return { name: e.label };
@@ -119,27 +118,15 @@ export default function AddOrEditLink({
           className="text-gray-500 my-2 text-center truncate w-full"
           title={link.url}
         >
-          Edit <span className="underline">{link.url}</span>
+          <Link href={link.url} target="_blank" className=" font-bold">
+            {link.url}
+          </Link>
         </p>
       ) : null}
 
       <div className="grid sm:grid-cols-2 gap-3">
-        <div>
-          <p className="text-sm text-sky-700 mb-2">
-            Name
-            <RequiredBadge />
-          </p>
-          <input
-            value={link.name}
-            onChange={(e) => setLink({ ...link, name: e.target.value })}
-            type="text"
-            placeholder="e.g. Example Link"
-            className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
-          />
-        </div>
-
         {method === "CREATE" ? (
-          <div>
+          <div className="sm:col-span-2">
             <p className="text-sm text-sky-700 mb-2">
               URL
               <RequiredBadge />
@@ -173,7 +160,7 @@ export default function AddOrEditLink({
           />
         </div>
 
-        <div className={method === "UPDATE" ? "sm:col-span-2" : ""}>
+        <div>
           <p className="text-sm text-sky-700 mb-2">Tags</p>
           <TagSelection
             onChange={setTags}
@@ -182,6 +169,18 @@ export default function AddOrEditLink({
             })}
           />
         </div>
+
+        <div className="sm:col-span-2">
+          <p className="text-sm text-sky-700 mb-2">Name</p>
+          <input
+            value={link.name}
+            onChange={(e) => setLink({ ...link, name: e.target.value })}
+            type="text"
+            placeholder="e.g. Example Link"
+            className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
+          />
+        </div>
+
         <div className="sm:col-span-2">
           <p className="text-sm text-sky-700 mb-2">Description</p>
           <textarea
diff --git a/lib/api/controllers/links/postLink.ts b/lib/api/controllers/links/postLink.ts
index 7a1bf56..3a5bfbd 100644
--- a/lib/api/controllers/links/postLink.ts
+++ b/lib/api/controllers/links/postLink.ts
@@ -10,11 +10,19 @@ export default async function postLink(
   link: LinkIncludingShortenedCollectionAndTags,
   userId: number
 ) {
+  try {
+    new URL(link.url);
+  } catch (error) {
+    return {
+      response:
+        "Please enter a valid Address for the Link. (It should start with http/https)",
+      status: 400,
+    };
+  }
+
   link.collection.name = link.collection.name.trim();
 
-  if (!link.name) {
-    return { response: "Please enter a valid name for the link.", status: 400 };
-  } else if (!link.collection.name) {
+  if (!link.collection.name) {
     link.collection.name = "Unnamed Collection";
   }
 
@@ -45,8 +53,8 @@ export default async function postLink(
 
   const newLink: Link = await prisma.link.create({
     data: {
-      name: link.name,
       url: link.url,
+      name: link.name,
       description,
       collection: {
         connectOrCreate: {
@@ -66,12 +74,12 @@ export default async function postLink(
         connectOrCreate: link.tags.map((tag) => ({
           where: {
             name_ownerId: {
-              name: tag.name,
+              name: tag.name.trim(),
               ownerId: link.collection.ownerId,
             },
           },
           create: {
-            name: tag.name,
+            name: tag.name.trim(),
             owner: {
               connect: {
                 id: link.collection.ownerId,
diff --git a/lib/api/getTitle.ts b/lib/api/getTitle.ts
index 5b23de7..704f7cd 100644
--- a/lib/api/getTitle.ts
+++ b/lib/api/getTitle.ts
@@ -5,7 +5,7 @@ export default async function getTitle(url: string) {
 
     // regular expression to find the <title> tag
     let match = text.match(/<title.*>([^<]*)<\/title>/);
-    if (match) return match[1] + " [AUTO GENERATED]";
+    if (match) return match[1];
     else return "";
   } catch (err) {
     console.log(err);

From 1086e2245186fb8362100dff3a7b0ce05c48e4c7 Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Mon, 24 Jul 2023 10:06:24 -0400
Subject: [PATCH 5/8] bug fix + ui improvements

---
 components/Modal/Link/AddOrEditLink.tsx | 32 ++++++++++++-------------
 components/Modal/Link/LinkDetails.tsx   |  2 +-
 lib/api/archive.ts                      | 14 +++++++----
 3 files changed, 27 insertions(+), 21 deletions(-)

diff --git a/components/Modal/Link/AddOrEditLink.tsx b/components/Modal/Link/AddOrEditLink.tsx
index 205513c..e072abd 100644
--- a/components/Modal/Link/AddOrEditLink.tsx
+++ b/components/Modal/Link/AddOrEditLink.tsx
@@ -124,23 +124,23 @@ export default function AddOrEditLink({
         </p>
       ) : null}
 
+      {method === "CREATE" ? (
+        <div>
+          <p className="text-sm text-sky-700 mb-2 font-bold">
+            Address (URL)
+            <RequiredBadge />
+          </p>
+          <input
+            value={link.url}
+            onChange={(e) => setLink({ ...link, url: e.target.value })}
+            type="text"
+            placeholder="e.g. http://example.com/"
+            className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
+          />
+        </div>
+      ) : null}
+      <hr />
       <div className="grid sm:grid-cols-2 gap-3">
-        {method === "CREATE" ? (
-          <div className="sm:col-span-2">
-            <p className="text-sm text-sky-700 mb-2">
-              URL
-              <RequiredBadge />
-            </p>
-            <input
-              value={link.url}
-              onChange={(e) => setLink({ ...link, url: e.target.value })}
-              type="text"
-              placeholder="e.g. http://example.com/"
-              className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
-            />
-          </div>
-        ) : null}
-
         <div>
           <p className="text-sm text-sky-700 mb-2">Collection</p>
           <CollectionSelection
diff --git a/components/Modal/Link/LinkDetails.tsx b/components/Modal/Link/LinkDetails.tsx
index 19904bd..0151c98 100644
--- a/components/Modal/Link/LinkDetails.tsx
+++ b/components/Modal/Link/LinkDetails.tsx
@@ -150,7 +150,7 @@ export default function LinkDetails({ link }: Props) {
             }}
           />
         )}
-        <div className="flex flex-col gap- justify-end drop-shadow">
+        <div className="flex flex-col min-h-[3rem] justify-end drop-shadow">
           <p className="text-2xl text-sky-700 capitalize break-words hyphens-auto">
             {link.name}
           </p>
diff --git a/lib/api/archive.ts b/lib/api/archive.ts
index 546c76e..d03b1e9 100644
--- a/lib/api/archive.ts
+++ b/lib/api/archive.ts
@@ -7,12 +7,12 @@ export default async function archive(
   collectionId: number,
   linkId: number
 ) {
-  const browser = await chromium.launch();
+  const browser = await chromium.launch({ headless: false });
   const context = await browser.newContext(devices["Desktop Chrome"]);
   const page = await context.newPage();
 
   try {
-    await page.goto(url, { waitUntil: "domcontentloaded", timeout: 300000 });
+    await page.goto(url, { waitUntil: "domcontentloaded" });
 
     await autoScroll(page);
 
@@ -53,7 +53,13 @@ export default async function archive(
 
 const autoScroll = async (page: Page) => {
   await page.evaluate(async () => {
-    await new Promise<void>((resolve, reject) => {
+    const timeoutPromise = new Promise<void>((_, reject) => {
+      setTimeout(() => {
+        reject(new Error("Auto scroll took too long (more than 10 seconds)."));
+      }, 20000);
+    });
+
+    const scrollingPromise = new Promise<void>((resolve) => {
       let totalHeight = 0;
       let distance = 100;
       let scrollDown = setInterval(() => {
@@ -68,6 +74,6 @@ const autoScroll = async (page: Page) => {
       }, 100);
     });
 
-    await new Promise((r) => setTimeout(r, 2000));
+    await Promise.race([scrollingPromise, timeoutPromise]);
   });
 };

From d65d1cfc09ad62724bfc6ba2b25daea8137863d4 Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Mon, 24 Jul 2023 10:07:37 -0400
Subject: [PATCH 6/8] minor typo

---
 lib/api/archive.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/api/archive.ts b/lib/api/archive.ts
index d03b1e9..bbd7345 100644
--- a/lib/api/archive.ts
+++ b/lib/api/archive.ts
@@ -55,7 +55,7 @@ const autoScroll = async (page: Page) => {
   await page.evaluate(async () => {
     const timeoutPromise = new Promise<void>((_, reject) => {
       setTimeout(() => {
-        reject(new Error("Auto scroll took too long (more than 10 seconds)."));
+        reject(new Error("Auto scroll took too long (more than 20 seconds)."));
       }, 20000);
     });
 

From 1833f9402c38763ce35c477d98b4decafc469bcd Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Mon, 24 Jul 2023 10:22:24 -0400
Subject: [PATCH 7/8] minor fix

---
 lib/api/archive.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/api/archive.ts b/lib/api/archive.ts
index bbd7345..24c3ff6 100644
--- a/lib/api/archive.ts
+++ b/lib/api/archive.ts
@@ -7,7 +7,7 @@ export default async function archive(
   collectionId: number,
   linkId: number
 ) {
-  const browser = await chromium.launch({ headless: false });
+  const browser = await chromium.launch();
   const context = await browser.newContext(devices["Desktop Chrome"]);
   const page = await context.newPage();
 

From 08140c22aaab20465552ece506aac3a7301d5a33 Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Mon, 24 Jul 2023 14:20:05 -0400
Subject: [PATCH 8/8] minor bug fix

---
 components/LinkCard.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/components/LinkCard.tsx b/components/LinkCard.tsx
index 2dd2b47..1f5dcd4 100644
--- a/components/LinkCard.tsx
+++ b/components/LinkCard.tsx
@@ -35,6 +35,8 @@ export default function LinkCard({ link, count, className }: Props) {
 
   const { collections } = useCollectionStore();
 
+  const { links } = useLinkStore();
+
   const { account } = useAccountStore();
 
   let shortendURL;
@@ -58,7 +60,7 @@ export default function LinkCard({ link, count, className }: Props) {
         (e) => e.id === link.collection.id
       ) as CollectionIncludingMembersAndLinkCount
     );
-  }, [collections]);
+  }, [collections, links]);
 
   const { removeLink, updateLink } = useLinkStore();