@agent-native/core 0.77.3 → 0.77.4

package/corpus/templates/calendar/app/pages/BookingPage.tsx

@@ -2,6 +2,7 @@ import {
   OpenSourceBadge,
   PoweredByBadge,
   StarfieldBackground,
+  useT,
 } from "@agent-native/core/client";
 import type { Booking } from "@shared/api";
 import { IconCalendar } from "@tabler/icons-react";
@@ -64,6 +65,7 @@ function BookingPageShell({
 }
 
 export default function BookingPage() {
+  const t = useT();
   const { slug, username } = useParams<{ slug: string; username?: string }>();
   const navigate = useNavigate();
   const { data: settings, isLoading: settingsLoading } = usePublicSettings();
@@ -188,7 +190,9 @@ export default function BookingPage() {
         },
         onError: (error) =>
           toast.error(
-            error instanceof Error ? error.message : "Failed to create booking",
+            error instanceof Error
+              ? error.message
+              : t("bookingLinks.failedToCreateBooking"),
           ),
       },
     );
@@ -225,9 +229,9 @@ export default function BookingPage() {
     }
   }
 
-  const title = settings?.bookingPageTitle || "Book a Meeting";
+  const title = settings?.bookingPageTitle || t("bookingLinks.bookAMeeting");
   const description =
-    settings?.bookingPageDescription || "Pick a time that works for you.";
+    settings?.bookingPageDescription || t("bookingLinks.defaultDescription");
   const isLegacyBookingPage = !!slug && availability?.bookingPageSlug === slug;
   const pageTitle = bookingLink?.title || title;
   const pageDescription = bookingLink?.description || description;
