From 9b75cfdd51c74b826a0175196c82e033f2cd8fa6 Mon Sep 17 00:00:00 2001
From: pftom <1043269994@qq.com>
Date: Sun, 2 Feb 2025 21:53:16 +0800
Subject: [PATCH] refactor(workspace): Improve resource card favicon handling
 with state-based fallback

---
 .../workspace/resource-list/index.tsx         | 20 ++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/packages/ai-workspace-common/src/components/workspace/resource-list/index.tsx b/packages/ai-workspace-common/src/components/workspace/resource-list/index.tsx
index c3bb0d593..abe11566e 100644
--- a/packages/ai-workspace-common/src/components/workspace/resource-list/index.tsx
+++ b/packages/ai-workspace-common/src/components/workspace/resource-list/index.tsx
@@ -141,6 +141,7 @@ const ActionDropdown = ({
 const ResourceCard = ({ item, onDelete }: { item: Resource; onDelete: () => void }) => {
   const { t, i18n } = useTranslation();
   const language = i18n.languages?.[0];
+  const [showFallbackIcon, setShowFallbackIcon] = useState(false);
 
   const handleCardClick = () => {
     if (item.data?.url) {
@@ -163,15 +164,16 @@ const ResourceCard = ({ item, onDelete }: { item: Resource; onDelete: () => void
       <div className="px-3 pt-2 pb-1 flex justify-between items-center bg-gray-50">
         <div className="flex items-center gap-3 mb-2">
           {item.data?.url ? (
-            <img
-              src={`https://www.google.com/s2/favicons?domain=${new URL(item?.data?.url || getClientOrigin()).hostname}&sz=32`}
-              alt="Website favicon"
-              className="w-6 h-6"
-              onError={(e) => {
-                e.currentTarget.src =
-                  'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTkgM0g1QzMuOSAzIDMgMy45IDMgNVYxOUMzIDIwLjEgMy45IDIxIDUgMjFIMTlDMjAuMSAyMSAyMSAyMC4xIDIxIDE5VjVDMjEgMy45IDIwLjEgMyAxOSAzWk0xOSAxOUg1VjVIMTlWMTlaIiBmaWxsPSIjNjY2NjY2Ii8+PC9zdmc+';
-              }}
-            />
+            showFallbackIcon ? (
+              <IconResourceFilled color={NODE_COLORS.resource} size={24} />
+            ) : (
+              <img
+                src={`https://www.google.com/s2/favicons?domain=${new URL(item?.data?.url || getClientOrigin()).hostname}&sz=32`}
+                alt="Website favicon"
+                className="w-6 h-6"
+                onError={() => setShowFallbackIcon(true)}
+              />
+            )
           ) : (
             <IconResourceFilled color={NODE_COLORS.resource} size={24} />
           )}