@1agh/maude 1.2.0 → 1.3.0

package/apps/studio/client/apply-edit-request.ts

@@ -0,0 +1,55 @@
+// The shell half of an inline-edit undo/redo (`dgn:'apply-edit'`). The canvas
+// iframe's edit-source command cannot reach the main-origin `/_api/edit-*`
+// routes (DDR-054), so it posts the re-application here and the shell builds
+// the request.
+//
+// `from` is the value the command expects the source to hold right now (the
+// side it replaces FROM). For css/attr it becomes the route's `expected`
+// precondition, so an undo cannot overwrite a newer value a teammate wrote
+// (audit 2026-09-13 P1 #5). For text it keeps its existing job: targeting a
+// `{variable}` edit at the right source string.
+
+export interface ApplyEditMessage {
+  op: unknown;
+  canvas?: unknown;
+  id?: unknown;
+  key?: unknown;
+  value?: unknown;
+  from?: unknown;
+  occurrence?: unknown;
+}
+
+export interface ApplyEditRequest {
+  op: 'css' | 'text' | 'attr';
+  url: string;
+  body: Record<string, unknown>;
+}
+
+export function applyEditRequest(m: ApplyEditMessage): ApplyEditRequest | null {
+  if (m.op !== 'css' && m.op !== 'text' && m.op !== 'attr') return null;
+  if (typeof m.id !== 'string' || !m.id) return null;
+  const value = typeof m.value === 'string' ? m.value : null;
+  // Older canvas bundles send no `from`; they keep the legacy unconditional write.
+  const expected =
+    typeof m.from === 'string' || m.from === null ? { expected: m.from } : ({} as object);
+  if (m.op === 'css') {
+    const target = value == null ? { reset: true } : { value };
+    return {
+      op: 'css',
+      url: '/_api/edit-css',
+      body: { canvas: m.canvas, id: m.id, property: m.key, ...target, ...expected },
+    };
+  }
+  if (m.op === 'attr') {
+    const target = value == null ? { reset: true } : { value };
+    return {
+      op: 'attr',
+      url: '/_api/edit-attr',
+      body: { canvas: m.canvas, id: m.id, attr: m.key, ...target, ...expected },
+    };
+  }
+  const body: Record<string, unknown> = { canvas: m.canvas, id: m.id, text: value ?? '' };
+  if (typeof m.occurrence === 'number') body.occurrence = m.occurrence;
+  if (typeof m.from === 'string') body.before = m.from;
+  return { op: 'text', url: '/_api/edit-text', body };
+}

package/apps/studio/client/export-center.jsx

