better link card

components/LinkViews/LinkComponents/LinkIcon.tsx

@@ -18,9 +18,11 @@ export default function LinkIcon({
     " " +
     (width || "w-12");
 
+  const [showFavicon, setShowFavicon] = React.useState<boolean>(true);
+
   return (
     <div>
-      {link.url && url ? (
+      {link.url && url && showFavicon ? (
         <Image
           src={`https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${link.url}&size=32`}
           width={64}
@@ -28,11 +30,14 @@ export default function LinkIcon({
           alt=""
           className={iconClasses}
           draggable="false"
-          onError={(e) => {
-            const target = e.target as HTMLElement;
-            target.style.display = "none";
+          onError={() => {
+            setShowFavicon(false);
           }}
         />
+      ) : showFavicon === false ? (
+        <div className="flex items-center justify-center h-12 w-12 bg-base-200 rounded-md shadow">
+          <i className="bi-link-45deg text-4xl text-primary"></i>
+        </div>
       ) : link.type === "pdf" ? (
         <i className={`bi-file-earmark-pdf ${iconClasses}`}></i>
       ) : link.type === "image" ? (