From 438c019f012546b20e50d0200cd6024f76b93b5c Mon Sep 17 00:00:00 2001 From: iuwqyir Date: Tue, 20 May 2025 20:46:17 +0000 Subject: [PATCH] replace chain with chain_id in insight playground (#7099) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## [Playground] Fix: Update chain parameter handling in blueprint playground ## Notes for the reviewer This PR updates the blueprint playground to use `chain_id` instead of `chain` parameter throughout the codebase. It also adds logic to remove deprecated parameters from the form schema and specifically removes the `chain` parameter if it's present. ## How to test Test the blueprint playground with various chain selections to ensure the chain_id parameter is correctly populated and that deprecated parameters are not displayed in the form. ## Summary by CodeRabbit - **Refactor** - Updated all references from "chain" to "chain_id" for improved consistency across the playground interface. - Deprecated parameters are now excluded from form generation and display. - **New Features** - Blueprint listings can now indicate if a blueprint is deprecated. - **Chores** - Made the API domain configurable via environment variables with a default fallback. --- ## PR-Codex overview This PR introduces changes to the `BlueprintSection`, `fetchBlueprintSpec`, and other components to enhance the handling of blueprint parameters, including the addition of a `deprecated` flag and renaming of parameters for consistency. It also updates the API URL handling. ### Detailed summary - Added optional `deprecated` property to `blueprints` in `BlueprintSection`. - Introduced `THIRDWEB_INSIGHT_API_DOMAIN` for dynamic API URL in `fetchBlueprintSpec`. - Renamed parameter `chain` to `chain_id` in multiple places for consistency. - Removed `chain` parameter if present in `modifyParametersForPlayground`. - Updated form handling to use `chain_id` instead of `chain` in `ParameterSection`. - Skipped deprecated parameters in schema creation with `createParametersFormSchema`. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` --- .../blueprint-playground.client.tsx | 21 +++++++++++++------ apps/playground-web/src/app/insight/page.tsx | 2 +- apps/playground-web/src/app/insight/utils.ts | 5 ++++- 3 files changed, 20 insertions(+), 8 deletions(-) diff --git a/apps/playground-web/src/app/insight/[blueprint_slug]/blueprint-playground.client.tsx b/apps/playground-web/src/app/insight/[blueprint_slug]/blueprint-playground.client.tsx index a69da3dbda2..3fc39f01028 100644 --- a/apps/playground-web/src/app/insight/[blueprint_slug]/blueprint-playground.client.tsx +++ b/apps/playground-web/src/app/insight/[blueprint_slug]/blueprint-playground.client.tsx @@ -109,7 +109,7 @@ function modifyParametersForPlayground(_parameters: BlueprintParameter[]) { const parameters = [..._parameters]; // make chain query param required - its not required in open api spec - because it either has to be set in subdomain or as a query param - const chainIdParameter = parameters.find((p) => p.name === "chain"); + const chainIdParameter = parameters.find((p) => p.name === "chain_id"); if (chainIdParameter) { chainIdParameter.required = true; } @@ -122,6 +122,12 @@ function modifyParametersForPlayground(_parameters: BlueprintParameter[]) { parameters.splice(clientIdParameterIndex, 1); } + // remove the chain parameter if it is present + const chainParameterIndex = parameters.findIndex((p) => p.name === "chain"); + if (chainParameterIndex !== -1) { + parameters.splice(chainParameterIndex, 1); + } + return parameters; } @@ -163,7 +169,7 @@ function BlueprintPlaygroundUI(props: { values[param.name] = Math.floor( (Date.now() - 3 * 30 * 24 * 60 * 60 * 1000) / 1000, ); - } else if (param.name === "chain") { + } else if (param.name === "chain_id") { values[param.name] = []; } else { values[param.name] = ""; @@ -466,7 +472,7 @@ function ParameterSection(props: { key={param.name} className={cn( "grid items-center", - param.name === "chain" + param.name === "chain_id" ? "grid-cols-1 lg:grid-cols-2" : "grid-cols-2", )} @@ -485,14 +491,14 @@ function ParameterSection(props: { )}
- {param.name === "chain" ? ( + {param.name === "chain_id" ? ( { - props.form.setValue("chain", chainIds, { + props.form.setValue("chain_id", chainIds, { shouldValidate: true, shouldDirty: true, }); @@ -821,6 +827,9 @@ function openAPIV3ParamToZodFormSchema( function createParametersFormSchema(parameters: BlueprintParameter[]) { const shape: z.ZodRawShape = {}; for (const param of parameters) { + if (param.deprecated) { + continue; + } const paramSchema = openAPIV3ParamToZodFormSchema( param.schema, !!param.required, diff --git a/apps/playground-web/src/app/insight/page.tsx b/apps/playground-web/src/app/insight/page.tsx index 470da4a1943..b4ce9bef8d8 100644 --- a/apps/playground-web/src/app/insight/page.tsx +++ b/apps/playground-web/src/app/insight/page.tsx @@ -41,7 +41,7 @@ export default function Page() { function BlueprintSection(props: { title: string; - blueprints: { name: string; link: string }[]; + blueprints: { name: string; link: string; deprecated?: boolean }[]; }) { return (
diff --git a/apps/playground-web/src/app/insight/utils.ts b/apps/playground-web/src/app/insight/utils.ts index f24ce70bc0b..b07558fda8b 100644 --- a/apps/playground-web/src/app/insight/utils.ts +++ b/apps/playground-web/src/app/insight/utils.ts @@ -6,6 +6,9 @@ import type { OpenAPIV3 } from "openapi-types"; export type BlueprintParameter = OpenAPIV3.ParameterObject; export type BlueprintPathMetadata = OpenAPIV3.PathItemObject; +const THIRDWEB_INSIGHT_API_DOMAIN = + process.env.NEXT_PUBLIC_INSIGHT_URL || "insight.thirdweb.com"; + export type BlueprintListItem = { id: string; name: string; @@ -40,7 +43,7 @@ export async function fetchBlueprintSpec(params: { blueprintId: string; }) { const res = await fetch( - `https://insight.thirdweb.com/v1/blueprints/${params.blueprintId}`, + `https://${THIRDWEB_INSIGHT_API_DOMAIN}/v1/blueprints/${params.blueprintId}`, ); if (!res.ok) {