fix(typegen): preserve non-identifier keys in generated types

Author: nkgentile

packages/@sanity/codegen/src/typescript/__tests__/schemaTypeGenerator.test.ts

@@ -47,11 +47,13 @@ describe(SchemaTypeGenerator.name, () => {
         members: [
           {
             key: {name: '_id', type: 'Identifier'},
+            optional: undefined,
             type: 'TSPropertySignature',
             typeAnnotation: {type: 'TSTypeAnnotation', typeAnnotation: {type: 'TSStringKeyword'}},
           },
           {
             key: {name: '_type', type: 'Identifier'},
+            optional: undefined,
             type: 'TSPropertySignature',
             typeAnnotation: {
               type: 'TSTypeAnnotation',
@@ -360,6 +362,52 @@ describe(SchemaTypeGenerator.name, () => {
       )
     })
 
+    test('quotes non-identifier keys, preserves valid identifier keys', () => {
+      const schema = new SchemaTypeGenerator([
+        {
+          type: 'type',
+          name: 'objectWithMixedKeys',
+          value: {
+            type: 'object',
+            attributes: {
+              // Valid identifiers - should NOT be quoted
+              'normalKey': {type: 'objectAttribute', value: {type: 'string'}},
+              '_privateKey': {type: 'objectAttribute', value: {type: 'string'}},
+              '$dollarKey': {type: 'objectAttribute', value: {type: 'string'}},
+              'camelCase': {type: 'objectAttribute', value: {type: 'string'}},
+              'PascalCase': {type: 'objectAttribute', value: {type: 'string'}},
+              'UPPER_SNAKE': {type: 'objectAttribute', value: {type: 'string'}},
+              // Invalid identifiers - MUST be quoted
+              'kebab-case': {type: 'objectAttribute', value: {type: 'string'}},
+              'dot.notation': {type: 'objectAttribute', value: {type: 'string'}},
+              'with spaces': {type: 'objectAttribute', value: {type: 'string'}},
+              '123startsWithNumber': {type: 'objectAttribute', value: {type: 'string'}},
+              'special@char': {type: 'objectAttribute', value: {type: 'string'}},
+              '': {type: 'objectAttribute', value: {type: 'string'}},
+            },
+          },
+        },
+      ])
+
+      const objectType = schema.getType('objectWithMixedKeys')?.tsType
+      expect(generateCode(objectType)).toMatchInlineSnapshot(`
+        "{
+          normalKey: string;
+          _privateKey: string;
+          $dollarKey: string;
+          camelCase: string;
+          PascalCase: string;
+          UPPER_SNAKE: string;
+          "kebab-case": string;
+          "dot.notation": string;
+          "with spaces": string;
+          "123startsWithNumber": string;
+          "special@char": string;
+          "": string;
+        }"
+      `)
+    })
+
     test('generates TS Types for objects', () => {
       const schema = new SchemaTypeGenerator([
         {

packages/@sanity/codegen/src/typescript/helpers.ts

@@ -14,6 +14,15 @@ export function sanitizeIdentifier(input: string): string {
   return `${input.replace(/^\d/, '_').replace(/[^$\w]+(.)/g, (_, char) => char.toUpperCase())}`
 }
 
+/**
+ * Checks if a string is a valid ECMAScript IdentifierName.
+ * IdentifierNames start with a letter, underscore, or $, and contain only
+ * alphanumeric characters, underscores, or $.
+ */
+export function isIdentifierName(input: string): boolean {
+  return /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(input)
+}
+
 export function normalizeIdentifier(input: string): string {
   const sanitized = sanitizeIdentifier(input)
   return `${sanitized.charAt(0).toUpperCase()}${sanitized.slice(1)}`

packages/@sanity/codegen/src/typescript/schemaTypeGenerator.ts

@@ -14,7 +14,7 @@ import {
 
 import {safeParseQuery} from '../safeParseQuery'
 import {INTERNAL_REFERENCE_SYMBOL} from './constants'
-import {getUniqueIdentifierForName, sanitizeIdentifier, weakMapMemo} from './helpers'
+import {getUniqueIdentifierForName, isIdentifierName, weakMapMemo} from './helpers'
 import {type ExtractedQuery, type TypeEvaluationStats} from './types'
 
 export class SchemaTypeGenerator {
@@ -115,10 +115,8 @@ export class SchemaTypeGenerator {
   // Helper function used to generate TS types for object properties.
   private generateTsObjectProperty(key: string, attribute: ObjectAttribute): t.TSPropertySignature {
     const type = this.generateTsType(attribute.value)
-    const propertySignature = t.tsPropertySignature(
-      t.identifier(sanitizeIdentifier(key)),
-      t.tsTypeAnnotation(type),
-    )
+    const keyNode = isIdentifierName(key) ? t.identifier(key) : t.stringLiteral(key)
+    const propertySignature = t.tsPropertySignature(keyNode, t.tsTypeAnnotation(type))
     propertySignature.optional = attribute.optional
 
     return propertySignature