Merge pull request #31 from KvizadSaderah/feat/yaml-typespec-support

Feat/yaml typespec support

Author: Artifizer

README.md

@@ -130,13 +130,34 @@ gts/
 
 ## Key Features
 
-- Full support for JSONC (JSON with Comments)
-- Automated GTS entities discovery in `*.json` or `*.gts` files
-- JSON / JSON schema validation with respect of GTS ids for schemas
-- JSONC support for comments and trailing commas
+- **Multiple File Format Support:**
+  - **JSON**: Standard JSON format (`.json`, `.jsonc`, `.gts`)
+  - **JSONC**: JSON with Comments - supports single-line comments, multi-line comments, and trailing commas
+  - **YAML**: Full YAML support (`.yaml`, `.yml`) - automatically parsed and treated identically to JSON
+  - **TypeSpec**: Pre-compiled TypeSpec schemas (see below)
+- Automated GTS entities discovery across all supported file formats
+- JSON / JSON Schema validation with respect to GTS IDs for schemas
 - Visual GTS entities layout editor and persistence
 - Invalid file detection and error reporting
 
+### TypeSpec Support
+
+TypeSpec (`.tsp`) schemas must be pre-compiled to JSON Schema before use with GTS Viewer.
+
+**Setup:**
+```bash
+# Install TypeSpec compiler
+npm install -g @typespec/compiler @typespec/json-schema
+
+# Compile TypeSpec to JSON Schema
+tsp compile --emit @typespec/json-schema your-schemas/
+```
+
+**Usage:**
+Point GTS Viewer to the generated JSON Schema output directory (e.g., `tsp-output/@typespec/json-schema/`). The viewer will automatically discover and load the compiled schemas.
+
+See [gts-spec TypeSpec examples](https://github.com/globaltypesystem/gts-spec/tree/main/examples/typespec) for sample TypeSpec definitions.
+
 ## Building
 
 ```

apps/electron/src/main/main.ts

@@ -9,10 +9,12 @@ let layoutStorage: HomeFolderLayoutStorage
 
 // Lazy-load ESM module from CJS using dynamic import
 let parseJSONCFn: ((s: string) => any) | null = null
+let parseYAMLFn: ((s: string) => any) | null = null
 async function ensureSharedLoaded() {
   if (!parseJSONCFn) {
     const mod: any = await import('@gts-viewer/shared')
     parseJSONCFn = mod.parseJSONC
+    parseYAMLFn = mod.parseYAML
   }
 }
 
@@ -89,10 +91,11 @@ ipcMain.handle('read-directory', async (_, directoryPath: string) => {
 
         if (entry.isDirectory()) {
           await readDirectory(fullPath)
-        } else if (entry.isFile() && (entry.name.endsWith('.json') || entry.name.endsWith('.jsonc') || entry.name.endsWith('.gts'))) {
+        } else if (entry.isFile() && (entry.name.endsWith('.json') || entry.name.endsWith('.jsonc') || entry.name.endsWith('.gts') || entry.name.endsWith('.yaml') || entry.name.endsWith('.yml'))) {
           try {
             const content = await fs.readFile(fullPath, 'utf-8')
-            const jsonContent = parseJSONCFn!(content)
+            const isYaml = entry.name.endsWith('.yaml') || entry.name.endsWith('.yml')
+            const jsonContent = isYaml ? parseYAMLFn!(content) : parseJSONCFn!(content)
             const relativePath = path.relative(directoryPath, fullPath)
             const isSchema = entry.name.includes('schema') ||
                            jsonContent.$schema ||

apps/server/src/server.ts

@@ -6,7 +6,7 @@ import { readdir, readFile } from 'node:fs/promises'
 import { join, basename } from 'node:path'
 import { openSqlite } from './db.js'
 import type { LayoutSaveRequest, LayoutSnapshot, GlobalSettings } from '@gts/shared'
-import { JsonRegistry, getGtsConfig, GtsConfig, DEFAULT_GTS_CONFIG, parseJSONC, decodeGtsId, isGtsCandidateFileName } from '@gts/shared'
+import { JsonRegistry, getGtsConfig, GtsConfig, DEFAULT_GTS_CONFIG, parseJSONC, parseYAML, decodeGtsId, isGtsCandidateFileName } from '@gts/shared'
 import { randomUUID } from 'crypto'
 import type { Server } from 'node:http'
 import type { ServerConfig } from './config.js'
@@ -48,14 +48,15 @@ async function scanDirectory(dir: string, files: Array<{ path: string; name: str
       } else if (entry.isFile() && isGtsCandidateFileName(entry.name)) {
         try {
           const content = await readFile(fullPath, 'utf-8')
-          const parsed = parseJSONC(content)
+          const isYaml = entry.name.endsWith('.yaml') || entry.name.endsWith('.yml')
+          const parsed = isYaml ? parseYAML(content) : parseJSONC(content)
           files.push({
             path: fullPath,
             name: basename(fullPath),
             content: parsed
           })
         } catch (error) {
-          // Skip invalid JSON files
+          // Skip invalid files
         }
       }
     }

apps/vscode-extension/src/extension.ts

@@ -22,7 +22,7 @@ function getNonce(): string {
   return text
 }
 
-async function scanAndPost(includeGlob: string = '**/*.{json,jsonc,gts}', isInitialScan: boolean = false, refreshFilePath?: string | null) {
+async function scanAndPost(includeGlob: string = '**/*.{json,jsonc,gts,yaml,yml}', isInitialScan: boolean = false, refreshFilePath?: string | null) {
   const hasViewer = viewerPanel !== null
 
   try {
@@ -253,7 +253,7 @@ export async function activate(context: vscode.ExtensionContext) {
  */
 async function performInitialScan() {
   try {
-    const include = '**/*.{json,jsonc,gts}'
+    const include = '**/*.{json,jsonc,gts,yaml,yml}'
     const exclude = '**/{node_modules,.gts-viewer,dist,.git}/**'
     const uris = await vscode.workspace.findFiles(include, exclude, 10000)
 
@@ -326,7 +326,7 @@ function handleFileChange(doc: vscode.TextDocument, delayMsec: number = 500) {
   if (changeTimer) clearTimeout(changeTimer)
   console.log(`[GTS] File changed 2: ${doc.uri.fsPath}`)
   changeTimer = setTimeout(() => {
-    scanAndPost('**/*.{json,jsonc,gts}', false, doc.uri.fsPath)
+    scanAndPost('**/*.{json,jsonc,gts,yaml,yml}', false, doc.uri.fsPath)
   }, delayMsec)
 }
 
@@ -414,7 +414,7 @@ function openViewer(context: vscode.ExtensionContext, resource?: vscode.Uri) {
 
         case 'scanWorkspaceJson': {
           try {
-            const include: string = message.options?.include || '**/*.{json,jsonc,gts}'
+            const include: string = message.options?.include || '**/*.{json,jsonc,gts,yaml,yml}'
             const isInitialScan = !hasPerformedInitialScan
             if (isInitialScan) {
               hasPerformedInitialScan = true

apps/web/src/hooks/useJsonFiles.ts

@@ -1,5 +1,5 @@
 import React, { useState, useRef } from 'react'
-import { JsonRegistry, parseJSONC } from '@gts/shared'
+import { JsonRegistry, parseJSONC, parseYAML } from '@gts/shared'
 import { Scanner } from '../../../../packages/fs-adapters/types'
 // Use the smart scanner that automatically chooses the best implementation
 import { WebSmartScanner } from '../../../../packages/fs-adapters/fs-adapter-web/src/index'
@@ -59,23 +59,24 @@ export function useJsonObjsWithScanner(createScanner: () => Scanner) {
     const scanner = scannerRef.current
     if (!scanner) return
 
-    const docs = await scanner.list({ glob: '**/*.{json,jsonc,gts}' })
+    const docs = await scanner.list({ glob: '**/*.{json,jsonc,gts,yaml,yml}' })
     const files: Array<{ path: string; name: string; content: any }> = []
 
     for (const d of docs) {
       try {
         const text = await scanner.read(d.path)
+        const isYaml = d.name.endsWith('.yaml') || d.name.endsWith('.yml')
         try {
-          const content = parseJSONC(text)
+          const content = isYaml ? parseYAML(text) : parseJSONC(text)
           files.push({ path: d.path, name: d.name, content })
         } catch (e) {
           if (text.includes('gts.')) {
-            // Still push malformed JSONC to show proper error messages
+            // Still push malformed files to show proper error messages
             files.push({ path: d.path, name: d.name, content: text })
           }
         }
       } catch (e) {
-        // Skip unreadable/invalid JSONC
+        // Skip unreadable/invalid files
       }
     }
 
@@ -129,7 +130,7 @@ export function useJsonObjsWithScanner(createScanner: () => Scanner) {
 
     // Start new watcher
     watcherRef.current = scanner.watch(
-      { glob: '**/*.{json,jsonc,gts}' },
+      { glob: '**/*.{json,jsonc,gts,yaml,yml}' },
       (change) => {
         console.log('File change detected:', change)
         // Reload data when files change

apps/web/src/hooks/useJsonFilesVscode.ts

@@ -122,7 +122,7 @@ export function useJsonObjsVscode() {
 
     // Kick off scan for .json, .jsonc and .gts files
     try {
-      (window as any).__GTS_APP_API__?.scanWorkspaceJson?.({ include: '**/*.{json,jsonc,gts}' })
+      (window as any).__GTS_APP_API__?.scanWorkspaceJson?.({ include: '**/*.{json,jsonc,gts,yaml,yml}' })
     } catch (e) {
       setError(e instanceof Error ? e.message : 'Failed to initiate scan')
       setLoading(false)
@@ -145,7 +145,7 @@ export function useJsonObjsVscode() {
     setError(null)
     setProgress(null)
     try {
-      (window as any).__GTS_APP_API__?.scanWorkspaceJson?.({ include: '**/*.{json,jsonc,gts}' })
+      (window as any).__GTS_APP_API__?.scanWorkspaceJson?.({ include: '**/*.{json,jsonc,gts,yaml,yml}' })
     } catch (e) {
       setError(e instanceof Error ? e.message : 'Failed to initiate scan')
       setLoading(false)