@agent-native/core 0.76.10 → 0.76.11

package/corpus/templates/mail/app/components/email/InlineReplyComposer.tsx

@@ -36,7 +36,7 @@ import {
 } from "@/hooks/use-emails";
 import { useAliases } from "@/hooks/use-aliases";
 import { expandAliasTokens } from "@/lib/alias-utils";
-import { useAgentChatGenerating } from "@agent-native/core/client";
+import { useAgentChatGenerating, useT } from "@agent-native/core/client";
 import { toast } from "sonner";
 import type { ComposeState, EmailMessage } from "@shared/types";
 import {
@@ -89,6 +89,7 @@ export const InlineReplyComposer = forwardRef<
   },
   ref,
 ) {
+  const t = useT();
   const [showQuoted, setShowQuoted] = useState(false);
   const [generateOpen, setGenerateOpen] = useState(false);
   const [generatePrompt, setGeneratePrompt] = useState("");
@@ -452,7 +453,7 @@ export const InlineReplyComposer = forwardRef<
         <>
           <div className="flex items-center justify-between px-4 pt-3 pb-1">
             <span className="text-[13px] font-semibold text-green-400">
-              Forward
+              {t("mail.compose.forward")}
             </span>
             <Tooltip>
               <TooltipTrigger asChild>
@@ -463,7 +464,7 @@ export const InlineReplyComposer = forwardRef<
                   <IconExternalLink className="h-3.5 w-3.5" />
                 </button>
               </TooltipTrigger>
-              <TooltipContent>Pop out to compose window</TooltipContent>
+              <TooltipContent>{t("mail.compose.popOut")}</TooltipContent>
             </Tooltip>
           </div>
           {recipientFields}
@@ -473,10 +474,10 @@ export const InlineReplyComposer = forwardRef<
           <div className="flex items-center justify-between px-4 pt-3 pb-1">
             <div className="flex items-center gap-1.5 min-w-0">
               <span className="text-[13px] font-semibold text-green-400">
-                Reply
+                {t("mail.compose.reply")}
               </span>
               <span className="text-[13px] text-muted-foreground/70 truncate">
-                to {recipientDisplay}
+                {t("mail.compose.replyTo", { recipient: recipientDisplay })}
               </span>
             </div>
             <Tooltip>
@@ -488,7 +489,7 @@ export const InlineReplyComposer = forwardRef<
                   <IconExternalLink className="h-3.5 w-3.5" />
                 </button>
               </TooltipTrigger>
-              <TooltipContent>Pop out to compose window</TooltipContent>
+              <TooltipContent>{t("mail.compose.popOut")}</TooltipContent>
             </Tooltip>
           </div>
           {recipientFields}
@@ -540,7 +541,11 @@ export const InlineReplyComposer = forwardRef<
           <>
             <button
               type="button"
-              aria-label={showQuoted ? "Hide quoted text" : "Show quoted text"}
+              aria-label={
+                showQuoted
+                  ? t("mail.thread.hideQuotedText")
+                  : t("mail.thread.showQuotedText")
+              }
               onClick={() => setShowQuoted(!showQuoted)}
               className="mt-1 inline-flex h-6 w-6 items-center justify-center rounded text-muted-foreground/50 transition-colors hover:bg-accent hover:text-muted-foreground"
             >
@@ -577,7 +582,7 @@ export const InlineReplyComposer = forwardRef<
                 <IconBold className="h-3.5 w-3.5" />
               </Button>
             </TooltipTrigger>
-            <TooltipContent>Bold</TooltipContent>
+            <TooltipContent>{t("mail.compose.bold")}</TooltipContent>
           </Tooltip>
           <Tooltip>
             <TooltipTrigger asChild>
@@ -590,7 +595,7 @@ export const InlineReplyComposer = forwardRef<
                 <IconItalic className="h-3.5 w-3.5" />
               </Button>
             </TooltipTrigger>
-            <TooltipContent>Italic</TooltipContent>
+            <TooltipContent>{t("mail.compose.italic")}</TooltipContent>
           </Tooltip>
           <Tooltip>
             <TooltipTrigger asChild>
@@ -603,7 +608,7 @@ export const InlineReplyComposer = forwardRef<
                 <IconLink className="h-3.5 w-3.5" />
               </Button>
             </TooltipTrigger>
-            <TooltipContent>Insert link</TooltipContent>
+            <TooltipContent>{t("mail.compose.insertLink")}</TooltipContent>
           </Tooltip>
           <Tooltip>
             <TooltipTrigger asChild>
@@ -616,7 +621,7 @@ export const InlineReplyComposer = forwardRef<
                 <IconPaperclip className="h-3.5 w-3.5" />
               </Button>
             </TooltipTrigger>
-            <TooltipContent>Attach file</TooltipContent>
+            <TooltipContent>{t("mail.compose.attachFile")}</TooltipContent>
           </Tooltip>
 
           <div className="mx-1 h-4 w-px bg-border" />
@@ -624,7 +629,7 @@ export const InlineReplyComposer = forwardRef<
           {isGenerating ? (
             <div className="flex items-center gap-1.5 px-2 text-xs text-muted-foreground">
               <IconLoader2 className="h-3.5 w-3.5 animate-spin" />
-              <span>Generating…</span>
+              <span>{t("mail.compose.generating")}</span>
             </div>
           ) : (
             <Popover open={generateOpen} onOpenChange={setGenerateOpen}>
@@ -634,13 +639,13 @@ export const InlineReplyComposer = forwardRef<
                   size="sm"
                   className="h-7 gap-1.5 px-2 text-xs"
                 >
-                  Generate
+                  {t("mail.compose.generate")}
                 </Button>
               </PopoverTrigger>
               <PopoverContent side="top" align="start" className="w-80 p-3">
                 <div className="flex flex-col gap-2">
                   <label className="text-xs font-medium text-muted-foreground">
-                    What should the agent write?
+                    {t("mail.compose.agentPromptLabel")}
                   </label>
                   <textarea
                     value={generatePrompt}
@@ -655,13 +660,14 @@ export const InlineReplyComposer = forwardRef<
                         setGenerateOpen(false);
                       }
                     }}