@@ -260,9 +264,11 @@ export default function BookingPage() {
     return (
       <BookingPageShell>
         <div className="mx-auto mt-[7.5vh] w-full max-w-md rounded-2xl border border-border bg-card/95 p-8 text-center shadow-xl shadow-background/20 backdrop-blur">
-          <h1 className="text-xl font-semibold">Booking link not found</h1>
+          <h1 className="text-xl font-semibold">
+            {t("bookingLinks.bookingLinkNotFound")}
+          </h1>
           <p className="mt-2 text-sm text-muted-foreground">
-            This meeting type may have been removed or is no longer active.
+            {t("bookingLinks.meetingTypeUnavailable")}
           </p>
         </div>
       </BookingPageShell>
@@ -288,12 +294,14 @@ export default function BookingPage() {
             <div className="mt-3 flex flex-wrap justify-center gap-2">
               {!hasDurationChoice && (
                 <span className="inline-flex rounded-full border border-border px-3 py-1 text-xs font-medium text-muted-foreground">
-                  {duration} minute meeting
+                  {t("bookingLinks.minuteMeeting", { count: duration })}
                 </span>
               )}
               {requiredHostCount > 1 && (
                 <span className="inline-flex rounded-full border border-border px-3 py-1 text-xs font-medium text-muted-foreground">
-                  {requiredHostCount} required hosts
+                  {t("bookingLinks.requiredHostsCount", {
+                    count: requiredHostCount,
+                  })}
                 </span>
               )}
             </div>
@@ -312,11 +320,11 @@ export default function BookingPage() {
                 step,
               );
               const stepLabels: Record<Step, string> = {
-                duration: "duration selection",
-                date: "date selection",
-                time: "time selection",
-                info: "your information",
-                confirmed: "confirmation",
+                duration: t("bookingLinks.durationSelection"),
+                date: t("bookingLinks.dateSelection"),
+                time: t("bookingLinks.timeSelection"),
+                info: t("bookingLinks.yourInformation"),
+                confirmed: t("bookingLinks.confirmation"),
               };
               return (
                 <div className="mb-6 flex items-center justify-center gap-2">
@@ -347,7 +355,9 @@ export default function BookingPage() {
                             type="button"
                             onClick={() => handleStepNavigation(s)}
                             className={circleClass}
-                            aria-label={`Go to ${stepLabels[s]}`}
+                            aria-label={t("bookingLinks.goToStep", {
+                              step: stepLabels[s],
+                            })}
                           >
                             {i + 1}
                           </button>
@@ -367,7 +377,7 @@ export default function BookingPage() {
           {step === "duration" && durationOptions && (
             <div>
               <h3 className="mb-4 text-sm font-medium text-center">
-                Choose a Duration
+                {t("bookingLinks.chooseDuration")}
               </h3>
               <div className="grid gap-3">
                 {durationOptions.map((mins) => (
@@ -380,7 +390,9 @@ export default function BookingPage() {
                     }}
                     className="rounded-xl border border-border px-4 py-3 text-left hover:bg-accent/60 hover:border-primary/30"
                   >
-                    <p className="text-sm font-medium">{mins} minutes</p>
+                    <p className="text-sm font-medium">
+                      {t("bookingLinks.minutesLong", { count: mins })}
+                    </p>
                   </button>
                 ))}
               </div>
@@ -390,7 +402,7 @@ export default function BookingPage() {
           {step === "date" && availability && (
             <div>
               <h3 className="mb-4 text-sm font-medium text-center">
-                Select a Date
+                {t("bookingLinks.selectDate")}
               </h3>
               <div className="flex justify-center">
                 <DatePicker
@@ -409,14 +421,16 @@ export default function BookingPage() {
           {step === "time" && (
             <div>
               <div className="mb-4 flex items-center justify-between">
-                <h3 className="text-sm font-medium">Select a Time</h3>
+                <h3 className="text-sm font-medium">
+                  {t("bookingLinks.selectTime")}
+                </h3>
                 <Button
                   variant="link"
                   size="sm"
                   className={BRAND_LINK_CLASS}
                   onClick={() => setStep("date")}
                 >
-                  Change date
+                  {t("bookingLinks.changeDate")}
                 </Button>
               </div>
               {selectedDate && (
@@ -436,20 +450,22 @@ export default function BookingPage() {
           {step === "info" && (
             <div>
               <div className="mb-4 flex items-center justify-between">
-                <h3 className="text-sm font-medium">Your Information</h3>
+                <h3 className="text-sm font-medium">
+                  {t("bookingLinks.yourInformation")}
+                </h3>
                 <Button
                   variant="link"
                   size="sm"
                   className={BRAND_LINK_CLASS}
                   onClick={() => setStep("time")}
                 >
-                  Change time
+                  {t("bookingLinks.changeTime")}
                 </Button>
               </div>
               {selectedSlotRange && (
                 <div className="mb-4 rounded-lg border border-border bg-muted/30 px-3 py-2 text-sm">
                   <div className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
-                    Confirming
+                    {t("bookingLinks.confirming")}
                   </div>
                   <div className="mt-1 font-medium text-foreground">
                     {format(parseISO(selectedSlotRange.start), "EEEE, MMMM d")}

package/corpus/templates/calendar/app/pages/BookingsList.tsx

@@ -1,4 +1,5 @@
-import type { Booking, BookingLink, CustomField } from "@shared/api";
+import { useT } from "@agent-native/core/client";
+import type { Booking, CustomField } from "@shared/api";
 import { IconCircleX } from "@tabler/icons-react";
 import { format, parseISO } from "date-fns";
 import { useMemo, useState } from "react";
@@ -33,10 +34,9 @@ import { useBookings, useDeleteBooking } from "@/hooks/use-bookings";
 type FilterStatus = "all" | "confirmed" | "cancelled";
 
 export default function BookingsList() {
-  const { data: bookingsData } = useBookings();
-  const { data: bookingLinksData } = useBookingLinks();
-  const bookings: Booking[] = bookingsData ?? [];
-  const bookingLinks: BookingLink[] = bookingLinksData ?? [];
+  const t = useT();
+  const { data: bookings = [] } = useBookings();
+  const { data: bookingLinks = [] } = useBookingLinks();
   const deleteBooking = useDeleteBooking();
   const [filter, setFilter] = useState<FilterStatus>("all");
 
@@ -56,8 +56,8 @@ export default function BookingsList() {
 
   function handleCancel(booking: Booking) {
     deleteBooking.mutate(booking.id, {
-      onSuccess: () => toast.success("Booking cancelled"),
-      onError: () => toast.error("Failed to cancel booking"),
+      onSuccess: () => toast.success(t("bookingLinks.bookingCancelled")),
+      onError: () => toast.error(t("bookingLinks.failedToCancelBooking")),
     });
   }
 
@@ -65,33 +65,39 @@ export default function BookingsList() {
     <div className="space-y-6">
       <Tabs value={filter} onValueChange={(v) => setFilter(v as FilterStatus)}>
         <TabsList>
-          <TabsTrigger value="all">All ({bookings.length})</TabsTrigger>
+          <TabsTrigger value="all">
+            {t("bookingLinks.allCount", { count: bookings.length })}
+          </TabsTrigger>
           <TabsTrigger value="confirmed">
-            Confirmed ({bookings.filter((b) => b.status === "confirmed").length}
-            )
+            {t("bookingLinks.confirmedCount", {
+              count: bookings.filter((b) => b.status === "confirmed").length,
+            })}
           </TabsTrigger>
           <TabsTrigger value="cancelled">
-            Cancelled ({bookings.filter((b) => b.status === "cancelled").length}
-            )
+            {t("bookingLinks.cancelledCount", {
+              count: bookings.filter((b) => b.status === "cancelled").length,
+            })}
           </TabsTrigger>
         </TabsList>
       </Tabs>
 
       {filtered.length === 0 ? (
         <div className="flex flex-col items-center justify-center rounded-lg border border-dashed border-border py-12">
-          <p className="text-sm text-muted-foreground">No bookings found.</p>
+          <p className="text-sm text-muted-foreground">
+            {t("bookingLinks.noBookingsFound")}
+          </p>
         </div>
       ) : (
         <div className="overflow-x-auto rounded-lg border border-border">
           <Table>
             <TableHeader>
               <TableRow>
-                <TableHead>Name</TableHead>
-                <TableHead>Email</TableHead>
-                <TableHead>Event</TableHead>
-                <TableHead>Date & Time</TableHead>
-                <TableHead>Details</TableHead>
-                <TableHead>Status</TableHead>
+                <TableHead>{t("bookingLinks.name")}</TableHead>
+                <TableHead>{t("bookingLinks.email")}</TableHead>
+                <TableHead>{t("eventForm.event")}</TableHead>
+                <TableHead>{t("bookingLinks.dateAndTime")}</TableHead>
+                <TableHead>{t("bookingLinks.details")}</TableHead>
+                <TableHead>{t("bookingLinks.status")}</TableHead>
                 <TableHead className="w-[80px]" />
               </TableRow>
             </TableHeader>
@@ -122,7 +128,9 @@ export default function BookingsList() {
                         booking.status === "confirmed" ? "default" : "secondary"
                       }
                     >
-                      {booking.status}
+                      {booking.status === "confirmed"
+                        ? t("bookingLinks.confirmed")
+                        : t("bookingLinks.cancelled")}
                     </Badge>
                   </TableCell>
                   <TableCell>
@@ -138,7 +146,9 @@ export default function BookingsList() {
                             <IconCircleX className="h-4 w-4 text-destructive" />
                           </Button>
                         </TooltipTrigger>
-                        <TooltipContent>Cancel booking</TooltipContent>
+                        <TooltipContent>
+                          {t("bookingLinks.cancelBooking")}
+                        </TooltipContent>
                       </Tooltip>
                     )}
                   </TableCell>
@@ -159,6 +169,7 @@ function BookingDetails({
   booking: Booking;
   customFields?: CustomField[];
 }) {
+  const t = useT();
   const responses = booking.fieldResponses;
   const hasResponses = responses && Object.keys(responses).length > 0;
   const hasNotes = !!booking.notes;
@@ -169,7 +180,7 @@ function BookingDetails({
 
   const lines: { label: string; value: string }[] = [];
   if (hasNotes) {
-    lines.push({ label: "Notes", value: booking.notes! });
+    lines.push({ label: t("bookingLinks.notes"), value: booking.notes! });
   }
   if (hasResponses && customFields) {
     for (const field of customFields) {
@@ -177,7 +188,7 @@ function BookingDetails({
       if (val !== undefined && val !== "" && val !== false) {
         lines.push({
           label: field.label,
-          value: typeof val === "boolean" ? "Yes" : String(val),
+          value: typeof val === "boolean" ? t("bookingLinks.yes") : String(val),
         });
       }
     }
@@ -196,12 +207,12 @@ function BookingDetails({
           size="sm"
           className="h-auto px-0 py-0 text-xs text-muted-foreground underline decoration-dotted"
         >
-          {lines.length} {lines.length === 1 ? "detail" : "details"}
+          {t("bookingLinks.detailCount", { count: lines.length })}
         </Button>
       </DialogTrigger>
       <DialogContent className="max-h-[80vh] overflow-hidden sm:max-w-lg">
         <DialogHeader>
-          <DialogTitle>Booking Details</DialogTitle>
+          <DialogTitle>{t("bookingLinks.bookingDetails")}</DialogTitle>
         </DialogHeader>
         <div className="space-y-4 overflow-y-auto pr-1 text-sm">
           {lines.map((line) => (

package/corpus/templates/calendar/app/pages/CalendarView.tsx

@@ -2,6 +2,7 @@ import {
   AgentToggleButton,
   agentNativePath,
   NotificationsBell,
+  useT,
 } from "@agent-native/core/client";
 import type {
   CalendarEvent,
@@ -90,12 +91,6 @@ import {
 import { isMcpEmbedSurface } from "@/lib/mcp-embed";
 import { cn } from "@/lib/utils";
 
-const viewModeLabels: Record<ViewMode, string> = {
-  month: "Month",
-  week: "Week",
-  day: "Day",
-};
-
 const CALENDAR_DRAFT_EVENT_PREFIX = "calendar-draft-event:";
 
 type DraftEventPatch = Partial<CalendarEvent> & {
@@ -292,6 +287,7 @@ function deletePersistedCalendarDraft(id: string) {
 }
 
 export default function CalendarView() {
+  const t = useT();
   const isMobile = useIsMobile();
   const {
     selectedDate,
@@ -345,6 +341,11 @@ export default function CalendarView() {
   const deleteEvent = useDeleteEvent();
   const { promptGuestNotification, guestNotificationDialog } =
     useGuestNotificationPrompt();
+  const viewModeLabels: Record<ViewMode, string> = {
+    month: t("calendarView.month"),
+    week: t("calendarView.week"),
+    day: t("calendarView.day"),
+  };
 
   // Compute date range for query based on view
   const { from, to } = useMemo(() => {
@@ -380,9 +381,7 @@ export default function CalendarView() {
     isFetching,
     isPlaceholderData,
   } = useEvents(from, to, overlayEmails);
-  const rawEvents: CalendarEvent[] = Array.isArray(rawEventsData)
-    ? rawEventsData
-    : [];
+  const rawEvents = Array.isArray(rawEventsData) ? rawEventsData : [];
   const draftEvent = useMemo(
     () => (eventDraft ? draftToCalendarEvent(eventDraft, selectedDate) : null),
     [eventDraft, selectedDate],
@@ -580,14 +579,14 @@ export default function CalendarView() {
         trimmedTitle && trimmedTitle !== "(No title)" ? trimmedTitle : "";
       if (!title && !isSlotDraftId(draftId)) {
         committingDraftIdsRef.current.delete(draftId);
-        toast.error("Add a title before creating the event");
+        toast.error(t("calendarView.addTitleBeforeCreate"));
         return;
       }
 
       const { start, end } = draftRange(draft, selectedDate);
       if (end.getTime() <= start.getTime()) {
         committingDraftIdsRef.current.delete(draftId);
-        toast.error("End time must be after start time");
+        toast.error(t("calendarView.endTimeAfterStart"));
         return;
       }
 
@@ -670,7 +669,9 @@ export default function CalendarView() {
             setQuickEditEventId(calendarDraftEventId(draftId));
           }
           toast.error(
-            error instanceof Error ? error.message : "Failed to create event",
+            error instanceof Error
+              ? error.message
+              : t("eventForm.createFailed"),
           );
         },
         onSettled: () => {
@@ -678,7 +679,7 @@ export default function CalendarView() {
         },
       });
     },
-    [createEvent, deleteEvent, eventDraft, selectedDate, setEventDraft],
+    [createEvent, deleteEvent, eventDraft, selectedDate, setEventDraft, t],
   );
 
   const updateDraftEvent = useCallback(
@@ -752,7 +753,7 @@ export default function CalendarView() {
 
   function handleOpenSelectedEventInGoogleCalendar(event: CalendarEvent) {
     if (!event.htmlLink) {
-      toast.error("Google Calendar link unavailable");
+      toast.error(t("calendarView.googleCalendarLinkUnavailable"));
       return;
     }
 
@@ -765,7 +766,7 @@ export default function CalendarView() {
             url.pathname.startsWith("/calendar/")));
 
       if (!isGoogleCalendarUrl) {
-        toast.error("Google Calendar link unavailable");
+        toast.error(t("calendarView.googleCalendarLinkUnavailable"));
         return;
       }
 
@@ -778,7 +779,7 @@ export default function CalendarView() {
         window.location.assign(url.toString());
       }
     } catch {
-      toast.error("Google Calendar link unavailable");
+      toast.error(t("calendarView.googleCalendarLinkUnavailable"));
     }
   }
 
@@ -824,11 +825,16 @@ export default function CalendarView() {
         onSuccess: () => {
           if (sidebarEvent?.id === ev.id) setSidebarEvent(null);
           setUndoAction(undo);
-          toast(`Event ${removeOnly ? "removed" : "deleted"}`, {
-            action: { label: "Undo", onClick: undo },
-          });
+          toast(
+            removeOnly
+              ? t("calendarView.eventRemoved")
+              : t("calendarView.eventDeleted"),
+            {
+              action: { label: t("calendarView.undo"), onClick: undo },
+            },
+          );
         },
-        onError: () => toast.error("Failed to delete event"),
+        onError: () => toast.error(t("calendarView.failedDeleteEvent")),
       },
     );
   }
@@ -924,7 +930,9 @@ export default function CalendarView() {
       });
     };
     const toastId = toast.loading(
-      isRecurring ? "Updating recurring event..." : "Moving event...",
+      isRecurring
+        ? t("calendarView.updatingRecurringEvent")
+        : t("calendarView.movingEvent"),
     );
 
     updateEvent.mutate(
@@ -936,12 +944,13 @@ export default function CalendarView() {
       {
         onSuccess: () => {
           setUndoAction(undo);
-          toast.success("Event moved", {
+          toast.success(t("calendarView.eventMoved"), {
             id: toastId,
-            action: { label: "Undo", onClick: undo },
+            action: { label: t("calendarView.undo"), onClick: undo },
           });
         },
-        onError: () => toast.error("Failed to move event", { id: toastId }),
+        onError: () =>
+          toast.error(t("calendarView.failedMoveEvent"), { id: toastId }),
       },
     );
   }
@@ -1000,7 +1009,9 @@ export default function CalendarView() {
       });
     };
     const toastId = toast.loading(
-      isRecurring ? "Updating recurring event..." : "Updating event...",
+      isRecurring
+        ? t("calendarView.updatingRecurringEvent")
+        : t("calendarView.updatingEvent"),
     );
 
     updateEvent.mutate(
@@ -1012,12 +1023,13 @@ export default function CalendarView() {
       {
         onSuccess: () => {
           setUndoAction(undo);
-          toast.success("Event updated", {
+          toast.success(t("calendarView.eventUpdated"), {
             id: toastId,
-            action: { label: "Undo", onClick: undo },
+            action: { label: t("calendarView.undo"), onClick: undo },
           });
         },
-        onError: () => toast.error("Failed to update event", { id: toastId }),
+        onError: () =>
+          toast.error(t("calendarView.failedUpdateEvent"), { id: toastId }),
       },
     );
   }
@@ -1033,9 +1045,7 @@ export default function CalendarView() {
       activeSettings = result.data;
     }
     if (!activeSettings?.timezone) {
-      toast.error(
-        "Calendar settings are still loading. Try again in a moment.",
-      );
+      toast.error(t("calendarView.calendarSettingsLoading"));
       return;
     }
 
@@ -1277,13 +1287,13 @@ export default function CalendarView() {
                     size="icon"
                     className="h-8 w-8 lg:hidden"
                     onClick={openSidebar}
-                    aria-label="Open navigation"
+                    aria-label={t("calendarView.openNavigation")}
                   >
                     <IconMenu2 className="h-4 w-4" />
                   </Button>
                 </TooltipTrigger>
                 <TooltipContent side="bottom">
-                  <p>Open navigation</p>
+                  <p>{t("calendarView.openNavigation")}</p>
                 </TooltipContent>
               </Tooltip>
               <DropdownMenu>
@@ -1299,26 +1309,26 @@ export default function CalendarView() {
                 </DropdownMenuTrigger>
                 <DropdownMenuContent align="start">
                   <DropdownMenuItem onClick={() => setViewMode("day")}>
-                    Day
+                    {t("calendarView.day")}
                     <kbd className="ml-auto text-[10px] text-muted-foreground">
                       D
                     </kbd>
                   </DropdownMenuItem>
                   <DropdownMenuItem onClick={() => setViewMode("week")}>
-                    Week
+                    {t("calendarView.week")}
                     <kbd className="ml-auto text-[10px] text-muted-foreground">
                       W
                     </kbd>
                   </DropdownMenuItem>
                   <DropdownMenuItem onClick={() => setViewMode("month")}>
-                    Month
+                    {t("calendarView.month")}
                     <kbd className="ml-auto text-[10px] text-muted-foreground">
                       M
                     </kbd>
                   </DropdownMenuItem>
                   <DropdownMenuSeparator />
                   <DropdownMenuLabel className="text-[10px] font-normal uppercase tracking-wider text-muted-foreground">
-                    Display
+                    {t("calendarView.display")}
                   </DropdownMenuLabel>
                   <DropdownMenuItem
                     onSelect={(e) => {
@@ -1326,7 +1336,7 @@ export default function CalendarView() {
                       setViewPrefs({ hideWeekends: !viewPrefs.hideWeekends });
                     }}
                   >
-                    Hide weekends
+                    {t("calendarView.hideWeekends")}
                     {viewPrefs.hideWeekends && (
                       <IconCheck className="ml-auto h-3.5 w-3.5 text-muted-foreground" />
                     )}
@@ -1345,12 +1355,12 @@ export default function CalendarView() {
                     onClick={handleToday}
                     className="h-7 px-2 text-xs font-medium sm:px-2.5"
                   >
-                    Today
+                    {t("calendarView.today")}
                   </Button>
                 </TooltipTrigger>
                 <TooltipContent side="bottom">
                   <p>
-                    Go to today{" "}
+                    {t("eventForm.goToToday")}{" "}
                     <kbd className="ml-1 rounded border border-border bg-muted px-1 font-mono text-[10px]">
                       T
                     </kbd>
@@ -1383,7 +1393,7 @@ export default function CalendarView() {
               {eventsRefreshing && (
                 <Spinner
                   className="ml-1 size-3.5 shrink-0 text-muted-foreground"
-                  aria-label="Loading calendars"
+                  aria-label={t("calendarView.loadingCalendars")}
                 />
               )}
             </div>
@@ -1403,7 +1413,7 @@ export default function CalendarView() {
                 </TooltipTrigger>
                 <TooltipContent side="bottom">
                   <p>
-                    Search{" "}
+                    {t("root.commandSearch")}{" "}
                     <kbd className="ml-1 rounded border border-border bg-muted px-1 font-mono text-[10px]">
                       /
                     </kbd>
@@ -1414,7 +1424,9 @@ export default function CalendarView() {
               {!isMobile && (
                 <NotificationsBell
                   browserNotifications
-                  emptyDescription="Calendar can pop browser alerts while this app is open. Clips desktop handles fuller meeting prompts with one-click notes."
+                  emptyDescription={t(
+                    "calendarView.notificationEmptyDescription",
+                  )}
                 />
               )}
               <CreateEventPopover
@@ -1578,13 +1590,17 @@ export default function CalendarView() {
               { id: eventId, ...options },
               {
                 onSuccess: () => {
-                  const label = options.removeOnly ? "removed" : "deleted";
                   setUndoAction(undo);
-                  toast(`Event ${label}`, {
-                    action: { label: "Undo", onClick: undo },
-                  });
+                  toast(
+                    options.removeOnly
+                      ? t("calendarView.eventRemoved")
+                      : t("calendarView.eventDeleted"),
+                    {
+                      action: { label: t("calendarView.undo"), onClick: undo },
+                    },
+                  );
                 },
-                onError: () => toast.error("Failed to delete event"),
+                onError: () => toast.error(t("calendarView.failedDeleteEvent")),
               },
             );
           }}
@@ -1596,6 +1612,7 @@ export default function CalendarView() {
 }
 
 function AccountAvatars() {
+  const t = useT();
   const googleStatus = useGoogleAuthStatus();
   const accounts = googleStatus.data?.accounts ?? [];
   if (accounts.length === 0) return null;
@@ -1606,7 +1623,7 @@ function AccountAvatars() {
         <Link
           to="/settings"
           className="flex items-center hover:opacity-90 ml-1"
-          aria-label="Manage accounts"
+          aria-label={t("calendarView.manageAccounts")}
         >
           <div className="flex items-center">
             {accounts.map((account, i) => (