@agent-native/core 0.77.3 → 0.77.4

package/corpus/templates/mail/app/routes/$.tsx

@@ -1,7 +1,8 @@
+import messages from "@/i18n/en-US";
 import { NotFound } from "@/pages/NotFound";
 
 export function meta() {
-  return [{ title: "Not Found - Mail" }];
+  return [{ title: messages.mail.routeTitles.notFound }];
 }
 
 export default function CatchAllRoute() {

package/corpus/templates/mail/app/routes/draft-queue.$id.tsx

@@ -1,7 +1,8 @@
+import messages from "@/i18n/en-US";
 import { DraftQueuePage } from "@/pages/DraftQueuePage";
 
 export function meta() {
-  return [{ title: "Draft Queue — Mail" }];
+  return [{ title: messages.mail.routeTitles.draftQueue }];
 }
 
 export default function DraftQueueDetailRoute() {

package/corpus/templates/mail/app/routes/draft-queue.tsx

@@ -1,7 +1,8 @@
+import messages from "@/i18n/en-US";
 import { DraftQueuePage } from "@/pages/DraftQueuePage";
 
 export function meta() {
-  return [{ title: "Draft Queue — Mail" }];
+  return [{ title: messages.mail.routeTitles.draftQueue }];
 }
 
 export default function DraftQueueRoute() {

package/corpus/templates/mail/app/routes/email.tsx

@@ -1,4 +1,4 @@
-import { postNavigate, isInAgentEmbed } from "@agent-native/core/client";
+import { postNavigate, isInAgentEmbed, useT } from "@agent-native/core/client";
 import type { EmailMessage } from "@shared/types";
 import { IconExternalLink } from "@tabler/icons-react";
 import { useMemo } from "react";
@@ -7,11 +7,12 @@ import { useSearchParams } from "react-router";
 import { Button } from "@/components/ui/button";
 import { Skeleton } from "@/components/ui/skeleton";
 import { useThreadMessages } from "@/hooks/use-emails";
+import messages from "@/i18n/en-US";
 import { sanitizeHtml } from "@/lib/sanitize-html";
 import { formatEmailDate, formatEmailDateFull, cn } from "@/lib/utils";
 
 export function meta() {
-  return [{ title: "Email" }];
+  return [{ title: messages.mail.routeTitles.emailThread }];
 }
 
 // ─── Message Card ────────────────────────────────────────────────────────────
@@ -68,11 +69,12 @@ function MessageCard({ message }: { message: EmailMessage }) {
 // ─── Error State ─────────────────────────────────────────────────────────────
 
 function ErrorState({ message }: { message: string }) {
+  const t = useT();
   return (
     <div className="flex h-full w-full items-center justify-center p-6">
       <div className="text-center max-w-sm">
         <div className="text-sm font-medium text-foreground mb-1">
-          Unable to load thread
+          {t("mail.routeTitles.unableToLoadThread")}
         </div>
         <div className="text-xs text-muted-foreground">{message}</div>
       </div>
@@ -106,6 +108,7 @@ function LoadingSkeleton() {
 // ─── Route ────────────────────────────────────────────────────────────────────
 
 export default function EmailEmbedRoute() {
+  const t = useT();
   const [params] = useSearchParams();
   const threadId = params.get("threadId");
   const view = params.get("view") ?? "inbox";
@@ -116,7 +119,7 @@ export default function EmailEmbedRoute() {
   );
 
   if (!threadId) {
-    return <ErrorState message="No thread ID provided." />;
+    return <ErrorState message={t("mail.routeTitles.unableToLoadThread")} />;
   }
 
   const subject =
@@ -133,7 +136,7 @@ export default function EmailEmbedRoute() {
             <Skeleton className="h-4 w-48" />
           ) : (
             <h1 className="text-[13px] font-semibold text-muted-foreground">
-              Email thread
+              {t("mail.routeTitles.emailThread")}
             </h1>
           )}
         </div>
@@ -145,7 +148,7 @@ export default function EmailEmbedRoute() {
             onClick={() => postNavigate(`/${view}/${threadId}`)}
           >
             <IconExternalLink className="h-3.5 w-3.5" />
-            Open in app
+            {t("mail.routeTitles.openInApp")}
           </Button>
         )}
       </header>
@@ -155,7 +158,7 @@ export default function EmailEmbedRoute() {
         {isLoading && !messages ? (
           <LoadingSkeleton />
         ) : !messages || messages.length === 0 ? (
-          <ErrorState message="Thread not found or has no messages." />
+          <ErrorState message={t("mail.routeTitles.unableToLoadThread")} />
         ) : (
           <div>
             {messages.map((msg) => (

package/corpus/templates/mail/app/routes/settings.tsx

@@ -1,7 +1,8 @@
+import messages from "@/i18n/en-US";
 import { SettingsPage } from "@/pages/SettingsPage";
 
 export function meta() {
-  return [{ title: "Settings — Mail" }];
+  return [{ title: messages.mail.routeTitles.settings }];
 }
 
 export default function SettingsRoute() {

package/corpus/templates/mail/app/routes/team.tsx

@@ -1,7 +1,8 @@
+import messages from "@/i18n/en-US";
 import Team from "@/pages/Team";
 
 export function meta() {
-  return [{ title: "Team — Mail" }];
+  return [{ title: messages.mail.routeTitles.team }];
 }
 
 export default function TeamRoute() {

package/corpus/templates/plan/app/components/editor/PlanDocumentEditor.tsx

@@ -9,6 +9,7 @@ import {
   RunId,
   SharedRichEditor,
   generateTabId,
+  useT,
   useCollaborativeDoc,
   type DragHandleDropContext,
   type DragHandleOptions,
@@ -775,6 +776,7 @@ export function PlanDocumentEditor({
   /** Forwarded to question-form and legacy visual-questions blocks. */
   onVisualQuestionsSubmit?: (summary: string) => void;
 }) {
+  const t = useT();
   const registryValue = useOptionalBlockRegistry();
   const registry = registryValue?.registry ?? null;
 
@@ -1066,9 +1068,9 @@ export function PlanDocumentEditor({
   const slashItems = useMemo(
     () =>
       registry
-        ? buildPlanSlashCommands(registry, { notionCompatibleOnly })
+        ? buildPlanSlashCommands(registry, { notionCompatibleOnly, t })
         : undefined,
-    [registry, notionCompatibleOnly],
+    [registry, notionCompatibleOnly, t],
   );
 
   // The reconcile value space is the AUTHORITATIVE blocks JSON — sourced from the
@@ -1432,6 +1434,7 @@ export function NestedPlanBlocksEditor({
   regionLabel?: string;
   compactVisuals?: boolean;
 }) {
+  const t = useT();
   const registryValue = useOptionalBlockRegistry();
   const registry = registryValue?.registry ?? null;
   const rootRef = useRef<HTMLDivElement | null>(null);
@@ -1499,9 +1502,9 @@ export function NestedPlanBlocksEditor({
   const slashItems = useMemo(
     () =>
       registry
-        ? buildPlanSlashCommands(registry, { notionCompatibleOnly })
+        ? buildPlanSlashCommands(registry, { notionCompatibleOnly, t })
         : undefined,
-    [registry, notionCompatibleOnly],
+    [registry, notionCompatibleOnly, t],
   );
 
   const value = useMemo(() => JSON.stringify(sourceBlocks), [sourceBlocks]);

package/corpus/templates/plan/app/components/editor/planSlashCommands.ts

@@ -51,82 +51,104 @@ type TableChain = {
  */
 export function buildPlanSlashCommands(
   registry: BlockRegistry,
-  options: { notionCompatibleOnly?: boolean } = {},
+  options: {
+    notionCompatibleOnly?: boolean;
+    t?: (key: string) => string;
+  } = {},
 ): SlashCommandItem[] {
+  const label = (key: string, fallback: string) => options.t?.(key) ?? fallback;
   const proseCommands: SlashCommandItem[] = [
     {
-      title: "Text",
-      description: "Plain text paragraph",
+      title: label("editor.slash.text.title", "Text"),
+      description: label(
+        "editor.slash.text.description",
+        "Plain text paragraph",
+      ),
       icon: "T",
       action: (editor: SlashEditor) =>
         editor.chain().focus().setParagraph().run(),
     },
     {
-      title: "Heading 1",
-      description: "Large heading",
+      title: label("editor.slash.heading1.title", "Heading 1"),
+      description: label("editor.slash.heading1.description", "Large heading"),
       icon: "H1",
       action: (editor: SlashEditor) =>
         editor.chain().focus().toggleHeading({ level: 1 }).run(),
     },
     {
-      title: "Heading 2",
-      description: "Section heading",
+      title: label("editor.slash.heading2.title", "Heading 2"),
+      description: label(
+        "editor.slash.heading2.description",
+        "Section heading",
+      ),
       icon: "H2",
       action: (editor: SlashEditor) =>
         editor.chain().focus().toggleHeading({ level: 2 }).run(),
     },
     {
-      title: "Heading 3",
-      description: "Subheading",
+      title: label("editor.slash.heading3.title", "Heading 3"),
+      description: label("editor.slash.heading3.description", "Subheading"),
       icon: "H3",
       action: (editor: SlashEditor) =>
         editor.chain().focus().toggleHeading({ level: 3 }).run(),
     },
     {
-      title: "Bulleted list",
-      description: "Unordered list",
+      title: label("editor.slash.bulletedList.title", "Bulleted list"),
+      description: label(
+        "editor.slash.bulletedList.description",
+        "Unordered list",
+      ),
       icon: "-",
       action: (editor: SlashEditor) =>
         editor.chain().focus().toggleBulletList().run(),
     },
     {
-      title: "Numbered list",
-      description: "Ordered list",
+      title: label("editor.slash.numberedList.title", "Numbered list"),
+      description: label(
+        "editor.slash.numberedList.description",
+        "Ordered list",
+      ),
       icon: "1.",
       action: (editor: SlashEditor) =>
         editor.chain().focus().toggleOrderedList().run(),
     },
     {
-      title: "To-do list",
-      description: "Checklist items",
+      title: label("editor.slash.todoList.title", "To-do list"),
+      description: label(
+        "editor.slash.todoList.description",
+        "Checklist items",
+      ),
       icon: "[]",
       action: (editor: SlashEditor) =>
         editor.chain().focus().toggleTaskList().run(),
     },
     {
-      title: "Quote",
-      description: "Block quote",
+      title: label("editor.slash.quote.title", "Quote"),
+      description: label("editor.slash.quote.description", "Block quote"),
       icon: '"',
       action: (editor: SlashEditor) =>
         editor.chain().focus().toggleBlockquote().run(),
     },
     {
-      title: "Code block",
-      description: "Code snippet",
+      title: label("editor.slash.codeBlock.title", "Code block"),
+      description: label("editor.slash.codeBlock.description", "Code snippet"),
       icon: "<>",
       action: (editor: SlashEditor) =>
         editor.chain().focus().toggleCodeBlock().run(),
     },
     {
-      title: "Divider",
-      description: "Horizontal rule",
+      title: label("editor.slash.divider.title", "Divider"),
+      description: label("editor.slash.divider.description", "Horizontal rule"),
       icon: "—",
       action: (editor: SlashEditor) =>
         editor.chain().focus().setHorizontalRule().run(),
     },
     {
-      title: "Table",
-      description: "Three by three table",
+      title: label("editor.slash.table.title", "Table"),
+      description: label(
+        "editor.slash.table.description",
+        "Three by three table",
+      ),
       icon: "tbl",
       action: (editor: SlashEditor) =>
         (editor.chain().focus() as unknown as TableChain)
@@ -134,8 +156,8 @@ export function buildPlanSlashCommands(
           .run(),
     },
     {
-      title: "Image",
-      description: "Insert an image",
+      title: label("editor.slash.image.title", "Image"),
+      description: label("editor.slash.image.description", "Insert an image"),
       icon: "img",
       action: (editor: SlashEditor) =>
         editor
@@ -158,7 +180,10 @@ export function buildPlanSlashCommands(
     notionCompatibleOnly: options.notionCompatibleOnly,
     isNotionCompatible: (spec) => isNotionCompatibleBlockType(spec.type),
     toItem: (spec, insert) => ({
-      title: spec.type === "table" ? "Structured table" : spec.label,
+      title:
+        spec.type === "table"
+          ? label("editor.slash.structuredTable.title", "Structured table")
+          : spec.label,
       description: getRegistryBlockSlashDescription(spec),
       searchText: getRegistryBlockSlashSearchText(spec),
       icon: spec.label.slice(0, 3),

package/corpus/templates/plan/app/components/layout/Sidebar.tsx

@@ -236,7 +236,7 @@ function PlanChatsSection({ collapsed }: { collapsed: boolean }) {
       threadId === activeThreadId || threadId === persistedActiveThreadId();
     const archived = await archiveThread(threadId);
     if (!archived) {
-      toast.error("Could not archive chat.");
+      toast.error(t("raw.sidebar.archiveChatFailed"));
       return;
     }
     if (wasActive) {
@@ -266,7 +266,7 @@ function PlanChatsSection({ collapsed }: { collapsed: boolean }) {
     setRenameDraft("");
     if (title) {
       const renamed = await renameThread(threadId, title);
-      if (!renamed) toast.error("Could not rename chat.");
+      if (!renamed) toast.error(t("raw.sidebar.renameChatFailed"));
     }
     committingRenameRef.current = false;
   }

package/corpus/templates/plan/app/components/plan/CanvasArea.tsx

@@ -1,3 +1,4 @@
+import { useT } from "@agent-native/core/client";
 import type {
   PlanAnnotation,
   PlanAnnotationPlacement,
@@ -118,6 +119,7 @@ export function CanvasArea({
   selectedDesignElementKey?: string | null;
   onDesignElementSelect?: (selection: DesignElementSelection) => void;
 }) {
+  const t = useT();
   const viewportRef = useRef<HTMLDivElement | null>(null);
   const initialView = useMemo<CanvasView>(
     () => ({
@@ -641,7 +643,7 @@ export function CanvasArea({
   return (
     <section
       className="plan-canvas relative h-[65vh] overflow-hidden border-b border-plan-line"
-      aria-label="Plan artboard canvas"
+      aria-label={t("raw.canvas.artboardCanvas")}
     >
       <div
         ref={viewportRef}
@@ -829,7 +831,7 @@ export function CanvasArea({
           size="icon"
           className="size-6"
           onClick={() => zoomByFactor(1 / 1.2)}
-          aria-label="Zoom out"
+          aria-label={t("raw.canvas.zoomOut")}
         >
           <IconMinus className="size-3" />
         </Button>
@@ -842,7 +844,7 @@ export function CanvasArea({
           size="icon"
           className="size-6"
           onClick={() => zoomByFactor(1.2)}
-          aria-label="Zoom in"
+          aria-label={t("raw.canvas.zoomIn")}
         >
           <IconPlus className="size-3" />
         </Button>
@@ -1678,6 +1680,7 @@ function CanvasMarkupComposer({
   onCancel: () => void;
   onSubmit: (text: string) => Promise<void>;
 }) {
+  const t = useT();
   const [text, setText] = useState("");
   const [error, setError] = useState(false);
   const screenPoint = {
@@ -1738,7 +1741,7 @@ function CanvasMarkupComposer({
       </div>
       {error && (
         <p className="mt-2 px-1 text-xs text-destructive">
-          Couldn't save markup. Try again.
+          {t("raw.canvas.markupSaveFailed")}
         </p>
       )}
     </form>

package/corpus/templates/plan/app/components/plan/DocumentArea.tsx

@@ -6,6 +6,7 @@ import {
 } from "@agent-native/core/blocks";
 import {
   uploadEditorImage,
+  useT,
   type RichMarkdownCollabUser,
 } from "@agent-native/core/client";
 import { imageDataSchema, type PlanBlock } from "@shared/plan-content";
@@ -99,6 +100,7 @@ function UnknownBlockPlaceholder({
   originalType: string;
   errorSummary: string;
 }) {
+  const t = useT();
   return (
     <section
       className="plan-block"
@@ -112,13 +114,12 @@ function UnknownBlockPlaceholder({
             Invalid {originalType} block
           </div>
           <p className="mt-1 leading-5">
-            This generated block did not match the Plan schema, so it was left
-            out while the rest of the recap stayed visible.
+            {t("raw.document.invalidBlockDescription")}
           </p>
           {errorSummary && (
             <details className="mt-2">
               <summary className="cursor-pointer text-xs opacity-70 hover:opacity-90">
-                Validation details
+                {t("raw.document.validationDetails")}
               </summary>
               <pre className="mt-1 max-h-40 overflow-auto whitespace-pre-wrap break-words rounded border border-plan-line bg-plan-bg/60 p-2 font-mono text-xs opacity-80">
                 {errorSummary}
@@ -182,6 +183,7 @@ function PlanBlockViewInner({
   planId,
   collabUser,
 }: PlanBlockViewProps) {
+  const t = useT();
   const unknownBlock = parseUnknownBlockMarker(block);
   if (unknownBlock) {
     return (
@@ -811,6 +813,7 @@ function CustomHtmlBlock({
   block: Extract<PlanBlock, { type: "custom-html" }>;
   onChange?: (block: PlanBlock) => Promise<void> | void;
 }) {
+  const t = useT();
   const [editing, setEditing] = useState(false);
   const [html, setHtml] = useState(block.data.html);
   const [css, setCss] = useState(block.data.css ?? "");
@@ -867,13 +870,13 @@ function CustomHtmlBlock({
             value={html}
             onChange={(event) => setHtml(event.target.value)}
             className="min-h-48 font-mono text-sm"
-            placeholder="HTML fragment"
+            placeholder={t("raw.document.htmlFragment")}
           />
           <Textarea
             value={css}
             onChange={(event) => setCss(event.target.value)}
             className="min-h-32 font-mono text-sm"
-            placeholder="Optional CSS"
+            placeholder={t("raw.document.optionalCss")}
           />
           <div className="flex justify-end gap-2">
             <Button
@@ -1046,6 +1049,7 @@ function ImageBlock({
   editingDisabled?: boolean;
   planId?: string | null;
 }) {
+  const t = useT();
   const blockRegistry = useOptionalBlockRegistry();
   const ctx = blockRegistry?.ctx;
   const src = block.data.url ?? imageSrcForAsset(block.data.assetId);
@@ -1070,17 +1074,17 @@ function ImageBlock({
     setEditOpen(open);
   };
 
-  // Auto-focus the "Describe a change…" prompt once the edit popover mounts. The
+  // Auto-focus the block edit prompt once the edit popover mounts. The
   // popover portals out and the deferred/guarded open can race Radix's own
   // auto-focus, so focus it explicitly (a few retries to win the open animation).
   useEffect(() => {
     if (!editOpen) return;
-    const focusPrompt = () =>
-      document
-        .querySelector<HTMLTextAreaElement>(
-          ".an-block-edit-popover textarea[placeholder^='Describe a change']",
-        )
-        ?.focus();
+    const focusPrompt = () => {
+      const prompt = document.querySelector<HTMLTextAreaElement>( // i18n-ignore DOM selector, not UI copy
+        ".an-block-edit-popover textarea[data-plan-block-edit-prompt]",
+      );
+      prompt?.focus();
+    };
     const timers = [40, 140, 280].map((ms) =>
       window.setTimeout(focusPrompt, ms),
     );
@@ -1093,7 +1097,7 @@ function ImageBlock({
     const file = event.currentTarget.files?.[0];
     event.currentTarget.value = "";
     if (!file) return;
-    const toastId = toast.loading("Replacing image…");
+    const toastId = toast.loading(t("raw.document.replacingImage"));
     try {
       const { src: nextSrc, alt: nextAlt } = await uploadEditorImage(file);
       commitData({
@@ -1101,10 +1105,10 @@ function ImageBlock({
         url: nextSrc,
         alt: block.data.alt || nextAlt || "image",
       });
-      toast.success("Image replaced.", { id: toastId });
+      toast.success(t("raw.document.imageReplaced"), { id: toastId });
     } catch (error) {
       console.error("Image replace failed:", error);
-      toast.error("Could not replace the image.", { id: toastId });
+      toast.error(t("raw.document.replaceImageFailed"), { id: toastId });
     }
   }
 

package/corpus/templates/plan/app/components/plan/LocalCodebasePicker.tsx

@@ -1,4 +1,4 @@
-import { setClientAppState } from "@agent-native/core/client";
+import { setClientAppState, useT } from "@agent-native/core/client";
 import {
   IconAlertCircle,
   IconCircleCheck,
@@ -63,6 +63,7 @@ function statusClasses(kind: SyncState["kind"]) {
 }
 
 export function LocalCodebasePicker() {
+  const t = useT();
   const queryClient = useQueryClient();
   const supported = useMemo(supportsLocalCodebasePicker, []);
   const [active, setActive] = useState<RestoredLocalCodebase | null>(null);
@@ -156,9 +157,11 @@ export function LocalCodebasePicker() {
       await queryClient.invalidateQueries({ queryKey: ["resources"] });
       setSyncState({
         kind: "success",
-        message: `${fileCountLabel(nextSummary)} synced`,
+        message: t("raw.localCodebase.filesSynced", {
+          count: fileCountLabel(nextSummary),
+        }),
       });
-      toast.success("Codebase synced", {
+      toast.success(t("raw.localCodebase.codebaseSynced"), {
         description: `${selection.name} is ready for Ask Plan.`,
       });
     },
@@ -170,7 +173,7 @@ export function LocalCodebasePicker() {
     if (chosen.ok === false) {
       if (!chosen.canceled) {
         setSyncState({ kind: "error", message: chosen.error });
-        toast.error("Could not choose folder", {
+        toast.error(t("raw.localCodebase.chooseFolderFailed"), {
           description: chosen.error,
         });
       }
@@ -191,9 +194,13 @@ export function LocalCodebasePicker() {
       await syncSelection(selection);
     } catch (err) {
       const message =
-        err instanceof Error ? err.message : "Could not sync local codebase.";
+        err instanceof Error
+          ? err.message
+          : t("raw.localCodebase.syncLocalFailed");
       setSyncState({ kind: "error", message });
-      toast.error("Codebase sync failed", { description: message });
+      toast.error(t("raw.localCodebase.codebaseSyncFailed"), {
+        description: message,
+      });
     }
   }, [active, cleanupLocalResources, syncSelection]);
 
@@ -207,7 +214,7 @@ export function LocalCodebasePicker() {
     if (previous) {
       await cleanupLocalResources(previous);
     }
-    toast("Codebase unlinked");
+    toast(t("raw.localCodebase.codebaseUnlinked"));
   }, [active, cleanupLocalResources, syncAppState]);
 
   const resync = useCallback(async () => {
@@ -216,9 +223,13 @@ export function LocalCodebasePicker() {
       await syncSelection(active);
     } catch (err) {
       const message =
-        err instanceof Error ? err.message : "Could not sync local codebase.";
+        err instanceof Error
+          ? err.message
+          : t("raw.localCodebase.syncLocalFailed");
       setSyncState({ kind: "error", message });
-      toast.error("Codebase sync failed", { description: message });
+      toast.error(t("raw.localCodebase.codebaseSyncFailed"), {
+        description: message,
+      });
     }
   }, [active, syncSelection]);
 
@@ -235,11 +246,11 @@ export function LocalCodebasePicker() {
               disabled
             >
               <IconFolderOpen className="size-4" />
-              Choose codebase
+              {t("raw.localCodebase.chooseCodebase")}
             </Button>
           </TooltipTrigger>
           <TooltipContent>
-            Folder access is unavailable in this browser.
+            {t("raw.localCodebase.folderUnavailable")}
           </TooltipContent>
         </Tooltip>
       </TooltipProvider>
@@ -259,7 +270,7 @@ export function LocalCodebasePicker() {
         >
           <IconFolderOpen className="size-4 shrink-0" />
           <span className="truncate">
-            {summary ? summary.name : "Choose codebase"}
+            {summary ? summary.name : t("raw.localCodebase.chooseCodebase")}
           </span>
         </Button>
 
@@ -276,7 +287,9 @@ export function LocalCodebasePicker() {
                 </Badge>
               </TooltipTrigger>
               <TooltipContent>
-                Last synced {updatedLabel(summary)}
+                {t("raw.localCodebase.lastSynced", {
+                  date: updatedLabel(summary),
+                })}
               </TooltipContent>
             </Tooltip>
 
@@ -289,7 +302,7 @@ export function LocalCodebasePicker() {
                   className="size-8 rounded-md"
                   onClick={resync}
                   disabled={syncState.kind === "syncing"}
-                  aria-label="Sync codebase"
+                  aria-label={t("raw.localCodebase.syncCodebase")}
                 >
                   <IconRefresh
                     className={cn(
@@ -299,7 +312,9 @@ export function LocalCodebasePicker() {
                   />
                 </Button>
               </TooltipTrigger>
-              <TooltipContent>Sync codebase</TooltipContent>
+              <TooltipContent>
+                {t("raw.localCodebase.syncCodebase")}
+              </TooltipContent>
             </Tooltip>
 
             <Tooltip>
@@ -310,12 +325,14 @@ export function LocalCodebasePicker() {
                   size="icon"
                   className="size-8 rounded-md"
                   onClick={clearSelection}
-                  aria-label="Clear codebase"
+                  aria-label={t("raw.localCodebase.clearCodebase")}
                 >
                   <IconX className="size-4" />
                 </Button>
               </TooltipTrigger>
-              <TooltipContent>Clear codebase</TooltipContent>
+              <TooltipContent>
+                {t("raw.localCodebase.clearCodebase")}
+              </TooltipContent>
             </Tooltip>
           </>
         )}