@neurocode-ai/app 1.18.8

package/src/pages/error.tsx

@@ -0,0 +1,372 @@
+import { TextField } from "@neurocode-ai/ui/text-field"
+import * as Sentry from "@sentry/solid"
+import { Logo } from "@neurocode-ai/ui/logo"
+import { Button } from "@neurocode-ai/ui/button"
+import { Component, createSignal, onMount, Show } from "solid-js"
+import { createStore } from "solid-js/store"
+import { usePlatform } from "@/context/platform"
+import { useLanguage } from "@/context/language"
+import { Icon } from "@neurocode-ai/ui/icon"
+import { errorDescriptionKey } from "./error-description"
+
+export type InitError = {
+  name: string
+  data: Record<string, unknown>
+}
+
+type Translator = ReturnType<typeof useLanguage>["t"]
+const CHAIN_SEPARATOR = "\n" + "─".repeat(40) + "\n"
+
+function isIssue(value: unknown): value is { message: string; path: string[] } {
+  if (!value || typeof value !== "object") return false
+  if (!("message" in value) || !("path" in value)) return false
+  const message = (value as { message: unknown }).message
+  const path = (value as { path: unknown }).path
+  if (typeof message !== "string") return false
+  if (!Array.isArray(path)) return false
+  return path.every((part) => typeof part === "string")
+}
+
+function isInitError(error: unknown): error is InitError {
+  return (
+    typeof error === "object" &&
+    error !== null &&
+    "name" in error &&
+    "data" in error &&
+    typeof (error as InitError).data === "object"
+  )
+}
+
+function safeJson(value: unknown, circular: string): string {
+  const seen = new WeakSet<object>()
+  const json = JSON.stringify(
+    value,
+    (_key, val) => {
+      if (typeof val === "bigint") return val.toString()
+      if (typeof val === "object" && val) {
+        if (seen.has(val)) return circular
+        seen.add(val)
+      }
+      return val
+    },
+    2,
+  )
+  return json ?? String(value)
+}
+
+function formatInitError(error: InitError, t: Translator): string {
+  const data = error.data
+  const json = (value: unknown) => safeJson(value, t("error.page.circular"))
+  switch (error.name) {
+    case "MCPFailed": {
+      const name = typeof data.name === "string" ? data.name : ""
+      return t("error.chain.mcpFailed", { name })
+    }
+    case "ProviderAuthError": {
+      const providerID = typeof data.providerID === "string" ? data.providerID : t("common.unknown")
+      const message = typeof data.message === "string" ? data.message : json(data.message)
+      return t("error.chain.providerAuthFailed", { provider: providerID, message })
+    }
+    case "APIError": {
+      const message = typeof data.message === "string" ? data.message : t("error.chain.apiError")
+      const lines: string[] = [message]
+
+      if (typeof data.statusCode === "number") {
+        lines.push(t("error.chain.status", { status: data.statusCode }))
+      }
+
+      if (typeof data.isRetryable === "boolean") {
+        lines.push(t("error.chain.retryable", { retryable: data.isRetryable }))
+      }
+
+      if (typeof data.responseBody === "string" && data.responseBody) {
+        lines.push(t("error.chain.responseBody", { body: data.responseBody }))
+      }
+
+      return lines.join("\n")
+    }
+    case "ProviderModelNotFoundError": {
+      const { providerID, modelID, suggestions } = data as {
+        providerID: string
+        modelID: string
+        suggestions?: string[]
+      }
+
+      const suggestionsLine =
+        Array.isArray(suggestions) && suggestions.length
+          ? [t("error.chain.didYouMean", { suggestions: suggestions.join(", ") })]
+          : []
+
+      return [
+        t("error.chain.modelNotFound", { provider: providerID, model: modelID }),
+        ...suggestionsLine,
+        t("error.chain.checkConfig"),
+      ].join("\n")
+    }
+    case "ProviderInitError": {
+      const providerID = typeof data.providerID === "string" ? data.providerID : t("common.unknown")
+      return t("error.chain.providerInitFailed", { provider: providerID })
+    }
+    case "ConfigJsonError": {
+      const path = typeof data.path === "string" ? data.path : json(data.path)
+      const message = typeof data.message === "string" ? data.message : ""
+      if (message) return t("error.chain.configJsonInvalidWithMessage", { path, message })
+      return t("error.chain.configJsonInvalid", { path })
+    }
+    case "ConfigDirectoryTypoError": {
+      const path = typeof data.path === "string" ? data.path : json(data.path)
+      const dir = typeof data.dir === "string" ? data.dir : json(data.dir)
+      const suggestion = typeof data.suggestion === "string" ? data.suggestion : json(data.suggestion)
+      return t("error.chain.configDirectoryTypo", { dir, path, suggestion })
+    }
+    case "ConfigFrontmatterError": {
+      const path = typeof data.path === "string" ? data.path : json(data.path)
+      const message = typeof data.message === "string" ? data.message : json(data.message)
+      return t("error.chain.configFrontmatterError", { path, message })
+    }
+    case "ConfigInvalidError": {
+      const issues = Array.isArray(data.issues)
+        ? data.issues.filter(isIssue).map((issue) => "↳ " + issue.message + " " + issue.path.join("."))
+        : []
+      const message = typeof data.message === "string" ? data.message : ""
+      const path = typeof data.path === "string" ? data.path : json(data.path)
+
+      const line = message
+        ? t("error.chain.configInvalidWithMessage", { path, message })
+        : t("error.chain.configInvalid", { path })
+
+      return [line, ...issues].join("\n")
+    }
+    case "UnknownError":
+      return typeof data.message === "string" ? data.message : json(data)
+    default:
+      if (typeof data.message === "string") return data.message
+      return json(data)
+  }
+}
+
+function formatErrorChain(error: unknown, t: Translator, depth = 0, parentMessage?: string): string {
+  const json = (value: unknown) => safeJson(value, t("error.page.circular"))
+  if (!error) return t("error.chain.unknown")
+
+  if (isInitError(error)) {
+    const message = formatInitError(error, t)
+    if (depth > 0 && parentMessage === message) return ""
+    const indent = depth > 0 ? `\n${CHAIN_SEPARATOR}${t("error.chain.causedBy")}\n` : ""
+    return indent + `${error.name}\n${message}`
+  }
+
+  if (error instanceof Error) {
+    const isDuplicate = depth > 0 && parentMessage === error.message
+    const parts: string[] = []
+    const indent = depth > 0 ? `\n${CHAIN_SEPARATOR}${t("error.chain.causedBy")}\n` : ""
+
+    const header = `${error.name}${error.message ? `: ${error.message}` : ""}`
+    const stack = error.stack?.trim()
+
+    if (stack) {
+      const startsWithHeader = stack.startsWith(header)
+
+      if (isDuplicate && startsWithHeader) {
+        const trace = stack.split("\n").slice(1).join("\n").trim()
+        if (trace) {
+          parts.push(indent + trace)
+        }
+      }
+
+      if (isDuplicate && !startsWithHeader) {
+        parts.push(indent + stack)
+      }
+
+      if (!isDuplicate && startsWithHeader) {
+        parts.push(indent + stack)
+      }
+
+      if (!isDuplicate && !startsWithHeader) {
+        parts.push(indent + `${header}\n${stack}`)
+      }
+    }
+
+    if (!stack && !isDuplicate) {
+      parts.push(indent + header)
+    }
+
+    if (error.cause) {
+      const causeResult = formatErrorChain(error.cause, t, depth + 1, error.message)
+      if (causeResult) {
+        parts.push(causeResult)
+      }
+    }
+
+    return parts.join("\n\n")
+  }
+
+  if (typeof error === "string") {
+    if (depth > 0 && parentMessage === error) return ""
+    const indent = depth > 0 ? `\n${CHAIN_SEPARATOR}${t("error.chain.causedBy")}\n` : ""
+    return indent + error
+  }
+
+  const indent = depth > 0 ? `\n${CHAIN_SEPARATOR}${t("error.chain.causedBy")}\n` : ""
+  return indent + json(error)
+}
+
+function formatError(error: unknown, t: Translator): string {
+  return formatErrorChain(error, t, 0)
+}
+
+interface ErrorPageProps {
+  error: unknown
+}
+
+export const ErrorPage: Component<ErrorPageProps> = (props) => {
+  const platform = usePlatform()
+  const language = useLanguage()
+  const formattedError = () => formatError(props.error, language.t)
+  let recordedFatalError: Promise<void> | undefined
+  const [store, setStore] = createStore({
+    actionError: undefined as string | undefined,
+  })
+
+  function ensureFatalErrorRecorded() {
+    recordedFatalError ??=
+      platform.recordFatalRendererError?.({
+        error: formattedError(),
+        url: location.href,
+        version: platform.version,
+        platform: platform.platform,
+        os: platform.os,
+      }) ?? Promise.resolve()
+    return recordedFatalError
+  }
+
+  onMount(() => {
+    void ensureFatalErrorRecorded().catch(() => undefined)
+  })
+
+  async function checkForUpdates() {
+    const state = await platform.updater?.check()
+    setStore("actionError", state?.status === "error" ? state.message : undefined)
+  }
+
+  async function installUpdate() {
+    await platform.updater
+      ?.install()
+      .then(() => setStore("actionError", undefined))
+      .catch((err) => {
+        setStore("actionError", formatError(err, language.t))
+      })
+  }
+
+  const updateVersion = () => {
+    const state = platform.updater?.state()
+    if (state?.status !== "ready") return
+    return state.version
+  }
+
+  async function exportDebugLogs() {
+    const exportLogs = platform.exportDebugLogs
+    if (!exportLogs) return
+    await ensureFatalErrorRecorded()
+      .then(() => exportLogs())
+      .then(() => setStore("actionError", undefined))
+      .catch((err) => {
+        setStore("actionError", formatError(err, language.t))
+      })
+  }
+
+  return (
+    <div
+      class="relative flex-1 h-screen w-screen min-h-0 flex flex-col items-center justify-center font-sans"
+      data-tauri-drag-region
+    >
+      <div class="w-2/3 max-w-3xl flex flex-col items-center justify-center gap-8">
+        <Logo class="w-58.5 opacity-12 shrink-0" />
+        <div class="flex flex-col items-center gap-2 text-center">
+          <h1 class="text-lg font-medium text-text-strong">{language.t("error.page.title")}</h1>
+          <p class="text-sm text-text-weak">{language.t(errorDescriptionKey(props.error))}</p>
+        </div>
+        <TextField
+          value={formattedError()}
+          readOnly
+          copyable
+          multiline
+          class="max-h-96 w-full font-mono text-xs no-scrollbar"
+          label={language.t("error.page.details.label")}
+          hideLabel
+        />
+        <div class="flex flex-row items-center justify-center gap-3 flex-wrap max-w-64">
+          <Button size="large" onClick={platform.restart}>
+            {language.t("error.page.action.restart")}
+          </Button>
+          <Show when={platform.platform === "desktop" && platform.exportDebugLogs}>
+            <Button size="large" variant="ghost" onClick={exportDebugLogs}>
+              {language.t("error.page.action.exportLogs")}
+            </Button>
+          </Show>
+          <Show when={Sentry.isEnabled}>
+            {(_) => {
+              const [reported, setReported] = createSignal(false)
+              return (
+                <Button
+                  size="large"
+                  disabled={reported()}
+                  onClick={() => {
+                    Sentry.captureException(props.error)
+                    setReported(true)
+                  }}
+                >
+                  {language.t(reported() ? "error.page.action.reported" : "error.page.action.report")}
+                </Button>
+              )
+            }}
+          </Show>
+          <Show when={platform.updater}>
+            <Show
+              when={updateVersion()}
+              fallback={
+                <Button
+                  size="large"
+                  variant="ghost"
+                  onClick={checkForUpdates}
+                  disabled={["checking", "downloading", "installing"].includes(platform.updater?.state().status ?? "")}
+                >
+                  {platform.updater?.state().status === "checking"
+                    ? language.t("error.page.action.checking")
+                    : language.t("error.page.action.checkUpdates")}
+                </Button>
+              }
+            >
+              {(version) => (
+                <Button size="large" onClick={installUpdate}>
+                  {language.t("error.page.action.updateTo", { version: version() })}
+                </Button>
+              )}
+            </Show>
+          </Show>
+        </div>
+        <Show when={store.actionError}>
+          {(message) => <p class="text-xs text-text-danger-base text-center max-w-2xl">{message()}</p>}
+        </Show>
+        <div class="flex flex-col items-center gap-2">
+          <div class="flex items-center justify-center gap-1">
+            {language.t("error.page.report.prefix")}
+            <button
+              type="button"
+              class="flex items-center text-text-interactive-base gap-1"
+              onClick={() => platform.openLink("https://neurocode.ai/desktop-feedback")}
+            >
+              <div>{language.t("error.page.report.discord")}</div>
+              <Icon name="discord" class="text-text-interactive-base" />
+            </button>
+          </div>
+          <Show when={platform.version}>
+            {(version) => (
+              <p class="text-xs text-text-weak">{language.t("error.page.version", { version: version() })}</p>
+            )}
+          </Show>
+        </div>
+      </div>
+    </div>
+  )
+}

