feat: add link to check.ipfs.network on block fetch failure

george-hub331 · george-hub331 · commit 5cbde309db27 · 2025-03-12T00:22:15.000+01:00
diff --git a/package-lock.json b/package-lock.json
diff --git a/public/locales/ar/explore.json b/public/locales/ar/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "تحقق من استخدامات المحتوى على شبكة IPFS"
   }
 }
diff --git a/public/locales/ca/explore.json b/public/locales/ca/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Comprova la disponibilitat del contingut a la xarxa IPFS"
   }
 }
diff --git a/public/locales/cs/explore.json b/public/locales/cs/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Nepodařilo se načíst obsah do {timeout} s. Obnovte prosím stránku a zkuste to znovu nebo zkuste jiný CID."
+    "BlockFetchTimeoutError": "Nepodařilo se načíst obsah do {timeout} s. Obnovte prosím stránku a zkuste to znovu nebo zkuste jiný CID.",
+    "checkIpfsNetwork": "Zkontrolujte dostupnost obsahu na IPFS síti"
   }
 }
diff --git a/public/locales/da/explore.json b/public/locales/da/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Tjek indholdets tilgængelighed på IPFS-netværk"
   }
 }
diff --git a/public/locales/de/explore.json b/public/locales/de/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Der Inhalt konnte innerhalb von {timeout}s nicht abgerufen werden. Lade bitte die Seite neu um es erneut zu versuchen oder versuche es mit einer anderen CID."
+    "BlockFetchTimeoutError": "Der Inhalt konnte innerhalb von {timeout}s nicht abgerufen werden. Lade bitte die Seite neu um es erneut zu versuchen oder versuche es mit einer anderen CID.",
+    "checkIpfsNetwork": "Inhalt auf IPFS-Netzwerk prüfen"
   }
 }
diff --git a/public/locales/el/explore.json b/public/locales/el/explore.json
@@ -8,9 +8,8 @@
   "StartExploringPage": {
     "title": "Εξερεύνηση - IPLD",
     "header": "Explore the Merkle Forest",
-    "leadParagraph": "Paste a CID into the box to fetch the IPLD node it addresses, or choose a featured dataset.",,
+    "leadParagraph": "Paste a CID into the box to fetch the IPLD node it addresses, or choose a featured dataset.",
     "noDataAvailable": "Δεν υπάρχουν διαθέσιμα δεδομένα"
-    "noDataAvailable": "No data available"
   },
   "AboutIpld": {
     "paragraph1":"<0>IPLD is <1>the data model of the content-addressable web.</1> It allows us to treat all hash-linked data structures as subsets of a unified information space, unifying all data models that link data with hashes as instances of IPLD.</0>",
@@ -70,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Έλεγχος διαθεσιμότητας περιεχομένου στο IPFS Network"
   }
 }
diff --git a/public/locales/en/explore.json b/public/locales/en/explore.json
@@ -13,7 +13,7 @@
   },
   "AboutIpld": {
     "paragraph1":"<0>IPLD is <1>the data model of the content-addressable web.</1> It allows us to treat all hash-linked data structures as subsets of a unified information space, unifying all data models that link data with hashes as instances of IPLD.</0>",
-    "paragraph2": "<0>Content addressing through hashes has become a widely-used means of connecting data in distributed systems, from the blockchains that run your favorite cryptocurrencies, to the commits that back your code, to the web’s content at large. Yet, whilst all of these tools rely on some common primitives, their specific underlying data structures are not interoperable.</0>",
+    "paragraph2": "<0>Content addressing through hashes has become a widely-used means of connecting data in distributed systems, from the blockchains that run your favorite cryptocurrencies, to the commits that back your code, to the web's content at large. Yet, whilst all of these tools rely on some common primitives, their specific underlying data structures are not interoperable.</0>",
     "paragraph3": "<0>Enter IPLD: a single namespace for all hash-inspired protocols. Through IPLD, links can be traversed across protocols, allowing you to explore data regardless of the underlying protocol.</0>"
   },
   "ExplorePage": {
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Check content availability on IPFS Network"
   }
 }
diff --git a/public/locales/es/explore.json b/public/locales/es/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Comprobar la disponibilidad del contenido en la red IPFS"
   }
 }
diff --git a/public/locales/fr/explore.json b/public/locales/fr/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Impossible d'obtenir le contenu après {timeout}s. Merci de rafraîchir la page pour réessayer ou d'essayer avec un autre CID."
+    "BlockFetchTimeoutError": "Impossible d'obtenir le contenu après {timeout}s. Merci de rafraîchir la page pour réessayer ou d'essayer avec un autre CID.",
+    "checkIpfsNetwork": "Vérifier la disponibilité du contenu sur le réseau IPFS"
   }
 }
