feat: improve CustomizeType to render basic constant values

jy95 · Jan 8, 2024 · 09922f3 · 09922f3
1 parent 3a40253
commit 09922f3
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 9 deletions.
diff --git a/__tests__/JSONSchemaViewer/__snapshots__/generateFriendlyName.test.tsx.snap b/__tests__/JSONSchemaViewer/__snapshots__/generateFriendlyName.test.tsx.snap
@@ -2221,7 +2221,7 @@ exports[`JSONSchemaViewer - generateFriendlyName cases test Prefer title 1`] = `
                         </strong>
                          
                         <code>
-                          Hello World
+                          "Hello World"
                         </code>
                          
                         <strong>

diff --git a/__tests__/JSONSchemaViewer/__snapshots__/generic_keywords.test.tsx.snap b/__tests__/JSONSchemaViewer/__snapshots__/generic_keywords.test.tsx.snap
@@ -166,7 +166,7 @@ exports[`JSONSchemaViewer - Generic keywords test const 1`] = `
               </strong>
                
               <code>
-                United States of America
+                "United States of America"
               </code>
                
               <strong>

diff --git a/__tests__/JSONSchemaViewer/__snapshots__/schema_conditionally.test.tsx.snap b/__tests__/JSONSchemaViewer/__snapshots__/schema_conditionally.test.tsx.snap
@@ -331,7 +331,7 @@ exports[`JSONSchemaViewer - schema conditionally test If Then Else (multiple) 1`
                                       </strong>
                                        
                                       <code>
-                                        United States of America
+                                        "United States of America"
                                       </code>
                                        
                                       <strong>
@@ -588,7 +588,7 @@ exports[`JSONSchemaViewer - schema conditionally test If Then Else (multiple) 1`
                                       </strong>
                                        
                                       <code>
-                                        Canada
+                                        "Canada"
                                       </code>
                                        
                                       <strong>
@@ -849,7 +849,7 @@ exports[`JSONSchemaViewer - schema conditionally test If Then Else (multiple) 1`
                                       </strong>
                                        
                                       <code>
-                                        Netherlands
+                                        "Netherlands"
                                       </code>
                                        
                                       <strong>
@@ -1248,7 +1248,7 @@ exports[`JSONSchemaViewer - schema conditionally test If Then Else 1`] = `
                             </strong>
                              
                             <code>
-                              United States of America
+                              "United States of America"
                             </code>
                              
                             <strong>

diff --git a/src/theme/JSONSchemaViewer/utils/generateFriendlyName.tsx b/src/theme/JSONSchemaViewer/utils/generateFriendlyName.tsx
@@ -1,5 +1,7 @@
 import React from "react"
 
+import CodeBlock from "@theme-original/CodeBlock"
+
 // Utility functions to know which case we have
 import { detectedTypes } from "@theme/JSONSchemaViewer/utils"
 
@@ -17,7 +19,6 @@ import type {
   JSONSchemaNS,
   TypeValues,
 } from "@theme/JSONSchemaViewer/types"
-import { printSchemaType } from "@theme/JSONSchemaViewer/utils/QualifierMessages"
 
 // common function I need below
 function shouldAddSeparator(idx: number, length: number): boolean {
@@ -139,12 +140,21 @@ function CustomizeType({ schema, type }: CustomizeProps): JSX.Element {
   }
 
   // For constant values
+  // I used Docusaurus Codeblock (instead of printSchemaType) as they put quotes whereas normal <code> don't
   if (!["array", "object"].includes(type)) {
     if (schema.const !== undefined) {
-      return printSchemaType(schema.const)
+      return (
+        <CodeBlock language="json">{`${JSON.stringify(
+          schema.const,
+        )}`}</CodeBlock>
+      )
     }
     if (schema.enum !== undefined && schema.enum.length === 1) {
-      return printSchemaType(schema.enum[0])
+      return (
+        <CodeBlock language="json">{`${JSON.stringify(
+          schema.enum[0],
+        )}`}</CodeBlock>
+      )
     }
   }