diff --git a/apps/dashboard/package.json b/apps/dashboard/package.json index 4393893a341..0f6dcdca315 100644 --- a/apps/dashboard/package.json +++ b/apps/dashboard/package.json @@ -73,6 +73,7 @@ "next-seo": "^6.5.0", "next-themes": "^0.4.4", "nextjs-toploader": "^1.6.12", + "openapi-types": "^12.1.3", "papaparse": "^5.4.1", "pluralize": "^8.0.0", "posthog-js": "1.67.1", diff --git a/apps/dashboard/src/app/team/[team_slug]/[project_slug]/insight/[blueprint_slug]/blueprint-playground.client.tsx b/apps/dashboard/src/app/team/[team_slug]/[project_slug]/insight/[blueprint_slug]/blueprint-playground.client.tsx index bc9fe21f76d..e5518a84c02 100644 --- a/apps/dashboard/src/app/team/[team_slug]/[project_slug]/insight/[blueprint_slug]/blueprint-playground.client.tsx +++ b/apps/dashboard/src/app/team/[team_slug]/[project_slug]/insight/[blueprint_slug]/blueprint-playground.client.tsx @@ -25,6 +25,7 @@ import { PlayIcon, } from "lucide-react"; import Link from "next/link"; +import type { OpenAPIV3 } from "openapi-types"; import { useEffect, useMemo, useState } from "react"; import { type UseFormReturn, useForm } from "react-hook-form"; import { z } from "zod"; @@ -118,8 +119,10 @@ function modifyParametersForPlayground(_parameters: BlueprintParameter[]) { name: "chainId", in: "path", required: true, - description: "Chain ID", - type: "integer", + schema: { + type: "integer", + description: "Chain ID of the blockchain", + }, }); } @@ -156,7 +159,10 @@ export function BlueprintPlaygroundUI(props: { }) { const trackEvent = useTrack(); const parameters = useMemo(() => { - return modifyParametersForPlayground(props.metadata.parameters); + const filteredParams = props.metadata.parameters?.filter( + isOpenAPIV3ParameterObject, + ); + return modifyParametersForPlayground(filteredParams || []); }, [props.metadata.parameters]); const formSchema = useMemo(() => { @@ -166,7 +172,11 @@ export function BlueprintPlaygroundUI(props: { const defaultValues = useMemo(() => { const values: Record = {}; for (const param of parameters) { - values[param.name] = param.default || ""; + if (param.schema && "type" in param.schema && param.schema.default) { + values[param.name] = param.schema.default; + } else { + values[param.name] = ""; + } } return values; }, [parameters]); @@ -200,7 +210,7 @@ export function BlueprintPlaygroundUI(props: {
@@ -263,7 +273,7 @@ export function BlueprintPlaygroundUI(props: { function BlueprintMetaHeader(props: { title: string; - description: string; + description: string | undefined; backLink: string; }) { return ( @@ -285,9 +295,11 @@ function BlueprintMetaHeader(props: {

{props.title}

-

- {props.description} -

+ {props.description && ( +

+ {props.description} +

+ )}
@@ -457,6 +469,11 @@ function ParameterSection(props: {

{props.title}

{props.parameters.map((param, i) => { + const description = + param.schema && "type" in param.schema + ? param.schema.description + : undefined; + const hasError = !!props.form.formState.errors[param.name]; return ( - {param.description && ( - + {description && ( +