diff --git a/public/locales/id/explore.json b/public/locales/id/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Gagal mengambil konten dalam {timeout}s. Harap segarkan halaman untuk mencoba lagi atau mencoba CID lain."
+    "BlockFetchTimeoutError": "Gagal mengambil konten dalam {timeout}s. Harap segarkan halaman untuk mencoba lagi atau mencoba CID lain.",
+    "checkIpfsNetwork": "Memeriksa ketersediaan konten di jaringan IPFS"
   }
 }
diff --git a/public/locales/it/explore.json b/public/locales/it/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Controlla la disponibilità del contenuto sulla rete IPFS"
   }
 }
diff --git a/public/locales/ja-JP/explore.json b/public/locales/ja-JP/explore.json
@@ -68,6 +68,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "IPFSネットワーク上のコンテンツの可用性を確認してください。"
   }
 }
diff --git a/public/locales/ko-KR/explore.json b/public/locales/ko-KR/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "IPFS 네트워크에서 콘텐츠 가용성 확인"
   }
 }
diff --git a/public/locales/nl/explore.json b/public/locales/nl/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Controleer de beschikbaarheid van inhoud op het IPFS-netwerk"
   }
 }
diff --git a/public/locales/no/explore.json b/public/locales/no/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Sjekk innholdets tilgjengelighet på IPFS-nettverket"
   }
 }
diff --git a/public/locales/pl/explore.json b/public/locales/pl/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Sprawdź dostępność zawartości w sieci IPFS"
   }
 }
diff --git a/public/locales/pt-BR/explore.json b/public/locales/pt-BR/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Falha ao buscar conteúdo em {timeout}s. Atualize a página para tentar novamente ou tente um CID diferente."
+    "BlockFetchTimeoutError": "Falha ao buscar conteúdo em {timeout}s. Atualize a página para tentar novamente ou tente um CID diferente.",
+    "checkIpfsNetwork": "Verifique a disponibilidade do conteúdo na rede IPFS"
   }
 }
diff --git a/public/locales/pt/explore.json b/public/locales/pt/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Verifique a disponibilidade do conteúdo na rede IPFS"
   }
 }
diff --git a/public/locales/ro/explore.json b/public/locales/ro/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Verificați disponibilitatea conținutului pe rețeaua IPFS"
   }
 }
diff --git a/public/locales/ru/explore.json b/public/locales/ru/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Проверьте доступность контента в сети IPFS"
   }
 }
diff --git a/public/locales/sv/explore.json b/public/locales/sv/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "Kontrollera innehållets tillgänglighet på IPFS-nätverket"
   }
 }
diff --git a/public/locales/tr/explore.json b/public/locales/tr/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "İçerik IPFS ağında mevcut mu kontrol edin"
   }
 }
diff --git a/public/locales/zh-CN/explore.json b/public/locales/zh-CN/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "在{timeout}内抓取内容失败. 请刷新页面或尝试一个不同的CID"
+    "BlockFetchTimeoutError": "在{timeout}内抓取内容失败. 请刷新页面或尝试一个不同的CID",
+    "checkIpfsNetwork": "检查IPFS网络上的内容可用性"
   }
 }
diff --git a/public/locales/zh-TW/explore.json b/public/locales/zh-TW/explore.json
@@ -69,6 +69,7 @@
     }
   },
   "errors": {
-    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."
+    "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",
+    "checkIpfsNetwork": "檢查 IPFS 網路上的內容可用性"
   }
 }
diff --git a/src/components/explore/IpldExploreErrorComponent.tsx b/src/components/explore/IpldExploreErrorComponent.tsx
@@ -1,5 +1,6 @@
 import React from 'react'
 import { useTranslation } from 'react-i18next'
