Generated by Spark: IndexedDB and Flask replaces Spark. Fix this please. Run npx tsc --noEmit

Error: src/components/FeatureIdeaCloud.tsx(920,37): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/components/PlaywrightDesigner.tsx(105,37): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/components/StorybookDesigner.tsx(115,37): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/components/TemplateExplorer.tsx(40,31): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/components/TemplateExplorer.tsx(44,32): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/components/UnitTestDesigner.tsx(138,37): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-data.ts(23,19): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-data.ts(30,33): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-data.ts(40,24): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-data.ts(63,19): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-data.ts(71,22): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-data.ts(86,19): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-data.ts(91,33): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-data.ts(95,22): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-templates.ts(87,22): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-templates.ts(102,33): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-templates.ts(104,22): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-templates.ts(126,43): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-templates.ts(129,24): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/data/use-seed-templates.ts(131,24): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/json-ui/use-data-sources.ts(25,40): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/json-ui/use-data-sources.ts(47,20): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/orchestration/use-actions.ts(119,31): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/use-component-tree-loader.ts(22,19): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/use-component-tree-loader.ts(27,42): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/use-component-tree-loader.ts(31,22): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/use-component-tree-loader.ts(43,24): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/use-component-tree-loader.ts(60,17): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/use-component-tree-loader.ts(65,32): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/use-component-tree-loader.ts(90,19): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/hooks/use-component-tree-loader.ts(94,20): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/project-service.ts(21,39): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/project-service.ts(61,18): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/project-service.ts(63,38): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/project-service.ts(66,20): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/project-service.ts(74,36): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/project-service.ts(83,18): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/project-service.ts(85,38): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/project-service.ts(87,18): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/protected-llm-service.ts(39,31): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(199,17): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(200,25): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(204,17): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(205,18): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(209,17): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(210,18): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(214,17): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(215,25): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(219,17): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(220,34): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(221,49): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: src/lib/unified-storage.ts(409,18): error TS2339: Property 'spark' does not exist on type 'Window & typeof globalThis'. Error: Process completed with exit code 2.
2026-05-01 09:04:55 +00:00 · 2026-01-17 20:19:44 +00:00
parent c3029577de
commit c7ebafe6a8
19 changed files with 196 additions and 46 deletions
--- a/src/components/FeatureIdeaCloud.tsx
+++ b/src/components/FeatureIdeaCloud.tsx
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { useState, useEffect, useCallback, useRef, ReactElement } from 'react'
 import { useKV } from '@/hooks/use-kv'
 import ReactFlow, {
--- a/src/components/PlaywrightDesigner.tsx
+++ b/src/components/PlaywrightDesigner.tsx
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { useState } from 'react'
 import { PlaywrightTest, PlaywrightStep } from '@/types/project'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
--- a/src/components/StorybookDesigner.tsx
+++ b/src/components/StorybookDesigner.tsx
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { useState } from 'react'
 import { StorybookStory } from '@/types/project'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
--- a/src/components/TemplateExplorer.tsx
+++ b/src/components/TemplateExplorer.tsx
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { useState } from 'react'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
 import { Button } from '@/components/ui/button'
--- a/src/components/UnitTestDesigner.tsx
+++ b/src/components/UnitTestDesigner.tsx
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { useState } from 'react'
 import { UnitTest, TestCase } from '@/types/project'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
--- a/src/global.d.ts
+++ b/src/global.d.ts
@@ -0,0 +1,30 @@
+/// <reference types="vite/client" />
+
+declare const GITHUB_RUNTIME_PERMANENT_NAME: string
+declare const BASE_KV_SERVICE_URL: string
+
+declare global {
+  interface Window {
+    spark: {
+      llmPrompt: (strings: TemplateStringsArray, ...values: any[]) => string
+      llm: (prompt: string, modelName?: string, jsonMode?: boolean) => Promise<string>
+      user: () => Promise<{
+        avatarUrl: string
+        email: string
+        id: string
+        isOwner: boolean
+        login: string
+      }>
+      kv: {
+        keys: () => Promise<string[]>
+        get: <T>(key: string) => Promise<T | undefined>
+        set: <T>(key: string, value: T) => Promise<void>
+        delete: (key: string) => Promise<void>
+      }
+    }
+  }
+
+  var spark: Window['spark']
+}
+
+export {}
--- a/src/hooks/data/use-seed-data.ts
+++ b/src/hooks/data/use-seed-data.ts
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { useCallback, useState } from 'react'
 import seedDataConfig from '@/config/seed-data.json'

--- a/src/hooks/data/use-seed-templates.ts
+++ b/src/hooks/data/use-seed-templates.ts
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { useState } from 'react'
 import { ecommerceTemplate, blogTemplate, dashboardTemplate } from '@/config/seed-templates'
 import defaultTemplate from '@/config/seed-data.json'
--- a/src/hooks/json-ui/use-data-sources.ts
+++ b/src/hooks/json-ui/use-data-sources.ts
@@ -1,3 +1,5 @@
+/// <reference path="../../global.d.ts" />
+
 import { useState, useEffect, useMemo, useCallback } from 'react'
 import { DataSource } from '@/types/json-ui'

--- a/src/hooks/orchestration/use-actions.ts
+++ b/src/hooks/orchestration/use-actions.ts
@@ -1,3 +1,5 @@
+/// <reference path="../../global.d.ts" />
+
 import { useState, useCallback, useMemo } from 'react'
 import { PageSchema, ActionConfig } from '@/types/page-schema'
 import { toast } from 'sonner'
--- a/src/hooks/use-component-tree-loader.ts
+++ b/src/hooks/use-component-tree-loader.ts
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { useCallback, useState, useEffect } from 'react'
 import { ComponentTree } from '@/types/project'
 import componentTreesData from '@/config/component-trees'
--- a/src/lib/ai-service.ts
+++ b/src/lib/ai-service.ts
@@ -1,10 +1,11 @@
+/// <reference path="../global.d.ts" />
+
 import { PrismaModel, ComponentNode, ThemeConfig, ProjectFile } from '@/types/project'
 import { ProtectedLLMService } from './protected-llm-service'

 export class AIService {
  static async generateComponent(description: string): Promise<ComponentNode | null> {
    try {
-      // @ts-expect-error - spark.llmPrompt exists at runtime
      const prompt = window.spark.llmPrompt`You are a React component generator. Generate a component tree structure based on this description: ${description}

 Return a valid JSON object with a single property "component" containing the component structure. The component should follow this format:
@@ -42,7 +43,6 @@ Make sure to use appropriate Material UI components and props. Keep the structur
    try {
      const existingModelNames = existingModels.map(m => m.name).join(', ')

-      // @ts-expect-error - spark.llmPrompt exists at runtime
      const prompt = window.spark.llmPrompt`You are a Prisma schema expert. Create a Prisma model based on this description: ${description}

 Existing models in the schema: ${existingModelNames || 'none'}
@@ -102,7 +102,6 @@ Return a valid JSON object with a single property "model" containing the model s
        utility: "Create a utility function with TypeScript types and JSDoc comments."
      }

-      // @ts-expect-error - spark.llmPrompt exists at runtime
      const prompt = window.spark.llmPrompt`You are a Next.js developer. ${fileTypeInstructions[fileType]}

 Description: ${description}
@@ -125,7 +124,6 @@ Return ONLY the code without any markdown formatting or explanations.`

  static async improveCode(code: string, instruction: string): Promise<string | null> {
    try {
-      // @ts-expect-error - spark.llmPrompt exists at runtime
      const prompt = window.spark.llmPrompt`You are a code improvement assistant. Improve the following code based on this instruction: ${instruction}

 Original code:
@@ -147,7 +145,6 @@ Return ONLY the improved code without any markdown formatting or explanations.`

  static async generateThemeFromDescription(description: string): Promise<Partial<ThemeConfig> | null> {
    try {
-      // @ts-expect-error - spark.llmPrompt exists at runtime
      const prompt = window.spark.llmPrompt`You are a UI/UX designer. Generate a Material UI theme configuration based on this description: ${description}

 Return a valid JSON object with a single property "theme" containing:
@@ -188,7 +185,6 @@ Return a valid JSON object with a single property "theme" containing:
  static async suggestFieldsForModel(modelName: string, existingFields: string[]): Promise<string[] | null> {
    try {
      const existingFieldsStr = existingFields.join(', ')
-      // @ts-expect-error - spark.llmPrompt exists at runtime
      const prompt = window.spark.llmPrompt`You are a database architect. Suggest additional useful fields for a Prisma model named ${modelName}.

 Existing fields: ${existingFieldsStr}
@@ -218,7 +214,6 @@ Suggest 3-5 common fields that would be useful for this model type. Use camelCas

  static async explainCode(code: string): Promise<string | null> {
    try {
-      // @ts-expect-error - spark.llmPrompt exists at runtime
      const prompt = window.spark.llmPrompt`You are a code teacher. Explain what this code does in simple terms:
 ${code}

@@ -238,7 +233,6 @@ Provide a clear, concise explanation suitable for developers.`

  static async generateCompleteApp(description: string): Promise<{ files: ProjectFile[], models: PrismaModel[], theme: Partial<ThemeConfig> } | null> {
    try {
-      // @ts-expect-error - spark.llmPrompt exists at runtime
      const prompt = window.spark.llmPrompt`You are a full-stack architect. Generate a complete Next.js application structure based on this description: ${description}

 Return a valid JSON object with properties "files", "models", and "theme":
--- a/src/lib/error-repair-service.ts
+++ b/src/lib/error-repair-service.ts
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { CodeError, ErrorRepairResult } from '@/types/errors'
 import { ProjectFile } from '@/types/project'
 import { ProtectedLLMService } from './protected-llm-service'
@@ -178,7 +180,6 @@ export class ErrorRepairService {
        .join('\n')

      const result = await ProtectedLLMService.safeLLMCall(
-        // @ts-expect-error - spark.llmPrompt exists at runtime
        window.spark.llmPrompt`You are a code repair assistant. Fix the following errors in this code:

 File: ${file.name} (${file.language})
@@ -277,7 +278,6 @@ Rules:
        .join('\n\n')

      const result = await ProtectedLLMService.safeLLMCall(
-        // @ts-expect-error - spark.llmPrompt exists at runtime
        window.spark.llmPrompt`You are a code repair assistant. Fix the following errors in this code, considering the context of related files:

 File: ${file.name} (${file.language})
--- a/src/lib/project-service.ts
+++ b/src/lib/project-service.ts
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { Project } from '@/types/project'

 export interface SavedProject {
--- a/src/lib/protected-llm-service.ts
+++ b/src/lib/protected-llm-service.ts
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 import { aiRateLimiter, scanRateLimiter } from './rate-limiter'
 import { toast } from 'sonner'

--- a/src/lib/spark-runtime.ts
+++ b/src/lib/spark-runtime.ts
@@ -7,33 +7,52 @@
 * - User authentication
 */

+/// <reference path="../vite-end.d.ts" />
+
 import { getStorage } from './storage-service'

-const llmFunction = async (prompt: string, model?: string, jsonMode?: boolean): Promise<any> => {
-  console.log('Mock LLM called with prompt:', prompt, 'model:', model, 'jsonMode:', jsonMode)
-  return 'This is a mock response from the Spark LLM service.'
-}
-
-llmFunction.chat = async (messages: any[]) => {
-  console.log('Mock LLM chat called with messages:', messages)
-  return {
-    role: 'assistant',
-    content: 'This is a mock response from the Spark LLM service.'
-  }
-}
-
-llmFunction.complete = async (prompt: string) => {
-  console.log('Mock LLM complete called with prompt:', prompt)
-  return 'This is a mock completion from the Spark LLM service.'
-}
-
 export const sparkRuntime = {
+  llmPrompt: (strings: TemplateStringsArray, ...values: any[]): string => {
+    let result = strings[0]
+    for (let i = 0; i < values.length; i++) {
+      result += String(values[i]) + strings[i + 1]
+    }
+    return result
+  },
+
+  llm: async (prompt: string, modelName?: string, jsonMode?: boolean): Promise<string> => {
+    console.log('Mock LLM called with prompt:', prompt, 'model:', modelName, 'jsonMode:', jsonMode)
+    if (jsonMode) {
+      return JSON.stringify({ 
+        message: 'This is a mock response from the Spark LLM service.',
+        model: modelName || 'gpt-4o'
+      })
+    }
+    return 'This is a mock response from the Spark LLM service.'
+  },
+
+  user: async (): Promise<{
+    avatarUrl: string
+    email: string
+    id: string
+    isOwner: boolean
+    login: string
+  }> => {
+    return {
+      id: 'mock-user-id',
+      login: 'mockuser',
+      email: 'mock@example.com',
+      avatarUrl: 'https://api.dicebear.com/7.x/avataaars/svg?seed=mockuser',
+      isOwner: true
+    }
+  },
+  
  kv: {
    get: async <T = any>(key: string): Promise<T | undefined> => {
      const storage = getStorage()
      return storage.get<T>(key)
    },
-    set: async (key: string, value: any): Promise<void> => {
+    set: async <T = any>(key: string, value: T): Promise<void> => {
      const storage = getStorage()
      return storage.set(key, value)
    },
@@ -44,25 +63,11 @@ export const sparkRuntime = {
    keys: async (): Promise<string[]> => {
      const storage = getStorage()
      return storage.keys()
-    },
-    clear: async (): Promise<void> => {
-      const storage = getStorage()
-      return storage.clear()
    }
-  },
-  
-  llm: llmFunction,
-  
-  user: {
-    getCurrentUser: () => ({
-      id: 'mock-user-id',
-      name: 'Mock User',
-      email: 'mock@example.com'
-    }),
-    isAuthenticated: () => true
  }
 }

 if (typeof window !== 'undefined') {
-  (window as any).spark = sparkRuntime
+  (window as any).spark = sparkRuntime;
+  (globalThis as any).spark = sparkRuntime
 }
--- a/src/lib/unified-storage.ts
+++ b/src/lib/unified-storage.ts
@@ -1,3 +1,5 @@
+/// <reference path="../global.d.ts" />
+
 export type StorageBackend = 'flask' | 'indexeddb' | 'sqlite' | 'sparkkv'

 export interface StorageAdapter {