From f90e32fd9bd34e1d657e9ec05a23cf5b1cd6af35 Mon Sep 17 00:00:00 2001 From: karooolis Date: Wed, 16 Oct 2024 19:27:07 +0300 Subject: [PATCH 01/14] remove future time --- packages/explorer/src/app/(explorer)/utils/timeAgo.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/packages/explorer/src/app/(explorer)/utils/timeAgo.ts b/packages/explorer/src/app/(explorer)/utils/timeAgo.ts index dc9f2bcac4..cd885031d6 100644 --- a/packages/explorer/src/app/(explorer)/utils/timeAgo.ts +++ b/packages/explorer/src/app/(explorer)/utils/timeAgo.ts @@ -11,10 +11,6 @@ export function timeAgo(timestamp: bigint) { const currentTimestampSeconds = Math.floor(Date.now() / 1000); const diff = currentTimestampSeconds - Number(timestamp); - if (diff < 0) { - return "in the future"; - } - for (const unit of units) { if (diff >= unit.limit) { const unitsAgo = Math.floor(diff / unit.inSeconds); From 9a4c5807dd9a4920ddc462f626beb826dd3f19ad Mon Sep 17 00:00:00 2001 From: karooolis Date: Wed, 16 Oct 2024 19:59:14 +0300 Subject: [PATCH 02/14] 404 page if invalid chain --- .../src/app/(explorer)/[chainName]/page.tsx | 4 ++-- .../worlds/[worldAddress]/layout.tsx | 17 ++++++++++++++++- .../worlds/[worldAddress]/page.tsx | 3 +-- .../(explorer)/[chainName]/worlds/page.tsx | 19 ++++++++++--------- packages/explorer/src/common.ts | 12 ++++++++++-- 5 files changed, 39 insertions(+), 16 deletions(-) diff --git a/packages/explorer/src/app/(explorer)/[chainName]/page.tsx b/packages/explorer/src/app/(explorer)/[chainName]/page.tsx index e6c8fd70b9..4e8538b59d 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/page.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/page.tsx @@ -6,6 +6,6 @@ type Props = { }; }; -export default async function ChainPage({ params }: Props) { - return redirect(`/${params.chainName}/worlds`); +export default async function ChainPage({ params: { chainName } }: Props) { + return redirect(`/${chainName}/worlds`); } diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/layout.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/layout.tsx index 2c8b5a4811..e530e28cf5 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/layout.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/layout.tsx @@ -1,10 +1,25 @@ "use client"; +import { notFound } from "next/navigation"; +import { Address } from "viem"; +import { isValidChainName } from "../../../../../common"; import { Navigation } from "../../../../../components/Navigation"; import { Providers } from "./Providers"; import { TransactionsWatcher } from "./observe/TransactionsWatcher"; -export default function WorldLayout({ children }: { children: React.ReactNode }) { +type Props = { + params: { + chainName: string; + worldAddress: Address; + }; + children: React.ReactNode; +}; + +export default function WorldLayout({ params: { chainName }, children }: Props) { + if (!isValidChainName(chainName)) { + return notFound(); + } + return ( diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx index 47b435ef54..89843fc4a5 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx @@ -7,7 +7,6 @@ type Props = { }; }; -export default async function WorldPage({ params }: Props) { - const { chainName, worldAddress } = params; +export default async function WorldPage({ params: { chainName, worldAddress } }: Props) { return redirect(`/${chainName}/worlds/${worldAddress}/explore`); } diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/page.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/page.tsx index a8ab09a6aa..8f788c8361 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/page.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/page.tsx @@ -1,7 +1,7 @@ import { headers } from "next/headers"; -import { redirect } from "next/navigation"; +import { notFound, redirect } from "next/navigation"; import { Address } from "viem"; -import { supportedChains, validateChainName } from "../../../../common"; +import { isValidChainName, supportedChainName, supportedChains } from "../../../../common"; import { indexerForChainId } from "../../utils/indexerForChainId"; import { WorldsForm } from "./WorldsForm"; @@ -13,9 +13,7 @@ type ApiResponse = { }[]; }; -async function fetchWorlds(chainName: string): Promise { - validateChainName(chainName); - +async function fetchWorlds(chainName: supportedChainName): Promise { const chain = supportedChains[chainName]; const indexer = indexerForChainId(chain.id); let worldsApiUrl: string | null = null; @@ -53,11 +51,14 @@ type Props = { }; }; -export default async function WorldsPage({ params }: Props) { - const worlds = await fetchWorlds(params.chainName); - if (worlds.length === 1) { - return redirect(`/${params.chainName}/worlds/${worlds[0]}`); +export default async function WorldsPage({ params: { chainName } }: Props) { + if (!isValidChainName(chainName)) { + return notFound(); } + const worlds = await fetchWorlds(chainName); + if (worlds.length === 1) { + return redirect(`/${chainName}/worlds/${worlds[0]}`); + } return ; } diff --git a/packages/explorer/src/common.ts b/packages/explorer/src/common.ts index 06eebb04eb..1e03bb4133 100644 --- a/packages/explorer/src/common.ts +++ b/packages/explorer/src/common.ts @@ -13,14 +13,22 @@ export const chainIdToName = Object.fromEntries( Object.entries(supportedChains).map(([chainName, chain]) => [chain.id, chainName]), ) as Record; +export function isValidChainId(chainId: unknown): name is supportedChainId { + return typeof chainId === "number" && chainId in chainIdToName; +} + +export function isValidChainName(name: unknown): name is supportedChainName { + return typeof name === "string" && name in supportedChains; +} + export function validateChainId(chainId: unknown): asserts chainId is supportedChainId { - if (!(typeof chainId === "number" && chainId in chainIdToName)) { + if (!isValidChainId(name)) { throw new Error(`Invalid chain ID. Supported chains are: ${Object.keys(chainIdToName).join(", ")}.`); } } export function validateChainName(name: unknown): asserts name is supportedChainName { - if (!(typeof name === "string" && name in supportedChains)) { + if (!isValidChainName(name)) { throw new Error(`Invalid chain name. Supported chains are: ${Object.keys(supportedChains).join(", ")}.`); } } From 2c6f1b9c64d0018167dc338b98a15e0d9e30af65 Mon Sep 17 00:00:00 2001 From: karooolis Date: Wed, 16 Oct 2024 20:03:36 +0300 Subject: [PATCH 03/14] worlds selector open only if options exist --- .../src/app/(explorer)/[chainName]/worlds/WorldsForm.tsx | 2 +- packages/explorer/src/common.ts | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/WorldsForm.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/WorldsForm.tsx index a17b413515..7fe546dd6a 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/WorldsForm.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/WorldsForm.tsx @@ -84,7 +84,7 @@ export function WorldsForm({ worlds }: { worlds: Address[] }) {
- {open ? ( + {open && worlds.length > 0 ? (
{worlds?.map((world) => { diff --git a/packages/explorer/src/common.ts b/packages/explorer/src/common.ts index 1e03bb4133..da18b9bc32 100644 --- a/packages/explorer/src/common.ts +++ b/packages/explorer/src/common.ts @@ -13,7 +13,7 @@ export const chainIdToName = Object.fromEntries( Object.entries(supportedChains).map(([chainName, chain]) => [chain.id, chainName]), ) as Record; -export function isValidChainId(chainId: unknown): name is supportedChainId { +export function isValidChainId(chainId: unknown): chainId is supportedChainId { return typeof chainId === "number" && chainId in chainIdToName; } @@ -22,7 +22,7 @@ export function isValidChainName(name: unknown): name is supportedChainName { } export function validateChainId(chainId: unknown): asserts chainId is supportedChainId { - if (!isValidChainId(name)) { + if (!isValidChainId(chainId)) { throw new Error(`Invalid chain ID. Supported chains are: ${Object.keys(chainIdToName).join(", ")}.`); } } From 7e05130826110386be730e086d01ee35c30ca86f Mon Sep 17 00:00:00 2001 From: karooolis Date: Thu, 17 Oct 2024 09:57:32 +0300 Subject: [PATCH 04/14] add chainName validation to chain layout --- .../src/app/(explorer)/[chainName]/layout.tsx | 19 +++++++++++++++++++ .../(explorer)/[chainName]/worlds/page.tsx | 10 +++------- 2 files changed, 22 insertions(+), 7 deletions(-) create mode 100644 packages/explorer/src/app/(explorer)/[chainName]/layout.tsx diff --git a/packages/explorer/src/app/(explorer)/[chainName]/layout.tsx b/packages/explorer/src/app/(explorer)/[chainName]/layout.tsx new file mode 100644 index 0000000000..816c9affda --- /dev/null +++ b/packages/explorer/src/app/(explorer)/[chainName]/layout.tsx @@ -0,0 +1,19 @@ +"use client"; + +import { notFound } from "next/navigation"; +import { isValidChainName } from "../../../common"; + +type Props = { + params: { + chainName: string; + }; + children: React.ReactNode; +}; + +export default function ChainLayout({ params: { chainName }, children }: Props) { + if (!isValidChainName(chainName)) { + return notFound(); + } + + return children; +} diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/page.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/page.tsx index 8f788c8361..04fcbedb5c 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/page.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/page.tsx @@ -1,7 +1,7 @@ import { headers } from "next/headers"; -import { notFound, redirect } from "next/navigation"; +import { redirect } from "next/navigation"; import { Address } from "viem"; -import { isValidChainName, supportedChainName, supportedChains } from "../../../../common"; +import { supportedChainName, supportedChains } from "../../../../common"; import { indexerForChainId } from "../../utils/indexerForChainId"; import { WorldsForm } from "./WorldsForm"; @@ -47,15 +47,11 @@ async function fetchWorlds(chainName: supportedChainName): Promise { type Props = { params: { - chainName: string; + chainName: supportedChainName; }; }; export default async function WorldsPage({ params: { chainName } }: Props) { - if (!isValidChainName(chainName)) { - return notFound(); - } - const worlds = await fetchWorlds(chainName); if (worlds.length === 1) { return redirect(`/${chainName}/worlds/${worlds[0]}`); From 28d282a5f20e661bba5299f05ae0775894718393 Mon Sep 17 00:00:00 2001 From: karooolis Date: Thu, 17 Oct 2024 10:01:03 +0300 Subject: [PATCH 05/14] update params --- .../app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx index 89843fc4a5..a3b0aefcec 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/page.tsx @@ -1,8 +1,9 @@ import { redirect } from "next/navigation"; +import { supportedChainName } from "../../../../../common"; type Props = { params: { - chainName: string; + chainName: supportedChainName; worldAddress: string; }; }; From 65f9ef9e3b1a8ec7d8bb48bc01cb61fdfceef758 Mon Sep 17 00:00:00 2001 From: karooolis Date: Thu, 17 Oct 2024 10:04:17 +0300 Subject: [PATCH 06/14] add back refetch intervalf or tables --- packages/explorer/src/app/(explorer)/queries/useTablesQuery.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/explorer/src/app/(explorer)/queries/useTablesQuery.ts b/packages/explorer/src/app/(explorer)/queries/useTablesQuery.ts index 197826c86c..8220d89803 100644 --- a/packages/explorer/src/app/(explorer)/queries/useTablesQuery.ts +++ b/packages/explorer/src/app/(explorer)/queries/useTablesQuery.ts @@ -52,5 +52,6 @@ export function useTablesQuery() { }) .sort(({ namespace }) => (internalNamespaces.includes(namespace) ? 1 : -1)); }, + refetchInterval: 5000, }); } From f961ac500fedaef8bb1ed6846d317b6972dca963 Mon Sep 17 00:00:00 2001 From: karooolis Date: Thu, 17 Oct 2024 11:24:45 +0300 Subject: [PATCH 07/14] improve layout --- .../worlds/[worldAddress]/interact/Form.tsx | 68 +++++++++---------- .../worlds/[worldAddress]/layout.tsx | 6 +- .../explorer/src/components/Navigation.tsx | 4 +- 3 files changed, 38 insertions(+), 40 deletions(-) diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx index e6eb68ff84..272379229b 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx @@ -22,26 +22,22 @@ export function Form() { ); return ( -
-
-
-

Jump to:

+ <> +
+
+
+

Jump to:

+ { + setFilterValue(evt.target.value); + }} + /> +
- { - setFilterValue(evt.target.value); - }} - /> - -
    +
      {!isFetched && Array.from({ length: 10 }).map((_, index) => { return ( @@ -77,25 +73,25 @@ export function Form() { })}
-
-
- {!isFetched && ( - <> - - - - - - - - - )} +
+ {!isFetched && ( + <> + + + + + + + + + )} - {filteredFunctions?.map((abi) => { - return ; - })} + {filteredFunctions?.map((abi) => { + return ; + })} +
-
+ ); } diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/layout.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/layout.tsx index e530e28cf5..ffa329b67d 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/layout.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/layout.tsx @@ -22,9 +22,11 @@ export default function WorldLayout({ params: { chainName }, children }: Props) return ( - +
+ + {children} +
- {children} ); } diff --git a/packages/explorer/src/components/Navigation.tsx b/packages/explorer/src/components/Navigation.tsx index 388ddad946..68d1e2d61c 100644 --- a/packages/explorer/src/components/Navigation.tsx +++ b/packages/explorer/src/components/Navigation.tsx @@ -30,7 +30,7 @@ function NavigationLink({ href, children }: { href: string; children: React.Reac export function Navigation() { const { data, isFetched } = useWorldAbiQuery(); return ( -
+ <>
Explore @@ -51,6 +51,6 @@ export function Navigation() {
-
+ ); } From 18e24fad3e77d6c6f57676d92b9ed20e0b76abbb Mon Sep 17 00:00:00 2001 From: karooolis Date: Thu, 17 Oct 2024 11:25:36 +0300 Subject: [PATCH 08/14] overflow scroll --- .../[chainName]/worlds/[worldAddress]/interact/Form.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx index 272379229b..3eec6e67d2 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx @@ -23,7 +23,7 @@ export function Form() { return ( <> -
+

Jump to:

From e12d9d1a0160b0188e0474d42be5b6576bd9f4c5 Mon Sep 17 00:00:00 2001 From: karooolis Date: Thu, 17 Oct 2024 11:50:04 +0300 Subject: [PATCH 09/14] wrap long inputs + logs --- .../[worldAddress]/observe/TransactionTableRow.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/observe/TransactionTableRow.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/observe/TransactionTableRow.tsx index d828a5436f..d34d1f640d 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/observe/TransactionTableRow.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/observe/TransactionTableRow.tsx @@ -82,11 +82,11 @@ export function TransactionTableRow({ row }: { row: Row })

Inputs

{Array.isArray(data.functionData?.args) && data.functionData?.args.length > 0 ? ( -
+
{data.functionData?.args?.map((arg, idx) => (
arg {idx + 1}: - + {typeof arg === "object" && arg !== null ? JSON.stringify(arg, null, 2) : String(arg)}
@@ -113,8 +113,8 @@ export function TransactionTableRow({ row }: { row: Row }) <>
-

Logs

- {Array.isArray(logs) && logs.length > 10 ? ( +

Logs

+ {Array.isArray(logs) && logs.length > 0 ? (
    {logs.map((log, idx) => { @@ -128,7 +128,7 @@ export function TransactionTableRow({ row }: { row: Row }) {Object.entries(args).map(([key, value]) => (
  • {key}: - {value as never} + {value as never}
    • ))}
From a152668bf7e5f2971671e72cf64679f84a0f7c1c Mon Sep 17 00:00:00 2001 From: Karolis Ramanauskas Date: Thu, 17 Oct 2024 11:55:57 +0300 Subject: [PATCH 10/14] Create soft-bears-rest.md --- .changeset/soft-bears-rest.md | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 .changeset/soft-bears-rest.md diff --git a/.changeset/soft-bears-rest.md b/.changeset/soft-bears-rest.md new file mode 100644 index 0000000000..498eb6ff87 --- /dev/null +++ b/.changeset/soft-bears-rest.md @@ -0,0 +1,10 @@ +--- +"@latticexyz/explorer": patch +--- + +- Not found page if invalid chain name +- Only show selector for worlds if options exist +- Remove "future time" from transactions table +- Improved layout for Interact tab +- Wrap long args in transactions table +- Add logs (regression) From f4299f72b754cd23ce2ddada3bcb502ea408b872 Mon Sep 17 00:00:00 2001 From: karooolis Date: Thu, 17 Oct 2024 12:20:45 +0300 Subject: [PATCH 11/14] visible ring offset for function field --- .../[chainName]/worlds/[worldAddress]/interact/Form.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx index 3eec6e67d2..dd9ba09c07 100644 --- a/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx +++ b/packages/explorer/src/app/(explorer)/[chainName]/worlds/[worldAddress]/interact/Form.tsx @@ -23,7 +23,7 @@ export function Form() { return ( <> -
+

Jump to:

@@ -74,7 +74,7 @@ export function Form() {
-
+
{!isFetched && ( <> From 84bdcd52e6b94e7133da65258e31701a55f329b2 Mon Sep 17 00:00:00 2001 From: Karolis Ramanauskas Date: Thu, 17 Oct 2024 12:29:59 +0300 Subject: [PATCH 12/14] Update soft-bears-rest.md --- .changeset/soft-bears-rest.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/.changeset/soft-bears-rest.md b/.changeset/soft-bears-rest.md index 498eb6ff87..1bc6b30c5f 100644 --- a/.changeset/soft-bears-rest.md +++ b/.changeset/soft-bears-rest.md @@ -2,9 +2,9 @@ "@latticexyz/explorer": patch --- -- Not found page if invalid chain name -- Only show selector for worlds if options exist -- Remove "future time" from transactions table -- Improved layout for Interact tab -- Wrap long args in transactions table -- Add logs (regression) +- Not found page if invalid chain name. +- Only show selector for worlds if options exist. +- Remove "future time" from transactions table. +- Improved layout for Interact tab. +- Wrap long args in transactions table. +- Add logs (regression). From caad3492995bae8ddb0fe7bfa142bc7b8c21ac4c Mon Sep 17 00:00:00 2001 From: karooolis Date: Thu, 17 Oct 2024 13:36:08 +0300 Subject: [PATCH 13/14] add nav padding --- packages/explorer/src/components/Navigation.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/explorer/src/components/Navigation.tsx b/packages/explorer/src/components/Navigation.tsx index 68d1e2d61c..95921087fe 100644 --- a/packages/explorer/src/components/Navigation.tsx +++ b/packages/explorer/src/components/Navigation.tsx @@ -30,7 +30,7 @@ function NavigationLink({ href, children }: { href: string; children: React.Reac export function Navigation() { const { data, isFetched } = useWorldAbiQuery(); return ( - <> +
Explore @@ -51,6 +51,6 @@ export function Navigation() {
- +
); } From d9075cce0a984e996dd747854f10ef313241adb1 Mon Sep 17 00:00:00 2001 From: Karolis Ramanauskas Date: Thu, 17 Oct 2024 13:37:46 +0300 Subject: [PATCH 14/14] Update soft-bears-rest.md --- .changeset/soft-bears-rest.md | 1 + 1 file changed, 1 insertion(+) diff --git a/.changeset/soft-bears-rest.md b/.changeset/soft-bears-rest.md index 1bc6b30c5f..766f6fbc91 100644 --- a/.changeset/soft-bears-rest.md +++ b/.changeset/soft-bears-rest.md @@ -7,4 +7,5 @@ - Remove "future time" from transactions table. - Improved layout for Interact tab. - Wrap long args in transactions table. +- New tables polling. - Add logs (regression).