replace chain with chain_id in insight playground (#7099)

## [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.

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## 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.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

<!-- start pr-codex -->

---

## 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}`

<!-- end pr-codex -->

Author: iuwqyir

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: {
                       )}
                     </div>
                     <div className="relative">
-                      {param.name === "chain" ? (
+                      {param.name === "chain_id" ? (
                         <MultiNetworkSelector
                           selectedBadgeClassName="bg-background"
                           selectedChainIds={
-                            props.form.watch("chain") as number[]
+                            props.form.watch("chain_id") as number[]
                           }
                           onChange={(chainIds) => {
-                            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,

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 (
     <div className="overflow-hidden rounded-lg border bg-card">

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) {