@tscircuit/fake-snippets 0.0.66 → 0.0.67

package/src/hooks/use-run-tsx/construct-circuit.tsx

@@ -1,62 +0,0 @@
-import { Circuit } from "@tscircuit/core"
-import { useEffect, useMemo, useState } from "react"
-import * as React from "react"
-import { useCompiledTsx } from "../use-compiled-tsx"
-import { createJSCADRenderer } from "jscad-fiber"
-import { jscadPlanner } from "jscad-planner"
-
-export const constructCircuit = ({
-  UserElm,
-  type,
-  circuitDisplayName,
-}: {
-  UserElm: any
-  type: "board" | "footprint" | "package" | "model"
-  circuitDisplayName?: string
-}) => {
-  const circuit = new Circuit()
-
-  if (circuitDisplayName) {
-    circuit.name = circuitDisplayName
-  }
-
-  if (type === "board") {
-    circuit.add(<UserElm />)
-    // HACK: switch to selectOne when root fixes bug with selecting board
-    const board = circuit.root?.children[0]
-    // const board = circuit.selectOne("board")
-    if (board) {
-      board.setProps({
-        ...board.props,
-      })
-    }
-  } else if (type === "package") {
-    circuit.add(
-      <board width="50mm" height="50mm">
-        <UserElm name="U1" />
-      </board>,
-    )
-  } else if (type === "footprint") {
-    circuit.add(
-      <board width="10mm" height="10mm">
-        <chip name="U1" footprint={<UserElm />} />
-      </board>,
-    )
-  } else if (type === "model") {
-    const jscadGeoms: any[] = []
-    const { createJSCADRoot } = createJSCADRenderer(jscadPlanner as any)
-    const jscadRoot = createJSCADRoot(jscadGeoms)
-    jscadRoot.render(<UserElm />)
-    circuit.add(
-      <board width="10mm" height="10mm">
-        <chip
-          name="U1"
-          cadModel={{
-            jscad: jscadGeoms[0],
-          }}
-        />
-      </board>,
-    )
-  }
-  return circuit
-}

package/src/hooks/use-run-tsx/index.tsx

