@agent-native/core 0.77.3 → 0.77.4

package/corpus/templates/content/app/components/editor/TableHoverControls.tsx

@@ -1,3 +1,4 @@
+import { useT } from "@agent-native/core/client";
 import {
   IconArrowDown,
   IconArrowLeft,
@@ -358,6 +359,7 @@ function getTableOverlayId(table: HTMLElement) {
 }
 
 export function TableHoverControls({ editor }: TableHoverControlsProps) {
+  const t = useT();
   const selectedCellRef = useRef<HTMLElement | null>(null);
   const selectedCellAddressRef = useRef<SelectedCellAddress | null>(null);
   const selectedCellRectRef = useRef<DOMRect | null>(null);
@@ -1124,7 +1126,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
           <DropdownMenu open={columnMenuOpen} onOpenChange={setColumnMenuOpen}>
             <DropdownMenuTrigger asChild>
               <button
-                aria-label="Column options"
+                aria-label={t("database.columnOptions")}
                 className={lineButtonClass}
                 data-testid="table-column-options"
                 onClickCapture={(event) => {
@@ -1173,7 +1175,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
               alignOffset={columnMenuAlignOffset}
               collisionPadding={MENU_COLLISION_PADDING}
             >
-              <DropdownMenuLabel>Column</DropdownMenuLabel>
+              <DropdownMenuLabel>{t("database.column")}</DropdownMenuLabel>
               {canToggleHeaderColumn ? (
                 <DropdownMenuItem
                   className="gap-2"
@@ -1189,7 +1191,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                   }}
                 >
                   <IconTableColumn className={menuIconClass} />
-                  Header column
+                  {t("database.headerColumn")}
                   <span
                     aria-hidden="true"
                     className={cn(
@@ -1219,7 +1221,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                 }
               >
                 <IconArrowLeft className={menuIconClass} />
-                Insert left
+                {t("database.insertLeft")}
               </DropdownMenuItem>
               <DropdownMenuItem
                 className="gap-2"
@@ -1230,21 +1232,21 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                 }
               >
                 <IconArrowRight className={menuIconClass} />
-                Insert right
+                {t("database.insertRight")}
               </DropdownMenuItem>
               <DropdownMenuItem
                 className="gap-2"
                 onSelect={() => duplicateColumn(getSelectedCellElement())}
               >
                 <IconCopy className={menuIconClass} />
-                Duplicate
+                {t("database.duplicate")}
               </DropdownMenuItem>
               <DropdownMenuItem
                 className="gap-2"
                 onSelect={() => clearColumnContents(getSelectedCellElement())}
               >
                 <IconCircleX className={menuIconClass} />
-                Clear column
+                {t("database.clearColumn")}
               </DropdownMenuItem>
               <DropdownMenuSeparator />
               <DropdownMenuItem
@@ -1260,7 +1262,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                 }
               >
                 <IconTrash className="size-4 shrink-0" />
-                Delete column
+                {t("database.deleteColumn")}
               </DropdownMenuItem>
             </DropdownMenuContent>
           </DropdownMenu>
@@ -1268,7 +1270,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
           <DropdownMenu open={rowMenuOpen} onOpenChange={setRowMenuOpen}>
             <DropdownMenuTrigger asChild>
               <button
-                aria-label="Row options"
+                aria-label={t("database.rowOptions")}
                 className={lineButtonClass}
                 data-testid="table-row-options"
                 onClickCapture={(event) => {
@@ -1315,7 +1317,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
               collisionPadding={MENU_COLLISION_PADDING}
               side="right"
             >
-              <DropdownMenuLabel>Row</DropdownMenuLabel>
+              <DropdownMenuLabel>{t("database.row")}</DropdownMenuLabel>
               {canToggleHeaderRow ? (
                 <DropdownMenuItem
                   className="gap-2"
@@ -1331,7 +1333,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                   }}
                 >
                   <IconTableRow className={menuIconClass} />
-                  Header row
+                  {t("database.headerRow")}
                   <span
                     aria-hidden="true"
                     className={cn(
@@ -1361,7 +1363,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                 }
               >
                 <IconArrowUp className={menuIconClass} />
-                Insert above
+                {t("database.insertAbove")}
               </DropdownMenuItem>
               <DropdownMenuItem
                 className="gap-2"
@@ -1372,21 +1374,21 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                 }
               >
                 <IconArrowDown className={menuIconClass} />
-                Insert below
+                {t("database.insertBelow")}
               </DropdownMenuItem>
               <DropdownMenuItem
                 className="gap-2"
                 onSelect={() => duplicateRow(getSelectedCellElement())}
               >
                 <IconCopy className={menuIconClass} />
-                Duplicate
+                {t("database.duplicate")}
               </DropdownMenuItem>
               <DropdownMenuItem
                 className="gap-2"
                 onSelect={() => clearRowContents(getSelectedCellElement())}
               >
                 <IconCircleX className={menuIconClass} />
-                Clear row
+                {t("database.clearRow")}
               </DropdownMenuItem>
               <DropdownMenuSeparator />
               <DropdownMenuItem
@@ -1402,7 +1404,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                 }
               >
                 <IconTrash className="size-4 shrink-0" />
-                Delete row
+                {t("database.deleteRow")}
               </DropdownMenuItem>
             </DropdownMenuContent>
           </DropdownMenu>
@@ -1426,7 +1428,7 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
             <Tooltip delayDuration={EDGE_HANDLE_TOOLTIP_DELAY}>
               <TooltipTrigger asChild>
                 <button
-                  aria-label="Click or drag table column handle"
+                  aria-label={t("database.tableColumnHandle")}
                   className={cn(
                     handleClass,
                     "cursor-col-resize -translate-y-1/2",
@@ -1457,15 +1459,17 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                 </button>
               </TooltipTrigger>
               <TooltipContent>
-                <strong>Click</strong> to add a column. <strong>Drag</strong> to
-                add or remove columns.
+                <strong>{t("database.click")}</strong>{" "}
+                {t("database.toAddAColumn")}{" "}
+                <strong>{t("database.drag")}</strong>{" "}
+                {t("database.toAddOrRemoveColumns")}
               </TooltipContent>
             </Tooltip>
 
             <Tooltip delayDuration={EDGE_HANDLE_TOOLTIP_DELAY}>
               <TooltipTrigger asChild>
                 <button
-                  aria-label="Click or drag table row handle"
+                  aria-label={t("database.tableRowHandle")}
                   className={cn(
                     handleClass,
                     "cursor-row-resize -translate-x-1/2",
@@ -1496,8 +1500,9 @@ export function TableHoverControls({ editor }: TableHoverControlsProps) {
                 </button>
               </TooltipTrigger>
               <TooltipContent>
-                <strong>Click</strong> to add a row. <strong>Drag</strong> to
-                add or remove rows.
+                <strong>{t("database.click")}</strong> {t("database.toAddARow")}{" "}
+                <strong>{t("database.drag")}</strong>{" "}
+                {t("database.toAddOrRemoveRows")}
               </TooltipContent>
             </Tooltip>
           </div>

package/corpus/templates/content/app/components/editor/VersionHistoryPanel.tsx

@@ -1,4 +1,4 @@
-import type { CollabUser } from "@agent-native/core/client";
+import { useT, type CollabUser } from "@agent-native/core/client";
 import type { DocumentVersion } from "@shared/api";
 import { IconArrowLeft, IconRotate, IconLoader2 } from "@tabler/icons-react";
 import { useState } from "react";
@@ -62,9 +62,10 @@ export function VersionHistoryPanel({
   canRestore = true,
   activeUsers = [],
 }: VersionHistoryPanelProps) {
-  const versionsQuery = useDocumentVersions(open ? documentId : null);
-  const versions: DocumentVersion[] = versionsQuery.data ?? [];
-  const isLoading = versionsQuery.isLoading;
+  const t = useT();
+  const { data: versions, isLoading } = useDocumentVersions(
+    open ? documentId : null,
+  );
   const restoreVersion = useRestoreDocumentVersion(documentId);
   const [selectedVersion, setSelectedVersion] =
     useState<DocumentVersion | null>(null);
@@ -80,11 +81,11 @@ export function VersionHistoryPanel({
         documentId,
         versionId: version.id,
       });
-      toast.success("Version restored.");
+      toast.success(t("editor.versionRestored"));
       setSelectedVersion(null);
       onOpenChange(false);
     } catch {
-      toast.error("Failed to restore version.");
+      toast.error(t("editor.versionRestoreFailed"));
     }
   };
 
@@ -114,14 +115,14 @@ export function VersionHistoryPanel({
                   className="flex items-center gap-1.5 text-muted-foreground hover:text-foreground"
                 >
                   <IconArrowLeft size={14} />
-                  <span>Back to history</span>
+                  <span>{t("editor.versionBackToHistory")}</span>
                 </button>
               ) : (
-                "Version history"
+                t("editor.toolbar.versionHistory")
               )}
             </SheetTitle>
             <SheetDescription className="sr-only">
-              Browse previous versions of this document.
+              {t("editor.versionHistoryDescription")}
             </SheetDescription>
           </SheetHeader>
 
@@ -159,7 +160,7 @@ export function VersionHistoryPanel({
                     ) : (
                       <IconRotate size={14} className="mr-1.5" />
                     )}
-                    Restore this version
+                    {t("editor.versionRestoreThisVersion")}
                   </Button>
                 </div>
               ) : null}
@@ -175,9 +176,9 @@ export function VersionHistoryPanel({
                 </div>
               ) : !versions?.length ? (
                 <div className="py-12 text-center text-xs text-muted-foreground">
-                  No version history yet.
+                  {t("editor.versionNoHistoryYet")}
                   <br />
-                  Versions are saved automatically as you edit.
+                  {t("editor.versionSavedAutomatically")}
                 </div>
               ) : (
                 <div className="p-1.5">
@@ -213,17 +214,20 @@ export function VersionHistoryPanel({
       >
         <AlertDialogContent>
           <AlertDialogHeader>
-            <AlertDialogTitle>Restore this version?</AlertDialogTitle>
+            <AlertDialogTitle>
+              {t("editor.versionRestoreThisVersionQuestion")}
+            </AlertDialogTitle>
             <AlertDialogDescription>
               {activeUsers.length === 1
-                ? "Another person is editing this document right now."
-                : `${activeUsers.length} people are editing this document right now.`}{" "}
-              Restoring will replace the live content for everyone and cannot be
-              undone (though the current state is saved as a version first).
+                ? t("editor.versionAnotherPersonEditing")
+                : t("editor.versionPeopleEditing", {
+                    count: activeUsers.length,
+                  })}{" "}
+              {t("editor.versionRestoreWarning")}
             </AlertDialogDescription>
           </AlertDialogHeader>
           <AlertDialogFooter>
-            <AlertDialogCancel>Cancel</AlertDialogCancel>
+            <AlertDialogCancel>{t("comments.cancel")}</AlertDialogCancel>
             <AlertDialogAction
               onClick={() => {
                 if (pendingRestoreVersion) {
@@ -233,7 +237,7 @@ export function VersionHistoryPanel({
                 }
               }}
             >
-              Restore anyway
+              {t("editor.versionRestoreAnyway")}
             </AlertDialogAction>
           </AlertDialogFooter>
         </AlertDialogContent>

package/corpus/templates/content/app/components/editor/VisualEditor.tsx

@@ -2,6 +2,7 @@ import {
   createSharedEditorExtensions,
   useCollabReconcile,
   RegistryBlockDataProvider,
+  useT,
   type RegistryBlockSideMapBlock,
   type UseCollabReconcileResult,
 } from "@agent-native/core/client";
@@ -1564,6 +1565,7 @@ export function VisualEditor({
   onOpenNotionPageLink,
   notionPageId,
 }: VisualEditorProps) {
+  const t = useT();
   const [isDraggingMedia, setIsDraggingMedia] = useState(false);
   const onChangeRef = useRef(onChange);
   onChangeRef.current = onChange;
@@ -1803,7 +1805,9 @@ export function VisualEditor({
         if (!guards.registerEmitted(normalized)) return;
         queueMicrotask(() => onChangeRef.current(normalized));
       } catch (err: any) {
-        toast.error("Markdown serialization error: " + err.message);
+        toast.error(
+          t("editor.markdownSerializationError", { message: err.message }),
+        );
         console.error("Markdown serialization error:", err);
       }
     },
@@ -2044,7 +2048,7 @@ export function VisualEditor({
             <IconPhoto size={16} />
             <IconVideo size={16} />
             <IconMusic size={16} />
-            <span>Drop media</span>
+            <span>{t("editor.dropMedia")}</span>
           </div>
         </div>
       ) : null}