From a2c9ca8be291688c532252265979552ede8209bf Mon Sep 17 00:00:00 2001
From: Rohin Bhargava <rohinbharg@gmail.com>
Date: Fri, 19 Jul 2024 20:02:43 -0400
Subject: [PATCH] [FER-2474] Test rendering literals as single enum values
 (#1172)

---
 .../InternalTypeDefinition.tsx                | 24 +++++++++++++++++++
 .../InternalTypeDefinitionError.tsx           | 18 ++++++++++++++
 .../InternalTypeReferenceDefinitions.tsx      | 13 ++++++++--
 .../types/type-shorthand/TypeShorthand.tsx    |  9 ++++---
 packages/ui/app/src/resolver/types.ts         |  3 ++-
 5 files changed, 59 insertions(+), 8 deletions(-)

diff --git a/packages/ui/app/src/api-page/types/type-definition/InternalTypeDefinition.tsx b/packages/ui/app/src/api-page/types/type-definition/InternalTypeDefinition.tsx
index 181998b1df..4dfc8d25ac 100644
--- a/packages/ui/app/src/api-page/types/type-definition/InternalTypeDefinition.tsx
+++ b/packages/ui/app/src/api-page/types/type-definition/InternalTypeDefinition.tsx
@@ -105,6 +105,19 @@ export const InternalTypeDefinition = memo<InternalTypeDefinition.Props>(functio
                     elementNameSingular: "enum value",
                     elementNamePlural: "enum values",
                 }),
+                literal: (literal) => ({
+                    elements: [
+                        visitDiscriminatedUnion(literal.value, "type")._visit({
+                            stringLiteral: (value) => <Chip key={value.value} name={value.value} />,
+                            booleanLiteral: (value) => (
+                                <Chip key={value.value.toString()} name={value.value.toString()} />
+                            ),
+                            _other: () => <span>{"<unknown>"}</span>,
+                        }),
+                    ],
+                    elementNameSingular: "literal",
+                    elementNamePlural: "literals",
+                }),
                 alias: () => undefined,
                 unknown: () => undefined,
                 _other: () => undefined,
@@ -151,6 +164,17 @@ export const InternalTypeDefinition = memo<InternalTypeDefinition.Props>(functio
     }
 
     if (!isCollapsible) {
+        // TODO: (rohin) Refactor this
+        if (collapsableContent.elementNameSingular === "literal") {
+            return (
+                <div className="t-muted flex items-baseline gap-2">
+                    <span className="shrink-0 text-sm"> Allowed value: </span>
+                    <FernTooltipProvider>
+                        <span className="inline-flex flex-wrap gap-2">{collapsableContent.elements}</span>
+                    </FernTooltipProvider>
+                </div>
+            );
+        }
         return (
             <FernErrorBoundary component="InternalTypeDefinition">
                 <FernTooltipProvider>
diff --git a/packages/ui/app/src/api-page/types/type-definition/InternalTypeDefinitionError.tsx b/packages/ui/app/src/api-page/types/type-definition/InternalTypeDefinitionError.tsx
index 78a9bd7ff8..fbce4bbdec 100644
--- a/packages/ui/app/src/api-page/types/type-definition/InternalTypeDefinitionError.tsx
+++ b/packages/ui/app/src/api-page/types/type-definition/InternalTypeDefinitionError.tsx
@@ -97,6 +97,24 @@ export const InternalTypeDefinitionError: React.FC<InternalTypeDefinitionError.P
                     elementNameSingular: "enum value",
                     elementNamePlural: "enum values",
                 }),
+                literal: (literal) => ({
+                    elements: [
+                        <EnumValue
+                            key={literal.value.value.toString()}
+                            enumValue={{
+                                value: visitDiscriminatedUnion(literal.value, "type")._visit({
+                                    stringLiteral: (value) => `${value.value}`,
+                                    booleanLiteral: (value) => `${value.value ? "true" : "false"}`,
+                                    _other: () => "<unknown>",
+                                }),
+                                description: undefined,
+                                availability: undefined,
+                            }}
+                        />,
+                    ],
+                    elementNameSingular: "literal",
+                    elementNamePlural: "literals",
+                }),
                 _other: () => undefined,
                 alias: () => undefined,
                 unknown: () => undefined,
diff --git a/packages/ui/app/src/api-page/types/type-reference/InternalTypeReferenceDefinitions.tsx b/packages/ui/app/src/api-page/types/type-reference/InternalTypeReferenceDefinitions.tsx
index d16eebe01c..159993f181 100644
--- a/packages/ui/app/src/api-page/types/type-reference/InternalTypeReferenceDefinitions.tsx
+++ b/packages/ui/app/src/api-page/types/type-reference/InternalTypeReferenceDefinitions.tsx
@@ -34,7 +34,7 @@ export function hasInternalTypeReference(
         optional: (optional) => hasInternalTypeReference(optional.shape, types),
         map: (map) => hasInternalTypeReference(map.keyShape, types) || hasInternalTypeReference(map.valueShape, types),
         primitive: () => false,
-        literal: () => false,
+        literal: () => true,
         unknown: () => false,
         _other: () => false,
         reference: (reference) =>
@@ -168,7 +168,16 @@ export const InternalTypeReferenceDefinitions: React.FC<InternalTypeReferenceDef
             </MapTypeContextProvider>
         ),
         primitive: () => null,
-        literal: () => null,
+        literal: (literal) => (
+            <InternalShapeRenderer
+                typeShape={literal}
+                isCollapsible={false}
+                anchorIdParts={anchorIdParts}
+                route={route}
+                defaultExpandAll={defaultExpandAll}
+                types={types}
+            />
+        ),
         unknown: () => null,
         _other: () => null,
         alias: (alias) => (
diff --git a/packages/ui/app/src/api-page/types/type-shorthand/TypeShorthand.tsx b/packages/ui/app/src/api-page/types/type-shorthand/TypeShorthand.tsx
index b1072f666c..a7cc811f96 100644
--- a/packages/ui/app/src/api-page/types/type-shorthand/TypeShorthand.tsx
+++ b/packages/ui/app/src/api-page/types/type-shorthand/TypeShorthand.tsx
@@ -118,13 +118,12 @@ export function renderTypeShorthand(
             )} to ${renderTypeShorthand(map.valueShape, { plural: true }, types)}`,
 
         // literals
-        literal: (literal) =>
-            visitDiscriminatedUnion(literal.value, "type")._visit({
-                stringLiteral: (value) => `"${value.value}"`,
-                booleanLiteral: (value) => `${value.value}`,
+        literal: (_literal) =>
+            visitDiscriminatedUnion(_literal.value, "type")._visit({
+                stringLiteral: () => "string literal",
+                booleanLiteral: () => "boolean literal",
                 _other: () => "<unknown>",
             }),
-
         // other
         unknown: () => "any",
         _other: () => "<unknown>",
diff --git a/packages/ui/app/src/resolver/types.ts b/packages/ui/app/src/resolver/types.ts
index db71fc9046..34d366f040 100644
--- a/packages/ui/app/src/resolver/types.ts
+++ b/packages/ui/app/src/resolver/types.ts
@@ -497,7 +497,8 @@ export type ResolvedTypeDefinition =
     | ResolvedDiscriminatedUnionShape
     | ResolvedEnumShape
     | ResolvedAliasShape
-    | (APIV1Read.TypeReference.Unknown & WithMetadata);
+    | (APIV1Read.TypeReference.Unknown & WithMetadata)
+    | (APIV1Read.TypeReference.Literal & WithMetadata);
 
 interface ResolvedEnumShape extends WithMetadata {
     name: string | undefined;