@@ -1,256 +0,0 @@
-import * as tscircuitCore from "@tscircuit/core"
-import { getImportsFromCode } from "@tscircuit/prompt-benchmarks/code-runner-utils"
-import type { AnyCircuitElement } from "circuit-json"
-import * as jscadFiber from "jscad-fiber"
-import * as React from "react"
-import * as tscircuitMathUtils from "@tscircuit/math-utils"
-import { useEffect, useMemo, useReducer, useRef, useState } from "react"
-import { safeCompileTsx } from "../use-compiled-tsx"
-import { useSnippetsBaseApiUrl } from "../use-snippets-base-api-url"
-import { constructCircuit } from "./construct-circuit"
-import { evalCompiledJs } from "./eval-compiled-js"
-import { getSyntaxError } from "@/lib/utils/getSyntaxError"
-
-type RunTsxResult = {
-  compiledModule: any
-  message: string
-  circuitJson: AnyCircuitElement[] | null
-  compiledJs?: string
-  isRunningCode: boolean
-}
-
-/**
- * @deprecated will be removed in future version, use @tscircuit/eval or
- * @tscircuit/runframe
- */
-export const useRunTsx = ({
-  code,
-  userImports,
-  type,
-  isStreaming = false,
-  circuitDisplayName,
-}: {
-  code?: string
-  userImports?: Record<string, object>
-  type?: "board" | "footprint" | "package" | "model"
-  isStreaming?: boolean
-  circuitDisplayName?: string
-} = {}): RunTsxResult & {
-  circuitJsonKey: string
-  triggerRunTsx: () => void
-  tsxRunTriggerCount: number
-} => {
-  type ??= "board"
-  const [tsxRunTriggerCount, incTsxRunTriggerCount] = useReducer(
-    (c) => c + 1,
-    0,
-  )
-  const [tsxResult, setTsxResult] = useState<RunTsxResult>({
-    compiledModule: null,
-    message: "",
-    circuitJson: null,
-    isRunningCode: false,
-  })
-  const apiBaseUrl = useSnippetsBaseApiUrl()
-  const preSuppliedImportsRef = useRef<Record<string, any>>({})
-
-  useEffect(() => {
-    if (tsxRunTriggerCount === 0) return
-    if (isStreaming) {
-      setTsxResult({
-        compiledModule: null,
-        message: "",
-        circuitJson: null,
-        isRunningCode: false,
-      })
-    }
-    if (!code) return
-    const syntaxError = getSyntaxError(code)
-    if (syntaxError) {
-      setTsxResult({
-        compiledModule: null,
-        message: syntaxError,
-        circuitJson: null,
-        isRunningCode: false,
-      })
-      return
-    }
-    async function run() {
-      setTsxResult({
-        compiledModule: null,
-        message: "",
-        circuitJson: null,
-        isRunningCode: true,
-      })
-
-      const userCodeTsciImports = getImportsFromCode(code!).filter((imp) =>
-        imp.startsWith("@tsci/"),
-      )
-
-      const preSuppliedImports: Record<string, any> =
-        preSuppliedImportsRef.current
-
-      for (const [importName, importValue] of Object.entries(
-        userImports ?? {},
-      )) {
-        preSuppliedImports[importName] = importValue
-      }
-
-      const __tscircuit_require = (name: string) => {
-        if (
-          name === "./manual-edits.json" &&
-          preSuppliedImports["./manual-edits.json"] === ""
-        ) {
-          return preSuppliedImports["./manual-edits.json"]
-        }
-        if (!preSuppliedImports[name]) {
-          throw new Error(
-            `Import "${name}" not found (imports available: ${Object.keys(preSuppliedImports).join(",")})`,
-          )
-        }
-        return preSuppliedImports[name]
-      }
-      ;(globalThis as any).__tscircuit_require = __tscircuit_require
-      preSuppliedImports["@tscircuit/core"] = tscircuitCore
-      preSuppliedImports["tscircuit"] = tscircuitCore
-      preSuppliedImports["@tscircuit/math-utils"] = tscircuitMathUtils
-      preSuppliedImports["react"] = React
-      preSuppliedImports["jscad-fiber"] = jscadFiber
-      globalThis.React = React
-
-      async function addImport(importName: string, depth = 0) {
-        if (!importName.startsWith("@tsci/")) return
-        if (preSuppliedImports[importName]) return
-        if (depth > 5) {
-          console.log("Max depth for imports reached")
-          return
-        }
-
-        const fullSnippetName = importName
-          .replace("@tsci/", "")
-          .replace(".", "/")
-        const { snippet: importedSnippet, error } = await fetch(
-          `${apiBaseUrl}/snippets/get?name=${fullSnippetName}`,
-        )
-          .then((res) => res.json())
-          .catch((e) => ({ error: e }))
-
-        if (error) {
-          console.error("Error fetching import", importName, error)
-          return
-        }
-
-        const { compiled_js, code } = importedSnippet
-
-        const importNames = getImportsFromCode(code!)
-
-        for (const importName of importNames) {
-          if (!preSuppliedImports[importName]) {
-            await addImport(importName, depth + 1)
-          }
-        }
-
-        try {
-          preSuppliedImports[importName] = evalCompiledJs(compiled_js).exports
-        } catch (e) {
-          console.error("Error importing snippet", e)
-        }
-      }
-
-      for (const userCodeTsciImport of userCodeTsciImports) {
-        await addImport(userCodeTsciImport)
-      }
-
-      const { success, compiledTsx: compiledJs, error } = safeCompileTsx(code!)
-
-      if (!success) {
-        setTsxResult({
-          compiledModule: null,
-          message: `Compile Error: ${error.message}`,
-          circuitJson: null,
-          isRunningCode: false,
-        })
-      }
-
-      try {
-        const module = evalCompiledJs(compiledJs!)
-
-        const componentExportKeys = Object.keys(module.exports).filter(
-          (key) => !key.startsWith("use"),
-        )
-
-        if (componentExportKeys.length > 1) {
-          throw new Error(
-            `Too many exports, only export one component. You exported: ${JSON.stringify(Object.keys(module.exports))}`,
-          )
-        }
-
-        const primaryKey = componentExportKeys[0]
-
-        const UserElm = (props: any) =>
-          React.createElement(module.exports[primaryKey], props)
-
-        try {
-          const circuit = constructCircuit({
-            UserElm,
-            type: type as any,
-            circuitDisplayName,
-          })
-          const renderPromise = circuit.renderUntilSettled()
-
-          // wait one tick to allow a single render pass
-          await new Promise((resolve) => setTimeout(resolve, 1))
-
-          let circuitJson = circuit.getCircuitJson()
-          setTsxResult({
-            compiledModule: module,
-            compiledJs,
-            message: "",
-            circuitJson: circuitJson as AnyCircuitElement[],
-            isRunningCode: true,
-          })
-
-          await renderPromise
-
-          circuitJson = circuit.getCircuitJson()
-          setTsxResult({
-            compiledModule: module,
-            compiledJs,
-            message: "",
-            circuitJson: circuitJson as AnyCircuitElement[],
-            isRunningCode: false,
-          })
-        } catch (error: any) {
-          console.error("Evaluation error:", error)
-          setTsxResult({
-            compiledModule: module,
-            message: `Render Error: ${error.message}`,
-            circuitJson: null,
-            isRunningCode: false,
-          })
-        }
-      } catch (error: any) {
-        console.error("Evaluation error:", error)
-        setTsxResult({
-          compiledModule: null,
-          message: `Eval Error: ${error.message}\n\n${error.stack}`,
-          circuitJson: null,
-          isRunningCode: false,
-        })
-      }
-    }
-    run()
-  }, [tsxRunTriggerCount])
-
-  const circuitJsonKey: string = useMemo(() => {
-    if (!tsxResult.circuitJson) return ""
-    return `cj-${Math.random().toString(36).substring(2, 15)}`
-  }, [tsxResult.circuitJson, tsxResult.circuitJson?.length])
-
-  return {
-    ...tsxResult,
-    circuitJsonKey: circuitJsonKey,
-    triggerRunTsx: incTsxRunTriggerCount,
-    tsxRunTriggerCount,
-  }
-}