+import { BlockFetchTimeoutError } from '../../lib/errors'
 import type IpldExploreError from '../../lib/errors'
 
 export interface IpldExploreErrorComponentProps {
@@ -10,9 +11,23 @@ export function IpldExploreErrorComponent ({ error }: IpldExploreErrorComponentP
   const { t } = useTranslation('explore', { keyPrefix: 'errors' })
   if (error == null) return null
 
+  const isBlockError = error instanceof BlockFetchTimeoutError
+
   return (
     <div className='bg-red white pa3 lh-copy'>
       <div>{error.toString(t)}</div>
+      {isBlockError && (
+        <div className='mt2'>
+          <a
+            href={`https://check.ipfs.network/#/ipfs/${error.cid ?? ''}`}
+            target="_blank"
+            rel="noopener noreferrer"
+            className='white underline hover-white'
+          >
+            {t('checkIpfsNetwork')}
+          </a>
+        </div>
+      )}
     </div>
   )
 }
diff --git a/src/lib/errors.ts b/src/lib/errors.ts
@@ -1,7 +1,7 @@
 import { type TFunction } from 'i18next'
 
 export default class IpldExploreError extends Error {
-  constructor (private readonly options: Record<string, string | number>) {
+  constructor (protected readonly options: Record<string, string | number>) {
     super()
     this.name = this.constructor.name
   }
@@ -19,6 +19,10 @@ export default class IpldExploreError extends Error {
   toString (t: TFunction<'translation', 'translation'>): string {
     return t(this.name, this.options)
   }
+
+  get cid (): string | undefined {
+    return this.options.cid as string | undefined
+  }
 }
 
 export class BlockFetchTimeoutError extends IpldExploreError {}
diff --git a/tsconfig.json b/tsconfig.json
@@ -37,7 +37,8 @@
   "include": [
     "src/**/*",
     "dev/**/*",
-    "test/**/*"
+    "test/**/*",
+    "vite.config.ts"
   ],
   "exclude": [
     "src/**/*.stories.*",

Original file line number	Diff line number	Diff line change
`@@ -69,6 +69,7 @@`
`69`	`69`	`}`
`70`	`70`	`},`
`71`	`71`	`"errors": {`
`72`		`- "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."`
	`72`	`+ "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",`
	`73`	`+ "checkIpfsNetwork": "تحقق من استخدامات المحتوى على شبكة IPFS"`
`73`	`74`	`}`
`74`	`75`	`}`
Original file line number	Diff line number	Diff line change
`@@ -8,9 +8,8 @@`
`8`	`8`	`"StartExploringPage": {`
`9`	`9`	`"title": "Εξερεύνηση - IPLD",`
`10`	`10`	`"header": "Explore the Merkle Forest",`
`11`		`- "leadParagraph": "Paste a CID into the box to fetch the IPLD node it addresses, or choose a featured dataset.",,`
	`11`	`+ "leadParagraph": "Paste a CID into the box to fetch the IPLD node it addresses, or choose a featured dataset.",`
`12`	`12`	`"noDataAvailable": "Δεν υπάρχουν διαθέσιμα δεδομένα"`
`13`		`- "noDataAvailable": "No data available"`
`14`	`13`	`},`
`15`	`14`	`"AboutIpld": {`
`16`	`15`	`"paragraph1":"<0>IPLD is <1>the data model of the content-addressable web.</1> It allows us to treat all hash-linked data structures as subsets of a unified information space, unifying all data models that link data with hashes as instances of IPLD.</0>",`
`@@ -70,6 +69,7 @@`
`70`	`69`	`}`
`71`	`70`	`},`
`72`	`71`	`"errors": {`
`73`		`- "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."`
	`72`	`+ "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",`
	`73`	`+ "checkIpfsNetwork": "Έλεγχος διαθεσιμότητας περιεχομένου στο IPFS Network"`
`74`	`74`	`}`
`75`	`75`	`}`
Original file line number	Diff line number	Diff line change
`@@ -13,7 +13,7 @@`
`13`	`13`	`},`
`14`	`14`	`"AboutIpld": {`
`15`	`15`	`"paragraph1":"<0>IPLD is <1>the data model of the content-addressable web.</1> It allows us to treat all hash-linked data structures as subsets of a unified information space, unifying all data models that link data with hashes as instances of IPLD.</0>",`
`16`		`- "paragraph2": "<0>Content addressing through hashes has become a widely-used means of connecting data in distributed systems, from the blockchains that run your favorite cryptocurrencies, to the commits that back your code, to the web’s content at large. Yet, whilst all of these tools rely on some common primitives, their specific underlying data structures are not interoperable.</0>",`
	`16`	`+ "paragraph2": "<0>Content addressing through hashes has become a widely-used means of connecting data in distributed systems, from the blockchains that run your favorite cryptocurrencies, to the commits that back your code, to the web's content at large. Yet, whilst all of these tools rely on some common primitives, their specific underlying data structures are not interoperable.</0>",`
`17`	`17`	`"paragraph3": "<0>Enter IPLD: a single namespace for all hash-inspired protocols. Through IPLD, links can be traversed across protocols, allowing you to explore data regardless of the underlying protocol.</0>"`
`18`	`18`	`},`
`19`	`19`	`"ExplorePage": {`
`@@ -69,6 +69,7 @@`
`69`	`69`	`}`
`70`	`70`	`},`
`71`	`71`	`"errors": {`
`72`		`- "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID."`
	`72`	`+ "BlockFetchTimeoutError": "Failed to fetch content in {timeout}s. Please refresh the page to retry or try a different CID.",`
	`73`	`+ "checkIpfsNetwork": "Check content availability on IPFS Network"`
`73`	`74`	`}`
`74`	`75`	`}`