From d63ef608679bbda3e292488d2b95c4d30f97f269 Mon Sep 17 00:00:00 2001
From: Nolann Biron <biron.nolann@gmail.com>
Date: Tue, 29 Apr 2025 09:39:58 +0200
Subject: [PATCH] Schemas disclosure label causing client error

---
 .changeset/sharp-falcons-punch.md             |  6 ++++
 .../components/DocumentView/OpenAPI/style.css |  7 +++-
 packages/react-openapi/src/OpenAPISchema.tsx  | 28 ++++-----------
 .../react-openapi/src/getDisclosureLabel.ts   | 25 ++++++++++++++
 .../src/schemas/OpenAPISchemaItem.tsx         | 34 +++++++++++++++++++
 .../src/schemas/OpenAPISchemas.tsx            | 25 +++++---------
 6 files changed, 85 insertions(+), 40 deletions(-)
 create mode 100644 .changeset/sharp-falcons-punch.md
 create mode 100644 packages/react-openapi/src/getDisclosureLabel.ts
 create mode 100644 packages/react-openapi/src/schemas/OpenAPISchemaItem.tsx

diff --git a/.changeset/sharp-falcons-punch.md b/.changeset/sharp-falcons-punch.md
new file mode 100644
index 0000000000..fbcb613276
--- /dev/null
+++ b/.changeset/sharp-falcons-punch.md
@@ -0,0 +1,6 @@
+---
+'@gitbook/react-openapi': patch
+'gitbook': patch
+---
+
+Fix schemas disclosure label causing client error
diff --git a/packages/gitbook/src/components/DocumentView/OpenAPI/style.css b/packages/gitbook/src/components/DocumentView/OpenAPI/style.css
index 7d08d97f59..e615f7bb1a 100644
--- a/packages/gitbook/src/components/DocumentView/OpenAPI/style.css
+++ b/packages/gitbook/src/components/DocumentView/OpenAPI/style.css
@@ -755,11 +755,16 @@ body:has(.openapi-select-popover) {
 
 .openapi-disclosure:not(
         .openapi-disclosure-group .openapi-disclosure,
-        .openapi-schema-alternatives .openapi-disclosure
+        .openapi-schema-alternatives .openapi-disclosure,
+        .openapi-schemas-disclosure .openapi-schema.openapi-disclosure
     ) {
     @apply rounded-xl;
 }
 
+.openapi-disclosure .openapi-schemas-disclosure .openapi-schema.openapi-disclosure {
+    @apply !rounded-none;
+}
+
 .openapi-disclosure:has(> .openapi-disclosure-trigger:hover) {
     @apply bg-tint-subtle;
 }
diff --git a/packages/react-openapi/src/OpenAPISchema.tsx b/packages/react-openapi/src/OpenAPISchema.tsx
index 8f4c0cd33c..007c335cf8 100644
--- a/packages/react-openapi/src/OpenAPISchema.tsx
+++ b/packages/react-openapi/src/OpenAPISchema.tsx
@@ -13,6 +13,7 @@ import { OpenAPIDisclosure } from './OpenAPIDisclosure';
 import { OpenAPISchemaName } from './OpenAPISchemaName';
 import type { OpenAPIClientContext } from './context';
 import { retrocycle } from './decycle';
+import { getDisclosureLabel } from './getDisclosureLabel';
 import { stringifyOpenAPI } from './stringifyOpenAPI';
 import { tString } from './translate';
 import { checkIsReference, resolveDescription, resolveFirstExample } from './utils';
@@ -606,6 +607,11 @@ function getSchemaTitle(schema: OpenAPIV3.SchemaObject): string {
         if (schema.format) {
             type += ` · ${schema.format}`;
         }
+
+        // Only add the title if it's an object (no need for the title of a string, number, etc.)
+        if (type === 'object' && schema.title) {
+            type += ` · ${schema.title.replaceAll(' ', '')}`;
+        }
     }
 
     if ('anyOf' in schema) {
@@ -620,25 +626,3 @@ function getSchemaTitle(schema: OpenAPIV3.SchemaObject): string {
 
     return type;
 }
-
-function getDisclosureLabel(props: {
-    schema: OpenAPIV3.SchemaObject;
-    isExpanded: boolean;
-    context: OpenAPIClientContext;
-}) {
-    const { schema, isExpanded, context } = props;
-    let label: string;
-    if (schema.type === 'array' && !!schema.items) {
-        if (schema.items.oneOf) {
-            label = tString(context.translation, 'available_items').toLowerCase();
-        } else if (schema.items.enum || schema.items.type === 'object') {
-            label = tString(context.translation, 'properties').toLowerCase();
-        } else {
-            label = schema.items.title ?? schema.title ?? getSchemaTitle(schema.items);
-        }
-    } else {
-        label = schema.title || tString(context.translation, 'properties').toLowerCase();
-    }
-
-    return tString(context.translation, isExpanded ? 'hide' : 'show', label);
-}
diff --git a/packages/react-openapi/src/getDisclosureLabel.ts b/packages/react-openapi/src/getDisclosureLabel.ts
new file mode 100644
index 0000000000..814113b910
--- /dev/null
+++ b/packages/react-openapi/src/getDisclosureLabel.ts
@@ -0,0 +1,25 @@
+'use client';
+
+import type { OpenAPIV3 } from '@gitbook/openapi-parser';
+import type { OpenAPIClientContext } from './context';
+import { tString } from './translate';
+
+export function getDisclosureLabel(props: {
+    schema: OpenAPIV3.SchemaObject;
+    isExpanded: boolean;
+    context: OpenAPIClientContext;
+}) {
+    const { schema, isExpanded, context } = props;
+    let label: string;
+    if (schema.type === 'array' && !!schema.items) {
+        if (schema.items.oneOf) {
+            label = tString(context.translation, 'available_items').toLowerCase();
+        } else {
+            label = tString(context.translation, 'properties').toLowerCase();
+        }
+    } else {
+        label = tString(context.translation, 'properties').toLowerCase();
+    }
+
+    return tString(context.translation, isExpanded ? 'hide' : 'show', label);
+}
diff --git a/packages/react-openapi/src/schemas/OpenAPISchemaItem.tsx b/packages/react-openapi/src/schemas/OpenAPISchemaItem.tsx
new file mode 100644
index 0000000000..86b7d49e8f
--- /dev/null
+++ b/packages/react-openapi/src/schemas/OpenAPISchemaItem.tsx
@@ -0,0 +1,34 @@
+'use client';
+
+import { SectionBody } from '../StaticSection';
+
+import type { OpenAPIV3 } from '@gitbook/openapi-parser';
+import { OpenAPIDisclosure } from '../OpenAPIDisclosure';
+import { OpenAPIRootSchema } from '../OpenAPISchemaServer';
+import { Section } from '../StaticSection';
+import type { OpenAPIClientContext } from '../context';
+import { getDisclosureLabel } from '../getDisclosureLabel';
+
+export function OpenAPISchemaItem(props: {
+    name: string;
+    schema: OpenAPIV3.SchemaObject;
+    context: OpenAPIClientContext;
+}) {
+    const { schema, context, name } = props;
+
+    return (
+        <OpenAPIDisclosure
+            className="openapi-schemas-disclosure"
+            key={name}
+            icon={context.icons.plus}
+            header={name}
+            label={(isExpanded) => getDisclosureLabel({ schema, isExpanded, context })}
+        >
+            <Section className="openapi-section-schemas">
+                <SectionBody>
+                    <OpenAPIRootSchema schema={schema} context={context} />
+                </SectionBody>
+            </Section>
+        </OpenAPIDisclosure>
+    );
+}
diff --git a/packages/react-openapi/src/schemas/OpenAPISchemas.tsx b/packages/react-openapi/src/schemas/OpenAPISchemas.tsx
index eddb893def..c0700a530a 100644
--- a/packages/react-openapi/src/schemas/OpenAPISchemas.tsx
+++ b/packages/react-openapi/src/schemas/OpenAPISchemas.tsx
@@ -1,16 +1,16 @@
 import type { OpenAPISchema } from '@gitbook/openapi-parser';
 import clsx from 'clsx';
-import { OpenAPIDisclosure } from '../OpenAPIDisclosure';
 import { OpenAPIExample } from '../OpenAPIExample';
 import { OpenAPIRootSchema } from '../OpenAPISchemaServer';
-import { Section, SectionBody, StaticSection } from '../StaticSection';
+import { StaticSection } from '../StaticSection';
 import {
     type OpenAPIContextInput,
     getOpenAPIClientContext,
     resolveOpenAPIContext,
 } from '../context';
-import { t, tString } from '../translate';
+import { t } from '../translate';
 import { getExampleFromSchema } from '../util/example';
+import { OpenAPISchemaItem } from './OpenAPISchemaItem';
 
 /**
  * OpenAPI Schemas component.
@@ -85,21 +85,12 @@ export function OpenAPISchemas(props: {
         <div className={clsx('openapi-schemas', className)}>
             {schemas.map(({ name, schema }) => {
                 return (
-                    <OpenAPIDisclosure
-                        className="openapi-schemas-disclosure"
+                    <OpenAPISchemaItem
                         key={name}
-                        icon={context.icons.chevronRight}
-                        header={name}
-                        label={(isExpanded) =>
-                            tString(context.translation, isExpanded ? 'hide' : 'show')
-                        }
-                    >
-                        <Section className="openapi-section-schemas">
-                            <SectionBody>
-                                <OpenAPIRootSchema schema={schema} context={clientContext} />
-                            </SectionBody>
-                        </Section>
-                    </OpenAPIDisclosure>
+                        name={name}
+                        context={clientContext}
+                        schema={schema}
+                    />
                 );
             })}
         </div>