diff --git a/components/LinkPreview.tsx b/components/LinkPreview.tsx
deleted file mode 100644
index 891a69f7..00000000
--- a/components/LinkPreview.tsx
+++ /dev/null
@@ -1,110 +0,0 @@
-import { faFolder, faLink } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import Image from "next/image";
-import { faCalendarDays } from "@fortawesome/free-regular-svg-icons";
-import isValidUrl from "@/lib/shared/isValidUrl";
-import A from "next/link";
-import unescapeString from "@/lib/client/unescapeString";
-import { Link } from "@prisma/client";
-
-type Props = {
-  link?: Partial<Link>;
-  className?: string;
-  settings: {
-    blurredFavicons: boolean;
-    displayLinkIcons: boolean;
-  };
-};
-
-export default function LinkPreview({ link, className, settings }: Props) {
-  if (!link) {
-    link = {
-      name: "Linkwarden",
-      url: "https://linkwarden.app",
-      createdAt: Date.now() as unknown as Date,
-    };
-  }
-
-  let shortendURL;
-
-  try {
-    shortendURL = new URL(link.url as string).host.toLowerCase();
-  } catch (error) {
-    console.log(error);
-  }
-
-  const url = isValidUrl(link.url as string)
-    ? new URL(link.url as string)
-    : undefined;
-
-  const formattedDate = new Date(link.createdAt as Date).toLocaleString(
-    "en-US",
-    {
-      year: "numeric",
-      month: "short",
-      day: "numeric",
-    }
-  );
-
-  return (
-    <>
-      <div
-        className={`h-fit border border-solid border-neutral-content bg-base-200 shadow hover:shadow-none duration-100 rounded-2xl relative group ${
-          className || ""
-        }`}
-      >
-        <div className="flex items-start cursor-pointer gap-5 sm:gap-10 h-full w-full p-5">
-          {url && settings?.displayLinkIcons && (
-            <Image
-              src={`https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${url.origin}&size=32`}
-              width={64}
-              height={64}
-              alt=""
-              className={`${
-                settings.blurredFavicons ? "blur-sm " : ""
-              }absolute w-16 group-hover:opacity-80 duration-100 rounded-2xl bottom-5 right-5 opacity-60 select-none`}
-              draggable="false"
-              onError={(e) => {
-                const target = e.target as HTMLElement;
-                target.style.display = "none";
-              }}
-            />
-          )}
-
-          <div className="flex justify-between gap-5 w-full h-full z-0">
-            <div className="flex flex-col justify-between w-full">
-              <div className="flex items-baseline gap-1">
-                <p className="text-sm text-neutral">{1}</p>
-                <p className="text-lg truncate capitalize w-full pr-8">
-                  {unescapeString(link.name as string)}
-                </p>
-              </div>
-              <div className="flex items-center gap-1 max-w-full w-fit my-1 hover:opacity-70 duration-100">
-                <FontAwesomeIcon
-                  icon={faFolder}
-                  className="w-4 h-4 mt-1 drop-shadow text-primary"
-                />
-                <p className="truncate capitalize w-full">Landing Pages ⚡️</p>
-              </div>
-              <A
-                href={link.url as string}
-                target="_blank"
-                onClick={(e) => {
-                  e.stopPropagation();
-                }}
-                className="flex items-center gap-1 max-w-full w-fit text-neutral hover:opacity-70 duration-100"
-              >
-                <FontAwesomeIcon icon={faLink} className="mt-1 w-4 h-4" />
-                <p className="truncate w-full">{shortendURL}</p>
-              </A>
-              <div className="flex items-center gap-1 text-neutral">
-                <FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" />
-                <p>{formattedDate}</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </>
-  );
-}
diff --git a/components/LinkSidebar.tsx b/components/LinkSidebar.tsx
deleted file mode 100644
index f3136f43..00000000
--- a/components/LinkSidebar.tsx
+++ /dev/null
@@ -1,129 +0,0 @@
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import {
-  faPen,
-  faBoxesStacked,
-  faTrashCan,
-} from "@fortawesome/free-solid-svg-icons";
-import { useRouter } from "next/router";
-import { useEffect, useState } from "react";
-import useModalStore from "@/store/modals";
-import useLinkStore from "@/store/links";
-import {
-  CollectionIncludingMembersAndLinkCount,
-  LinkIncludingShortenedCollectionAndTags,
-} from "@/types/global";
-import { useSession } from "next-auth/react";
-import useCollectionStore from "@/store/collections";
-
-type Props = {
-  className?: string;
-  onClick?: Function;
-};
-
-export default function LinkSidebar({ className, onClick }: Props) {
-  const session = useSession();
-  const userId = session.data?.user.id;
-
-  const { setModal } = useModalStore();
-
-  const { links, removeLink } = useLinkStore();
-  const { collections } = useCollectionStore();
-
-  const [linkCollection, setLinkCollection] =
-    useState<CollectionIncludingMembersAndLinkCount>();
-
-  const [link, setLink] = useState<LinkIncludingShortenedCollectionAndTags>();
-
-  const router = useRouter();
-
-  useEffect(() => {
-    if (links) setLink(links.find((e) => e.id === Number(router.query.id)));
-  }, [links]);
-
-  useEffect(() => {
-    if (link)
-      setLinkCollection(collections.find((e) => e.id === link?.collection?.id));
-  }, [link]);
-
-  return (
-    <div
-      className={`bg-base-100 h-full w-64 overflow-y-auto border-solid border border-base-100 border-r-neutral-content p-5 z-20 flex flex-col gap-5 justify-between ${
-        className || ""
-      }`}
-    >
-      <div className="flex flex-col gap-5">
-        {link?.collection.ownerId === userId ||
-        linkCollection?.members.some(
-          (e) => e.userId === userId && e.canUpdate
-        ) ? (
-          <div
-            title="Edit"
-            onClick={() => {
-              link
-                ? setModal({
-                    modal: "LINK",
-                    state: true,
-                    active: link,
-                    method: "UPDATE",
-                  })
-                : undefined;
-              onClick && onClick();
-            }}
-            className={`hover:opacity-60 duration-100 py-2 px-2 cursor-pointer flex items-center gap-4 w-full rounded-md h-8`}
-          >
-            <FontAwesomeIcon icon={faPen} className="w-6 h-6 text-neutral" />
-
-            <p className="truncate w-full lg:hidden">Edit</p>
-          </div>
-        ) : undefined}
-
-        <div
-          onClick={() => {
-            link
-              ? setModal({
-                  modal: "LINK",
-                  state: true,
-                  active: link,
-                  method: "FORMATS",
-                })
-              : undefined;
-            onClick && onClick();
-          }}
-          title="Preserved Formats"
-          className={`hover:opacity-60 duration-100 py-2 px-2 cursor-pointer flex items-center gap-4 w-full rounded-md h-8`}
-        >
-          <FontAwesomeIcon
-            icon={faBoxesStacked}
-            className="w-6 h-6 text-neutral"
-          />
-
-          <p className="truncate w-full lg:hidden">Preserved Formats</p>
-        </div>
-
-        {link?.collection.ownerId === userId ||
-        linkCollection?.members.some(
-          (e) => e.userId === userId && e.canDelete
-        ) ? (
-          <div
-            onClick={() => {
-              if (link?.id) {
-                removeLink(link.id);
-                router.back();
-                onClick && onClick();
-              }
-            }}
-            title="Delete"
-            className={`hover:opacity-60 duration-100 py-2 px-2 cursor-pointer flex items-center gap-4 w-full rounded-md h-8`}
-          >
-            <FontAwesomeIcon
-              icon={faTrashCan}
-              className="w-6 h-6 text-neutral"
-            />
-
-            <p className="truncate w-full lg:hidden">Delete</p>
-          </div>
-        ) : undefined}
-      </div>
-    </div>
-  );
-}
diff --git a/components/Modal/Collection/CollectionInfo.tsx b/components/Modal/Collection/CollectionInfo.tsx
index 635bdd4f..be33707c 100644
--- a/components/Modal/Collection/CollectionInfo.tsx
+++ b/components/Modal/Collection/CollectionInfo.tsx
@@ -1,14 +1,8 @@
 import { Dispatch, SetStateAction, useState } from "react";
