docs-i18n 0.6.2 → 0.7.0

package/{src/admin/ui → admin/app}/components/JobDialog.tsx

@@ -55,6 +55,12 @@ export function JobDialog({
 
   const minCtx = CTX_STEPS[ctxSlider] * 1000;
 
+  const { data: llmConfig } = useQuery({
+    queryKey: ['llmConfig'],
+    queryFn: api.llmConfig,
+    staleTime: 60 * 1000,
+  });
+
   const { data: models, isLoading: modelsLoading } = useQuery({
     queryKey: ['models'],
     queryFn: api.models,
@@ -139,6 +145,19 @@ export function JobDialog({
 
         {error && <div className="dialog-error">{error}</div>}
 
+        {llmConfig && !llmConfig.hasApiKey && (
+          <div className="dialog-error">
+            ⚠ No API key found. Set <code>OPENROUTER_API_KEY</code> in <code>.env</code> or configure <code>llm.apiKey</code> in config.
+          </div>
+        )}
+
+        {llmConfig?.model && (
+          <div className="dialog-mode-hint">
+            Default model: <strong>{llmConfig.model}</strong>
+            {llmConfig.provider && <span> ({llmConfig.provider})</span>}
+          </div>
+        )}
+
         {files?.length && (
           <div className="dialog-mode-hint">
             Translating {files.length} selected file
@@ -312,10 +331,10 @@ export function JobDialog({
           <button
             type="button"
             className="btn"
-            disabled={create.isPending}
+            disabled={create.isPending || (llmConfig && !llmConfig.hasApiKey)}
             onClick={() => create.mutate()}
           >
-            {create.isPending ? 'Starting...' : 'Start Job →'}
+            {create.isPending ? 'Starting...' : llmConfig && !llmConfig.hasApiKey ? 'No API Key' : 'Start Job →'}
           </button>
         </div>
       </div>

package/{src/admin/ui → admin/app}/components/JobPanel.tsx

@@ -51,7 +51,7 @@ function JobItem({ job }: { job: Job }) {
         </button>
       </div>
       <div className="progress-bar">
-        <div className="progress-fill" style={{ width: `${pct}%` }} />
+        <div className="progress-fill" style={{ width: `${Math.min(100, pct)}%` }} />
       </div>
       <div className="job-meta">
         {progress} · {new Date(job.startedAt).toLocaleTimeString()}

package/{src/admin/ui → admin/app}/components/Preview.tsx

@@ -2,6 +2,7 @@ import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { api, type FileBlock } from '../lib/api';
 import { FLAGS } from '../lib/flags';
+import { openFile } from '../../server/functions/misc';
 
 interface ContextMenuState {
   x: number;
@@ -155,11 +156,7 @@ export function Preview({
           title="Click to open in editor"
           onClick={(e) => {
             e.preventDefault();
-            fetch('/api/open-file', {
-              method: 'POST',
-              headers: { 'Content-Type': 'application/json' },
-              body: JSON.stringify({ file: `content/${version}/${file}` }),
-            });
+            openFile({ data: { file: `content/${version}/${file}` } });
           }}
         >
           {file}

package/{src/admin/ui → admin/app}/lib/api.ts

@@ -1,11 +1,7 @@
-const BASE = '/api';
-
-async function request<T>(path: string, init?: RequestInit): Promise<T> {
-  const res = await fetch(`${BASE}${path}`, init);
-  const data = await res.json();
-  if (!res.ok) throw new Error(data.error || `HTTP ${res.status}`);
-  return data as T;
-}
+import { fetchStatus, fetchFileCoverage, fetchFileBlocks, deleteCacheEntry } from '../../server/functions/status';
+import { fetchJobs, createJob, deleteJob } from '../../server/functions/jobs';
+import { fetchModels } from '../../server/functions/models';
+import { fetchVersion, fetchLlmConfig } from '../../server/functions/misc';
 
 // ── Types ──
 
@@ -89,8 +85,6 @@ export interface Job {
   logLines?: string[];
 }
 
-// ── API ──
-
 export interface Model {
   id: string;
   name: string;
@@ -104,36 +98,27 @@ export interface Model {
   provider: string;
 }
 
-export const api = {
-  version: () => request<{ version: string }>('/version'),
+// ── API ──
 
-  status: () => request<StatusOverview>('/status'),
+export const api = {
+  version: () => fetchVersion() as Promise<{ version: string }>,
 
-  fileCoverage: (version: string, lang: string) =>
-    request<FileCoverage[]>(`/status/${version}/${lang}`),
+  llmConfig: () => fetchLlmConfig() as Promise<{ model: string | null; provider: string | null; hasApiKey: boolean }>,
 
-  fileContent: (version: string, lang: string, file: string) =>
-    request<FileContent>(`/status/content/${version}/${lang}/${file}`),
+  status: () => fetchStatus() as Promise<StatusOverview>,
 
-  fileDetail: (version: string, lang: string, file: string) =>
-    request<FileNode[]>(
-      `/status/${version}/${lang}/file?path=${encodeURIComponent(file)}`,
-    ),
+  fileCoverage: (version: string, lang: string) =>
+    fetchFileCoverage({ data: { version, lang } }) as Promise<FileCoverage[]>,
 
   fileBlocks: (version: string, lang: string, file: string) =>
-    request<FileBlocksResponse>(
-      `/status/${version}/${lang}/blocks?path=${encodeURIComponent(file)}`,
-    ),
+    fetchFileBlocks({ data: { version, lang, path: file } }) as Promise<FileBlocksResponse>,
 
   deleteCache: (version: string, lang: string, key: string) =>
-    request<{ deleted: string }>(
-      `/status/${version}/${lang}/cache?key=${encodeURIComponent(key)}`,
-      { method: 'DELETE' },
-    ),
+    deleteCacheEntry({ data: { version, lang, key } }) as Promise<{ deleted: string; lang: string }>,
 
-  models: () => request<Model[]>('/models'),
+  models: () => fetchModels() as Promise<Model[]>,
 
-  jobs: () => request<Job[]>('/jobs'),
+  jobs: () => fetchJobs() as Promise<Job[]>,
 
   createJob: (body: {
     lang: string;
@@ -144,13 +129,7 @@ export const api = {
     modelRotate?: string[];
     md5?: boolean;
     files?: string[];
-  }) =>
-    request<Job>('/jobs', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify(body),
-    }),
-
-  deleteJob: (id: string) =>
-    request<{ ok: boolean }>(`/jobs/${id}`, { method: 'DELETE' }),
+  }) => createJob({ data: body }) as Promise<Job>,
+
+  deleteJob: (id: string) => deleteJob({ data: { id } }) as Promise<{ ok: boolean }>,
 };

package/admin/app/routeTree.gen.ts

@@ -0,0 +1,68 @@
+/* eslint-disable */
+
+// @ts-nocheck
+
+// noinspection JSUnusedGlobalSymbols
+
+// This file was automatically generated by TanStack Router.
+// You should NOT make any changes in this file as it will be overwritten.
+// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
+
+import { Route as rootRouteImport } from './routes/__root'
+import { Route as IndexRouteImport } from './routes/index'
+
+const IndexRoute = IndexRouteImport.update({
+  id: '/',
+  path: '/',
+  getParentRoute: () => rootRouteImport,
+} as any)
+
+export interface FileRoutesByFullPath {
+  '/': typeof IndexRoute
+}
+export interface FileRoutesByTo {
+  '/': typeof IndexRoute
+}
+export interface FileRoutesById {
+  __root__: typeof rootRouteImport
+  '/': typeof IndexRoute
+}
+export interface FileRouteTypes {
+  fileRoutesByFullPath: FileRoutesByFullPath
+  fullPaths: '/'
+  fileRoutesByTo: FileRoutesByTo
+  to: '/'
+  id: '__root__' | '/'
+  fileRoutesById: FileRoutesById
+}
+export interface RootRouteChildren {
+  IndexRoute: typeof IndexRoute
+}
+
+declare module '@tanstack/react-router' {
+  interface FileRoutesByPath {
+    '/': {
+      id: '/'
+      path: '/'
+      fullPath: '/'
+      preLoaderRoute: typeof IndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+  }
+}
+
+const rootRouteChildren: RootRouteChildren = {
+  IndexRoute: IndexRoute,
+}
+export const routeTree = rootRouteImport
+  ._addFileChildren(rootRouteChildren)
+  ._addFileTypes<FileRouteTypes>()
+
+import type { getRouter } from './router.tsx'
+import type { createStart } from '@tanstack/react-start'
+declare module '@tanstack/react-start' {
+  interface Register {
+    ssr: true
+    router: Awaited<ReturnType<typeof getRouter>>
+  }
+}

package/admin/app/router.tsx

@@ -0,0 +1,23 @@
+import { createRouter as createTanStackRouter } from '@tanstack/react-router';
+import { QueryClient } from '@tanstack/react-query';
+import { routeTree } from './routeTree.gen';
+
+export function getRouter() {
+  const queryClient = new QueryClient({
+    defaultOptions: {
+      queries: { refetchOnWindowFocus: false, retry: 1 },
+    },
+  });
+
+  return createTanStackRouter({
+    routeTree,
+    context: { queryClient },
+    scrollRestoration: true,
+  });
+}
+
+declare module '@tanstack/react-router' {
+  interface Register {
+    router: ReturnType<typeof getRouter>;
+  }
+}

package/admin/app/routes/__root.tsx

@@ -0,0 +1,55 @@
+/// <reference types="vite/client" />
+import {
+  HeadContent,
+  Outlet,
+  Scripts,
+  createRootRouteWithContext,
+} from '@tanstack/react-router';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import * as React from 'react';
+import appCss from '../styles.css?url';
+
+export const Route = createRootRouteWithContext<{
+  queryClient: QueryClient;
+}>()({
+  head: () => ({
+    meta: [
+      { charSet: 'utf-8' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+    ],
+    links: [{ rel: 'stylesheet', href: appCss }],
+  }),
+  component: RootComponent,
+  notFoundComponent: () => <div style={{ padding: 20 }}>Page not found</div>,
+});
+
+function RootComponent() {
+  const { queryClient } = Route.useRouteContext();
+
+  return (
+    <RootDocument>
+      <QueryClientProvider client={queryClient}>
+        <Outlet />
+      </QueryClientProvider>
+    </RootDocument>
+  );
+}
+
+function RootDocument({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en" data-theme="dark" suppressHydrationWarning>
+      <head>
+        <HeadContent />
+      </head>
+      <body>
+        <script
+          dangerouslySetInnerHTML={{
+            __html: `document.documentElement.dataset.theme=localStorage.getItem('theme')||'dark'`,
+          }}
+        />
+        {children}
+        <Scripts />
+      </body>
+    </html>
+  );
+}