Merge remote-tracking branch 'origin/master' into rm-tracking-cookie

Author: haraldschilly

src/.claude/settings.json

@@ -17,7 +17,17 @@
       "WebFetch(domain:cocalc.com)",
       "WebFetch(domain:doc.cocalc.com)",
       "WebFetch(domain:docs.anthropic.com)",
-      "WebFetch(domain:github.com)"
+      "WebFetch(domain:github.com)",
+      "Bash(git checkout:*)",
+      "Bash(git push:*)",
+      "Bash(NODE_OPTIONS=--max-old-space-size=8192 ../node_modules/.bin/tsc --noEmit)",
+      "Bash(docker run:*)",
+      "Bash(../node_modules/.bin/tsc:*)",
+      "Bash(npm view:*)",
+      "WebFetch(domain:www.anthropic.com)",
+      "WebFetch(domain:mistral.ai)",
+      "Bash(pnpm i18n:*)",
+      "WebFetch(domain:simplelocalize.io)"
     ],
     "deny": []
   }

src/CLAUDE.md

@@ -157,6 +157,40 @@ CoCalc is organized as a monorepo with key packages:
 - REFUSE to modify files when the git repository is on the `master` or `main` branch.
 - NEVER proactively create documentation files (`*.md`) or README files. Only create documentation files if explicitly requested by the User.
 
+## React-intl / Internationalization (i18n)
+
+CoCalc uses react-intl for internationalization with SimpleLocalize as the translation platform.
+
+### Translation ID Naming Convention
+
+Translation IDs follow a hierarchical pattern: `[directory].[subdir].[filename].[aspect].[label|title|tooltip|...]`
+
+Examples:
+- `labels.masked_files` - for common UI labels
+- `account.sign-out.button.title` - for account sign-out dialog
+- `command.generic.force_build.label` - for command labels
+
+### Translation Workflow
+
+**For new translation keys:**
+1. Add the translation to source code (e.g., `packages/frontend/i18n/common.ts`)
+2. Run `pnpm i18n:extract` - updates `extracted.json` from source code
+3. Run `pnpm i18n:upload` - sends new strings to SimpleLocalize
+4. New keys are automatically translated to all languages
+5. Run `pnpm i18n:download` - fetches translations
+6. Run `pnpm i18n:compile` - compiles translation files
+
+**For editing existing translation keys:**
+Same flow as above, but **before 3. i18n:upload**, delete the key. Only new keys are auto-translated. `pnpm i18n:delete [id]`.
+
+### Translation File Structure
+
+- `packages/frontend/i18n/README.md` - more information
+- `packages/frontend/i18n/common.ts` - shared translation definitions
+- `packages/frontend/i18n/extracted.json` - auto-generated, do not edit manually
+- `packages/frontend/i18n/[locale].json` - downloaded translations per language
+- `packages/frontend/i18n/[locale].compiled.json` - compiled for runtime use
+
 # Ignore
 
 - Ignore files covered by `.gitignore`

src/packages/conat/service/typed.ts

@@ -9,7 +9,7 @@ import type { Options, ServiceCall } from "./service";
 export type { ConatService };
 
 export interface Extra {
-  ping: typeof pingConatService;
+  ping: (opts?: { maxWait?: number }) => Promise<void>;
   waitFor: (opts?: { maxWait?: number }) => Promise<void>;
 }
 

src/packages/frontend/admin/llm/admin-llm-test.tsx