-import {
-  faFolder,
-  faPenToSquare,
-  faPlus,
-} from "@fortawesome/free-solid-svg-icons";
 import useCollectionStore from "@/store/collections";
 import { CollectionIncludingMembersAndLinkCount } from "@/types/global";
 import SubmitButton from "@/components/SubmitButton";
 import { HexColorPicker } from "react-colorful";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { toast } from "react-hot-toast";
 import TextInput from "@/components/TextInput";
 
@@ -73,10 +67,7 @@ export default function CollectionInfo({
               <div className="flex flex-col justify-between items-center w-32">
                 <p className="w-full mb-2">Color</p>
                 <div style={{ color: collection.color }}>
-                  <FontAwesomeIcon
-                    icon={faFolder}
-                    className="w-12 h-12 drop-shadow"
-                  />
+                  <i className={"bi-folder2"}></i>
                 </div>
                 <div
                   className="btn btn-ghost btn-xs"
@@ -115,7 +106,6 @@ export default function CollectionInfo({
         onClick={submit}
         loading={submitLoader}
         label={method === "CREATE" ? "Add" : "Save"}
-        icon={method === "CREATE" ? faPlus : faPenToSquare}
         className="mx-auto mt-2"
       />
     </div>
diff --git a/components/Modal/Collection/DeleteCollection.tsx b/components/Modal/Collection/DeleteCollection.tsx
index caadfa4d..472b6aa5 100644
--- a/components/Modal/Collection/DeleteCollection.tsx
+++ b/components/Modal/Collection/DeleteCollection.tsx
@@ -1,9 +1,4 @@
 import React, { useState } from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import {
-  faRightFromBracket,
-  faTrashCan,
-} from "@fortawesome/free-solid-svg-icons";
 import { CollectionIncludingMembersAndLinkCount } from "@/types/global";
 import useCollectionStore from "@/store/collections";
 import { useRouter } from "next/router";
@@ -111,10 +106,7 @@ export default function DeleteCollection({
         }`}
         onClick={submit}
       >
-        <FontAwesomeIcon
-          icon={permissions === true ? faTrashCan : faRightFromBracket}
-          className="h-5"
-        />
+        <i className={`${ permissions === true ? 'bi-trash' : 'bi-arrow-right'}`}></i>
         {permissions === true ? "Delete" : "Leave"} Collection
       </div>
     </div>
diff --git a/components/Modal/Collection/TeamManagement.tsx b/components/Modal/Collection/TeamManagement.tsx
index 9736c4e8..e04b3c85 100644
--- a/components/Modal/Collection/TeamManagement.tsx
+++ b/components/Modal/Collection/TeamManagement.tsx
@@ -1,12 +1,4 @@
-import { Dispatch, SetStateAction, useEffect, useState } from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import {
-  faClose,
-  faCrown,
-  faPenToSquare,
-  faPlus,
-  faUserPlus,
-} from "@fortawesome/free-solid-svg-icons";
+import React, { Dispatch, SetStateAction, useEffect, useState } from "react";
 import useCollectionStore from "@/store/collections";
 import { CollectionIncludingMembersAndLinkCount, Member } from "@/types/global";
 import addMemberToCollection from "@/lib/client/addMemberToCollection";
@@ -173,7 +165,7 @@ export default function TeamManagement({
               }
               className="flex items-center justify-center bg-sky-700 hover:bg-sky-600 duration-100 text-white w-10 h-10 p-2 rounded-md cursor-pointer"
             >
-              <FontAwesomeIcon icon={faUserPlus} className="w-5 h-5" />
+              <i className="bi-person-add text-xl"></i>
             </div>
           </div>
         </>
@@ -194,9 +186,8 @@ export default function TeamManagement({
                     className="relative border p-2 rounded-md border-neutral flex flex-col sm:flex-row sm:items-center gap-2 justify-between"
                   >
                     {permissions === true && (
-                      <FontAwesomeIcon
-                        icon={faClose}
-                        className="absolute right-2 top-2 text-neutral h-4 hover:text-red-500 dark:hover:text-red-500 duration-100 cursor-pointer"
+                      <i
+                        className={"bi-x text-xl absolute right-1 top-1 text-neutral hover:text-red-500 dark:hover:text-red-500 duration-100 cursor-pointer"}
                         title="Remove Member"
                         onClick={() => {
                           const updatedMembers = collection.members.filter(
@@ -402,10 +393,6 @@ export default function TeamManagement({
           <div>
             <div className="flex items-center gap-1">
               <p className="text-sm font-bold">{collectionOwner.name}</p>
-              <FontAwesomeIcon
-                icon={faCrown}
-                className="w-3 h-3 text-yellow-500"
-              />
             </div>
             <p className="text-neutral">@{collectionOwner.username}</p>
           </div>
@@ -422,7 +409,6 @@ export default function TeamManagement({
           onClick={submit}
           loading={submitLoader}
           label={method === "CREATE" ? "Add" : "Save"}
-          icon={method === "CREATE" ? faPlus : faPenToSquare}
           className="mx-auto mt-2"
         />
       )}
diff --git a/components/Modal/Collection/ViewTeam.tsx b/components/Modal/Collection/ViewTeam.tsx
index 4896efd4..f54f542a 100644
--- a/components/Modal/Collection/ViewTeam.tsx
+++ b/components/Modal/Collection/ViewTeam.tsx
@@ -1,6 +1,4 @@
 import { useEffect, useState } from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faCrown } from "@fortawesome/free-solid-svg-icons";
 import { CollectionIncludingMembersAndLinkCount } from "@/types/global";
 import ProfilePhoto from "@/components/ProfilePhoto";
 import getPublicUserData from "@/lib/client/getPublicUserData";
@@ -45,10 +43,6 @@ export default function ViewTeam({ collection }: Props) {
             <div className="flex items-center gap-1 w-full justify-between">
               <p className="text-sm font-bold">{collectionOwner.name}</p>
               <div className="flex text-xs gap-1 items-center">
-                <FontAwesomeIcon
-                  icon={faCrown}
-                  className="w-3 h-3 text-yellow-500"
-                />
                 Admin
               </div>
             </div>
diff --git a/components/Modal/Link/AddOrEditLink.tsx b/components/Modal/Link/AddOrEditLink.tsx
index 23a69860..8b17f311 100644
--- a/components/Modal/Link/AddOrEditLink.tsx
+++ b/components/Modal/Link/AddOrEditLink.tsx
@@ -2,9 +2,7 @@ import React, { useEffect, useState } from "react";
 import CollectionSelection from "@/components/InputSelect/CollectionSelection";
 import TagSelection from "@/components/InputSelect/TagSelection";
 import { LinkIncludingShortenedCollectionAndTags } from "@/types/global";
-import { faPenToSquare } from "@fortawesome/free-regular-svg-icons";
 import useLinkStore from "@/store/links";
-import { faLink, faPlus } from "@fortawesome/free-solid-svg-icons";
 import { useSession } from "next-auth/react";
 import useCollectionStore from "@/store/collections";
 import { useRouter } from "next/router";
@@ -13,7 +11,6 @@ import { toast } from "react-hot-toast";
 import Link from "next/link";
 import TextInput from "@/components/TextInput";
 import unescapeString from "@/lib/client/unescapeString";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
 type Props =
   | {
@@ -142,7 +139,7 @@ export default function AddOrEditLink({
           className="text-neutral break-all w-full flex gap-2"
           title={link.url || ""}
         >
-          <FontAwesomeIcon icon={faLink} className="w-6 h-6" />
+          <i className={"bi-link-45deg"}></i>
           <Link href={link.url || ""} target="_blank" className="w-full">
             {link.url}
           </Link>
@@ -264,7 +261,6 @@ export default function AddOrEditLink({
         <SubmitButton
           onClick={submit}
           label={method === "CREATE" ? "Add" : "Save"}
-          icon={method === "CREATE" ? faPlus : faPenToSquare}
           loading={submitLoader}
           className={`${method === "CREATE" ? "" : "mx-auto"}`}
         />
diff --git a/components/Modal/Link/PreservedFormats.tsx b/components/Modal/Link/PreservedFormats.tsx
index f7b53455..a77941c2 100644
--- a/components/Modal/Link/PreservedFormats.tsx
+++ b/components/Modal/Link/PreservedFormats.tsx
@@ -4,12 +4,6 @@ import {
 } from "@/types/global";
 import { useEffect, useState } from "react";
 import Link from "next/link";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import {
-  faArrowUpRightFromSquare,
-  faCloudArrowDown,
-} from "@fortawesome/free-solid-svg-icons";
-import { faFileImage, faFilePdf } from "@fortawesome/free-regular-svg-icons";
 import useLinkStore from "@/store/links";
 import { toast } from "react-hot-toast";
 import { useRouter } from "next/router";
@@ -97,7 +91,6 @@ export default function PreservedFormats() {
         <div className="flex justify-between items-center pr-1 border border-neutral-content rounded-md">
           <div className="flex gap-2 items-center">
             <div className="bg-primary text-primary-content p-2 rounded-l-md">
-              <FontAwesomeIcon icon={faFileImage} className="w-6 h-6" />
             </div>
 
             <p>Screenshot</p>
@@ -108,10 +101,6 @@ export default function PreservedFormats() {
               onClick={() => handleDownload(ArchivedFormat.png)}
               className="cursor-pointer hover:opacity-60 duration-100 p-2 rounded-md"
             >
-              <FontAwesomeIcon
-                icon={faCloudArrowDown}
-                className="w-5 h-5 cursor-pointer text-neutral"
-              />
             </div>
 
             <Link
@@ -123,10 +112,6 @@ export default function PreservedFormats() {
               target="_blank"
               className="cursor-pointer hover:opacity-60 duration-100 p-2 rounded-md"
             >
-              <FontAwesomeIcon
-                icon={faArrowUpRightFromSquare}
-                className="w-5 h-5 text-neutral"
-              />
             </Link>
           </div>
         </div>
@@ -136,7 +121,6 @@ export default function PreservedFormats() {
         <div className="flex justify-between items-center pr-1 border border-neutral-content rounded-md">
           <div className="flex gap-2 items-center">
             <div className="bg-primary text-primary-content p-2 rounded-l-md">
-              <FontAwesomeIcon icon={faFilePdf} className="w-6 h-6" />
             </div>
 
             <p>PDF</p>
@@ -147,10 +131,6 @@ export default function PreservedFormats() {
               onClick={() => handleDownload(ArchivedFormat.pdf)}
               className="cursor-pointer hover:opacity-60 duration-100 p-2 rounded-md"
             >
-              <FontAwesomeIcon
-                icon={faCloudArrowDown}
-                className="w-5 h-5 cursor-pointer text-neutral"
-              />
             </div>
 
             <Link
@@ -158,10 +138,6 @@ export default function PreservedFormats() {
               target="_blank"
               className="cursor-pointer hover:opacity-60 duration-100 p-2 rounded-md"
             >
-              <FontAwesomeIcon
-                icon={faArrowUpRightFromSquare}
-                className="w-5 h-5 text-neutral"
-              />
             </Link>
           </div>
         </div>
@@ -191,10 +167,6 @@ export default function PreservedFormats() {
             screenshotAvailable(link) && pdfAvailable(link) ? "sm:mt-3" : ""
           }`}
         >
-          <FontAwesomeIcon
-            icon={faArrowUpRightFromSquare}
-            className="w-4 h-4"
-          />
           <p className="whitespace-nowrap">
             View Latest Snapshot on archive.org
           </p>
diff --git a/components/ModalContent/NewCollectionModal.tsx b/components/ModalContent/NewCollectionModal.tsx
index de0fc98c..23b43444 100644
--- a/components/ModalContent/NewCollectionModal.tsx
+++ b/components/ModalContent/NewCollectionModal.tsx
@@ -1,11 +1,9 @@
 import React, { useEffect, useState } from "react";
 import TextInput from "@/components/TextInput";
 import useCollectionStore from "@/store/collections";
-import toast, { Toaster } from "react-hot-toast";
-import { faFolder } from "@fortawesome/free-solid-svg-icons";
+import toast from "react-hot-toast";
 import { HexColorPicker } from "react-colorful";
 import { Collection } from "@prisma/client";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import Modal from "../Modal";
 
 type Props = {
@@ -76,10 +74,6 @@ export default function NewCollectionModal({ onClose }: Props) {
                 <div className="color-picker flex justify-between">
                   <div className="flex flex-col gap-2 items-center w-32">
                     <div style={{ color: collection.color }}>
-                      <FontAwesomeIcon
-                        icon={faFolder}
-                        className="w-12 h-12 drop-shadow"
-                      />
                     </div>
                     <div
                       className="btn btn-ghost btn-xs"
diff --git a/components/ModalContent/UploadFileModal.tsx b/components/ModalContent/UploadFileModal.tsx
index a2a128bd..f45f40d3 100644
--- a/components/ModalContent/UploadFileModal.tsx
+++ b/components/ModalContent/UploadFileModal.tsx
@@ -1,5 +1,4 @@
 import React, { useEffect, useState } from "react";
-import { Toaster } from "react-hot-toast";
 import CollectionSelection from "@/components/InputSelect/CollectionSelection";
 import TagSelection from "@/components/InputSelect/TagSelection";
 import TextInput from "@/components/TextInput";
@@ -14,9 +13,6 @@ import { useSession } from "next-auth/react";
 import { useRouter } from "next/router";
 import toast from "react-hot-toast";
 import Modal from "../Modal";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faQuestion } from "@fortawesome/free-solid-svg-icons";
-import { faQuestionCircle } from "@fortawesome/free-regular-svg-icons";
 
 type Props = {
   onClose: Function;
diff --git a/components/RadioButton.tsx b/components/RadioButton.tsx
index d4614b3f..76c03fec 100644
--- a/components/RadioButton.tsx
+++ b/components/RadioButton.tsx
@@ -1,5 +1,3 @@
-import { faCircle, faCircleCheck } from "@fortawesome/free-regular-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { ChangeEventHandler } from "react";
 
 type Props = {
@@ -18,14 +16,14 @@ export default function RadioButton({ label, state, onClick }: Props) {
         checked={state}
         onChange={onClick}
       />
-      <FontAwesomeIcon
-        icon={faCircleCheck}
-        className="w-5 h-5 text-primary peer-checked:block hidden"
-      />
-      <FontAwesomeIcon
-        icon={faCircle}
-        className="w-5 h-5 text-primary peer-checked:hidden block"
-      />
+      {/*<FontAwesomeIcon*/}
+      {/*  icon={faCircleCheck}*/}
+      {/*  className="w-5 h-5 text-primary peer-checked:block hidden"*/}
+      {/*/>*/}
+      {/*<FontAwesomeIcon*/}
+      {/*  icon={faCircle}*/}
+      {/*  className="w-5 h-5 text-primary peer-checked:hidden block"*/}
+      {/*/>*/}
       <span className="rounded select-none">{label}</span>
     </label>
   );
diff --git a/components/SubmitButton.tsx b/components/SubmitButton.tsx
index 7a50b354..e86fa784 100644
--- a/components/SubmitButton.tsx
+++ b/components/SubmitButton.tsx
@@ -1,9 +1,5 @@
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { IconProp } from "@fortawesome/fontawesome-svg-core";
-
 type Props = {
   onClick?: Function;
-  icon?: IconProp;
   label: string;
   loading: boolean;
   className?: string;
@@ -12,7 +8,6 @@ type Props = {
 
 export default function SubmitButton({
   onClick,
-  icon,
   label,
   loading,
   className,
@@ -28,7 +23,6 @@ export default function SubmitButton({
         if (!loading && onClick) onClick();
       }}
     >
-      {icon && <FontAwesomeIcon icon={icon} className="h-5" />}
       <p>{label}</p>
     </button>
   );
diff --git a/layouts/LinkLayout.tsx b/layouts/LinkLayout.tsx
deleted file mode 100644
index ddcced19..00000000
--- a/layouts/LinkLayout.tsx
+++ /dev/null
@@ -1,216 +0,0 @@
-import LinkSidebar from "@/components/LinkSidebar";
-import { ReactNode, useEffect, useState } from "react";
-import ModalManagement from "@/components/ModalManagement";
-import useModalStore from "@/store/modals";
-import { useRouter } from "next/router";
-import ClickAwayHandler from "@/components/ClickAwayHandler";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
-import useWindowDimensions from "@/hooks/useWindowDimensions";
-import {
-  faPen,
-  faBoxesStacked,
-  faTrashCan,
-} from "@fortawesome/free-solid-svg-icons";
-import useLinkStore from "@/store/links";
-import {
-  CollectionIncludingMembersAndLinkCount,
-  LinkIncludingShortenedCollectionAndTags,
-} from "@/types/global";
-import { useSession } from "next-auth/react";
-import useCollectionStore from "@/store/collections";
-import EditLinkModal from "@/components/ModalContent/EditLinkModal";
-import Link from "next/link";
-import PreservedFormatsModal from "@/components/ModalContent/PreservedFormatsModal";
-import toast from "react-hot-toast";
-import DeleteLinkModal from "@/components/ModalContent/DeleteLinkModal";
-
-interface Props {
-  children: ReactNode;
-}
-
-export default function LinkLayout({ children }: Props) {
-  const { modal } = useModalStore();
-
-  const router = useRouter();
-
-  useEffect(() => {
-    modal
-      ? (document.body.style.overflow = "hidden")
-      : (document.body.style.overflow = "auto");
-  }, [modal]);
-
-  const [sidebar, setSidebar] = useState(false);
-
-  const { width } = useWindowDimensions();
-
-  useEffect(() => {
-    setSidebar(false);
-  }, [width]);
-
-  useEffect(() => {
-    setSidebar(false);
-  }, [router]);
-
-  const toggleSidebar = () => {
-    setSidebar(!sidebar);
-  };
-
-  const session = useSession();
-  const userId = session.data?.user.id;
-
-  const { setModal } = useModalStore();
-
-  const { links, removeLink } = useLinkStore();
-  const { collections } = useCollectionStore();
-
-  const [linkCollection, setLinkCollection] =
-    useState<CollectionIncludingMembersAndLinkCount>();
-
-  const [link, setLink] = useState<LinkIncludingShortenedCollectionAndTags>();
-
-  useEffect(() => {
-    if (links[0]) setLink(links.find((e) => e.id === Number(router.query.id)));
-  }, [links]);
-
-  useEffect(() => {
-    if (link)
-      setLinkCollection(collections.find((e) => e.id === link?.collection?.id));
-  }, [link, collections]);
-
-  const deleteLink = async () => {
-    const load = toast.loading("Deleting...");
-
-    const response = await removeLink(link?.id as number);
-
-    toast.dismiss(load);
-
-    response.ok && toast.success(`Link Deleted.`);
-
-    router.push("/dashboard");
-  };
-
-  const [editLinkModal, setEditLinkModal] = useState(false);
-  const [deleteLinkModal, setDeleteLinkModal] = useState(false);
-  const [preservedFormatsModal, setPreservedFormatsModal] = useState(false);
-
-  return (
-    <>
-      <div className="flex mx-auto">
-        {/* <div className="hidden lg:block fixed left-5 h-screen">
-          <LinkSidebar />
-        </div> */}
-
-        <div className="w-full flex flex-col min-h-screen max-w-screen-md mx-auto p-5">
-          <div className="flex gap-3 mb-3 duration-100 items-center justify-between">
-            {/* <div
-              onClick={toggleSidebar}
-              className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-2 text-neutral rounded-md duration-100 hover:bg-neutral-content"
-            >
-              <FontAwesomeIcon icon={faBars} className="w-5 h-5" />
-            </div> */}
-
-            <Link
-              href={
-                router.pathname.startsWith("/public")
-                  ? `/public/collections/${
-                      linkCollection?.id || link?.collection?.id
-                    }`
-                  : `/dashboard`
-              }
-              className="inline-flex gap-1 btn btn-ghost btn-sm text-neutral px-2"
-            >
-              <FontAwesomeIcon icon={faChevronLeft} className="w-4 h-4" />
-              <span className="capitalize">
-                {router.pathname.startsWith("/public")
-                  ? linkCollection?.name || link?.collection?.name
-                  : "Dashboard"}
-              </span>
-            </Link>
-
-            <div className="flex gap-3">
-              {link?.collection?.ownerId === userId ||
-              linkCollection?.members.some(
-                (e) => e.userId === userId && e.canUpdate
-              ) ? (
-                <div
-                  title="Edit"
-                  onClick={() => setEditLinkModal(true)}
-                  className={`btn btn-ghost btn-square btn-sm`}
-                >
-                  <FontAwesomeIcon
-                    icon={faPen}
-                    className="w-4 h-4 text-neutral"
-                  />
-                </div>
-              ) : undefined}
-
-              <div
-                onClick={() => setPreservedFormatsModal(true)}
-                title="Preserved Formats"
-                className={`btn btn-ghost btn-square btn-sm`}
-              >
-                <FontAwesomeIcon
-                  icon={faBoxesStacked}
-                  className="w-4 h-4 text-neutral"
-                />
-              </div>
-
-              {link?.collection?.ownerId === userId ||
-              linkCollection?.members.some(
-                (e) => e.userId === userId && e.canDelete
-              ) ? (
-                <div
-                  onClick={(e) => {
-                    (document?.activeElement as HTMLElement)?.blur();
-                    e.shiftKey ? deleteLink() : setDeleteLinkModal(true);
-                  }}
-                  title="Delete"
-                  className={`btn btn-ghost btn-square btn-sm`}
-                >
-                  <FontAwesomeIcon
-                    icon={faTrashCan}
-                    className="w-4 h-4 text-neutral"
-                  />
-                </div>
-              ) : undefined}
-            </div>
-          </div>
-
-          {children}
-
-          {sidebar ? (
-            <div className="fixed top-0 bottom-0 right-0 left-0 bg-black bg-opacity-10 backdrop-blur-sm flex items-center fade-in z-30">
-              <ClickAwayHandler
-                className="h-full"
-                onClickOutside={toggleSidebar}
-              >
-                <div className="slide-right h-full shadow-lg">
-                  <LinkSidebar onClick={() => setSidebar(false)} />
-                </div>
-              </ClickAwayHandler>
-            </div>
-          ) : null}
-        </div>
-        {link && editLinkModal ? (
-          <EditLinkModal
-            onClose={() => setEditLinkModal(false)}
-            activeLink={link}
-          />
-        ) : undefined}
-        {link && deleteLinkModal ? (
-          <DeleteLinkModal
-            onClose={() => setDeleteLinkModal(false)}
-            activeLink={link}
-          />
-        ) : undefined}
-        {link && preservedFormatsModal ? (
-          <PreservedFormatsModal
-            onClose={() => setPreservedFormatsModal(false)}
-            activeLink={link}
-          />
-        ) : undefined}
-      </div>
-    </>
-  );
-}
diff --git a/package.json b/package.json
index 10cb9b34..27bf41aa 100644
--- a/package.json
+++ b/package.json
@@ -16,11 +16,6 @@
   "dependencies": {
     "@auth/prisma-adapter": "^1.0.1",
     "@aws-sdk/client-s3": "^3.379.1",
-    "@fortawesome/fontawesome-svg-core": "^6.4.0",
-    "@fortawesome/free-brands-svg-icons": "^6.4.2",
-    "@fortawesome/free-regular-svg-icons": "^6.4.0",
-    "@fortawesome/free-solid-svg-icons": "^6.4.0",
-    "@fortawesome/react-fontawesome": "^0.2.0",
     "@headlessui/react": "^1.7.15",
     "@mozilla/readability": "^0.4.4",
     "@prisma/client": "^4.16.2",
diff --git a/pages/api/v1/links/[id]/archive/index.ts b/pages/api/v1/links/[id]/archive/index.ts
index fe8aaffa..065179fa 100644
--- a/pages/api/v1/links/[id]/archive/index.ts
+++ b/pages/api/v1/links/[id]/archive/index.ts
@@ -1,5 +1,5 @@
 import type { NextApiRequest, NextApiResponse } from "next";
-import urlHandler from "@/lib/api/archiveHandler";
+import archiveHandler from "@/lib/api/archiveHandler";
 import { prisma } from "@/lib/api/db";
 import verifyUser from "@/lib/api/verifyUser";
 import isValidUrl from "@/lib/shared/isValidUrl";
@@ -14,7 +14,7 @@ export default async function links(req: NextApiRequest, res: NextApiResponse) {
     where: {
       id: Number(req.query.id),
     },
-    include: { collection: true },
+    include: { collection: { include: { owner: true } } },
   });
 
   if (!link)
@@ -43,7 +43,7 @@ export default async function links(req: NextApiRequest, res: NextApiResponse) {
       });
 
     if (link.url && isValidUrl(link.url)) {
-      urlHandler(link.id, link.url, user.id);
+      archiveHandler(link);
       return res.status(200).json({
         response: "Link is not a webpage to be archived.",
       });
diff --git a/yarn.lock b/yarn.lock
index 705ecd0f..745672a0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -781,51 +781,6 @@
   dependencies:
     "@floating-ui/core" "^1.2.1"
 
-"@fortawesome/fontawesome-common-types@6.4.0":
-  version "6.4.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.0.tgz#88da2b70d6ca18aaa6ed3687832e11f39e80624b"
-  integrity sha512-HNii132xfomg5QVZw0HwXXpN22s7VBHQBv9CeOu9tfJnhsWQNd2lmTNi8CSrnw5B+5YOmzu1UoPAyxaXsJ6RgQ==
-
-"@fortawesome/fontawesome-common-types@6.4.2":
-  version "6.4.2"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.2.tgz#1766039cad33f8ad87f9467b98e0d18fbc8f01c5"
-  integrity sha512-1DgP7f+XQIJbLFCTX1V2QnxVmpLdKdzzo2k8EmvDOePfchaIGQ9eCHj2up3/jNEbZuBqel5OxiaOJf37TWauRA==
-
-"@fortawesome/fontawesome-svg-core@^6.4.0":
-  version "6.4.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.4.0.tgz#3727552eff9179506e9203d72feb5b1063c11a21"
-  integrity sha512-Bertv8xOiVELz5raB2FlXDPKt+m94MQ3JgDfsVbrqNpLU9+UE2E18GKjLKw+d3XbeYPqg1pzyQKGsrzbw+pPaw==
-  dependencies:
-    "@fortawesome/fontawesome-common-types" "6.4.0"
-
-"@fortawesome/free-brands-svg-icons@^6.4.2":
-  version "6.4.2"
-  resolved "https://registry.yarnpkg.com/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.4.2.tgz#9b8e78066ea6dd563da5dfa686615791d0f7cc71"
-  integrity sha512-LKOwJX0I7+mR/cvvf6qIiqcERbdnY+24zgpUSouySml+5w8B4BJOx8EhDR/FTKAu06W12fmUIcv6lzPSwYKGGg==
-  dependencies:
-    "@fortawesome/fontawesome-common-types" "6.4.2"
-
-"@fortawesome/free-regular-svg-icons@^6.4.0":
-  version "6.4.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.4.0.tgz#cacc53bd8d832d46feead412d9ea9ce80a55e13a"
-  integrity sha512-ZfycI7D0KWPZtf7wtMFnQxs8qjBXArRzczABuMQqecA/nXohquJ5J/RCR77PmY5qGWkxAZDxpnUFVXKwtY/jPw==
-  dependencies:
-    "@fortawesome/fontawesome-common-types" "6.4.0"
-
-"@fortawesome/free-solid-svg-icons@^6.4.0":
-  version "6.4.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.4.0.tgz#48c0e790847fa56299e2f26b82b39663b8ad7119"
-  integrity sha512-kutPeRGWm8V5dltFP1zGjQOEAzaLZj4StdQhWVZnfGFCvAPVvHh8qk5bRrU4KXnRRRNni5tKQI9PBAdI6MP8nQ==
-  dependencies:
-    "@fortawesome/fontawesome-common-types" "6.4.0"
-
-"@fortawesome/react-fontawesome@^0.2.0":
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.0.tgz#d90dd8a9211830b4e3c08e94b63a0ba7291ddcf4"
-  integrity sha512-uHg75Rb/XORTtVt7OS9WoK8uM276Ufi7gCzshVWkUJbHhh3svsUUeqXerrM96Wm7fRiDzfKRwSoahhMIkGAYHw==
-  dependencies:
-    prop-types "^15.8.1"
-
 "@headlessui/react@^1.7.15":
   version "1.7.15"
   resolved "https://registry.yarnpkg.com/@headlessui/react/-/react-1.7.15.tgz#53ef6ae132af81b8f188414767b6e79ebf8dc73f"