-                    placeholder="e.g. Write a polite follow-up..."
+                    placeholder={t("mail.compose.agentPromptPlaceholder")}
                     className="min-h-[60px] w-full resize-none rounded-md border bg-transparent px-3 py-2 text-sm outline-none placeholder:text-muted-foreground focus:ring-1 focus:ring-ring"
                     autoFocus
                   />
                   <div className="flex items-center justify-between">
                     <span className="text-[10px] text-muted-foreground">
-                      <kbd className="kbd-hint">↵</kbd> to submit
+                      <kbd className="kbd-hint">↵</kbd>{" "}
+                      {t("mail.compose.toSubmit")}
                     </span>
                     <Button
                       size="sm"
@@ -669,7 +675,7 @@ export const InlineReplyComposer = forwardRef<
                       disabled={!generatePrompt.trim()}
                       className="h-7 gap-1.5 px-3 text-xs"
                     >
-                      Generate
+                      {t("mail.compose.generate")}
                     </Button>
                   </div>
                 </div>
@@ -690,7 +696,7 @@ export const InlineReplyComposer = forwardRef<
                 <IconTrash className="h-3.5 w-3.5" />
               </Button>
             </TooltipTrigger>
-            <TooltipContent>Discard draft</TooltipContent>
+            <TooltipContent>{t("mail.compose.discardDraft")}</TooltipContent>
           </Tooltip>
           <Button
             size="sm"
@@ -699,7 +705,7 @@ export const InlineReplyComposer = forwardRef<
             className="gap-1.5"
           >
             <IconSend className="h-3.5 w-3.5" />
-            Send
+            {t("mail.compose.send")}
           </Button>
         </div>
       </div>

package/corpus/templates/mail/app/components/email/IntegrationsSidebar.tsx

@@ -19,7 +19,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
 } from "@/components/ui/dropdown-menu";
