way nicer flow and almost ready for fetching and displaying but stay patient

components/LinkCard.tsx

@@ -2,13 +2,14 @@ import { FaArchive, FaExternalLinkAlt, FaFilePdf } from "react-icons/fa";
 import Link from "../models/link";
 import Image from "next/image";
 import { BsThreeDots } from "react-icons/bs";
+import LinkIcon from "./LinkIcon";
 
 export default function LinkCard(props: { link?: Link }) {
   return (
     <span className="flex flex-col rounded-lg">
       {/* attmnt header */}
       <span className="flex flex-row bg-gray-300 bg-opacity-25 py-5 px-3 items-center justify-start">
-        <RenderFileIcon className="text-4xl text-orange-300 mr-2" />
+        <LinkIcon className="text-4xl text-orange-300 mr-2" />
 
         <span className="flex flex-col items-baseline mr-10 space-y-1">
           <span className="text-md font-bold text-white">report.pdf</span>
@@ -57,7 +58,3 @@ export default function LinkCard(props: { link?: Link }) {
     </span>
   );
 }
-
-function RenderFileIcon(props) {
-  return <FaFilePdf {...props} />;
-}