@agent-native/core 0.77.2 → 0.77.4

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

@@ -1,3 +1,4 @@
+import { useT } from "@agent-native/core/client";
 import {
   IconCalendar,
   IconClock,
@@ -37,6 +38,7 @@ interface BookingInfo {
 }
 
 export function ManageBookingPage() {
+  const t = useT();
   const { token } = useParams<{ token: string }>();
   const navigate = useNavigate();
   const [justCancelled, setJustCancelled] = useState(false);
@@ -51,7 +53,7 @@ export function ManageBookingPage() {
       const res = await fetch(appApiPath(`/api/public/bookings/${token}`));
       if (!res.ok) {
         const body = await res.json().catch(() => ({}));
-        throw new Error(body.error || "Booking not found");
+        throw new Error(body.error || t("manageBooking.notFound"));
       }
       return res.json();
     },
@@ -65,7 +67,7 @@ export function ManageBookingPage() {
       });
       if (!res.ok) {
         const body = await res.json().catch(() => ({}));
-        throw new Error(body.error || "Failed to cancel");
+        throw new Error(body.error || t("manageBooking.cancelFailed"));
       }
       return res.json();
     },
@@ -89,9 +91,9 @@ export function ManageBookingPage() {
     return (
       <div className="flex flex-col items-center justify-center min-h-screen px-4 text-center">
         <IconCircleX className="h-12 w-12 text-muted-foreground mb-4" />
-        <h1 className="text-xl font-semibold">Booking not found</h1>
+        <h1 className="text-xl font-semibold">{t("manageBooking.notFound")}</h1>
         <p className="mt-2 text-sm text-muted-foreground max-w-sm">
-          This link may have expired or the booking may have been removed.
+          {t("manageBooking.notFoundDescription")}
         </p>
       </div>
     );
@@ -101,17 +103,19 @@ export function ManageBookingPage() {
     return (
       <div className="flex flex-col items-center justify-center min-h-screen px-4 text-center">
         <IconCircleCheck className="h-16 w-16 text-emerald-600 dark:text-emerald-400 mb-4" />
-        <h1 className="text-2xl font-semibold">Booking Cancelled</h1>
+        <h1 className="text-2xl font-semibold">
+          {t("manageBooking.cancelled")}
+        </h1>
         <p className="mt-2 text-sm text-muted-foreground max-w-sm">
-          Your booking for{" "}
+          {t("manageBooking.cancelledPrefix")}{" "}
           <span className="font-medium text-foreground">
             {booking.eventTitle}
           </span>{" "}
-          on{" "}
+          {t("manageBooking.cancelledDateConnector")}{" "}
           <span className="font-medium text-foreground">
             {format(parseISO(booking.start), "MMMM d, yyyy")}
           </span>{" "}
-          has been cancelled.
+          {t("manageBooking.cancelledSuffix")}
         </p>
         {booking.slug && (
           <Button
@@ -120,7 +124,7 @@ export function ManageBookingPage() {
             onClick={() => navigate(`/book/${booking.slug}`)}
           >
             <IconCalendarPlus className="h-4 w-4" />
-            Reschedule
+            {t("manageBooking.reschedule")}
           </Button>
         )}
       </div>
@@ -131,9 +135,9 @@ export function ManageBookingPage() {
     <div className="flex flex-col items-center justify-center min-h-screen px-4">
       <div className="w-full max-w-md space-y-6">
         <div className="text-center space-y-2">
-          <h1 className="text-2xl font-semibold">Manage Booking</h1>
+          <h1 className="text-2xl font-semibold">{t("manageBooking.title")}</h1>
           <p className="text-sm text-muted-foreground">
-            Cancel or reschedule your meeting.
+            {t("manageBooking.description")}
           </p>
         </div>
 
@@ -152,13 +156,13 @@ export function ManageBookingPage() {
             {format(parseISO(booking.end), "h:mm a")}
           </div>
           <div className="text-sm text-muted-foreground">
-            Booked by {booking.name}
+            {t("manageBooking.bookedBy", { name: booking.name })}
           </div>
         </div>
 
         {isPast ? (
           <p className="text-center text-sm text-muted-foreground">
-            This meeting has already passed.
+            {t("manageBooking.pastMeeting")}
           </p>
         ) : (
           <div className="flex flex-col gap-3">
@@ -171,35 +175,36 @@ export function ManageBookingPage() {
                     disabled={cancelMutation.isPending}
                   >
                     <IconCalendarPlus className="h-4 w-4" />
-                    Reschedule
+                    {t("manageBooking.reschedule")}
                   </Button>
                 </AlertDialogTrigger>
                 <AlertDialogContent>
                   <AlertDialogHeader>
                     <AlertDialogTitle>
-                      Reschedule this booking?
+                      {t("manageBooking.rescheduleTitle")}
                     </AlertDialogTitle>
                     <AlertDialogDescription>
-                      Your current booking will be cancelled and you'll be taken
-                      to pick a new time.
+                      {t("manageBooking.rescheduleDescription")}
                     </AlertDialogDescription>
                   </AlertDialogHeader>
                   <AlertDialogFooter>
-                    <AlertDialogCancel>Keep Current Time</AlertDialogCancel>
+                    <AlertDialogCancel>
+                      {t("manageBooking.keepCurrentTime")}
+                    </AlertDialogCancel>
                     <AlertDialogAction
                       onClick={(e) => {
                         e.preventDefault();
                         cancelMutation.mutate(undefined, {
                           onSuccess: () => navigate(`/book/${booking.slug}`),
                           onError: () =>
-                            toast.error("Failed to cancel booking"),
+                            toast.error(t("manageBooking.cancelFailed")),
                         });
                       }}
                       disabled={cancelMutation.isPending}
                     >
                       {cancelMutation.isPending
-                        ? "Cancelling..."
-                        : "Reschedule"}
+                        ? t("manageBooking.cancelling")
+                        : t("manageBooking.reschedule")}
                     </AlertDialogAction>
                   </AlertDialogFooter>
                 </AlertDialogContent>
@@ -214,36 +219,43 @@ export function ManageBookingPage() {
                   disabled={cancelMutation.isPending}
                 >
                   <IconCircleX className="h-4 w-4" />
-                  Cancel Booking
+                  {t("manageBooking.cancelBooking")}
                 </Button>
               </AlertDialogTrigger>
               <AlertDialogContent>
                 <AlertDialogHeader>
-                  <AlertDialogTitle>Cancel this booking?</AlertDialogTitle>
+                  <AlertDialogTitle>
+                    {t("manageBooking.cancelTitle")}
+                  </AlertDialogTitle>
                   <AlertDialogDescription>
-                    This will cancel your{" "}
+                    {t("manageBooking.cancelDescriptionPrefix")}{" "}
                     <span className="font-medium text-foreground">
                       {booking.eventTitle}
                     </span>{" "}
-                    on{" "}
+                    {t("manageBooking.cancelDescriptionDateConnector")}{" "}
                     <span className="font-medium text-foreground">
                       {format(parseISO(booking.start), "MMMM d, yyyy")}
                     </span>
-                    . This action cannot be undone.
+                    {t("manageBooking.cancelDescriptionSuffix")}
                   </AlertDialogDescription>
                 </AlertDialogHeader>
                 <AlertDialogFooter>
-                  <AlertDialogCancel>Keep Booking</AlertDialogCancel>
+                  <AlertDialogCancel>
+                    {t("manageBooking.keepBooking")}
+                  </AlertDialogCancel>
                   <AlertDialogAction
                     onClick={(e) => {
                       e.preventDefault();
                       cancelMutation.mutate(undefined, {
-                        onError: () => toast.error("Failed to cancel booking"),
+                        onError: () =>
+                          toast.error(t("manageBooking.cancelFailed")),
                       });
                     }}
                     disabled={cancelMutation.isPending}
                   >
-                    {cancelMutation.isPending ? "Cancelling..." : "Yes, Cancel"}
+                    {cancelMutation.isPending
+                      ? t("manageBooking.cancelling")
+                      : t("manageBooking.yesCancel")}
                   </AlertDialogAction>
                 </AlertDialogFooter>
               </AlertDialogContent>

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

@@ -1,8 +1,10 @@
+import { useT } from "@agent-native/core/client";
 import { IconArrowLeft } from "@tabler/icons-react";
 import { useEffect } from "react";
 import { Link, useLocation } from "react-router";
 
 export default function NotFound() {
+  const t = useT();
   const location = useLocation();
 
   useEffect(() => {
@@ -14,14 +16,14 @@ export default function NotFound() {
       <div className="text-center">
         <h1 className="text-6xl font-bold text-foreground/10 mb-2">404</h1>
         <p className="text-sm text-muted-foreground mb-6">
-          This page doesn't exist yet.
+          {t("notFound.pageMissing")}
         </p>
         <Link
           to="/"
           className="inline-flex items-center gap-2 px-4 py-2 rounded-lg bg-accent hover:bg-accent/80 text-sm text-accent-foreground transition-colors"
         >
           <IconArrowLeft className="w-4 h-4" />
-          Back to Calendar
+          {t("notFound.backToCalendar")}
         </Link>
       </div>
     </div>

package/corpus/templates/calendar/app/routes/_app.$.tsx

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

package/corpus/templates/calendar/app/routes/_app.booking-links.tsx

@@ -1,7 +1,9 @@
 import { Outlet } from "react-router";
 
+import { messagesByLocale } from "@/i18n-data";
+
 export function meta() {
-  return [{ title: "Booking Links — Calendar" }];
+  return [{ title: messagesByLocale["en-US"].routeTitles.bookingLinks }];
 }
 
 export default function BookingLinksLayout() {

package/corpus/templates/calendar/app/routes/_app.settings.tsx

@@ -1,22 +1,25 @@
+import { useT } from "@agent-native/core/client";
 import { useMemo } from "react";
 
 import { useAppHeaderControls } from "@/components/layout/AppLayout";
+import { messagesByLocale } from "@/i18n-data";
 import Settings from "@/pages/Settings";
 
 export function meta() {
-  return [{ title: "Settings — Calendar" }];
+  return [{ title: messagesByLocale["en-US"].routeTitles.settings }];
 }
 
 export default function SettingsRoute() {
+  const t = useT();
   const controls = useMemo(
     () => ({
       left: (
         <h1 className="text-lg font-semibold tracking-tight truncate">
-          Settings
+          {t("navigation.settings")}
         </h1>
       ),
     }),
-    [],
+    [t],
   );
   useAppHeaderControls(controls);
   return <Settings />;

package/corpus/templates/calendar/app/routes/_app.team.tsx

@@ -1,20 +1,25 @@
+import { useT } from "@agent-native/core/client";
 import { useMemo } from "react";
 
 import { useAppHeaderControls } from "@/components/layout/AppLayout";
+import { messagesByLocale } from "@/i18n-data";
 import Team from "@/pages/Team";
 
 export function meta() {
-  return [{ title: "Team — Calendar" }];
+  return [{ title: messagesByLocale["en-US"].routeTitles.team }];
 }
 
 export default function TeamRoute() {
+  const t = useT();
   const controls = useMemo(
     () => ({
       left: (
-        <h1 className="text-lg font-semibold tracking-tight truncate">Team</h1>
+        <h1 className="text-lg font-semibold tracking-tight truncate">
+          {t("navigation.team")}
+        </h1>
       ),
     }),
-    [],
+    [t],
   );
   useAppHeaderControls(controls);
   return <Team />;

package/corpus/templates/calendar/app/routes/booking-og-meta.ts

@@ -4,6 +4,8 @@ import type {
   MetaDescriptor,
 } from "react-router";
 
+import { messagesByLocale } from "@/i18n-data";
+
 export interface BookingOgLoaderData {
   ogImageUrl: string;
 }
@@ -32,12 +34,12 @@ function appBasePath(): string {
 
 export function bookingOgLoader({
   params,
-  url,
+  request,
 }: LoaderFunctionArgs): BookingOgLoaderData {
   const slug = params.slug ?? "";
   const imageUrl = new URL(
     `${appBasePath()}/api/public/booking-links/${encodeURIComponent(slug)}/og.png`,
-    url,
+    request.url,
   );
   if (params.username) imageUrl.searchParams.set("username", params.username);
   return { ogImageUrl: imageUrl.toString() };
@@ -47,9 +49,10 @@ export function bookingOgMeta({
   loaderData,
 }: MetaArgs<typeof bookingOgLoader>): MetaDescriptor[] {
   const image = loaderData?.ogImageUrl;
+  const title = messagesByLocale["en-US"].routeTitles.bookMeeting;
   return [
-    { title: "Book a Meeting" },
-    { property: "og:title", content: "Book a Meeting" },
+    { title },
+    { property: "og:title", content: title },
     { property: "og:type", content: "website" },
     ...(image
       ? [

package/corpus/templates/calendar/app/routes/booking.manage.$token.tsx

@@ -1,7 +1,8 @@
+import { messagesByLocale } from "@/i18n-data";
 import { ManageBookingPage } from "@/pages/ManageBookingPage";
 
 export function meta() {
-  return [{ title: "Manage Booking" }];
+  return [{ title: messagesByLocale["en-US"].routeTitles.manageBooking }];
 }
 
 // Public page — no AppLayout wrapper

package/corpus/templates/calendar/app/routes/event.tsx

@@ -1,5 +1,9 @@
-import { useActionQuery } from "@agent-native/core/client";
-import { postNavigate, isInAgentEmbed } from "@agent-native/core/client";
+import {
+  isInAgentEmbed,
+  postNavigate,
+  useActionQuery,
+  useT,
+} from "@agent-native/core/client";
 import type { CalendarEvent } from "@shared/api";
 import {
   IconClock,
@@ -14,11 +18,12 @@ import { useSearchParams } from "react-router";
 
 import { Button } from "@/components/ui/button";
 import { Spinner } from "@/components/ui/spinner";
+import { messagesByLocale } from "@/i18n-data";
 
 type EventPreviewResult = CalendarEvent | { error: string };
 
 export function meta() {
-  return [{ title: "Event Preview" }];
+  return [{ title: messagesByLocale["en-US"].routeTitles.eventPreview }];
 }
 
 function formatDuration(start: string, end: string): string {
@@ -31,6 +36,7 @@ function formatDuration(start: string, end: string): string {
 }
 
 function EventCard({ event }: { event: CalendarEvent }) {
+  const t = useT();
   const inEmbed = isInAgentEmbed();
 
   return (
@@ -133,7 +139,7 @@ function EventCard({ event }: { event: CalendarEvent }) {
                 onClick={() => postNavigate("/")}
               >
                 <IconCalendar className="h-3.5 w-3.5" />
-                Open calendar
+                {t("eventPreview.openCalendar")}
                 <IconArrowUpRight className="h-3 w-3" />
               </Button>
             </div>
@@ -145,11 +151,12 @@ function EventCard({ event }: { event: CalendarEvent }) {
 }
 
 function ErrorCard({ message }: { message: string }) {
+  const t = useT();
   return (
     <div className="min-h-screen bg-background flex items-start justify-center p-4">
       <div className="w-full max-w-sm rounded-xl border border-border bg-card shadow-sm px-5 py-4">
         <p className="text-sm text-destructive font-medium">
-          Could not load event
+          {t("eventPreview.couldNotLoadEvent")}
         </p>
         <p className="mt-1 text-xs text-muted-foreground">{message}</p>
       </div>
@@ -158,6 +165,7 @@ function ErrorCard({ message }: { message: string }) {
 }
 
 export default function EventPreviewRoute() {
+  const t = useT();
   const [searchParams] = useSearchParams();
   const id = searchParams.get("id") ?? "";
   const calendarId = searchParams.get("calendarId") ?? "primary";
@@ -169,9 +177,7 @@ export default function EventPreviewRoute() {
   );
 
   if (!id) {
-    return (
-      <ErrorCard message="No event id provided. Add ?id=<eventId> to the URL." />
-    );
+    return <ErrorCard message={t("eventPreview.noEventId")} />;
   }
 
   if (isLoading) {

package/corpus/templates/chat/app/i18n/ar-SA.ts

@@ -16,33 +16,33 @@ const messages = {
     openAgentSettings: "فتح إعدادات الوكيل",
   },
   chat: {
-    archiveChat: "Archive Chat",
-    archiveFailed: "Archive Failed",
-    chats: "Chats",
-    composerPlaceholder: "Ask the agent...",
-    emptyState: "Ask me anything",
-    heroDescription: "Ask the agent to inspect, explain, or change this app.",
-    heroTitle: "How can I help?",
-    inspectEmptyState: "Ask me anything about this app",
-    inspectSuggestionAction: "Show available actions",
-    inspectSuggestionCapabilities: "What can this app do?",
-    inspectSuggestionHello: "Help me get started",
-    newChat: "New Chat",
-    optionsFor: "Options For",
-    pinChat: "Pin Chat",
-    renameChat: "Rename Chat",
-    renameFailed: "Rename Failed",
-    renameThread: "Rename Thread",
-    suggestionActions: "Show me the available actions",
-    suggestionCapabilities: "What can this app do?",
-    suggestionCustomize: "Help me customize this app",
-    unpinChat: "Unpin Chat",
+    archiveChat: "أرشفة المحادثة",
+    archiveFailed: "فشلت الأرشفة",
+    chats: "المحادثات",
+    composerPlaceholder: "اسأل الوكيل...",
+    emptyState: "اسألني أي شيء",
+    heroDescription: "اطلب من الوكيل فحص هذا التطبيق أو شرحه أو تغييره.",
+    heroTitle: "كيف يمكنني المساعدة؟",
+    inspectEmptyState: "اسألني أي شيء عن هذا التطبيق",
+    inspectSuggestionAction: "إظهار الإجراءات المتاحة",
+    inspectSuggestionCapabilities: "ما الذي يمكن لهذا التطبيق فعله؟",
+    inspectSuggestionHello: "ساعدني على البدء",
+    newChat: "محادثة جديدة",
+    optionsFor: "خيارات لـ",
+    pinChat: "تثبيت المحادثة",
+    renameChat: "إعادة تسمية المحادثة",
+    renameFailed: "فشلت إعادة التسمية",
+    renameThread: "إعادة تسمية السلسلة",
+    suggestionActions: "أرني الإجراءات المتاحة",
+    suggestionCapabilities: "ما الذي يمكن لهذا التطبيق فعله؟",
+    suggestionCustomize: "ساعدني في تخصيص هذا التطبيق",
+    unpinChat: "إلغاء تثبيت المحادثة",
   },
   navigation: {
     chat: "المحادثة",
-    collapseSidebar: "Collapse Sidebar",
+    collapseSidebar: "طي الشريط الجانبي",
     database: "قاعدة البيانات",
-    expandSidebar: "Expand Sidebar",
+    expandSidebar: "توسيع الشريط الجانبي",
     extensions: "الإضافات",
     navigation: "التنقل",
     navigationDescription: "التنقل الرئيسي",
@@ -51,6 +51,12 @@ const messages = {
     settings: "الإعدادات",
     team: "الفريق",
   },
+  pages: {
+    databaseTitle: "قاعدة البيانات",
+    observabilityPageTitle: "قابلية ملاحظة الوكيل",
+    teamTitle: "الفريق",
+    teamCreateOrgDescription: "أنشئ مؤسسة لدعوة الزملاء ومشاركة هذا التطبيق.",
+  },
   root: {
     commandActions: "الإجراءات",
     commandAppearance: "المظهر",

package/corpus/templates/chat/app/i18n/de-DE.ts

@@ -17,33 +17,34 @@ const messages = {
     openAgentSettings: "Agent-Einstellungen öffnen",
   },
   chat: {
-    archiveChat: "Archive Chat",
-    archiveFailed: "Archive Failed",
+    archiveChat: "Chat archivieren",
+    archiveFailed: "Archivieren fehlgeschlagen",
     chats: "Chats",
-    composerPlaceholder: "Ask the agent...",
-    emptyState: "Ask me anything",
-    heroDescription: "Ask the agent to inspect, explain, or change this app.",
-    heroTitle: "How can I help?",
-    inspectEmptyState: "Ask me anything about this app",
-    inspectSuggestionAction: "Show available actions",
-    inspectSuggestionCapabilities: "What can this app do?",
-    inspectSuggestionHello: "Help me get started",
-    newChat: "New Chat",
-    optionsFor: "Options For",
-    pinChat: "Pin Chat",
-    renameChat: "Rename Chat",
-    renameFailed: "Rename Failed",
-    renameThread: "Rename Thread",
-    suggestionActions: "Show me the available actions",
-    suggestionCapabilities: "What can this app do?",
-    suggestionCustomize: "Help me customize this app",
-    unpinChat: "Unpin Chat",
+    composerPlaceholder: "Frag den Agenten...",
+    emptyState: "Frag mich alles",
+    heroDescription:
+      "Bitte den Agenten, diese App zu prüfen, zu erklären oder zu ändern.",
+    heroTitle: "Wie kann ich helfen?",
+    inspectEmptyState: "Frag mich alles über diese App",
+    inspectSuggestionAction: "Verfügbare Aktionen anzeigen",
+    inspectSuggestionCapabilities: "Was kann diese App?",
+    inspectSuggestionHello: "Hilf mir beim Einstieg",
+    newChat: "Neuer Chat",
+    optionsFor: "Optionen für",
+    pinChat: "Chat anheften",
+    renameChat: "Chat umbenennen",
+    renameFailed: "Umbenennen fehlgeschlagen",
+    renameThread: "Thread umbenennen",
+    suggestionActions: "Zeig mir die verfügbaren Aktionen",
+    suggestionCapabilities: "Was kann diese App?",
+    suggestionCustomize: "Hilf mir, diese App anzupassen",
+    unpinChat: "Chat lösen",
   },
   navigation: {
     chat: "Chat",
-    collapseSidebar: "Collapse Sidebar",
+    collapseSidebar: "Seitenleiste einklappen",
     database: "Datenbank",
-    expandSidebar: "Expand Sidebar",
+    expandSidebar: "Seitenleiste ausklappen",
     extensions: "Erweiterungen",
     navigation: "Navigation",
     navigationDescription: "Hauptnavigation",
@@ -52,6 +53,13 @@ const messages = {
     settings: "Einstellungen",
     team: "Team",
   },
+  pages: {
+    databaseTitle: "Datenbank",
+    observabilityPageTitle: "Agent-Beobachtbarkeit",
+    teamTitle: "Team",
+    teamCreateOrgDescription:
+      "Erstelle eine Organisation, um Teammitglieder einzuladen und diese App zu teilen.",
+  },
   root: {
     commandActions: "Aktionen",
     commandAppearance: "Darstellung",

package/corpus/templates/chat/app/i18n/en-US.ts

@@ -52,6 +52,13 @@ const messages = {
     settings: "Settings",
     team: "Team",
   },
+  pages: {
+    databaseTitle: "Database",
+    observabilityPageTitle: "Agent Observability",
+    teamTitle: "Team",
+    teamCreateOrgDescription:
+      "Create an organization to invite teammates and share this app.",
+  },
   root: {
     commandActions: "Actions",
     commandAppearance: "Appearance",