@1agh/maude 0.34.0 → 0.36.0

package/apps/studio/client/app.jsx

@@ -449,10 +449,11 @@ const STICONS = {
       <polyline points="3 12.8 3 13.6 13 13.6 13 12.8" />
     </>
   ),
+  // lucide `rotate-cw`, scaled from the 24px source into our 16px viewBox.
   reload: (
     <>
-      <path d="M3.2 8a5 5 0 1 1 1.4 3.5" />
-      <polyline points="3.2 11.4 3.2 8 6.6 8" />
+      <path d="M14 8a6 6 0 1 1-2-4.47L14 5.33" />
+      <path d="M14 2v3.33h-3.33" />
     </>
   ),
   help: (
@@ -1092,10 +1093,23 @@ function FileRow({ file, activePath, onOpen, onDelete, openCount: oc, depth, kin
   // Delete only real canvases in a deletable group (onDelete is undefined for the
   // DS group + runtime files); the server enforces the rest.
   const canDelete = isCanvas && typeof onDelete === 'function' && kind !== 'runtime';
+  // Stable hook for the desktop E2E harness (data-testid convention — see the
+  // `desktop-e2e` skill): canvas rows only, slug derived from the relative path
+  // (e.g. `ui/Smoke.tsx` → `canvas-row-ui-smoke`).
+  const testId = isCanvas
+    ? 'canvas-row-' +
+      file.path
+        .replace(/^\.[^/]+\//, '') // strip the leading designRoot dot-folder (.design/)
+        .replace(CANVAS_EXT_RE, '')
+        .replace(/[^a-z0-9]+/gi, '-')
+        .toLowerCase()
+        .replace(/^-+|-+$/g, '')
+    : undefined;
   const row = (
     <button
       type="button"
       role="treeitem"
+      data-testid={testId}
       aria-selected={isSel}
       aria-disabled={inert ? 'true' : undefined}
       tabIndex={isSel ? 0 : -1}
@@ -1383,6 +1397,8 @@ function Sidebar({
   onToggleSection,
   onNewBoard,
   onDeleteBoard,
+  onRefresh,
+  refreshing,
   collapsed,
   onCollapse,
   width,
@@ -1457,6 +1473,19 @@ function Sidebar({
           >
             <StIcon name="plus" size={15} />
           </button>
+          {onRefresh && (
+            <button
+              type="button"
+              className={'st-iconbtn st-refresh' + (refreshing ? ' is-spinning' : '')}
+              data-tip="Refresh files · ⇧⌘R"
+              aria-label="Refresh files"
+              aria-busy={refreshing || undefined}
+              disabled={refreshing}
+              onClick={() => onRefresh()}
+            >
+              <StIcon name="reload" size={15} />
+            </button>
+          )}
           <span
             className="st-live"
             data-tip={wsConnected ? 'live · file index synced' : 'reconnecting…'}
@@ -1553,7 +1582,7 @@ function Sidebar({
         </div>
       </div>
 
-      <div className="st-tree" role="tree" aria-label="Project file tree">
+      <div className="st-tree" role="tree" aria-label="Project file tree" data-testid="canvas-list">
         {filteredGroups.map((g) => {
           // Hide gitignored runtime / orphan-only project sections by default.
           // Active search overrides — if the user typed a query, they want hits
@@ -2748,6 +2777,7 @@ function Viewport({
             src={canvasUrl(t.path, cfg)}
             className={t.path === activePath ? 'active' : ''}
             data-path={t.path}
+            data-testid={t.path === activePath ? 'canvas-frame' : undefined}
             onLoad={() => onIframeLoad?.(t.path)}
             // T2 (9.1-A) — only sandbox + delegate clipboard when the canvas is
             // served cross-origin (canvasOrigin present = the split is on). In
@@ -3136,6 +3166,7 @@ function StatusBar({
             (changesCount > 0 ? ' has-changes' : unpushed > 0 ? ' has-unpushed' : '')
           }
           onClick={onOpenChanges}
+          data-testid="open-changes"
           data-tip="Open Changes · ⌘⇧G"
           data-tip-pos="top"
           aria-label="Open Changes panel"
@@ -6303,6 +6334,50 @@ function App() {
 
   const reloadTree = useCallback(() => loadTree(), [loadTree]);
 
+  // User-facing tree refresh with a visible spin. The header button and ⌘⇧R call
+  // this so the reload icon spins for at least one beat — even when /_index-data
+  // returns instantly — so the action registers visually ("something is
+  // happening"). The min-duration race keeps the spin from flashing for one
+  // frame on a fast read; the ref guard ignores re-entrant clicks. The passive
+  // focus backstop below uses the plain reloadTree (no icon to animate).
+  const [treeRefreshing, setTreeRefreshing] = useState(false);
+  const treeRefreshingRef = useRef(false);
+  const refreshTree = useCallback(async () => {
+    if (treeRefreshingRef.current) return;
+    treeRefreshingRef.current = true;
+    setTreeRefreshing(true);
+    try {
+      await Promise.all([loadTree(), new Promise((r) => setTimeout(r, 550))]);
+    } finally {
+      treeRefreshingRef.current = false;
+      setTreeRefreshing(false);
+    }
+  }, [loadTree]);
+
+  // Backstop for the desktop sidecar: re-list the tree whenever the window
+  // regains focus. The fs-watch → canvas-list-update auto-refresh can drop
+  // events in a `bun --compile` standalone binary (recursive fs.watch is
+  // unreliable there) and across a sidecar respawn / WS reconnect, leaving a
+  // stale tree after a canvas was created from the ACP chat or a terminal.
+  // `/_index-data` is a cheap read and people tab away to the agent and back, so
+  // this turns "switch projects to force a refresh" into "just come back to the
+  // window". Debounced so a rapid blur/focus burst coalesces to one re-read.
+  useEffect(() => {
+    let t = null;
+    const onFocus = () => {
+      if (t) clearTimeout(t);
+      t = setTimeout(() => {
+        t = null;
+        reloadTree();
+      }, 150);
+    };
+    window.addEventListener('focus', onFocus);
+    return () => {
+      window.removeEventListener('focus', onFocus);
+      if (t) clearTimeout(t);
+    };
+  }, [reloadTree]);
+
   // Phase 22 — create a blank brief board from the tree header. POSTs to the
   // main-origin-only /_api/canvas (the untrusted canvas iframe can't reach it),
   // then refreshes the tree and opens the new board so it's immediately the
@@ -6784,6 +6859,15 @@ function App() {
         setPaletteOpen((v) => !v);
         return;
       }
+      // Cmd+Shift+R — refresh the FILES tree (re-read /_index-data). The fs-watch
+      // → canvas-list-update auto-refresh can miss events in the compiled desktop
+      // sidecar (recursive fs.watch is unreliable in a bun --compile binary), and
+      // ⌘R is taken by canvas-iframe reload, so this is the manual escape hatch.
+      if (meta && e.shiftKey && (e.key === 'r' || e.key === 'R')) {
+        e.preventDefault();
+        refreshTree();
+        return;
+      }
       // Cmd+R — reload active iframe (override browser reload)
       if (meta && (e.key === 'r' || e.key === 'R')) {
         e.preventDefault();
@@ -6933,6 +7017,7 @@ function App() {
     return () => window.removeEventListener('keydown', onKey);
   }, [
     reloadActive,
+    refreshTree,
     selected,
     activePath,
     focusedCommentId,
@@ -7216,6 +7301,8 @@ function App() {
             onToggleSection={toggleSection}
             onNewBoard={createBoard}
             onDeleteBoard={deleteBoard}
+            onRefresh={refreshTree}
+            refreshing={treeRefreshing}
             collapsed={!sidebarOpen}
             onCollapse={() => setSidebarOpen(false)}
             width={sbSize.w}

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

@@ -411,6 +411,7 @@ export default function GitPanel({
       <button
         type="button"
         className="btn btn--primary gp-publish"
+        data-testid="git-publish"
         data-tour="publish"
         disabled={!!busy}
         onClick={() =>
@@ -435,6 +436,7 @@ export default function GitPanel({
       className={'st-rpanel gp-panel' + (resizing ? ' is-resizing' : '')}
       style={width ? { width, flexBasis: width } : undefined}
       aria-label="Changes"
+      data-testid="git-panel"
     >
       <div className="gp-head">
         <div className="gp-panel-hd">
@@ -494,6 +496,7 @@ export default function GitPanel({
                   <button
                     type="button"
                     className="btn btn--sm"
+                    data-testid="git-get-latest"
                     disabled={!!busy}
                     onClick={() =>
                       run('getLatest', onGetLatest, {
@@ -559,6 +562,7 @@ export default function GitPanel({
                 <button
                   type="button"
                   className="btn btn--ghost btn--sm"
+                  data-testid="git-get-latest"
                   data-tour="pull"
                   disabled={!!busy}
                   onClick={() =>
@@ -639,6 +643,7 @@ export default function GitPanel({
               </label>
               <textarea
                 className="gp-msg"
+                data-testid="git-commit-message"
                 placeholder="Describe what changed in this version…"
                 aria-label="Describe what changed in this version"
                 rows={2}
@@ -665,6 +670,7 @@ export default function GitPanel({
                 <button
                   type="button"
                   className="btn btn--ghost btn--sm"
+                  data-testid="git-save-all"
                   disabled={!message.trim() || !!busy}
                   title="Save every change"
                   onClick={async () => {