@agent-native/core 0.94.0 → 0.94.2

package/corpus/templates/clips/desktop/src/overlays/finalizing.tsx

@@ -1,3 +1,9 @@
+import {
+  IconAlertCircle,
+  IconCheck,
+  IconExternalLink,
+  IconX,
+} from "@tabler/icons-react";
 import { invoke } from "@tauri-apps/api/core";
 import { listen } from "@tauri-apps/api/event";
 import { open as openExternal } from "@tauri-apps/plugin-shell";
@@ -13,6 +19,7 @@ type NativeUploadProgress = {
 type ProcessingProgress = {
   stage?: string;
   progress?: number | null;
+  viewUrl?: string;
 };
 
 type NativeUploadFinished = {
@@ -23,15 +30,40 @@ type NativeUploadFinished = {
   localFilePath?: string | null;
 };
 
+const FINALIZING_RESULT_STORAGE_KEY = "clips-finalizing-result";
+
+function takePersistedFinalizingResult(): NativeUploadFinished | null {
+  try {
+    const raw = window.localStorage.getItem(FINALIZING_RESULT_STORAGE_KEY);
+    if (!raw) return null;
+    window.localStorage.removeItem(FINALIZING_RESULT_STORAGE_KEY);
+    const parsed: unknown = JSON.parse(raw);
+    if (!parsed || typeof parsed !== "object") return null;
+    const payload = parsed as Record<string, unknown>;
+    if (
+      typeof payload.recordingId !== "string" ||
+      typeof payload.viewUrl !== "string" ||
+      typeof payload.ok !== "boolean"
+    ) {
+      return null;
+    }
+    return {
+      recordingId: payload.recordingId,
+      viewUrl: payload.viewUrl,
+      ok: payload.ok,
+      error: typeof payload.error === "string" ? payload.error : null,
+      localFilePath: null,
+    };
+  } catch {
+    return null;
+  }
+}
+
 /**
- * Full-screen transparent feedback overlay. Rendered the moment the user
- * clicks Stop on the recording toolbar and kept visible while the desktop
- * finishes its durable backup and first upload/finalize attempt. The browser
- * can open `/r/:id` earlier so the page shows live progress.
- *
- * The window ignores cursor events on the Rust side, so the compact
- * bottom-left card does not block the user's screen while compression or
- * upload runs.
+ * Compact bottom-left feedback window. Rendered the moment the user clicks
+ * Stop and kept visible while the desktop finishes its durable backup and
+ * first upload/finalize attempt. The browser can open `/r/:id` earlier so the
+ * page shows live progress.
  */
 export function Finalizing() {
   const [progress, setProgress] = useState<ProcessingProgress>({
@@ -45,6 +77,9 @@ export function Finalizing() {
     let unlistenFinished: (() => void) | null = null;
     let completionTimer: ReturnType<typeof window.setTimeout> | null = null;
     let openingWatchdog: ReturnType<typeof window.setTimeout> | null = null;
+    const hardWatchdog = window.setTimeout(() => {
+      void invoke("hide_finalizing").catch(() => {});
+    }, 120_000);
     let finishedHandled = false;
     const clearCompletionTimer = () => {
       if (completionTimer) {
@@ -59,6 +94,7 @@ export function Finalizing() {
       }
     };
     listen<NativeUploadProgress>("clips:native-upload-progress", (event) => {
+      if (finishedHandled) return;
       const payload = event.payload ?? {};
       if (payload.stage === "opening" && payload.progress === 1) {
         clearOpeningWatchdog();
@@ -99,21 +135,36 @@ export function Finalizing() {
     const handleFinished = (payload: NativeUploadFinished) => {
       if (disposed || finishedHandled) return;
       finishedHandled = true;
+      try {
+        window.localStorage.removeItem(FINALIZING_RESULT_STORAGE_KEY);
+      } catch {
+        // Storage is a best-effort event-race fallback only.
+      }
       clearCompletionTimer();
       clearOpeningWatchdog();
       if (payload.ok && payload.viewUrl) {
-        setProgress({ stage: "opening", progress: 1 });
-        completionTimer = window.setTimeout(() => {
-          void claimNativeOpen(payload.recordingId).then((claimed) => {
-            if (!claimed || disposed) return;
-            void openExternal(payload.viewUrl as string).catch(() => {});
-            void invoke("hide_finalizing").catch(() => {});
+        setProgress({
+          stage: "uploaded",
+          progress: 1,
+          viewUrl: payload.viewUrl,
+        });
+        void claimNativeOpen(payload.recordingId).then((claimed) => {
+          if (!claimed || disposed) return;
+          void openExternal(payload.viewUrl as string).catch((err) => {
+            console.error("[clips-finalizing] open clip failed:", err);
           });
-        }, 1500);
+        });
+        completionTimer = window.setTimeout(() => {
+          void invoke("hide_finalizing").catch(() => {});
+        }, 2500);
         return;
       }
 
-      setProgress({ stage: "failed", progress: 1 });
+      setProgress({
+        stage: "failed",
+        progress: 1,
+        viewUrl: payload.viewUrl,
+      });
       completionTimer = window.setTimeout(() => {
         void invoke("show_popover").catch(() => {});
         void invoke("hide_finalizing").catch(() => {});
@@ -129,6 +180,11 @@ export function Finalizing() {
           return;
         }
         unlistenFinished = u;
+        const persisted = takePersistedFinalizingResult();
+        if (persisted) {
+          handleFinished(persisted);
+          return;
+        }
         void invoke<NativeUploadFinished | null>(
           "native_fullscreen_take_upload_finished",
         )
@@ -142,6 +198,7 @@ export function Finalizing() {
       disposed = true;
       clearCompletionTimer();
       clearOpeningWatchdog();
+      window.clearTimeout(hardWatchdog);
       unlisten?.();
       unlistenFinished?.();
     };
@@ -152,38 +209,89 @@ export function Finalizing() {
       ? Math.round(progress.progress * 100)
       : null;
   const caption =
-    progress.stage === "uploading" ||
-    progress.stage === "processing" ||
-    progress.stage === "opening"
-      ? "Uploading clip..."
+    progress.stage === "uploaded"
+      ? "Uploaded"
       : progress.stage === "failed"
         ? "Upload paused"
-        : "Optimizing clip...";
+        : progress.stage === "uploading" ||
+            progress.stage === "processing" ||
+            progress.stage === "opening"
+          ? "Uploading clip..."
+          : "Optimizing clip...";
+  const finished = progress.stage === "uploaded" || progress.stage === "failed";
+
+  const dismiss = () => {
+    void invoke("hide_finalizing").catch(() => {});
+  };
+  const openClip = () => {
+    if (!progress.viewUrl) return;
+    void openExternal(progress.viewUrl).catch((err) => {
+      console.error("[clips-finalizing] open clip failed:", err);
+    });
+  };
 
   return (
     <div className="finalizing-root">
       <div className="finalizing-card">
-        <div className="finalizing-spinner" aria-hidden="true" />
-        <div className="finalizing-caption">{caption}</div>
-        <div
-          className="finalizing-progress"
-          aria-label={
-            percent === null ? caption : `${caption} ${percent}% complete`
-          }
-          role="progressbar"
-          aria-valuemin={0}
-          aria-valuemax={100}
-          aria-valuenow={percent ?? undefined}
-        >
-          <div
-            className={
-              percent === null
-                ? "finalizing-progress-fill finalizing-progress-fill-indeterminate"
-                : "finalizing-progress-fill"
-            }
-            style={percent === null ? undefined : { width: `${percent}%` }}
+        {progress.stage === "uploaded" ? (
+          <IconCheck
+            className="finalizing-status-icon finalizing-status-icon-success"
+            aria-hidden="true"
+          />
+        ) : progress.stage === "failed" ? (
+          <IconAlertCircle
+            className="finalizing-status-icon finalizing-status-icon-failed"
+            aria-hidden="true"
           />
+        ) : (
+          <div className="finalizing-spinner" aria-hidden="true" />
+        )}
+        <div className="finalizing-caption" aria-live="polite">
+          {caption}
+        </div>
+        <div className="finalizing-actions">
+          {progress.viewUrl ? (
+            <button
+              type="button"
+              className="finalizing-action"
+              onClick={openClip}
+              aria-label="Open clip in browser"
+              title="Open clip in browser"
+            >
+              <IconExternalLink aria-hidden="true" />
+            </button>
+          ) : null}
+          <button
+            type="button"
+            className="finalizing-action"
+            onClick={dismiss}
+            aria-label="Dismiss upload status"
+            title="Dismiss"
+          >
+            <IconX aria-hidden="true" />
+          </button>
         </div>
+        {!finished ? (
+          <div
+            className="finalizing-progress"
+            aria-label={
+              percent === null ? caption : `${caption} ${percent}% complete`
+            }
+            role="progressbar"
+            aria-valuemin={0}
+            aria-valuemax={100}
+            aria-valuenow={percent ?? undefined}
+          >
+            <div
+              className={
+                percent === null
+                  ? "finalizing-progress-fill finalizing-progress-fill-indeterminate"
+                  : "finalizing-progress-fill"
+              }
+              style={percent === null ? undefined : { width: `${percent}%` }}
+            />
+          </div>
+        ) : null}
       </div>
     </div>
   );

package/corpus/templates/clips/desktop/src/overlays/meeting-notification.tsx

@@ -326,19 +326,19 @@ export function MeetingNotification() {
   const secondaryLabel = hasJoin ? "& open Clips" : null;
 
   return (
-    <div
-      className="meeting-notification-root"
-      onMouseEnter={() => {
-        setShowClose(true);
-        clearAutoHide();
-      }}
-      onMouseLeave={() => {
-        setShowClose(false);
-        setMenuOpen(false);
-        resumeAutoHide();
-      }}
-    >
-      <div className="meeting-notification">
+    <div className="meeting-notification-root">
+      <div
+        className="meeting-notification"
+        onMouseEnter={() => {
+          setShowClose(true);
+          clearAutoHide();
+        }}
+        onMouseLeave={() => {
+          setShowClose(false);
+          setMenuOpen(false);
+          resumeAutoHide();
+        }}
+      >
         <div
           className={`meeting-notification-bar ${isCalendar ? "meeting-notification-bar-calendar" : "meeting-notification-bar-adhoc"}`}
         />

package/corpus/templates/clips/desktop/src/styles.css

@@ -2527,12 +2527,9 @@ body[data-clips-route="recording-pill"] #root {
 /* ------------------------------------------------------------------------- */
 
 /*
- * Full-screen transparent overlay shown after the user clicks Stop and
- * before the browser opens at /r/:id. The Tauri window is transparent +
- * decorations-less (see `show_finalizing` in lib.rs), so we paint a
- * compact card tucked into the bottom-left with a spinner and caption.
- * The window also has ignore_cursor_events(true), so clicks pass through
- * to whatever is beneath and the progress card stays out of the way.
+ * Compact transparent window shown after the user clicks Stop. Keeping the OS
+ * window close to the card's bounds lets its open/dismiss controls stay
+ * interactive without blocking the rest of the screen.
  */
 .finalizing-root {
   position: fixed;
@@ -2540,17 +2537,16 @@ body[data-clips-route="recording-pill"] #root {
   display: flex;
   align-items: flex-end;
   justify-content: flex-start;
-  padding: 24px;
+  padding: 10px;
   background: transparent;
-  pointer-events: none;
 }
 
 .finalizing-card {
   display: grid;
-  grid-template-columns: 20px minmax(0, 1fr);
+  grid-template-columns: 20px minmax(0, 1fr) auto;
   align-items: center;
   gap: 7px 10px;
-  width: min(320px, calc(100vw - 48px));
+  width: 100%;
   padding: 12px 14px;
   border-radius: 16px;
   background: rgba(20, 22, 28, 0.94);
@@ -2577,6 +2573,20 @@ body[data-clips-route="recording-pill"] #root {
   animation: finalizing-spin 0.9s linear infinite;
 }
 
+.finalizing-status-icon {
+  width: 18px;
+  height: 18px;
+  stroke-width: 2.2;
+}
+
+.finalizing-status-icon-success {
+  color: #8ce99a;
+}
+
+.finalizing-status-icon-failed {
+  color: #ffb4a8;
+}
+
 @keyframes finalizing-spin {
   to {
     transform: rotate(360deg);
@@ -2592,6 +2602,45 @@ body[data-clips-route="recording-pill"] #root {
   text-align: left;
 }
 
+.finalizing-actions {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+}
+
+.finalizing-action {
+  display: inline-flex;
+  width: 26px;
+  height: 26px;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  border: 0;
+  border-radius: 8px;
+  background: transparent;
+  color: rgba(255, 255, 255, 0.64);
+  cursor: pointer;
+  transition:
+    color 140ms ease-out,
+    background-color 140ms ease-out;
+}
+
+.finalizing-action:hover {
+  background: rgba(255, 255, 255, 0.1);
+  color: white;
+}
+
+.finalizing-action:focus-visible {
+  outline: 2px solid rgba(255, 255, 255, 0.9);
+  outline-offset: 1px;
+}
+
+.finalizing-action svg {
+  width: 15px;
+  height: 15px;
+  stroke-width: 2;
+}
+
 .finalizing-progress {
   grid-column: 1 / -1;
   width: 100%;
@@ -3400,14 +3449,14 @@ body[data-clips-route="recording-pill"] #root {
  * Slots into the top of the popover when an update is in flight or ready.
  * Two visual states:
  *  - pending: subtle inline row, just keeps the user informed.
- *  - ready:   accent color + actions (Later / Restart) since clicking
+ *  - ready:   accent color + actions (dismiss / Restart) since clicking
  *             Restart is the thing we actually want them to do.
  */
 .update-banner {
   display: flex;
   align-items: center;
   gap: 8px;
-  margin: 0 12px 8px;
+  margin: 0;
   padding: 8px 10px;
   border-radius: 8px;
   font-size: 12px;
@@ -3424,7 +3473,7 @@ body[data-clips-route="recording-pill"] #root {
   background: var(--surface-strong);
   color: var(--fg);
   border: 1px solid var(--border-strong, var(--border));
-  flex-wrap: wrap;
+  flex-wrap: nowrap;
 }
 
 .update-banner--error {
@@ -3466,6 +3515,27 @@ body[data-clips-route="recording-pill"] #root {
   color: var(--fg);
 }
 
+.update-banner-btn--dismiss {
+  width: 28px;
+  height: 28px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  background: transparent;
+  color: var(--fg-muted);
+}
+
+.update-banner-btn--dismiss:hover {
+  background: var(--surface-hover, var(--surface));
+  color: var(--fg);
+}
+
+.update-banner-btn--dismiss:focus-visible {
+  outline: none;
+  box-shadow: 0 0 0 2px var(--brand-ring);
+}
+
 .update-banner-btn--primary {
   background: var(--brand);
   color: var(--bg);

package/corpus/templates/clips/desktop/src-tauri/src/clips/mod.rs

@@ -458,42 +458,57 @@ fn stop_countdown_control_tracking() {
     COUNTDOWN_CONTROL_TRACKING.store(false, Ordering::SeqCst);
 }
 
-/// Full-screen transparent overlay that shows compact bottom-left progress
-/// while the recorder flushes its final chunks and awaits the server finalize.
-/// Rendered immediately after the user clicks Stop so they don't stare at a
-/// blank screen for a few seconds while `recorder.stop()` completes. Ignores
-/// cursor events so the progress card does not block the screen. Marked
-/// non-sharable for consistency with the other Clips overlays, even though
-/// the recording has already ended by the time this appears.
+/// Compact bottom-left status window shown while the recorder flushes its
+/// final chunks and awaits the server finalize. Keeping the native window near
+/// the card's bounds makes its open/dismiss controls clickable without placing
+/// an input-blocking transparent window over the whole monitor.
 #[tauri::command]
 pub async fn show_finalizing(app: AppHandle) -> Result<(), String> {
     dlog!("[clips-tray] show_finalizing invoked");
     if let Some(existing) = app.get_webview_window(FINALIZING_LABEL) {
         let _ = existing.close();
     }
-    let (mx, my, mw, mh) = tray_monitor_physical_rect(&app);
-    dlog!("[clips-tray] finalizing target size {}x{} physical", mw, mh);
-    let win = WebviewWindowBuilder::new(&app, FINALIZING_LABEL, build_overlay_url("finalizing"))
-        .title("Finalizing")
-        .decorations(false)
-        .transparent(true)
-        .always_on_top(true)
-        .skip_taskbar(true)
-        .shadow(false)
-        .visible(false)
-        // Don't steal focus — same rationale as the countdown overlay.
-        .focused(false)
-        .build()
-        .map_err(|e| {
-            eprintln!("[clips-tray] finalizing build failed: {}", e);
-            e.to_string()
-        })?;
-    let _ = win.set_size(tauri::Size::Physical(PhysicalSize::new(mw, mh)));
-    let _ = win.set_position(PhysicalPosition::new(mx, my));
-    let _ = win.set_ignore_cursor_events(true);
+    let (mx, my, _mw, mh) = tray_monitor_physical_rect(&app);
+    let scale = overlay_scale_factor(&app);
+    let content_w: u32 = (336.0 * scale).round() as u32;
+    let content_h: u32 = (86.0 * scale).round() as u32;
+    let margin: i32 = (14.0 * scale).round() as i32;
+    let gutter = overlay_shadow_gutter_physical(&app);
+    let w = content_w + gutter * 2;
+    let h = content_h + gutter * 2;
+    let x = (mx + margin - gutter as i32).max(mx);
+    let y = (my + mh as i32 - h as i32 - margin).max(my);
+    dlog!("[clips-tray] finalizing target size {}x{} physical", w, h);
+    #[allow(unused_mut)]
+    let mut builder =
+        WebviewWindowBuilder::new(&app, FINALIZING_LABEL, build_overlay_url("finalizing"))
+            .title("Finalizing")
+            .decorations(false)
+            .transparent(true)
+            .always_on_top(true)
+            .skip_taskbar(true)
+            .resizable(false)
+            .shadow(false)
+            .visible(false)
+            // Don't steal focus — same rationale as the countdown overlay.
+            .focused(false);
+    // This window deliberately stays non-activating, but its Open and Dismiss
+    // controls must receive the activating click on macOS instead of requiring
+    // a second click after the window becomes key.
+    #[cfg(target_os = "macos")]
+    {
+        builder = builder.accept_first_mouse(true);
+    }
+    let win = builder.build().map_err(|e| {
+        eprintln!("[clips-tray] finalizing build failed: {}", e);
+        e.to_string()
+    })?;
+    let _ = win.set_size(tauri::Size::Physical(PhysicalSize::new(w, h)));
+    let _ = win.set_position(PhysicalPosition::new(x, y));
+    let _ = win.set_ignore_cursor_events(false);
     set_capture_excluded(&win);
     configure_overlay_behavior(&win);
-    let _ = win.show();
+    crate::util::show_without_activation(&win);
     dlog!("[clips-tray] finalizing shown");
     Ok(())
 }