Pass recursive from server to client

Author: gregberge

bun.lock

@@ -241,6 +241,7 @@
         "@scalar/oas-utils": "^0.2.120",
         "clsx": "^2.1.1",
         "flatted": "^3.2.9",
+        "json-decycle": "^4.0.0",
         "json-xml-parse": "^1.3.0",
         "react-aria": "^3.37.0",
         "react-aria-components": "^1.6.0",
@@ -2069,6 +2070,8 @@
 
     "json-buffer": ["[email protected]", "", {}, "sha512-CuUqjv0FUZIdXkHPI8MezCnFCdaTAacej1TZYulLoAg1h/PhwkdXFN4V/gzY4g+fMBCOV2xF+rp7t2XD2ns/NQ=="],
 
+    "json-decycle": ["[email protected]", "", {}, "sha512-3GFL/vWazCbMu1kw+NdIfAHh6Ugq5pxkKcSUnK1f/Fw1nDtt1i+BiBfRJs0iPEKscYAz4k4+osvgjY95hmuJXQ=="],
+
     "json-parse-even-better-errors": ["[email protected]", "", {}, "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w=="],
 
     "json-schema": ["[email protected]", "", {}, "sha512-es94M3nTIfsEPisRafak+HDLfHXnKBhV3vU5eqPcS3flIWqcxJWgXHXiey3YrpaNsanY5ei1VoYEbOzijuq9BA=="],

packages/react-openapi/package.json

@@ -16,6 +16,7 @@
         "@scalar/oas-utils": "^0.2.120",
         "clsx": "^2.1.1",
         "flatted": "^3.2.9",
+        "json-decycle": "^4.0.0",
         "json-xml-parse": "^1.3.0",
         "react-aria-components": "^1.6.0",
         "react-aria": "^3.37.0",

packages/react-openapi/src/OpenAPIRequestBody.tsx

@@ -1,6 +1,6 @@
 import type { OpenAPIV3 } from '@gitbook/openapi-parser';
 import { InteractiveSection } from './InteractiveSection';
-import { OpenAPIRootSchema } from './OpenAPISchema';
+import { OpenAPIRootSchema } from './OpenAPISchemaServer';
 import type { OpenAPIClientContext } from './types';
 import { checkIsReference } from './utils';
 

packages/react-openapi/src/OpenAPIResponse.tsx

@@ -1,6 +1,6 @@
 import type { OpenAPIV3 } from '@gitbook/openapi-parser';
 import { OpenAPIDisclosure } from './OpenAPIDisclosure';
-import { OpenAPISchemaProperties } from './OpenAPISchema';
+import { OpenAPISchemaProperties } from './OpenAPISchemaServer';
 import type { OpenAPIClientContext } from './types';
 import { parameterToProperty, resolveDescription } from './utils';
 

packages/react-openapi/src/OpenAPISchema.tsx

@@ -6,6 +6,7 @@ import type { OpenAPIV3 } from '@gitbook/openapi-parser';
 import { useId } from 'react';
 
 import clsx from 'clsx';
+import { retrocycle } from 'json-decycle';
 import { Markdown } from './Markdown';
 import { OpenAPIDisclosure } from './OpenAPIDisclosure';
 import { OpenAPISchemaName } from './OpenAPISchemaName';
@@ -14,7 +15,7 @@ import { checkIsReference, resolveDescription, resolveFirstExample } from './uti
 
 type CircularRefsIds = Map<OpenAPIV3.SchemaObject, string>;
 
-interface OpenAPISchemaPropertyEntry {
+export interface OpenAPISchemaPropertyEntry {
     propertyName?: string | undefined;
     required?: boolean | undefined;
     schema: OpenAPIV3.SchemaObject;
@@ -84,7 +85,7 @@ function OpenAPISchemaProperty(props: {
 /**
  * Render a set of properties of an OpenAPI schema.
  */
-export function OpenAPISchemaProperties(props: {
+function OpenAPISchemaProperties(props: {
     id?: string;
     properties: OpenAPISchemaPropertyEntry[];
     circularRefs?: CircularRefsIds;
@@ -113,10 +114,24 @@ export function OpenAPISchemaProperties(props: {
     );
 }
 
+export function OpenAPISchemaPropertiesFromServer(props: {
+    id?: string;
+    properties: string;
+    context: OpenAPIClientContext;
+}) {
+    return (
+        <OpenAPISchemaProperties
+            id={props.id}
+            properties={JSON.parse(props.properties, retrocycle())}
+            context={props.context}
+        />
+    );
+}
+
 /**
  * Render a root schema (such as the request body or response body).
  */
-export function OpenAPIRootSchema(props: {
+function OpenAPIRootSchema(props: {
     schema: OpenAPIV3.SchemaObject;
     context: OpenAPIClientContext;
     circularRefs?: CircularRefsIds;
@@ -153,6 +168,18 @@ export function OpenAPIRootSchema(props: {
     );
 }
 
+export function OpenAPIRootSchemaFromServer(props: {
+    schema: string;
+    context: OpenAPIClientContext;
+}) {
+    return (
+        <OpenAPIRootSchema
+            schema={JSON.parse(props.schema, retrocycle())}
+            context={props.context}
+        />
+    );
+}
+
 /**
  * Render a tab for an alternative schema.
  * It renders directly the properties if relevant;

packages/react-openapi/src/OpenAPISchemaServer.tsx

@@ -0,0 +1,34 @@
+import type { OpenAPIV3 } from '@gitbook/openapi-parser';
+import { decycle } from 'json-decycle';
+import {
+    OpenAPIRootSchemaFromServer,
+    OpenAPISchemaPropertiesFromServer,
+    type OpenAPISchemaPropertyEntry,
+} from './OpenAPISchema';
+import type { OpenAPIClientContext } from './types';
+
+export function OpenAPISchemaProperties(props: {
+    id?: string;
+    properties: OpenAPISchemaPropertyEntry[];
+    context: OpenAPIClientContext;
+}) {
+    return (
+        <OpenAPISchemaPropertiesFromServer
+            id={props.id}
+            properties={JSON.stringify(props.properties, decycle())}
+            context={props.context}
+        />
+    );
+}
+
+export function OpenAPIRootSchema(props: {
+    schema: OpenAPIV3.SchemaObject;
+    context: OpenAPIClientContext;
+}) {
+    return (
+        <OpenAPIRootSchemaFromServer
+            schema={JSON.stringify(props.schema, decycle())}
+            context={props.context}
+        />
+    );
+}

packages/react-openapi/src/OpenAPISpec.tsx

@@ -2,7 +2,7 @@ import type { OpenAPI } from '@gitbook/openapi-parser';
 
 import { OpenAPIRequestBody } from './OpenAPIRequestBody';
 import { OpenAPIResponses } from './OpenAPIResponses';
-import { OpenAPISchemaProperties } from './OpenAPISchema';
+import { OpenAPISchemaProperties } from './OpenAPISchemaServer';
 import { OpenAPISecurities } from './OpenAPISecurities';
 import { StaticSection } from './StaticSection';
 import type { OpenAPIClientContext, OpenAPIOperationData } from './types';