package/src/pages/home/home-controller.ts

@@ -0,0 +1,108 @@
+import { useGlobal } from "@/context/global"
+import { type HomeProjectSelection, useLayout } from "@/context/layout"
+import { ServerConnection, useServer } from "@/context/server"
+import { useServerSync } from "@/context/server-sync"
+import { useTabs } from "@/context/tabs"
+import { toggleHomeProjectSelection } from "@/pages/layout/helpers"
+import { createEffect, createMemo } from "solid-js"
+
+export function createHomeController() {
+  const sync = useServerSync()
+  const layout = useLayout()
+  const server = useServer()
+  const global = useGlobal()
+  const tabs = useTabs()
+  const selection = layout.home.selection
+  const focusedServer = createMemo(
+    () => global.servers.list().find((conn) => ServerConnection.key(conn) === selection().server) ?? server.current,
+  )
+  const focusedServerCtx = createMemo(() => {
+    const conn = focusedServer()
+    if (!conn) return undefined
+    return global.ensureServerCtx(conn)
+  })
+  const focusedSync = () => focusedServerCtx()?.sync ?? sync()
+  const projects = createMemo(() => focusedServerCtx()?.projects.list() ?? layout.projects.list())
+  const recentlyClosed = createMemo(
+    () => focusedServerCtx()?.projects.recentlyClosed() ?? layout.projects.recentlyClosed(),
+  )
+  const homedir = createMemo(() => focusedSync().data.path.home ?? "")
+  const selectedProject = createMemo(() => projects().find((project) => project.worktree === selection().directory))
+  const newSessionProject = createMemo(
+    () =>
+      selectedProject() ??
+      projects().find((project) => project.worktree === focusedServerCtx()?.projects.last()) ??
+      projects()[0],
+  )
+
+  createEffect(() => {
+    const list = global.servers.list()
+    if (list.some((conn) => ServerConnection.key(conn) === selection().server)) return
+    const conn = list.find((conn) => ServerConnection.key(conn) === server.key) ?? list[0]
+    if (conn) setSelection({ server: ServerConnection.key(conn) })
+  })
+
+  function setSelection(next: HomeProjectSelection) {
+    layout.home.setSelection(next)
+  }
+
+  function openProjectNewSession(conn: ServerConnection.Any, directory: string) {
+    const ctx = global.ensureServerCtx(conn)
+    ctx.projects.open(directory)
+    ctx.projects.touch(directory)
+    void tabs.newDraft({ server: ServerConnection.key(conn), directory })
+  }
+
+  return {
+    selection: {
+      value: selection,
+      set: setSelection,
+      focusServer: (conn: ServerConnection.Any) => setSelection({ server: ServerConnection.key(conn) }),
+    },
+    server: {
+      list: global.servers.list,
+      health: (conn: ServerConnection.Any) => global.servers.health[ServerConnection.key(conn)],
+      context: (conn: ServerConnection.Any) => global.ensureServerCtx(conn),
+      focused: focusedServer,
+      focusedContext: focusedServerCtx,
+      focusedSync,
+    },
+    project: {
+      list: projects,
+      recentlyClosed,
+      homedir,
+      selected: selectedProject,
+      newSession: newSessionProject,
+      forServer: (conn: ServerConnection.Any) => global.ensureServerCtx(conn).projects.list(),
+      select: (conn: ServerConnection.Any, directory: string) => {
+        const key = ServerConnection.key(conn)
+        if (global.servers.health[key]?.healthy === false) return
+        if (
+          !global
+            .ensureServerCtx(conn)
+            .projects.list()
+            .some((project) => project.worktree === directory)
+        )
+          return
+        setSelection(toggleHomeProjectSelection(selection(), key, directory))
+      },
+      add: (conn: ServerConnection.Any, directories: string[]) => {
+        const directory = directories[0]
+        if (!directory) return
+        const ctx = global.ensureServerCtx(conn)
+        directories.forEach((item) => ctx.projects.open(item))
+        ctx.projects.touch(directory)
+        setSelection({ server: ServerConnection.key(conn), directory })
+      },
+      openNewSession: () => {
+        const conn = focusedServer()
+        const project = newSessionProject()
+        if (!conn || !project) return
+        openProjectNewSession(conn, project.worktree)
+      },
+      openProjectNewSession,
+    },
+  }
+}
+
+export type HomeController = ReturnType<typeof createHomeController>

