diff --git a/src/components/object-info/links-table.tsx b/src/components/object-info/links-table.tsx index 5ee9a2ef..e977fde0 100644 --- a/src/components/object-info/links-table.tsx +++ b/src/components/object-info/links-table.tsx @@ -46,7 +46,7 @@ interface RowProps { const Row: React.FC = ({ onLinkClick, startIndex, index, rowHeight, link }) => { const key = startIndex + index - const backgroundColor = key % 2 === 0 ? '#fff' : 'rgb(251, 251, 251);' + const backgroundColor = key % 2 === 0 ? '#fff' : 'rgb(251, 251, 251)' return ( // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions diff --git a/src/lib/init-helia.ts b/src/lib/init-helia.ts index dd079c92..aab17281 100644 --- a/src/lib/init-helia.ts +++ b/src/lib/init-helia.ts @@ -1,29 +1,36 @@ import { trustlessGateway } from '@helia/block-brokers' import { createHeliaHTTP } from '@helia/http' -import { type Helia } from '@helia/interface' +import { type Routing, type Helia } from '@helia/interface' import { delegatedHTTPRouting, httpGatewayRouting } from '@helia/routers' import { addDagNodeToHelia } from '../lib/helpers.js' import { getHashersForCodes } from './hash-importer.js' import type { KuboGatewayOptions } from '../types.d.js' +const localStorageKey = 'explore.ipld.gatewayEnabled' +console.info( + `🎛️ Customise whether ipld-explorer-components fetches content from gateways by setting an '${localStorageKey}' value to true/false in localStorage. e.g. localStorage.setItem('${localStorageKey}', false) -- NOTE: defaults to true` +) + /** * Whether to enable remote gateways for fetching content. We default to true if the setting is not present. */ function areRemoteGatewaysEnabled (): boolean { - const localStorageKey = 'explore.ipld.gatewayEnabled' - console.info( - `🎛️ Customise whether ipld-explorer-components fetches content from gateways by setting an '${localStorageKey}' value to true/false in localStorage. e.g. localStorage.setItem('explore.ipld.gatewayEnabled', false) -- NOTE: defaults to true` - ) const gatewayEnabledSetting = localStorage.getItem(localStorageKey) return gatewayEnabledSetting != null ? JSON.parse(gatewayEnabledSetting) : true } export default async function initHelia (kuboGatewayOptions: KuboGatewayOptions): Promise { - const routers = [ - // Always add the Kubo gateway - httpGatewayRouting({ gateways: [`${kuboGatewayOptions.protocol ?? 'http'}://${kuboGatewayOptions.host}:${kuboGatewayOptions.port}`] }) - ] + const routers: Array> = [] + const kuboGatewayUrlString = `${kuboGatewayOptions.protocol ?? 'http'}://${kuboGatewayOptions.host}:${kuboGatewayOptions.port}` + try { + const kuboGatewayUrl = new URL(kuboGatewayUrlString) + // Always try to add the Kubo gateway if we have a valid URL + routers.push(httpGatewayRouting({ gateways: [kuboGatewayUrl.href] })) + } catch (error) { + // eslint-disable-next-line no-console + console.error('Invalid kuboGateway url string: %s', kuboGatewayUrlString, error) + } if (areRemoteGatewaysEnabled()) { // eslint-disable-next-line no-console diff --git a/src/providers/explore.tsx b/src/providers/explore.tsx index 343a1574..d61f432e 100644 --- a/src/providers/explore.tsx +++ b/src/providers/explore.tsx @@ -153,7 +153,7 @@ export const ExploreProvider = ({ children, state, explorePathPrefix = '#/explor const setExplorePath = (path: string | null): void => { const newPath = processPath(path, explorePathPrefix) - if (newPath != null && !window.location.href.includes(newPath)) { + if (newPath != null && !window.location.href.includes(encodeURI(newPath))) { throw new Error('setExplorePath should only be used to update the state, not the URL. If you are using a routing library that doesn\'t allow you to listen to hashchange events, ensure the URL is updated prior to calling setExplorePath.') } setExploreState((exploreState) => ({ diff --git a/src/providers/helia.tsx b/src/providers/helia.tsx index 8b522923..d6d32671 100644 --- a/src/providers/helia.tsx +++ b/src/providers/helia.tsx @@ -1,5 +1,5 @@ import { type Helia } from '@helia/interface' -import React, { createContext, useContext, useEffect, useState, useCallback } from 'react' +import React, { createContext, useContext, useState, useCallback } from 'react' import packageJson from '../../package.json' import initHelia from '../lib/init-helia.js' import type { KuboGatewayOptions } from '../types.js' @@ -29,7 +29,8 @@ const getDefaultKuboGatewayOptions = (): KuboGatewayOptions => { const localStorageKuboGatewayOptions = localStorage.getItem('kuboGateway') if (localStorageKuboGatewayOptions != null) { try { - return JSON.parse(localStorageKuboGatewayOptions) as KuboGatewayOptions + const kuboGatewaySettings = JSON.parse(localStorageKuboGatewayOptions) as KuboGatewayOptions + return { ...defaultKuboGatewayOptions, ...kuboGatewaySettings } } catch (e) { console.error('getDefaultKuboGatewayOptions error', e) } @@ -67,11 +68,6 @@ export const HeliaProvider = ({ children }: React.ComponentProps): any => { } }, [kuboGatewayOptions, setHelia]) - useEffect(() => { - void doInitHelia() - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []) - return ( {children}