remove fontawesome package

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>

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>

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"
         />
       )}

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>

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"}`}
         />

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>