Extract and remove unused code around OpenAPI servers (#2867)

Author: gregberge

packages/react-openapi/src/OpenAPICodeSample.tsx

@@ -1,12 +1,12 @@
 import { CodeSampleInput, codeSampleGenerators } from './code-samples';
 import { generateMediaTypeExample, generateSchemaExample } from './generateSchemaExample';
 import { InteractiveSection } from './InteractiveSection';
-import { getServersURL } from './OpenAPIServerURL';
 import type { OpenAPIContextProps, OpenAPIOperationData } from './types';
 import { createStateKey } from './utils';
 import { stringifyOpenAPI } from './stringifyOpenAPI';
 import { OpenAPITabs, OpenAPITabsList, OpenAPITabsPanels } from './OpenAPITabs';
 import { checkIsReference } from './utils';
+import { getDefaultServerURL } from './util/server';
 
 /**
  * Display code samples to execute the operation.
@@ -53,7 +53,7 @@ export function OpenAPICodeSample(props: {
 
     const input: CodeSampleInput = {
         url:
-            getServersURL(data.servers) +
+            getDefaultServerURL(data.servers) +
             data.path +
             (searchParams.size ? `?${searchParams.toString()}` : ''),
         method: data.method,

packages/react-openapi/src/OpenAPIServerURL.tsx

@@ -0,0 +1,58 @@
+import { describe, it, expect } from 'bun:test';
+import { interpolateServerURL, getDefaultServerURL } from './server';
+import { OpenAPIV3 } from '@gitbook/openapi-parser';
+
+describe('#interpolateServerURL', () => {
+    it('interpolates the server URL with the default values of the variables', () => {
+        const server: OpenAPIV3.ServerObject = {
+            url: 'https://{username}.example.com/{basePath}',
+            variables: {
+                username: { default: 'user' },
+                basePath: { default: 'v1' },
+            },
+        };
+        const result = interpolateServerURL(server);
+        expect(result).toBe('https://user.example.com/v1');
+    });
+
+    it('returns the URL with placeholders if no variables are provided', () => {
+        const server: OpenAPIV3.ServerObject = {
+            url: 'https://{username}.example.com/{basePath}',
+        };
+        const result = interpolateServerURL(server);
+        expect(result).toBe('https://{username}.example.com/{basePath}');
+    });
+
+    it('returns the URL with mixed placeholders and default values', () => {
+        const server: OpenAPIV3.ServerObject = {
+            url: 'https://{username}.example.com/{basePath}',
+            variables: {
+                basePath: { default: 'v1' },
+            },
+        };
+        const result = interpolateServerURL(server);
+        expect(result).toBe('https://{username}.example.com/v1');
+    });
+});
+
+describe('#getDefaultServerURL', () => {
+    it('returns the default server URL', () => {
+        const servers: OpenAPIV3.ServerObject[] = [
+            {
+                url: 'https://{username}.example.com/{basePath}',
+                variables: {
+                    username: { default: 'user' },
+                    basePath: { default: 'v1' },
+                },
+            },
+        ];
+        const result = getDefaultServerURL(servers);
+        expect(result).toBe('https://user.example.com/v1');
+    });
+
+    it('returns null if no servers are provided', () => {
+        const servers: OpenAPIV3.ServerObject[] = [];
+        const result = getDefaultServerURL(servers);
+        expect(result).toBeNull();
+    });
+});

packages/react-openapi/src/OpenAPIServerURLVariable.tsx

@@ -0,0 +1,47 @@
+import { OpenAPIV3 } from '@gitbook/openapi-parser';
+
+/**
+ * Get the default URL for the server.
+ */
+export function getDefaultServerURL(servers: OpenAPIV3.ServerObject[]): null | string {
+    const server = servers[0];
+    if (!server) {
+        return null;
+    }
+
+    return interpolateServerURL(server);
+}
+
+/**
+ * Interpolate the server URL with the default values of the variables.
+ */
+export function interpolateServerURL(server: OpenAPIV3.ServerObject) {
+    const parts = parseServerURL(server?.url ?? '');
+
+    return parts
+        .map((part) => {
+            if (part.kind === 'text') {
+                return part.text;
+            } else {
+                return server.variables?.[part.name]?.default ?? `{${part.name}}`;
+            }
+        })
+        .join('');
+}
+
+function parseServerURL(url: string) {
+    const parts = url.split(/{([^}]+)}/g);
+    const result: Array<{ kind: 'variable'; name: string } | { kind: 'text'; text: string }> = [];
+    for (let i = 0; i < parts.length; i++) {
+        const part = parts[i];
+        if (!part) {
+            continue;
+        }
+        if (i % 2 === 0) {
+            result.push({ kind: 'text', text: part });
+        } else {
+            result.push({ kind: 'variable', name: part });
+        }
+    }
+    return result;
+}