@@ -12,6 +12,7 @@
 // (`.st-exports`) and 4-components.css (`.st-export-*`).
 
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { dismissNotice, notify, summarizeNoticeText } from '../notifications.tsx';
 import { isNativeApp, saveExport } from './github.js';
 
 const FORMAT_LABELS = {
@@ -75,6 +76,7 @@ async function saveNative(id, filename) {
 export function useExportCenter({ enabled = true } = {}) {
   const [jobs, setJobs] = useState(() => new Map());
   const [panelOpen, setPanelOpen] = useState(false);
+  const [selectedJobId, setSelectedJobId] = useState(null);
   const [toastQueue, setToastQueue] = useState([]);
   const [savingIds, setSavingIds] = useState(() => new Set());
   const prevStatusRef = useRef(new Map());
@@ -149,7 +151,7 @@ export function useExportCenter({ enabled = true } = {}) {
     if (toSurface.length) {
       setToastQueue((q) => {
         const merged = q.filter((id) => !toSurface.includes(id));
-        return [...toSurface, ...merged].slice(0, 8);
+        return [...toSurface, ...merged];
       });
     }
 
@@ -169,14 +171,22 @@ export function useExportCenter({ enabled = true } = {}) {
 
   const list = useMemo(
     () =>
-      Array.from(jobs.values()).sort((a, b) => (b.createdAt || '').localeCompare(a.createdAt || '')),
+      Array.from(jobs.values()).sort((a, b) =>
+        (b.createdAt || '').localeCompare(a.createdAt || '')
+      ),
     [jobs]
   );
   const runningCount = list.filter((j) => j.status === 'running').length;
   const queuedCount = list.filter((j) => j.status === 'queued').length;
 
-  const dismissToast = useCallback(() => setToastQueue((q) => q.slice(1)), []);
-  const openPanel = useCallback(() => setPanelOpen(true), []);
+  const dismissToast = useCallback(
+    (id) => setToastQueue((q) => q.filter((item) => item !== (id ?? q[0]))),
+    []
+  );
+  const openPanel = useCallback((jobId) => {
+    setSelectedJobId(typeof jobId === 'string' ? jobId : null);
+    setPanelOpen(true);
+  }, []);
   const closePanel = useCallback(() => setPanelOpen(false), []);
 
   const withSaving = useCallback(async (job, fn) => {
@@ -221,6 +231,8 @@ export function useExportCenter({ enabled = true } = {}) {
     queuedCount,
     busyCount: runningCount + queuedCount,
     panelOpen,
+    selectedJobId,
+    toastJobs: toastQueue.map((id) => jobs.get(id)).filter(Boolean),
     openPanel,
     closePanel,
     showToast: !!toastJobId,
@@ -248,7 +260,9 @@ function saveActionLabel(saving) {
 
 function ProgressBar({ progress }) {
   if (!progress || !progress.total) {
-    return <div className="st-export-progress st-export-progress--indeterminate" aria-hidden="true" />;
+    return (
+      <div className="st-export-progress st-export-progress--indeterminate" aria-hidden="true" />
+    );
   }
   const pct = Math.max(0, Math.min(100, Math.round((progress.current / progress.total) * 100)));
   return (
@@ -331,7 +345,7 @@ function StatusPill({ job }) {
  * back degraded — in the panel row and in the completion toast, because the
  * whole failure mode of this bug was that neither surface said anything.
  */
-function DegradedNote({ degraded }) {
+function DegradedNote({ degraded, compact = false }) {
   if (!degraded) return null;
   // The font case names the fonts, because "reduced fidelity" is useless to
   // someone about to send this to a printer — what they need is which faces
@@ -344,8 +358,12 @@ function DegradedNote({ degraded }) {
       : 'Exported with reduced fidelity.';
   return (
     <div className="st-export-degraded" data-testid="export-degraded-note">
-      <span aria-hidden="true">⚠</span> {headline}
-      {degraded.remedy ? <div className="st-export-degraded__fix">{degraded.remedy}</div> : null}
+      <span aria-hidden="true">!</span> {compact ? summarizeNoticeText(headline) : headline}
+      {degraded.remedy ? (
+        <div className="st-export-degraded__fix">
+          {compact ? summarizeNoticeText(degraded.remedy) : degraded.remedy}
+        </div>
+      ) : null}
     </div>
   );
 }
@@ -372,65 +390,88 @@ export function ExportBadge({ center }) {
   );
 }
 
-export function ExportToast({ center }) {
-  if (!center.showToast || !center.toastJob) return null;
-  const job = center.toastJob;
+function ExportJobNotice({ job, center }) {
   const pending = job.status === 'queued' || job.status === 'running';
   const ok = job.status === 'done';
   const saving = center.savingIds.has(job.id);
-  const finalize = () => {
-    if (isNativeApp()) void center.save(job);
-    else void center.download(job);
-  };
-  return (
-    <div className="st-toast" role="status" aria-live="polite">
-      <button type="button" className="st-toast-close" aria-label="Dismiss" onClick={center.dismissToast}>
-        ×
-      </button>
-      <div className="st-toast-hd">
-        <span aria-hidden="true">{pending ? '⋯' : ok && !job.degraded ? '⬇' : '⚠'}</span>
-        {pending
-          ? 'Exporting…'
-          : ok
-            ? job.degraded
-              ? 'Export ready — with a problem'
-              : 'Export ready'
-            : 'Export failed'}
-      </div>
-      <div className="st-toast-title">{jobLabel(job)}</div>
-      {pending ? (
+  const id = `export-${job.id}`;
+  useEffect(() => {
+    notify({
+      id,
+      group: 'exports',
+      title: pending
+        ? 'Exporting…'
+        : ok
+          ? job.degraded
+            ? 'Export ready — with a problem'
+            : 'Export ready'
+          : 'Export failed',
+      description: pending
+        ? 'Running in the background — you can keep working.'
+        : ok
+          ? (job.filename ?? 'Ready to download.')
+          : (job.error ?? 'Something went wrong.'),
+      kind: pending ? 'info' : ok ? (job.degraded ? 'warning' : 'success') : 'error',
+      duration: pending ? Infinity : undefined,
+      timerKey: pending ? 'active' : job.status,
+      paused: saving,
+      onDismiss: () => center.dismissToast(job.id),
+      content: (
         <>
-          <div className="st-toast-txt">Running in the background — you can keep working.</div>
-          <ProgressBar progress={job.progress} />
+          <div className="maude-notice-summary">{jobLabel(job)}</div>
+          {pending && <ProgressBar progress={job.progress} />}
+          {ok && <DegradedNote degraded={job.degraded} compact />}
+          <div className="st-toast-actions">
+            {ok && (
+              <button
+                type="button"
+                className="btn btn--primary btn--sm"
+                disabled={saving}
+                onClick={() => (isNativeApp() ? void center.save(job) : void center.download(job))}
+              >
+                {saving && <span className="st-btn-spin" aria-hidden="true" />}
+                {saveActionLabel(saving)}
+              </button>
+            )}
+            <button
+              type="button"
+              className="btn btn--ghost btn--sm"
+              onClick={() => center.openPanel(job.id)}
+            >
+              View in history
+            </button>
+          </div>
         </>
-      ) : (
-        <div className="st-toast-txt">
-          {ok ? (job.filename ?? 'Ready to download.') : (job.error ?? 'Something went wrong.')}
-        </div>
-      )}
-      {ok && <DegradedNote degraded={job.degraded} />}
-      {ok && (
-        <div className="st-toast-actions">
-          <button
-            type="button"
-            className="btn btn--primary btn--sm"
-            onClick={finalize}
-            disabled={saving}
-          >
-            {saving && <span className="st-btn-spin" aria-hidden="true" />}
-            {saveActionLabel(saving)}
-          </button>
-          <button type="button" className="btn btn--ghost btn--sm" onClick={center.dismissToast}>
-            Dismiss
-          </button>
-        </div>
-      )}
-    </div>
-  );
+      ),
+    });
+  }, [
+    id,
+    job,
+    pending,
+    ok,
+    saving,
+    center.dismissToast,
+    center.openPanel,
+    center.save,
+    center.download,
+  ]);
+  useEffect(() => () => dismissNotice(id), [id]);
+  return null;
+}
+
+export function ExportToast({ center }) {
+  return center.toastJobs.map((job) => <ExportJobNotice key={job.id} job={job} center={center} />);
 }
 
 export function ExportPanel({ center }) {
-  const { panelOpen, closePanel } = center;
+  const { panelOpen, closePanel, selectedJobId } = center;
+  const selectedRow = useRef(null);
+  useEffect(() => {
+    if (panelOpen && selectedJobId) {
+      selectedRow.current?.scrollIntoView?.({ block: 'nearest' });
+      selectedRow.current?.focus();
+    }
+  }, [panelOpen, selectedJobId]);
   useEffect(() => {
     if (!panelOpen) return;
     function onKey(e) {
@@ -474,7 +515,13 @@ export function ExportPanel({ center }) {
           ) : (
             <ul className="st-export-list">
               {center.jobs.map((job) => (
-                <li key={job.id} className="st-export-item">
+                <li
+                  key={job.id}
+                  className="st-export-item"
+                  data-testid={`export-job-${job.id}`}
+                  ref={job.id === selectedJobId ? selectedRow : null}
+                  tabIndex={-1}
+                >
                   <div className="st-export-item__hd">
                     <span className="st-export-item__label">{jobLabel(job)}</span>
                     <StatusPill job={job} />
@@ -501,7 +548,10 @@ export function ExportPanel({ center }) {
                   )}
                   {job.status === 'failed' && (
                     <div className="st-export-item__ft">
-                      <span className="st-export-item__error">{job.error ?? 'Export failed.'}</span>
+                      <details className="st-export-item__error">
+                        <summary>Show error details</summary>
+                        <pre>{job.error ?? 'Export failed.'}</pre>
+                      </details>
                     </div>
                   )}
                 </li>

package/apps/studio/client/github.js

@@ -86,6 +86,42 @@ export const initDesign = (dir) => api('/_api/design/init', { method: 'POST', bo
 /** Phase 29 (E4) Door C — connect to a team hub (saves the global hub credential). */
 export const hubLink = (body) => api('/_api/hub/link', { method: 'POST', body: JSON.stringify(body) });
 
+// ── managed team projects (plan T21/T22) ───────────────────────────────────────
+/**
+ * Sign in / hold the credential and describe a team project, so its own copy can
+ * be created without choosing a folder. body: { kind: 'cloud', projectId } |
+ * { kind: 'handoff', code, claimedProject } | { kind: 'hub', url, email, password }
+ * | { kind: 'known-hub', url }.
+ */
+export const prepareProject = (body) => api('/_api/projects/prepare', { method: 'POST', body: JSON.stringify(body) });
+/** Create (first time) or reuse the project's managed copy, then switch to it. */
+export const managedProjectOpen = (p) =>
+  invoke('managed_project_open', {
+    serverUrl: p.serverUrl,
+    projectId: p.projectId,
+    name: p.name || p.projectId,
+    canvasGroups: p.canvasGroups || [],
+  });
+/** The team projects this computer keeps a copy of, most recent first. */
+export const managedProjectsList = () => invoke('managed_projects_list');
+
+/**
+ * Prepare, then open. Resolves `{ ok: true, path }` once the switch has started
+ * (the webview reloads onto the project), or `{ ok: false, error }`.
+ */
+export async function openTeamProject(input) {
+  const r = await prepareProject(input);
+  if (!r.ok || !r.json?.ok) {
+    return { ok: false, error: r.json?.error || 'The project could not be opened.', status: r.status };
+  }
+  try {
+    const path = await managedProjectOpen(r.json);
+    return { ok: true, path, project: r.json };
+  } catch (e) {
+    return { ok: false, error: String(e?.message || e || 'The project could not be opened.') };
+  }
+}
+
 // ── Tauri shell: app-state (first-run / last-project / recent) — Phase 29 (E4) ──
 // In a plain browser these throw via tauri(); the wizard only mounts in the native
 // app (isNativeApp()), so call sites guard accordingly.
@@ -99,7 +135,8 @@ export const appRecentProjects = () => invoke('app_recent_projects');
 /** Native folder picker → chosen parent dir, or null if cancelled. */
 export const pickDirectory = () => invoke('pick_directory');
 /** Switch the app to a local project folder (the freshly cloned copy). */
-export const openLocalProject = (path) => invoke('open_local_project', { path });
+export const openLocalProject = (path, open) => invoke('open_local_project', { path, open });
+export const resolveProjectForLink = (project) => invoke('resolve_project_for_link', { project });
 /**
  * Native "Save As…" for an export — opens an OS save dialog seeded with
  * `filename`, then has the Rust side fetch the finished `jobId`'s bytes

package/apps/studio/client/index-loader.ts

@@ -0,0 +1,76 @@
+/** One project-index request at a time, with automatic transient recovery. */
+export function createIndexLoader<T>({
+  read,
+  apply,
+  onError,
+  retryDelayMs = 500,
+  maxRetryDelayMs = 5000,
+  timeoutMs = 10000,
+}: {
+  read: (signal: AbortSignal) => Promise<T>;
+  apply: (value: T) => void;
+  onError: (error: unknown) => void;
+  retryDelayMs?: number;
+  maxRetryDelayMs?: number;
+  timeoutMs?: number;
+}) {
+  let disposed = false;
+  let dirty = false;
+  let failures = 0;
+  let pending: Promise<void> | null = null;
+  let retryTimer: ReturnType<typeof setTimeout> | undefined;
+  let controller: AbortController | undefined;
+  const cancelRetry = () => {
+    clearTimeout(retryTimer);
+    retryTimer = undefined;
+  };
+  async function drain() {
+    while (dirty && !disposed) {
+      dirty = false;
+      cancelRetry();
+      const current = new AbortController();
+      controller = current;
+      const timeout = setTimeout(() => current.abort(), timeoutMs);
+      try {
+        const value = await read(current.signal);
+        // A mutation/refresh requested a newer index during this read. Do not
+        // briefly restore the older tree; the next request serves all waiters.
+        if (!disposed && !dirty) apply(value);
+        failures = 0;
+      } catch (error) {
+        if (disposed) return;
+        onError(error);
+        const status = (error as { status?: number } | null)?.status;
+        if (status == null || status === 408 || status === 429 || status >= 500) {
+          const delay = Math.min(maxRetryDelayMs, retryDelayMs * 2 ** Math.min(failures++, 10));
+          retryTimer = setTimeout(() => { void reload(); }, delay);
+        }
+      } finally {
+        clearTimeout(timeout);
+        if (controller === current) controller = undefined;
+      }
+    }
+  }
+  function reload(): Promise<void> {
+    if (disposed) return Promise.resolve();
+    dirty = true;
+    cancelRetry();
+    if (!pending) {
+      pending = drain().finally(() => {
+        pending = null;
+        // Cover a reload requested between drain's return and this microtask.
+        if (dirty && !disposed) return reload();
+      });
+    }
+    return pending;
+  }
+  return {
+    reload,
+    dispose() {
+      disposed = true;
+      dirty = false;
+      cancelRetry();
+      controller?.abort();
+    },
+  };
+}

package/apps/studio/client/panels/CloudBar.jsx

@@ -14,8 +14,10 @@
 
 import { useEffect, useRef, useState } from 'react';
 
+import { localIdentityMatches, parseFileDeepLink } from '../share-link.js';
+import FileDeepLinkDialog from './file-deep-link-dialog.jsx';
 import { safeName, syncPresentation } from '../../sync/presentation.ts';
-import { invoke, isNativeApp, listen, openCloudUrl } from '../github.js';
+import { invoke, isNativeApp, listen, openCloudUrl, openTeamProject } from '../github.js';
 
 const api = async (path, init) => {
   const res = await fetch(path, init);
@@ -80,7 +82,7 @@ export function isDisplayableUrl(url, cloudUrl) {
  * browser didn't open, go to:" teaches the person to copy the address into a
  * browser the lock cannot see (B4). Callers surface the failure instead.
  */
-function openExternal(url) {
+export function openExternal(url) {
   if (!url) return Promise.resolve('failed');
   if (isNativeApp()) {
     return openCloudUrl(url).then(
@@ -118,7 +120,9 @@ export function parseDeepLink(url) {
   // without this, arbitrary attacker text renders in the dialog's heading, prose
   // and aria-label. Nothing longer can name a real project anyway.
   if (m[1].length > 40) return null;
-  const code = new URLSearchParams(m[2]).get('code') ?? '';
+  const params = new URLSearchParams(m[2]);
+  if (params.has('open') || params.getAll('code').length !== 1) return null;
+  const code = params.get('code') ?? '';
   if (!/^mhc_[0-9a-f]{16,128}$/.test(code)) return null;
   return { project: m[1], code };
 }
@@ -402,7 +406,7 @@ function Icon({ name, size = 15 }) {
 // GitPanel's cloud-managed posture turns on the same `linkedHub.credentialed`
 // fact this panel's Connected row does, and CloudBar owns every action that
 // changes it (status resolve, attach, detach) — so it reports, the app decides.
-export default function CloudBar({ syncStatus, onLinkedHub }) {
+export default function CloudBar({ syncStatus, onLinkedHub, onLocalProject, onOpenFile, filesReady }) {
   const [state, setState] = useState('loading'); // loading | out | in
   const [email, setEmail] = useState(null);
   const [menuOpen, setMenuOpen] = useState(false);
@@ -451,6 +455,7 @@ export default function CloudBar({ syncStatus, onLinkedHub }) {
           resolved: true,
         });
         onLinkedHub?.(r.json?.linkedHub ?? null);
+        onLocalProject?.(r.json?.project ?? null);
         if (r.ok && r.json?.connected) {
           setEmail(r.json.email);
           setState('in');
@@ -474,7 +479,9 @@ export default function CloudBar({ syncStatus, onLinkedHub }) {
   useEffect(() => {
     if (!isNativeApp()) return undefined;
     const consume = (url) => {
-      const parsed = parseDeepLink(url);
+      const connect = parseDeepLink(url);
+      const file = connect ? null : parseFileDeepLink(url);
+      const parsed = connect ? { ...connect, kind: 'connect' } : file ? { ...file, kind: 'file' } : null;
       if (!parsed) return;
       // NEVER replace a link the person is already looking at. The dialog is a
       // single slot, so an overwrite would swap the code out from under a
@@ -493,6 +500,13 @@ export default function CloudBar({ syncStatus, onLinkedHub }) {
     return () => unlisten?.();
   }, []);
 
+  const fileMatches = pending?.kind === 'file' && local.resolved && localIdentityMatches(local, pending.project);
+  useEffect(() => {
+    if (!fileMatches || !filesReady || !onOpenFile) return;
+    onOpenFile(pending.rel);
+    setPending(null);
+  }, [fileMatches, filesReady, pending, onOpenFile]);
+
   async function connectPending() {
     if (!pending) return;
     setBusy('deeplink');
@@ -516,6 +530,21 @@ export default function CloudBar({ syncStatus, onLinkedHub }) {
     }
   }
 
+  // Plan T22: the link's project opened as ITS OWN copy — the designer's
+  // default, and the one answer that can't sync the wrong folder anywhere. The
+  // server still checks the claimed name against what the code opens.
+  async function openPendingManaged() {
+    if (!pending) return;
+    setBusy('deeplink');
+    setError('');
+    const r = await openTeamProject({ kind: 'handoff', code: pending.code, claimedProject: pending.project });
+    setPending(null);
+    if (!r.ok) {
+      setBusy('');
+      setError(r.error || 'The project could not be opened.');
+    }
+  }
+
   // A successful attach IS a credentialed link — mirror it into `local` so the
   // project list flips to Connected without a second status fetch (the server
   // just wrote both halves: linkedHub in config.json + the hub credential).
@@ -677,7 +706,8 @@ export default function CloudBar({ syncStatus, onLinkedHub }) {
           status fetch, and a modal rendered without the local half showed no
           warning and a primary Connect — failing OPEN in the one scenario with
           the least context (attacker pass B3). */}
-      {pending && local.resolved && (
+      {pending?.kind === 'file' && local.resolved && !fileMatches && <FileDeepLinkDialog key={pending.project + pending.rel} pending={pending} local={local} cloudUrl={cloudUrl} onClose={() => setPending(null)} />}
+      {pending?.kind === 'connect' && local.resolved && (
         <div
           className="gi-modal"
           role="dialog"
@@ -751,6 +781,22 @@ export default function CloudBar({ syncStatus, onLinkedHub }) {
                 </span>
               </div>
             )}
+            {isNativeApp() && (
+              <div className="gi-dl-open">
+                <button
+                  type="button"
+                  className="btn btn--primary"
+                  disabled={busy === 'deeplink'}
+                  onClick={openPendingManaged}
+                  data-testid="cloud-deeplink-open"
+                >
+                  {busy === 'deeplink' ? 'Opening…' : `Open ${pending.project}`}
+                </button>
+                <span className="gi-dc-foot-note">
+                  Opens the project in its own copy on this computer. Nothing in this folder changes.
+                </span>
+              </div>
+            )}
             <div className="gi-dc-foot">
               {/* On a mismatch the safe action leads and connecting is the one you
                   have to mean. No project switcher lives here on purpose: the