package/src/hooks/use-save-snippet.ts

@@ -1,66 +0,0 @@
-import { Snippet } from "fake-snippets-api/lib/db/schema"
-import { useMutation } from "react-query"
-import { useAxios } from "./use-axios"
-import { safeCompileTsx } from "./use-compiled-tsx"
-import { useCurrentSnippetId } from "./use-current-snippet-id"
-
-export const useSaveSnippet = () => {
-  const axios = useAxios()
-
-  const { snippetId } = useCurrentSnippetId()
-
-  const saveSnippetMutation = useMutation<
-    Snippet,
-    Error,
-    { code: string; snippet_type: string; dts?: string; circuit_json?: any[] }
-  >({
-    mutationFn: async ({ code, snippet_type, dts, circuit_json }) => {
-      const compileResult = safeCompileTsx(code)
-
-      if (snippetId) {
-        const response = await axios.post("/snippets/update", {
-          snippet_id: snippetId,
-          code,
-          snippet_type,
-          compiled_js: compileResult.success
-            ? compileResult.compiledTsx
-            : undefined,
-          circuit_json: circuit_json,
-          dts,
-        })
-        return response.data.snippet
-      } else {
-        const response = await axios.post("/snippets/create", {
-          code,
-          snippet_type,
-          owner_name: "seveibar", // Replace with actual user name or fetch from user context
-          compiled_js: compileResult.success
-            ? compileResult.compiledTsx
-            : undefined,
-          dts,
-        })
-        return response.data.snippet
-      }
-    },
-  })
-
-  const saveSnippet = async (
-    code: string,
-    snippet_type: string,
-    dts?: string,
-    circuit_json?: any[],
-  ) => {
-    return saveSnippetMutation.mutateAsync({
-      code,
-      snippet_type,
-      dts,
-      circuit_json,
-    })
-  }
-
-  return {
-    saveSnippet,
-    isLoading: saveSnippetMutation.isLoading,
-    error: saveSnippetMutation.error,
-  }
-}

package/src/hooks/use-typecheck.ts

@@ -1,54 +0,0 @@
-// import * as ts from "typescript"
-
-// export function checkTypeScriptErrors(code: string): ts.Diagnostic[] {
-//   // Create a virtual TypeScript compiler
-//   const compilerOptions: ts.CompilerOptions = {
-//     noEmit: true,
-//     allowJs: true,
-//     checkJs: true,
-//     strict: true,
-//   }
-
-//   // Create a virtual file system
-//   const fileSystem = {
-//     "example.ts": code,
-//   }
-
-//   // Create a compiler host
-//   const compilerHost = ts.createCompilerHost(compilerOptions)
-//   compilerHost.getSourceFile = (fileName: string) => {
-//     return ts.createSourceFile(
-//       fileName,
-//       fileSystem[fileName] || "",
-//       ts.ScriptTarget.Latest,
-//     )
-//   }
-//   compilerHost.writeFile = () => {}
-//   compilerHost.getCurrentDirectory = () => "/"
-//   compilerHost.getDefaultLibFileName = () => "lib.d.ts"
-
-//   // Create a program
-//   const program = ts.createProgram(
-//     ["example.ts"],
-//     compilerOptions,
-//     compilerHost,
-//   )
-
-//   // Get the diagnostics (errors)
-//   const diagnostics = ts.getPreEmitDiagnostics(program)
-
-//   return diagnostics
-// }
-
-// // Example usage
-// const code = `
-// let x: number = "string"; // Type error
-// let y: string = 5; // Another type error
-// let z: number = 10; // No error
-// `
-
-// const errors = checkTypeScriptErrors(code)
-// console.log("Errors found:", errors.length)
-// errors.forEach((error) => {
-//   console.log(`Error on line ${error.start}: ${error.messageText}`)
-// })