package/src/pages/home/home-projects-controller.tsx

@@ -0,0 +1,128 @@
+import { useDirectoryPicker } from "@/components/directory-picker"
+import { useServerManagementController } from "@/components/dialog-select-server"
+import { useSettingsCommand } from "@/components/settings-dialog"
+import { DialogServerV2 } from "@/components/settings-v2/dialog-server-v2"
+import { type LocalProject } from "@/context/layout"
+import { useLanguage } from "@/context/language"
+import { useNotification } from "@/context/notification"
+import { usePlatform } from "@/context/platform"
+import { ServerConnection } from "@/context/server"
+import { closeHomeProject, errorMessage, homeProjectDirectories } from "@/pages/layout/helpers"
+import { Persist, persisted } from "@/utils/persist"
+import { showToast } from "@/utils/toast"
+import { useDialog } from "@neurocode-ai/ui/context/dialog"
+import { createResource } from "solid-js"
+import { createStore } from "solid-js/store"
+import type { HomeController } from "./home-controller"
+
+export function createHomeProjectsController(home: HomeController) {
+  const platform = usePlatform()
+  const pickDirectory = useDirectoryPicker()
+  const dialog = useDialog()
+  const language = useLanguage()
+  const notification = useNotification()
+  const openSettings = useSettingsCommand()
+  const serverManagement = useServerManagementController({ navigateOnAdd: false })
+  const [_state, setState, _, ready] = persisted(
+    Persist.global("home.servers", ["home.servers.v1"]),
+    createStore({ collapsed: {} as Record<string, boolean> }),
+  )
+  const [state] = createResource(
+    () => ready.promise ?? Promise.resolve(),
+    (promise) => promise.then(() => _state),
+    { initialValue: _state },
+  )
+  function directories(project: LocalProject) {
+    return [project.worktree, ...(project.sandboxes ?? [])]
+  }
+
+  function canRevealProject(conn: ServerConnection.Any) {
+    return platform.platform === "desktop" && !!platform.openPath && ServerConnection.local(conn)
+  }
+
+  return {
+    copy: {
+      language,
+    },
+    selection: {
+      value: home.selection.value,
+    },
+    server: {
+      list: home.server.list,
+      health: home.server.health,
+      projects: home.project.forServer,
+      collapsed: (conn: ServerConnection.Any) => state().collapsed[ServerConnection.key(conn)] ?? false,
+      toggleCollapsed: (conn: ServerConnection.Any) => {
+        const key = ServerConnection.key(conn)
+        setState("collapsed", key, !state().collapsed[key])
+      },
+      canDefault: serverManagement.canDefault,
+      defaultKey: serverManagement.defaultKey,
+      setDefault: (conn: ServerConnection.Any | undefined) =>
+        serverManagement.setDefault(conn ? ServerConnection.key(conn) : null),
+      remove: (conn: ServerConnection.Any) => serverManagement.handleRemove(ServerConnection.key(conn)),
+      edit: (conn: ServerConnection.Http) => dialog.show(() => <DialogServerV2 mode="edit" server={conn} />),
+      focus: home.selection.focusServer,
+    },
+    project: {
+      list: home.project.list,
+      recentlyClosed: home.project.recentlyClosed,
+      homedir: home.project.homedir,
+      select: home.project.select,
+      add: home.project.add,
+      openNewSession: home.project.openProjectNewSession,
+      edit: (conn: ServerConnection.Any, project: LocalProject) => {
+        void import("@/components/dialog-edit-project-v2").then(({ DialogEditProjectV2 }) => {
+          void dialog.show(() => <DialogEditProjectV2 server={conn} project={project} />)
+        })
+      },
+      unseenCount: (conn: ServerConnection.Any, project: LocalProject) => {
+        const state = notification.ensureServerState(ServerConnection.key(conn))
+        return directories(project).reduce((total, directory) => total + state.project.unseenCount(directory), 0)
+      },
+      clearNotifications: (conn: ServerConnection.Any, project: LocalProject) => {
+        const state = notification.ensureServerState(ServerConnection.key(conn))
+        directories(project)
+          .filter((directory) => state.project.unseenCount(directory) > 0)
+          .forEach((directory) => state.project.markViewed(directory))
+      },
+      choose: (conn: ServerConnection.Any) => {
+        if (home.server.health(conn)?.healthy === false) return
+        pickDirectory({
+          server: conn,
+          title: language.t("command.project.open"),
+          multiple: true,
+          onSelect: (result) => home.project.add(conn, homeProjectDirectories(result)),
+        })
+      },
+      close: (conn: ServerConnection.Any, directory: string) => {
+        const next = closeHomeProject(
+          home.selection.value(),
+          ServerConnection.key(conn),
+          home.server.context(conn).projects,
+          directory,
+        )
+        if (next) home.selection.set(next)
+      },
+      move: (conn: ServerConnection.Any, worktree: string, index: number) => {
+        home.server.context(conn).projects.move(worktree, index)
+      },
+      canReveal: canRevealProject,
+      reveal: (conn: ServerConnection.Any, project: LocalProject) => {
+        if (!platform.openPath || !canRevealProject(conn)) return
+        platform.openPath(project.worktree).catch((cause: unknown) =>
+          showToast({
+            title: language.t("common.requestFailed"),
+            description: errorMessage(cause, language.t("common.requestFailed")),
+          }),
+        )
+      },
+    },
+    utility: {
+      settings: openSettings,
+      help: () => platform.openLink("https://neurocode.ai/desktop-feedback"),
+    },
+  }
+}
+
+export type HomeProjectsController = ReturnType<typeof createHomeProjectsController>