@@ -1,4 +1,13 @@
-import { Alert, Button, Input, Select, Space, Table } from "antd";
+import {
+  Alert,
+  Button,
+  Input,
+  Progress,
+  Select,
+  Space,
+  Table,
+  Tooltip,
+} from "antd";
 
 import {
   redux,
@@ -20,12 +29,13 @@ import { trunc_middle } from "@cocalc/util/misc";
 import { COLORS } from "@cocalc/util/theme";
 import { PROMPTS } from "./tests";
 import { Value } from "./value";
-
 interface TestResult {
   model: string;
   status: "pending" | "running" | "passed" | "failed";
   output: string;
   error?: string;
+  firstResponseTime?: number; // Time in milliseconds until first token
+  totalTime?: number; // Total time in milliseconds until completion
 }
 
 export function TestLLMAdmin() {
@@ -101,6 +111,10 @@ export function TestLLMAdmin() {
 
     return new Promise((resolve) => {
       try {
+        const startTime = Date.now();
+        let firstResponseTime: number | undefined;
+        let totalTime: number | undefined;
+
         const llmStream = webapp_client.openai_client.queryStream({
           input: prompt,
           project_id: null,
@@ -116,6 +130,10 @@ export function TestLLMAdmin() {
         llmStream.on("token", (token) => {
           console.log({ model, system, token });
           if (token != null) {
+            // Record first response time if this is the first token
+            if (firstResponseTime === undefined) {
+              firstResponseTime = Date.now() - startTime;
+            }
             reply += token;
             // Update the result in real-time
             setTestResults((prev) =>
@@ -125,22 +143,28 @@ export function TestLLMAdmin() {
             );
           } else {
             // Stream is complete (token is null)
+            totalTime = Date.now() - startTime;
             const passed = expectedRegex.test(reply);
             resolve({
               model,
               status: passed ? "passed" : "failed",
               output: reply,
+              firstResponseTime,
+              totalTime,
             });
           }
         });
 
         llmStream.on("error", (err) => {
+          totalTime = Date.now() - startTime;
           console.error(`Error in LLM stream for model ${model}:`, err);
           resolve({
             model,
             status: "failed",
             output: reply,
             error: err?.toString(),
+            firstResponseTime,
+            totalTime,
           });
         });
 
@@ -241,6 +265,57 @@ export function TestLLMAdmin() {
     }
   }
 
+  function formatTiming(timeMs: number | undefined): string {
+    if (timeMs === undefined) return "-";
+    return `${(timeMs / 1000).toFixed(1)}s`;
+  }
+
+  function renderTimingColumn(record: TestResult) {
+    const { firstResponseTime, totalTime, status } = record;
+
+    if (status === "pending" || status === "running") {
+      return <span style={{ color: COLORS.GRAY_M }}>-</span>;
+    }
+
+    if (firstResponseTime === undefined || totalTime === undefined) {
+      return <span style={{ color: COLORS.GRAY_M }}>-</span>;
+    }
+
+    // Calculate progress bar values (normalize to 10 seconds max)
+    const maxTime = Math.max(
+      10000,
+      ...testResults.filter((r) => r.totalTime).map((r) => r.totalTime!),
+    );
+    const totalPercent = Math.min(100, (totalTime / maxTime) * 100);
+
+    // Determine if this is one of the slowest (top 10% quantile)
+    const completedResults = testResults.filter(
+      (r) => r.totalTime !== undefined,
+    );
+    const sortedTimes = completedResults
+      .map((r) => r.totalTime!)
+      .sort((a, b) => b - a);
+    const slowThreshold =
+      sortedTimes[Math.floor(sortedTimes.length * 0.1)] || 0;
+    const isSlow = totalTime >= slowThreshold && completedResults.length > 1;
+
+    return (
+      <div>
+        <Tooltip title="First response time / Total completion time">
+          <div style={{ marginBottom: 2 }}>
+            {formatTiming(firstResponseTime)}/{formatTiming(totalTime)}
+          </div>
+        </Tooltip>
+        <Progress
+          percent={totalPercent}
+          size="small"
+          status={isSlow ? "exception" : "normal"}
+          showInfo={false}
+        />
+      </div>
+    );
+  }
+
   function renderTestResults() {
     if (testResults.length === 0) {
       return (
@@ -292,6 +367,12 @@ export function TestLLMAdmin() {
             <span style={{ color: COLORS.GRAY_M }}>-</span>
           ),
       },
+      {
+        title: "Timing",
+        key: "timing",
+        width: 120,
+        render: (_, record: TestResult) => renderTimingColumn(record),
+      },
       {
         title: "Test",
         key: "test",

src/packages/frontend/frame-editors/latex-editor/build.tsx

@@ -143,7 +143,7 @@ export const Build: React.FC<Props> = React.memo((props) => {
     // const y: ExecOutput | undefined = job_infos.get(stage)?.toJS();
 
     if (!x) return;
-    const value = x.stdout ?? "" + x.stderr ?? "";
+    const value = (x.stdout ?? "") + (x.stderr ?? "");
     if (!value) return;
     // const time: number | undefined = x.get("time");
     // const time_str = time ? `(${(time / 1000).toFixed(1)} seconds)` : "";
@@ -235,7 +235,7 @@ export const Build: React.FC<Props> = React.memo((props) => {
       if (!info || info.type !== "async" || info.status !== "running") return;
       const stats_str = getResourceUsage(info.stats, "last");
       const start = info.start;
-      logTail = tail(info.stdout ?? "" + info.stderr ?? "", 6);
+      logTail = tail((info.stdout ?? "") + (info.stderr ?? ""), 6);
       isLongRunning ||=
         typeof start === "number" &&
         webapp_client.server_time() - start > WARN_LONG_RUNNING_S * 1000;