fix(explorer): preserve route when switching networks

Author: decofe

apps/explorer/src/comps/Header.tsx

@@ -13,6 +13,7 @@ import {
 	buildExplorerNetworkHref,
 	EXPLORER_NETWORK_OPTIONS,
 	getActiveExplorerNetworkOption,
+	isExplorerNetworkPathPreservable,
 } from '#lib/explorer-network'
 import { useIsNotFoundPage } from '#lib/not-found'
 import ChevronDownIcon from '~icons/lucide/chevron-down'
@@ -229,7 +230,9 @@ export namespace Header {
 								<a
 									key={option.env}
 									href={buildExplorerNetworkHref(option.host, currentPath, {
-										fallbackToHome: isNotFoundPage,
+										fallbackToHome:
+											isNotFoundPage &&
+											!isExplorerNetworkPathPreservable(currentPath),
 									})}
 									role="menuitemradio"
 									aria-checked={isActive}

apps/explorer/src/lib/explorer-network.ts

@@ -40,3 +40,20 @@ export namespace buildExplorerNetworkHref {
 		fallbackToHome?: boolean
 	}
 }
+
+export function isExplorerNetworkPathPreservable(path: string): boolean {
+	const pathname = path.split(/[?#]/, 1)[0]
+
+	return [
+		/^\/$/,
+		/^\/blocks\/?$/,
+		/^\/tokens\/?$/,
+		/^\/fee-amm\/?$/,
+		/^\/tx\/[^/]+\/?$/,
+		/^\/receipt\/[^/]+\/?$/,
+		/^\/block\/[^/]+\/?$/,
+		/^\/block\/countdown\/[^/]+\/?$/,
+		/^\/address\/[^/]+\/?$/,
+		/^\/token\/[^/]+\/?$/,
+	].some((pattern) => pattern.test(pathname))
+}

apps/explorer/test/explorer-network.test.ts

@@ -2,6 +2,7 @@ import { describe, expect, it } from 'vitest'
 import {
 	buildExplorerNetworkHref,
 	EXPLORER_NETWORK_OPTIONS,
+	isExplorerNetworkPathPreservable,
 } from '#lib/explorer-network.ts'
 
 const MAINNET_HOST = 'https://explore.tempo.xyz'
@@ -41,20 +42,29 @@ describe('explorer network switcher hrefs', () => {
 		)
 	})
 
-	it('links to the target network homepage from not-found pages', () => {
+	it('preserves resource paths even when the current route rendered not found', () => {
+		expect(isExplorerNetworkPathPreservable(`/receipt/${SAMPLE_HASH}`)).toBe(
+			true,
+		)
+		expect(
+			isExplorerNetworkPathPreservable(`/tx/${SAMPLE_HASH}?tab=logs#top`),
+		).toBe(true)
+		expect(
+			buildExplorerNetworkHref(TESTNET_HOST, `/receipt/${SAMPLE_HASH}`),
+		).toBe(`${TESTNET_HOST}/receipt/${SAMPLE_HASH}`)
+		expect(
+			buildExplorerNetworkHref(MAINNET_HOST, `/tx/${SAMPLE_HASH}?tab=logs#top`),
+		).toBe(`${MAINNET_HOST}/tx/${SAMPLE_HASH}?tab=logs#top`)
+	})
+
+	it('still links unknown not-found routes to the target network homepage', () => {
+		expect(isExplorerNetworkPathPreservable('/definitely-not-a-route')).toBe(
+			false,
+		)
 		expect(
-			buildExplorerNetworkHref(TESTNET_HOST, `/receipt/${SAMPLE_HASH}`, {
+			buildExplorerNetworkHref(TESTNET_HOST, '/definitely-not-a-route', {
 				fallbackToHome: true,
 			}),
 		).toBe(`${TESTNET_HOST}/`)
-		expect(
-			buildExplorerNetworkHref(
-				MAINNET_HOST,
-				`/tx/${SAMPLE_HASH}?tab=logs#top`,
-				{
-					fallbackToHome: true,
-				},
-			),
-		).toBe(`${MAINNET_HOST}/`)
 	})
 })