package/src/lib/utils/getSyntaxError.ts

@@ -1,13 +0,0 @@
-import * as Babel from "@babel/standalone"
-
-export function getSyntaxError(code: string): string | null {
-  try {
-    Babel.transform(code, {
-      filename: "index.tsx",
-      presets: ["react", "typescript"],
-    })
-    return null
-  } catch (error: unknown) {
-    return (error as Error).message
-  }
-}

package/src/pages/ai.tsx

@@ -1,92 +0,0 @@
-import AIChatInterface from "@/components/AiChatInterface"
-import Header from "@/components/Header"
-import { PreviewContent } from "@/components/PreviewContent"
-import { useRunTsx } from "@/hooks/use-run-tsx"
-import { useSaveSnippet } from "@/hooks/use-save-snippet"
-import { useSnippet } from "@/hooks/use-snippet"
-import { useToast } from "@/hooks/use-toast"
-import { useEffect, useState } from "react"
-import { useLocation } from "wouter"
-
-export const AiPage = () => {
-  const [code, setCode] = useState("")
-  const [manualEditsFileContent, setManualEditsFileContent] = useState("")
-  const [dts, setDts] = useState("")
-  const [isStreaming, setIsStreaming] = useState(false)
-  const { saveSnippet, isLoading: isSaving } = useSaveSnippet()
-  const snippetIdFromUrl = new URLSearchParams(window.location.search).get(
-    "snippet_id",
-  )
-  const [snippetId, setSnippetId] = useState<string | null>(snippetIdFromUrl)
-  const { data: snippet } = useSnippet(snippetId)
-  const { toast } = useToast()
-  const [, navigate] = useLocation()
-  const {
-    message: errorMessage,
-    circuitJson,
-    triggerRunTsx,
-    isRunningCode,
-    tsxRunTriggerCount,
-    circuitJsonKey,
-  } = useRunTsx({
-    code,
-    type: "board",
-    isStreaming,
-    circuitDisplayName: snippet?.name,
-  })
-
-  useEffect(() => {
-    if (!code && snippet && snippetIdFromUrl) {
-      setCode(snippet.code)
-    }
-  }, [code, snippet])
-
-  const hasUnsavedChanges = snippet?.code !== code
-
-  return (
-    <div>
-      <Header />
-      <div className="flex bg-gray-100">
-        <div className="w-1/2">
-          <AIChatInterface
-            code={code}
-            hasUnsavedChanges={hasUnsavedChanges}
-            snippetId={snippet?.snippet_id}
-            onCodeChange={setCode}
-            errorMessage={errorMessage}
-            onStartStreaming={() => {
-              setIsStreaming(true)
-            }}
-            onStopStreaming={() => {
-              setIsStreaming(false)
-            }}
-          />
-        </div>
-        <div className="w-1/2">
-          <div className="p-4 h-full">
-            <PreviewContent
-              className="bg-white h-full p-4 rounded-lg shadow"
-              code={code}
-              isStreaming={isStreaming}
-              isRunningCode={isRunningCode}
-              onCodeChange={setCode}
-              onDtsChange={setDts}
-              showCodeTab
-              triggerRunTsx={triggerRunTsx}
-              errorMessage={errorMessage}
-              circuitJson={circuitJson}
-              circuitJsonKey={circuitJsonKey}
-              manualEditsFileContent={manualEditsFileContent}
-              onManualEditsFileContentChange={(
-                newManualEditsFileContent: string,
-              ) => {
-                setManualEditsFileContent(newManualEditsFileContent)
-              }}
-              tsxRunTriggerCount={tsxRunTriggerCount}
-            />
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}