@agent-native/core 0.100.2 → 0.101.3

package/corpus/templates/assets/app/routes/library.tsx

@@ -37,7 +37,14 @@ import {
   IconX,
 } from "@tabler/icons-react";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+  type ReactNode,
+} from "react";
 import {
   Link,
   useSearchParams,
@@ -1094,26 +1101,55 @@ function LibraryKitSelector({
   );
 }
 
-function AllAssetsBrowser() {
+function AllAssetsBrowser({
+  foldersByLibraryId = {},
+}: {
+  foldersByLibraryId?: Record<string, any[]>;
+}) {
   const t = useT();
   const navigate = useNavigate();
-  const [query, setQuery] = useState("");
-  const [assetTab, setAssetTab] = useState<AssetTab>("all");
+  const queryClient = useQueryClient();
+  const [searchParams, setSearchParams] = useSearchParams();
+  const searchParamsKey = searchParams.toString();
+  // The root Library view keeps its tab/search in the URL so deep links,
+  // refreshes, and agent `navigate` commands are honored (the framework's
+  // useNavigationState reads the same `?tab=`/`?q=` params). Absent a tab param,
+  // default to Drafts.
+  const urlAssetTab = useMemo<AssetTab>(() => {
+    const tab = new URLSearchParams(searchParamsKey).get("tab");
+    return tab === "drafts" || tab === "generated" || tab === "references"
+      ? tab
+      : "drafts";
+  }, [searchParamsKey]);
+  const urlQuery = useMemo(
+    () => new URLSearchParams(searchParamsKey).get("q") ?? "",
+    [searchParamsKey],
+  );
+  const [query, setQuery] = useState(urlQuery);
+  const [assetTab, setAssetTab] = useState<AssetTab>(urlAssetTab);
   const [previewAsset, setPreviewAsset] = useState<Asset | null>(null);
   const [standaloneSelection, setStandaloneSelection] = useState<ReturnType<
     typeof assetPayload
   > | null>(null);
   const [standaloneCopyOk, setStandaloneCopyOk] = useState(false);
 
+  const isDraftsTab = assetTab === "drafts";
+
+  // The Drafts tab renders its own candidate queries via LibraryCandidateStage,
+  // so skip the cross-library asset scan while it is the active tab.
   const {
     data: assetData,
     isLoading,
     isError,
     isFetching,
     refetch,
-  } = useActionQuery("list-assets", {
-    query: query.trim() || undefined,
-  } as any) as {
+  } = useActionQuery(
+    "list-assets",
+    {
+      query: query.trim() || undefined,
+    } as any,
+    { enabled: !isDraftsTab } as any,
+  ) as {
     data?: { assets?: Asset[] };
     isLoading: boolean;
     isError: boolean;
@@ -1127,11 +1163,11 @@ function AllAssetsBrowser() {
     [allAssets, assetTab],
   );
   const visibleAssetCount = assets.length;
+  // The badge only renders on the Generated/References tabs, which are always a
+  // filtered subset, so report the shown count rather than the library total.
   const assetCountLabel = isLoading
     ? t("library.loading")
-    : query.trim() || assetTab !== "all"
-      ? t("library.shownCount", { count: visibleAssetCount })
-      : t("library.assetCount", { count: allAssets.length });
+    : t("library.shownCount", { count: visibleAssetCount });
   const standaloneSelectionText = useMemo(
     () =>
       standaloneSelection
@@ -1166,6 +1202,57 @@ function AllAssetsBrowser() {
     void copyStandaloneSelection(payload);
   }
 
+  // Keep local state in sync when the URL changes externally (back/forward,
+  // agent navigation, deep links) since the component stays mounted.
+  useEffect(() => {
+    setAssetTab(urlAssetTab);
+  }, [urlAssetTab]);
+  useEffect(() => {
+    setQuery(urlQuery);
+  }, [urlQuery]);
+
+  const handleAssetTabChange = useCallback(
+    (value: AssetTab) => {
+      setAssetTab(value);
+      setSearchParams(
+        (prev) => {
+          const next = new URLSearchParams(prev);
+          // Drafts is the default, so keep it out of the URL for clean links.
+          if (value === "drafts") next.delete("tab");
+          else next.set("tab", value);
+          return next;
+        },
+        { replace: true },
+      );
+    },
+    [setSearchParams],
+  );
+
+  const handleQueryChange = useCallback(
+    (value: string) => {
+      setQuery(value);
+      setSearchParams(
+        (prev) => {
+          const next = new URLSearchParams(prev);
+          if (value.trim()) next.set("q", value);
+          else next.delete("q");
+          return next;
+        },
+        { replace: true },
+      );
+    },
+    [setSearchParams],
+  );
+
+  // The Drafts tab's candidate queries live inside LibraryCandidateStage;
+  // refetch them by key so the error state offers a working retry.
+  const retryDrafts = useCallback(() => {
+    void queryClient.refetchQueries({
+      queryKey: ["app-state", assetVariantStateKey(null)],
+    });
+    void queryClient.refetchQueries({ queryKey: ["action", "list-assets"] });
+  }, [queryClient]);
+
   return (
     <div className="flex min-w-0 flex-col">
       <div className="border-b border-border px-4 py-3 md:px-6">
@@ -1173,10 +1260,10 @@ function AllAssetsBrowser() {
           <div className="flex min-w-0 items-center gap-2">
             <Tabs
               value={assetTab}
-              onValueChange={(value) => setAssetTab(value as AssetTab)}
+              onValueChange={(value) => handleAssetTabChange(value as AssetTab)}
             >
               <TabsList className="h-9">
-                <TabsTrigger value="all">{t("library.tabsAll")}</TabsTrigger>
+                <TabsTrigger value="drafts">{t("library.drafts")}</TabsTrigger>
                 <TabsTrigger value="generated">
                   {t("library.generated")}
                 </TabsTrigger>
@@ -1185,24 +1272,30 @@ function AllAssetsBrowser() {
                 </TabsTrigger>
               </TabsList>
             </Tabs>
-            <Badge
-              variant="secondary"
-              className="h-6 max-w-full rounded-full px-2 text-xs"
-            >
-              {assetCountLabel}
-            </Badge>
-          </div>
-          <div className="flex h-9 min-w-0 flex-1 items-center gap-2 rounded-md border border-border/70 bg-background px-3 focus-within:ring-1 focus-within:ring-ring sm:max-w-sm">
-            <IconSearch className="h-4 w-4 shrink-0 text-muted-foreground" />
-            <input
-              type="search"
-              value={query}
-              onInput={(event) => setQuery(event.currentTarget.value)}
-              onChange={(event) => setQuery(event.target.value)}
-              placeholder={t("library.searchAssets")}
-              className="h-full min-w-0 flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground"
-            />
+            {!isDraftsTab && (
+              <Badge
+                variant="secondary"
+                className="h-6 max-w-full rounded-full px-2 text-xs"
+              >
+                {assetCountLabel}
+              </Badge>
+            )}
           </div>
+          {!isDraftsTab && (
+            <div className="flex h-9 min-w-0 flex-1 items-center gap-2 rounded-md border border-border/70 bg-background px-3 focus-within:ring-1 focus-within:ring-ring sm:max-w-sm">
+              <IconSearch className="h-4 w-4 shrink-0 text-muted-foreground" />
+              <input
+                type="search"
+                value={query}
+                onInput={(event) =>
+                  handleQueryChange(event.currentTarget.value)
+                }
+                onChange={(event) => handleQueryChange(event.target.value)}
+                placeholder={t("library.searchAssets")}
+                className="h-full min-w-0 flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground"
+              />
+            </div>
+          )}
         </div>
       </div>
 
@@ -1278,7 +1371,31 @@ function AllAssetsBrowser() {
       )}
 
       <main className="p-4 md:p-6">
-        {isLoading ? (
+        {isDraftsTab ? (
+          <LibraryCandidateStage
+            activeLibraryId={null}
+            foldersByLibraryId={foldersByLibraryId}
+            inline
+            emptyState={
+              <div className="flex min-h-64 items-center justify-center text-center">
+                <div className="max-w-sm text-sm text-muted-foreground">
+                  {t("library.noDrafts")}
+                </div>
+              </div>
+            }
+            errorState={
+              <div className="flex min-h-64 flex-col items-center justify-center gap-3 px-6 text-center">
+                <IconAlertTriangle className="size-9 text-destructive" />
+                <p className="max-w-sm text-sm text-muted-foreground">
+                  {t("audit.unknownError")}
+                </p>
+                <Button size="sm" variant="outline" onClick={retryDrafts}>
+                  {t("brandKitDetail.refresh")}
+                </Button>
+              </div>
+            }
+          />
+        ) : isLoading ? (
           <div className="assets-library-grid grid grid-cols-2 gap-4">
             {Array.from({ length: 12 }).map((_, index) => (
               <Skeleton key={index} className="aspect-[4/3] rounded-lg" />
@@ -1593,12 +1710,16 @@ function LibraryCandidateStage({
   variantScopeId = null,
   onUseAsset,
   inline = false,
+  emptyState = null,
+  errorState = null,
 }: {
   activeLibraryId?: string | null;
   foldersByLibraryId?: Record<string, any[]>;
   variantScopeId?: string | null;
   onUseAsset?: (asset: Asset) => void;
   inline?: boolean;
+  emptyState?: ReactNode;
+  errorState?: ReactNode;
 }) {
   const t = useT();
   const queryClient = useQueryClient();
@@ -1608,7 +1729,11 @@ function LibraryCandidateStage({
   const [promotingReferenceKeys, setPromotingReferenceKeys] = useState<
     Set<string>
   >(() => new Set());
-  const { data: variants } = useQuery({
+  const {
+    data: variants,
+    isLoading: variantsLoading,
+    isError: variantsError,
+  } = useQuery({
     queryKey: ["app-state", assetVariantStateKey(variantScopeId)],
     queryFn: ({ signal }) => {
       return readClientAppState<AssetVariantState>(
@@ -1626,11 +1751,15 @@ function LibraryCandidateStage({
     { id: activeLibraryId ?? "" } as any,
     { enabled: Boolean(activeLibraryId) } as any,
   ) as { data?: { library?: Library; assets?: Asset[]; folders?: any[] } };
-  const { data: allCandidateData } = useActionQuery(
+  const {
+    data: allCandidateData,
+    isLoading: allCandidatesLoading,
+    isError: allCandidatesError,
+  } = useActionQuery(
     "list-assets",
     { includeCandidates: true, status: "candidate" } as any,
     { enabled: isAllAssetsStage } as any,
-  ) as { data?: { assets?: Asset[] } };
+  ) as { data?: { assets?: Asset[] }; isLoading: boolean; isError: boolean };
   const saveGenerated = useActionMutation("save-generated-image");
   const updateAsset = useActionMutation("update-asset");
   const libraryAssets = isAllAssetsStage
@@ -1675,10 +1804,20 @@ function LibraryCandidateStage({
     [libraryAssets, liveAssetIds],
   );
   const totalCount = slots.length + draftAssets.length;
-
-  if (totalCount === 0) return null;
+  // Don't flash the empty state before the candidate sources have resolved, and
+  // don't misreport a load failure as "no drafts".
+  const candidatesLoading =
+    variantsLoading || (isAllAssetsStage && allCandidatesLoading);
+  const candidatesError =
+    variantsError || (isAllAssetsStage && allCandidatesError);
+
+  if (totalCount === 0) {
+    if (candidatesLoading) return null;
+    if (candidatesError) return errorState ? <>{errorState}</> : null;
+    return emptyState ? <>{emptyState}</> : null;
+  }
   const stageLibraryId = liveLibraryId ?? draftAssets[0]?.libraryId ?? null;
-  if (!stageLibraryId) return null;
+  if (!stageLibraryId) return emptyState ? <>{emptyState}</> : null;
 
   function invalidateStage(
     libraryIdToInvalidate: string | null = stageLibraryId,
@@ -1982,22 +2121,22 @@ export function LibraryWorkspace({
               </Button>
             </div>
           ) : routeSelectedLibraryId || hasLibraries ? (
-            <>
-              <LibraryCandidateStage
-                activeLibraryId={routeSelectedLibraryId}
-                foldersByLibraryId={foldersByLibraryId}
-              />
-              <div className="min-w-0">
-                {routeSelectedLibraryId ? (
+            <div className="min-w-0">
+              {routeSelectedLibraryId ? (
+                <>
+                  <LibraryCandidateStage
+                    activeLibraryId={routeSelectedLibraryId}
+                    foldersByLibraryId={foldersByLibraryId}
+                  />
                   <BrandKitDetailRoute
                     libraryId={routeSelectedLibraryId}
                     headerMode="actions"
                   />
-                ) : (
-                  <AllAssetsBrowser />
-                )}
-              </div>
-            </>
+                </>
+              ) : (
+                <AllAssetsBrowser foldersByLibraryId={foldersByLibraryId} />
+              )}
+            </div>
           ) : (
             <EmptyLibraryStarter onCreateBlank={() => setCreateOpen(true)} />
           )}

package/corpus/templates/assets/changelog/2026-07-13-merged-the-candidates-panel-into-the-library-as-a-drafts-tab.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-13
+---
+
+Merged the Candidates panel into the Library as a Drafts tab that opens by default

package/corpus/templates/chat/app/lib/agent-page.tsx

@@ -0,0 +1,40 @@
+import type { ComponentType } from "react";
+
+export type AgentPageProps = {
+  appName?: string;
+};
+
+type AgentClientModule = {
+  AgentChatSurface: ComponentType<{
+    mode?: "panel" | "page";
+    className?: string;
+  }>;
+  AgentTabsPage?: ComponentType<AgentPageProps>;
+};
+
+const legacyAgentPages = new WeakMap<
+  AgentClientModule,
+  ComponentType<AgentPageProps>
+>();
+
+/**
+ * Keep the chat scaffold runnable when its template and core package are
+ * briefly out of sync during a release. Older core versions do not export
+ * AgentTabsPage, but they do expose the page-level chat surface.
+ */
+export function resolveAgentPageComponent(
+  client: AgentClientModule,
+): ComponentType<AgentPageProps> {
+  if (typeof client.AgentTabsPage === "function") {
+    return client.AgentTabsPage;
+  }
+
+  const existing = legacyAgentPages.get(client);
+  if (existing) return existing;
+
+  const legacyAgentPage = function LegacyAgentPage() {
+    return <client.AgentChatSurface mode="page" className="h-full" />;
+  };
+  legacyAgentPages.set(client, legacyAgentPage);
+  return legacyAgentPage;
+}

package/corpus/templates/chat/app/routes/agent.tsx

@@ -1,6 +1,7 @@
-import { AgentTabsPage, useT } from "@agent-native/core/client";
+import * as AgentClient from "@agent-native/core/client";
 import { useSetPageTitle } from "@agent-native/toolkit/app-shell";
 
+import { resolveAgentPageComponent } from "@/lib/agent-page";
 import { APP_TITLE } from "@/lib/app-config";
 
 export function meta() {
@@ -8,8 +9,9 @@ export function meta() {
 }
 
 export default function AgentRoute() {
-  const t = useT();
+  const t = AgentClient.useT();
   useSetPageTitle(t("settings.agentTitle"));
 
-  return <AgentTabsPage appName={APP_TITLE} />;
+  const AgentPage = resolveAgentPageComponent(AgentClient);
+  return <AgentPage appName={APP_TITLE} />;
 }

package/corpus/templates/chat/changelog/2026-07-14-fixed-chat-template-startup-with-older-core-versions.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-07-14
+---
+
+Fixed chat template startup with older core versions

package/corpus/templates/clips/.agents/skills/ai-video-tools/SKILL.md

@@ -131,6 +131,11 @@ Transcription takes an audio file and returns text + segments. That's not a prom
 2. **Cloud fallback — Builder.io managed (Gemini).** When a Builder account is connected (`BUILDER_PRIVATE_KEY` or per-user OAuth, no separate API key needed), `request-transcript` calls `transcribeWithBuilder()`, which routes audio to Builder.io's managed Gemini transcription. Returns text plus timestamped segments. Retry a failed transcript with `force: true`; pass `regenerate: true` to replace an existing ready transcript from the stored recording media. Regeneration keeps the prior ready transcript available if the new provider attempt fails.
 3. **Cloud fallback — Groq Whisper.** `GROQ_API_KEY` → `https://api.groq.com/openai/v1/audio/transcriptions`, model `whisper-large-v3-turbo`. Fast (~$0.04/hour of audio) Whisper-compatible speech-to-text used when Builder is unavailable.
 
+The transcript included by `view-screen` is only a bounded preview. When its
+`previewTruncated` field is true, the preview may end mid-sentence and does not
+show where transcription ended. Call `get-recording-player-data` before
+judging completeness or quoting the full transcript.
+
 Clips never routes recording/meeting audio to OpenAI for transcription. (Groq's endpoint is OpenAI-_compatible_ in request shape only — the audio goes to Groq, not OpenAI.)
 
 If no native transcript exists and no cloud fallback is available (no Builder connection and no Groq key), the action writes `status="failed"` so the UI can show a friendly prompt.

package/corpus/templates/clips/AGENTS.md

@@ -43,6 +43,10 @@ Detailed media, meeting, dictation, editing, and sharing rules live in
   transcript. Pass `--regenerate=true` to replace an existing ready transcript
   from the stored recording media; if regeneration fails, keep the prior ready
   transcript available.
+- The transcript embedded by `view-screen` is a bounded preview. If
+  `previewTruncated` is true, it may end mid-sentence and does not show where
+  transcription ended. Call `get-recording-player-data` before judging
+  completeness or quoting the full transcript.
 - Dictation cleanup, Clip title/cleanup, and meeting summaries should pass
   bounded `voiceContext` to the shared cleanup/transcription path when active
   app context, learned vocabulary, user notes, or AGENTS.md preferences are

package/corpus/templates/clips/actions/get-feature-flags.ts

@@ -0,0 +1,30 @@
+/**
+ * Read global, server-controlled feature flags (e.g. desktop capture
+ * pipeline toggles) so they can change without a redeploy. The desktop app
+ * polls this using the same session cookie/bearer token it already sends to
+ * other actions (e.g. `list-meetings`).
+ *
+ * Usage:
+ *   pnpm action get-feature-flags
+ */
+
+import { defineAction } from "@agent-native/core";
+import { getSetting } from "@agent-native/core/settings";
+import { z } from "zod";
+
+import {
+  FEATURE_FLAGS_KEY,
+  withFeatureFlagDefaults,
+} from "../shared/feature-flags.js";
+
+export default defineAction({
+  description:
+    "Get global server-controlled feature flags (e.g. desktop capture pipeline toggles). Returns defaults for any flag never explicitly set.",
+  schema: z.object({}),
+  http: { method: "GET" },
+  readOnly: true,
+  run: async () => {
+    const stored = await getSetting(FEATURE_FLAGS_KEY);
+    return withFeatureFlagDefaults(stored);
+  },
+});

package/corpus/templates/clips/actions/lib/transcript-preview.ts

@@ -0,0 +1,48 @@
+export const TRANSCRIPT_PREVIEW_CHARS = 2_000;
+
+export interface TranscriptPreview {
+  recordingId: string;
+  language: string | null | undefined;
+  status: string | null | undefined;
+  fullTextSnippet: string;
+  fullTextLength: number;
+  previewTruncated: boolean;
+  omittedCharacterCount: number;
+  segmentCount: number;
+  note: string;
+}
+
+export function buildTranscriptPreview({
+  recordingId,
+  language,
+  status,
+  fullText,
+  segments,
+}: {
+  recordingId: string;
+  language: string | null | undefined;
+  status: string | null | undefined;
+  fullText: string | null | undefined;
+  segments: unknown;
+}): TranscriptPreview {
+  const text = fullText ?? "";
+  const previewTruncated = text.length > TRANSCRIPT_PREVIEW_CHARS;
+  const omittedCharacterCount = Math.max(
+    0,
+    text.length - TRANSCRIPT_PREVIEW_CHARS,
+  );
+
+  return {
+    recordingId,
+    language,
+    status,
+    fullTextSnippet: text.slice(0, TRANSCRIPT_PREVIEW_CHARS),
+    fullTextLength: text.length,
+    previewTruncated,
+    omittedCharacterCount,
+    segmentCount: Array.isArray(segments) ? segments.length : 0,
+    note: previewTruncated
+      ? `Bounded preview only: showing the first ${TRANSCRIPT_PREVIEW_CHARS.toLocaleString()} of ${text.length.toLocaleString()} characters. It may end mid-sentence; do not infer that the transcript is incomplete. Call get-recording-player-data for the complete transcript and segments.`
+      : "The complete transcript fits in this snapshot.",
+  };
+}

package/corpus/templates/clips/actions/request-transcript.ts

@@ -33,6 +33,7 @@
  */
 
 import { defineAction } from "@agent-native/core";
+import type { ActionRunContext } from "@agent-native/core/action";
 import {
   readAppState,
   writeAppState,
@@ -1054,10 +1055,49 @@ const requestTranscriptAction = defineAction({
         "Internal — set only by the bounded automatic retry scheduler after a transient failure (ffmpeg timeout, transient provider error). Do not set this when calling request-transcript manually or from the agent; omitting it means the retry budget never applies to this call.",
       ),
   }),
-  run: async (args) => {
+  run: async (args, context?: ActionRunContext) => {
     await assertAccess("recording", args.recordingId, "editor");
 
     const db = getDb();
+
+    if (context?.caller === "tool") {
+      const [existingTranscript] = await db
+        .select({
+          status: schema.recordingTranscripts.status,
+          updatedAt: schema.recordingTranscripts.updatedAt,
+        })
+        .from(schema.recordingTranscripts)
+        .where(eq(schema.recordingTranscripts.recordingId, args.recordingId))
+        .limit(1);
+      if (
+        existingTranscript &&
+        isRecentlyPendingTranscript(existingTranscript)
+      ) {
+        console.log(
+          `[clips] Transcript already pending for ${args.recordingId}; skipping duplicate agent request.`,
+        );
+        return {
+          recordingId: args.recordingId,
+          status: "pending" as const,
+          skipped: true,
+          reason: "already-pending",
+        };
+      }
+
+      await dispatchPostFinalizeJob({
+        recordingId: args.recordingId,
+        kind: "transcript",
+        ...(args.regenerate ? { regenerate: true } : {}),
+      });
+      return {
+        recordingId: args.recordingId,
+        status: "pending" as const,
+        queued: true,
+        regenerate: Boolean(args.regenerate),
+        provider: "background" as const,
+      };
+    }
+
     const ownerEmail = getCurrentOwnerEmail();
     const now = new Date().toISOString();
 

package/corpus/templates/clips/actions/view-screen.ts

@@ -38,6 +38,7 @@ import {
   parseSpaceIds,
 } from "../server/lib/recordings.js";
 import { parseBrowserDiagnosticsRow } from "../shared/browser-diagnostics.js";
+import { buildTranscriptPreview } from "./lib/transcript-preview.js";
 
 interface NavigationState {
   view?: string;
@@ -540,18 +541,13 @@ export default defineAction({
               // and is injected into <current-screen> on EVERY message, which
               // can blow the model's context window. The agent calls
               // get-recording-player-data for the complete transcript/segments.
-              const segmentCount = Array.isArray(transcript.segments)
-                ? transcript.segments.length
-                : 0;
-              screen.transcript = {
+              screen.transcript = buildTranscriptPreview({
                 recordingId: transcript.recordingId,
                 language: transcript.language,
                 status: transcript.status,
-                fullTextSnippet: (transcript.fullText ?? "").slice(0, 2000),
-                fullTextLength: (transcript.fullText ?? "").length,
-                segmentCount,
-                note: "Snippet only. Call get-recording-player-data for the full transcript and segments.",
-              };
+                fullText: transcript.fullText,
+                segments: transcript.segments,
+              });
             }
             screen.comments = comments.slice(0, 50);
             if (browserDiagnosticsSummary) {

package/corpus/templates/clips/app/components/library/library-layout.tsx

@@ -524,7 +524,7 @@ export function LibraryLayout({ children }: LibraryLayoutProps) {
           <>
             <div className="shrink-0 space-y-1.5 px-2 py-1.5">
               {shouldShowSidebarLink && (
-                <CaptureInstallInlineLink className="flex items-center gap-2 rounded px-2 py-1.5 text-xs text-foreground hover:bg-accent/60">
+                <CaptureInstallInlineLink className="flex w-full items-center gap-2 rounded px-2 py-1.5 text-xs text-foreground hover:bg-accent/60">
                   <IconAppWindow className="h-4 w-4" />
                   {t("navigation.desktopCta")}
                 </CaptureInstallInlineLink>