-import { useSendToAgentChat } from "@agent-native/core/client";
+import { useSendToAgentChat, useT } from "@agent-native/core/client";
 import { ExtensionSlot } from "@agent-native/core/client/extensions";
 import {
   useIntegration,
@@ -330,6 +330,7 @@ function IntegrationSetup() {
 }
 
 function AddIntegrationButton() {
+  const t = useT();
   const [open, setOpen] = useState(false);
   const [value, setValue] = useState("");
   const textareaRef = useRef<HTMLTextAreaElement>(null);
@@ -365,7 +366,7 @@ function AddIntegrationButton() {
             <div className="h-7 w-7 rounded-md border border-dashed border-border/40 flex items-center justify-center shrink-0">
               <IconPlus className="h-3 w-3" />
             </div>
-            <span>Add integration</span>
+            <span>{t("mail.integrations.addIntegration")}</span>
           </button>
         </PopoverTrigger>
         <PopoverContent
@@ -377,7 +378,7 @@ function AddIntegrationButton() {
         >
           <div className="px-3.5 pt-3 pb-1.5">
             <span className="text-[12px] font-medium text-foreground/80">
-              New integration
+              {t("mail.integrations.newIntegration")}
             </span>
           </div>
 
@@ -397,7 +398,7 @@ function AddIntegrationButton() {
                   handleSubmit();
                 }
               }}
-              placeholder="e.g. Salesforce CRM — show deal stage and recent activity for the contact"
+              placeholder={t("mail.integrations.newIntegrationPlaceholder")}
               className="w-full bg-transparent text-[12px] text-foreground/90 placeholder:text-muted-foreground/30 outline-none resize-none"
               rows={3}
               style={{ maxHeight: "200px" }}
@@ -407,7 +408,7 @@ function AddIntegrationButton() {
           <div className="px-3.5 py-2 flex items-center justify-end gap-2 border-t border-border/30">
             <span className="text-[11px] text-muted-foreground/60">
               {/Mac|iPhone|iPad/.test(navigator.userAgent) ? "⌘" : "Ctrl"}
-              +Enter to submit
+              +Enter {t("mail.compose.toSubmit")}
             </span>
             <Tooltip>
               <TooltipTrigger asChild>
@@ -420,12 +421,16 @@ function AddIntegrationButton() {
                       ? "bg-primary hover:bg-primary/90 text-primary-foreground"
                       : "bg-muted/50 text-muted-foreground/30 cursor-not-allowed",
                   )}
-                  aria-label="Submit"
+                  aria-label={t("mail.integrations.submit")}
                 >
                   <IconArrowUp className="w-4 h-4" />
                 </button>
               </TooltipTrigger>
-              <TooltipContent>{`Submit (${/Mac|iPhone|iPad/.test(navigator.userAgent) ? "⌘" : "Ctrl"}+Enter)`}</TooltipContent>
+              <TooltipContent>
+                {t("mail.integrations.submitShortcut", {
+                  shortcut: `${/Mac|iPhone|iPad/.test(navigator.userAgent) ? "⌘" : "Ctrl"}+Enter`,
+                })}
+              </TooltipContent>
             </Tooltip>
           </div>
         </PopoverContent>
@@ -443,6 +448,7 @@ function IntegrationRow({
   connected: boolean;
   onConfigure: () => void;
 }) {
+  const t = useT();
   const { disconnect } = useIntegration(def.id);
 
   return (
@@ -470,20 +476,20 @@ function IntegrationRow({
                   </button>
                 </DropdownMenuTrigger>
               </TooltipTrigger>
-              <TooltipContent>Settings</TooltipContent>
+              <TooltipContent>{t("mail.toolbar.settings")}</TooltipContent>
             </Tooltip>
             <DropdownMenuContent align="end" className="w-36">
               <DropdownMenuItem
                 onClick={() => onConfigure()}
                 className="text-[12px] text-foreground/70"
               >
-                Update key
+                {t("mail.integrations.updateKey")}
               </DropdownMenuItem>
               <DropdownMenuItem
                 onClick={() => disconnect.mutate()}
                 className="text-[12px] text-red-400/80"
               >
-                Disconnect
+                {t("mail.integrations.disconnect")}
               </DropdownMenuItem>
             </DropdownMenuContent>
           </DropdownMenu>
@@ -493,7 +499,7 @@ function IntegrationRow({
           onClick={onConfigure}
           className="shrink-0 text-[11px] text-primary hover:text-primary/90 font-medium transition-colors"
         >
-          Connect
+          {t("mail.integrations.connect")}
         </button>
       )}
     </div>
@@ -507,6 +513,7 @@ function IntegrationKeyEntry({
   def: IntegrationDef;
   onBack: () => void;
 }) {
+  const t = useT();
   const [apiKey, setApiKey] = useState("");
   const { connect } = useIntegration(def.id);
   const errorMessage =
@@ -550,7 +557,9 @@ function IntegrationKeyEntry({
           disabled={!apiKey.trim() || connect.isPending}
           className="shrink-0 rounded-md bg-primary px-2.5 py-1 text-[11px] font-medium text-primary-foreground hover:bg-primary/90 disabled:opacity-50 transition-colors"
         >
-          {connect.isPending ? "Checking..." : "Save"}
+          {connect.isPending
+            ? t("mail.integrations.checking")
+            : t("mail.integrations.save")}
         </button>
       </div>
 
@@ -561,7 +570,7 @@ function IntegrationKeyEntry({
       {/* Instructions always visible */}
       <div className="rounded-md bg-accent/30 px-2.5 py-2">
         <p className="text-[11px] text-muted-foreground/70 mb-1.5">
-          To get your API key:
+          {t("mail.integrations.getApiKey")}
         </p>
         <ol className="text-[11px] text-muted-foreground/50 space-y-0.5 list-decimal ps-3 mb-1.5">
           {def.helpSteps.map((step, i) => (
@@ -574,7 +583,10 @@ function IntegrationKeyEntry({
           rel="noopener noreferrer"
           className="text-[11px] text-primary/80 hover:text-primary hover:underline transition-colors"
         >
-          Open {def.name} Settings &rarr;
+          {t("mail.integrations.openProviderSettings", {
+            provider: def.name,
+          })}{" "}
+          &rarr;
         </a>
       </div>
     </div>
@@ -817,7 +829,7 @@ function ApolloSection({ email }: { email: string }) {
                 rel="noopener noreferrer"
                 className="text-[11px] text-muted-foreground/60 hover:text-foreground transition-colors"
               >
-                LinkedIn
+                LinkedIn{/* i18n-ignore */}
               </a>
             )}
             {safeExternalHref(person.twitter_url) && (
@@ -837,7 +849,7 @@ function ApolloSection({ email }: { email: string }) {
                 rel="noopener noreferrer"
                 className="text-[11px] text-muted-foreground/60 hover:text-foreground transition-colors"
               >
-                GitHub
+                GitHub{/* i18n-ignore */}
               </a>
             )}
             {safeExternalHref(person.organization?.website_url) && (
@@ -932,7 +944,10 @@ function HubSpotSection({ email }: { email: string }) {
     <>
       <div className="h-px bg-border/30 mx-4" />
       <div className="px-4 py-3">
-        <SectionHeader logo={INTEGRATIONS[1].logo} label="HubSpot" />
+        <SectionHeader
+          logo={INTEGRATIONS[1].logo}
+          label={"HubSpot" /* i18n-ignore */}
+        />
 
         {name && (
           <p className="text-[12px] text-foreground/80 font-medium">{name}</p>

package/corpus/templates/mail/app/components/email/RecipientInput.tsx

@@ -37,6 +37,7 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
+import { useT } from "@agent-native/core/client";
 
 /** Which header field a RecipientInput represents — used for cross-field drag. */
 export type RecipientField = "to" | "cc" | "bcc";
@@ -144,6 +145,7 @@ function AliasPopover({
   onClose,
   onExpand,
 }: AliasPopoverProps) {
+  const t = useT();
   const navigate = useNavigate();
   const panelRef = useRef<HTMLDivElement>(null);
   const [pos, setPos] = useState({ top: 0, left: 0 });
@@ -194,7 +196,9 @@ function AliasPopover({
           {alias.name}
         </span>
         <span className="rounded-full bg-indigo-500/15 px-2 py-0.5 text-[11px] font-medium text-indigo-300">
-          {alias.emails.length} recipients
+          {t("mail.recipients.recipientCount", {
+            count: alias.emails.length,
+          })}
         </span>
         <Tooltip>
           <TooltipTrigger asChild>
@@ -206,7 +210,7 @@ function AliasPopover({
               <IconPencil className="size-3.5" />
             </button>
           </TooltipTrigger>
-          <TooltipContent>Edit alias</TooltipContent>
+          <TooltipContent>{t("mail.recipients.editAlias")}</TooltipContent>
         </Tooltip>
         <Tooltip>
           <TooltipTrigger asChild>
@@ -218,7 +222,9 @@ function AliasPopover({
               <IconArrowsDiagonal className="size-3.5" />
             </button>
           </TooltipTrigger>
-          <TooltipContent>Expand to individual emails</TooltipContent>
+          <TooltipContent>
+            {t("mail.recipients.expandToIndividualEmails")}
+          </TooltipContent>
         </Tooltip>
       </div>
       {/* Email list */}
@@ -250,6 +256,7 @@ interface SaveAliasModalProps {
 }
 
 function SaveAliasModal({ emails, onClose }: SaveAliasModalProps) {
+  const t = useT();
   const [name, setName] = useState("");
   const createAlias = useCreateAlias();
 
@@ -263,9 +270,13 @@ function SaveAliasModal({ emails, onClose }: SaveAliasModalProps) {
     <Dialog open onOpenChange={(open) => !open && onClose()}>
       <DialogContent className="max-w-sm">
         <DialogHeader>
-          <DialogTitle className="text-[14px]">Save as alias</DialogTitle>
+          <DialogTitle className="text-[14px]">
+            {t("mail.recipients.saveAsAlias")}
+          </DialogTitle>
           <DialogDescription className="text-[12px]">
-            Create a reusable group of {emails.length} recipients
+            {t("mail.recipients.createReusableGroup", {
+              count: emails.length,
+            })}
           </DialogDescription>
         </DialogHeader>
         <Input
@@ -277,7 +288,7 @@ function SaveAliasModal({ emails, onClose }: SaveAliasModalProps) {
             if (e.key === "Enter") handleSave();
             e.stopPropagation();
           }}
-          placeholder="Alias name"
+          placeholder={t("mail.recipients.aliasName")}
         />
         <DialogFooter>
           <button
@@ -285,7 +296,7 @@ function SaveAliasModal({ emails, onClose }: SaveAliasModalProps) {
             onClick={onClose}
             className="rounded-lg px-3 py-1.5 text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground"
           >
-            Cancel
+            {t("mail.compose.cancel")}
           </button>
           <button
             type="button"
@@ -293,7 +304,9 @@ function SaveAliasModal({ emails, onClose }: SaveAliasModalProps) {
             disabled={!name.trim() || createAlias.isPending}
             className="rounded-lg bg-indigo-600 px-3 py-1.5 text-[13px] font-medium text-white hover:opacity-90 disabled:opacity-40"
           >
-            {createAlias.isPending ? "Saving…" : "Save"}
+            {createAlias.isPending
+              ? t("mail.recipients.saving")
+              : t("mail.integrations.save")}
           </button>
         </DialogFooter>
       </DialogContent>
@@ -311,6 +324,7 @@ export function RecipientInput({
   field,
   onMoveRecipient,
 }: RecipientInputProps) {
+  const t = useT();
   const [inputValue, setInputValue] = useState("");
   const [showSuggestions, setShowSuggestions] = useState(false);
   const [selectedIndex, setSelectedIndex] = useState(0);
@@ -611,7 +625,9 @@ export function RecipientInput({
                     {alias.name}
                   </span>
                   <span className="shrink-0 text-[11px] text-indigo-400/70">
-                    {alias.emails.length} people
+                    {t("mail.recipients.peopleCount", {
+                      count: alias.emails.length,
+                    })}
                   </span>
                 </button>
               ))}
@@ -765,7 +781,7 @@ export function RecipientInput({
             className="flex items-center gap-1 rounded-md px-1.5 py-0.5 text-[11px] text-muted-foreground/35 transition-colors hover:text-muted-foreground/60"
           >
             <IconPlus className="size-3" />
-            Save as alias
+            {t("mail.recipients.saveAsAlias")}
           </button>
         )}
       </div>

package/corpus/templates/mail/app/components/email/SendLaterButton.tsx

@@ -6,6 +6,7 @@ import {
 } from "@/components/ui/popover";
 import { Button } from "@/components/ui/button";
 import { IconSend, IconChevronDown, IconCalendar } from "@tabler/icons-react";
+import { useT } from "@agent-native/core/client";
 
 interface SendLaterButtonProps {
   onSend: () => void;
@@ -54,6 +55,7 @@ export function SendLaterButton({
   disabled,
   isSending,
 }: SendLaterButtonProps) {
+  const t = useT();
   const [open, setOpen] = useState(false);
   const presets = getPresets();
   const dateInputRef = useRef<HTMLInputElement>(null);
@@ -73,7 +75,7 @@ export function SendLaterButton({
         onClick={onSend}
       >
         <IconSend className="h-3.5 w-3.5 mr-1.5" />
-        {isSending ? "Sending..." : "Send"}
+        {isSending ? t("mail.compose.sending") : t("mail.compose.send")}
       </Button>
       <Popover open={open} onOpenChange={setOpen}>
         <PopoverTrigger asChild>
@@ -89,7 +91,7 @@ export function SendLaterButton({
         <PopoverContent className="w-64 p-3" align="end" side="top">
           <div className="space-y-2">
             <div className="text-xs font-medium text-muted-foreground uppercase tracking-wide">
-              Schedule send
+              {t("mail.sendLater.scheduleSend")}
             </div>
             <div className="space-y-1">
               {presets.map((preset) => (
@@ -112,7 +114,7 @@ export function SendLaterButton({
                   className="w-full flex items-center gap-2 px-2.5 py-2 rounded-md hover:bg-accent hover:text-accent-foreground transition-colors text-sm text-muted-foreground"
                 >
                   <IconCalendar className="h-4 w-4" />
-                  Pick date &amp; time...
+                  {t("mail.sendLater.pickDateTime")}
                 </button>
                 <input
                   ref={dateInputRef}

package/corpus/templates/mail/app/components/email/SnoozeModal.tsx

@@ -5,6 +5,7 @@ import { useParseDate, useSnoozeEmail } from "@/hooks/use-scheduled-jobs";
 import { toast } from "sonner";
 import { Dialog, DialogContent } from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
+import { useT } from "@agent-native/core/client";
 
 interface SnoozeModalProps {
   open: boolean;
@@ -103,6 +104,7 @@ export function SnoozeModal({
   onClose,
   onSnoozed,
 }: SnoozeModalProps) {
+  const t = useT();
   const [nlInput, setNlInput] = useState("");
   const [selectedIndex, setSelectedIndex] = useState(0);
   const [parsedDate, setParsedDate] = useState<Date | null>(null);
@@ -274,7 +276,7 @@ export function SnoozeModal({
             type="text"
             value={nlInput}
             onChange={(e) => setNlInput(e.target.value)}
-            placeholder="Try: 8 am, 3 days, aug 7"
+            placeholder={t("mail.snooze.modalPlaceholder")}
             className="h-11 border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 focus-visible:ring-offset-0"
           />
           {nlTyping && (nlParsed || parseDate.isPending) && (
@@ -287,7 +289,7 @@ export function SnoozeModal({
         {/* Options list */}
         <div className="max-h-[300px] overflow-y-auto overflow-x-hidden p-1">
           <div className="px-2 py-1.5 text-xs font-medium text-muted-foreground">
-            Snooze until
+            {t("mail.snooze.snoozeUntil")}
           </div>
           {options.map((opt, i) => {
             const active = i === selectedIndex;

package/corpus/templates/mail/app/components/email/SnoozePopover.tsx

@@ -9,6 +9,7 @@ import { cn } from "@/lib/utils";
 import { useParseDate, useSnoozeEmail } from "@/hooks/use-scheduled-jobs";
 import { IconAlarm } from "@tabler/icons-react";
 import { toast } from "sonner";
+import { useT } from "@agent-native/core/client";
 
 interface SnoozePopoverProps {
   emailId: string;
@@ -68,6 +69,7 @@ export function SnoozePopover({
   onArchive,
   children,
 }: SnoozePopoverProps) {
+  const t = useT();
   const [open, setOpen] = useState(false);
   const [nlInput, setNlInput] = useState("");
   const [selectedDate, setSelectedDate] = useState<Date | null>(null);
@@ -140,7 +142,7 @@ export function SnoozePopover({
       <PopoverContent className="w-72 p-3" align="end">
         <div className="space-y-3">
           <div className="text-xs font-medium text-muted-foreground uppercase tracking-wide">
-            Snooze until
+            {t("mail.snooze.snoozeUntil")}
           </div>
 
           {/* Preset chips */}
@@ -171,17 +173,17 @@ export function SnoozePopover({
               type="text"
               value={nlInput}
               onChange={(e) => setNlInput(e.target.value)}
-              placeholder="or try: friday 5pm, in 2 weeks..."
+              placeholder={t("mail.snooze.tryPlaceholder")}
               className="w-full text-xs px-2.5 py-1.5 rounded-md border border-input bg-background placeholder:text-muted-foreground/60 focus:outline-none focus:ring-1 focus:ring-ring/30"
             />
             {nlInput && displayDate && (
               <div className="text-[11px] px-1 text-muted-foreground">
-                Snooze until {displayDate}
+                {t("mail.snooze.snoozeUntilDate", { date: displayDate })}
               </div>
             )}
             {nlInput && !displayDate && parseDate.isPending && (
               <div className="text-[11px] px-1 text-muted-foreground">
-                Parsing...
+                {t("mail.snooze.parsing")}
               </div>
             )}
           </div>
@@ -194,7 +196,9 @@ export function SnoozePopover({
             onClick={handleSnooze}
           >
             <IconAlarm className="h-3.5 w-3.5 mr-1.5" />
-            {snoozeEmail.isPending ? "Snoozing..." : "Snooze"}
+            {snoozeEmail.isPending
+              ? t("mail.snooze.snoozing")
+              : t("mail.snooze.snooze")}
             {displayDate && !snoozeEmail.isPending && (
               <span className="ml-1 opacity-60 truncate max-w-[120px]">
                 · {displayDate}

package/corpus/templates/mail/app/components/email/extensions/ComposeImageBlock.tsx

@@ -2,6 +2,7 @@ import { NodeViewWrapper, type NodeViewProps } from "@tiptap/react";
 import { useState, useCallback } from "react";
 import { IconPhoto, IconLoader2, IconX } from "@tabler/icons-react";
 import { openFilePicker, uploadFile } from "@/lib/upload";
+import { useT } from "@agent-native/core/client";
 
 export function ComposeImageBlock({
   node,
@@ -9,6 +10,7 @@ export function ComposeImageBlock({
   deleteNode,
   selected,
 }: NodeViewProps) {
+  const t = useT();
   const [isUploading, setIsUploading] = useState(false);
   const [isHovered, setIsHovered] = useState(false);
   const src = node.attrs.src as string;
@@ -40,12 +42,12 @@ export function ComposeImageBlock({
           {isUploading ? (
             <>
               <IconLoader2 size={20} className="animate-spin" />
-              <span>Uploading...</span>
+              <span>{t("mail.compose.uploading")}</span>
             </>
           ) : (
             <>
               <IconPhoto size={20} />
-              <span>Add an image</span>
+              <span>{t("mail.compose.addImage")}</span>
             </>
           )}
         </div>