paseo-form-render 0.1.0 → 0.2.0

package/README.md

@@ -15,6 +15,8 @@ Interactive forms, dashboards, and metrics rendering plugin for Paseo conversati
 - **Provider Agnostic**:
   - Fully compatible with **Devin**, **Claude**, **Antigravity**, **Gemini**, and OpenAI providers.
   - Automatically injects protocol instructions on agent initialization.
+- **Localized Interface**:
+  - Labels, buttons, and the picker and settings screens follow the Paseo app language (English and 简体中文). Form content and the error details are not translated.
 - **Full Mobile & Hermes Compatibility**:
   - 100% pure React Native UI primitives (`View`, `Text`, `TextInput`, `Pressable`, `Switch`).
   - Zero external runtime dependencies in the client bundle.

package/client/container.tsx

@@ -1,9 +1,11 @@
 import type { PluginHostProps } from "@getpaseo/plugin/client";
+import { useTranslation } from "@getpaseo/plugin/client";
 import React, { useMemo, useState } from "react";
 import { View, Text, StyleSheet, Pressable, Platform } from "react-native";
 import { formatIssues } from "../shared/form-errors";
 import { buildFixMessage } from "../shared/form-fix";
 import { parseFormBlock, parseMessageContent, type ParsedBlock } from "../shared/parser";
+import { messages } from "./messages";
 import { PfrFormView } from "./renderer";
 import { HostMarkdown } from "./host-markdown";
 import { PfrRpcProvider, type PfrRpcFn } from "./rpc-bridge";
@@ -83,6 +85,7 @@ BlockErrorBoundary.prototype.render = function (this: any) {
 };
 
 const FormErrorBox: React.FC<FormErrorBoxProps> = ({ block, blockNumber, theme, onSubmit }) => {
+  const { t } = useTranslation(messages);
   const [status, setStatus] = useState<"idle" | "sending" | "sent">("idle");
   const errors = block.errors ?? [];
 
@@ -107,7 +110,7 @@ const FormErrorBox: React.FC<FormErrorBoxProps> = ({ block, blockNumber, theme,
       ]}
     >
       <Text style={[styles.errorTitle, { color: theme.colors.statusDanger }]}>
-        [pfr-form Syntax Error]
+        {t("errorBox.title")}
       </Text>
       {formatIssues(errors).map((line, i) => (
         <Text key={i} style={[styles.errorDetail, { color: theme.colors.statusDanger }]}>
@@ -135,7 +138,7 @@ const FormErrorBox: React.FC<FormErrorBoxProps> = ({ block, blockNumber, theme,
       </View>
       {status === "sent" ? (
         <Text style={[styles.sentText, { color: theme.colors.statusSuccess }]}>
-          ✓ Fix requested; the agent will reply with a corrected form
+          {t("errorBox.fixRequested")}
         </Text>
       ) : (
         <Pressable
@@ -148,7 +151,7 @@ const FormErrorBox: React.FC<FormErrorBoxProps> = ({ block, blockNumber, theme,
           onPress={askAgentToFix}
         >
           <Text style={[styles.fixButtonText, { color: theme.colors.accentForeground }]}>
-            {status === "sending" ? "Sending…" : "Ask agent to fix"}
+            {status === "sending" ? t("errorBox.sending") : t("errorBox.askFix")}
           </Text>
         </Pressable>
       )}

package/client/messages.ts

@@ -0,0 +1,147 @@
+import { defineTranslations } from "@getpaseo/plugin/client";
+
+/**
+ * Labels shown in the plugin UI. English is the source of truth; every other locale must use the
+ * same keys and placeholders (checked by the SDK and by `client/messages.test.ts`). The host picks the
+ * locale from the app language.
+ */
+const en = {
+  slash: {
+    form: "Instruct the agent to use pfr-form protocol",
+    formDemo: "Show a demo interactive form",
+  },
+  errorBox: {
+    title: "[pfr-form Syntax Error]",
+    askFix: "Ask agent to fix",
+    sending: "Sending…",
+    fixRequested: "✓ Fix requested; the agent will reply with a corrected form",
+  },
+  form: {
+    submitted: "✓ Form Submitted",
+  },
+  dropdown: {
+    placeholder: "Select an option...",
+    multiPlaceholder: "Select options...",
+    close: "Close dropdown menu",
+  },
+  file: {
+    folderPlaceholder: "Enter or select folder...",
+    filePlaceholder: "Enter or select file...",
+    browse: "Browse...",
+    fullPath: "Full path:",
+  },
+  picker: {
+    selectFolder: "Select Folder",
+    selectFile: "Select File",
+    chooseFolder: "Choose Folder",
+    chooseFile: "Choose File",
+    quick: "Quick:",
+    searchPlaceholder: "Search files/folders in directory...",
+    newFolderPlaceholder: "New folder name...",
+    create: "Create",
+    upToParent: ".. (Up to parent)",
+    loading: "Loading files...",
+    noMatches: "No matching entries found",
+    selected: "✓ Selected",
+    selectedLabel: "Selected:",
+    cancel: "Cancel",
+    projectRoot: "Project Root",
+    project: "Project",
+    invalidFolderName: 'Folder name contains invalid characters (/ \\ : * ? " < > |).',
+    createFailed: "Failed to create folder.",
+  },
+  settings: {
+    loadError: "Could not load settings: {{error}}",
+    retry: "Retry",
+    resetDefaults: "Reset to defaults",
+    autoFixTitle: "Automatic form fixes",
+    autoFixDescription:
+      'When an agent replies with a pfr-form block that fails validation, ask it to re-send a corrected block automatically. This sets how many times in a row the agent is asked; 0 turns automatic fixes off. The "Ask agent to fix" button on an error box always works.',
+    maxRetries: "Maximum retries",
+    decreaseRetries: "Decrease retries",
+    increaseRetries: "Increase retries",
+    hintOff: "Automatic fixes are off.",
+    hint_one: "Up to {{count}} automatic request per reply.",
+    hint_other: "Up to {{count}} automatic requests per reply.",
+    saving: "Saving…",
+    preferFormsTitle: "Prefer forms",
+    preferFormsDescription:
+      "By default the agent is only told it can use pfr-form. Turn this on to require it to ask for choices, parameters, and confirmations with a form instead of plain text. Applies to agents created after the change.",
+    requireForms: "Require forms for user input",
+    saveError: "Could not save: {{error}}",
+  },
+};
+
+const zhCN = {
+  slash: {
+    form: "让智能体使用 pfr-form 协议",
+    formDemo: "显示一个交互表单示例",
+  },
+  errorBox: {
+    title: "[pfr-form 语法错误]",
+    askFix: "请求智能体修复",
+    sending: "发送中…",
+    fixRequested: "✓ 已请求修复，智能体将回复更正后的表单",
+  },
+  form: {
+    submitted: "✓ 表单已提交",
+  },
+  dropdown: {
+    placeholder: "请选择...",
+    multiPlaceholder: "请选择多项...",
+    close: "关闭下拉菜单",
+  },
+  file: {
+    folderPlaceholder: "输入或选择文件夹...",
+    filePlaceholder: "输入或选择文件...",
+    browse: "浏览...",
+    fullPath: "完整路径：",
+  },
+  picker: {
+    selectFolder: "选择文件夹",
+    selectFile: "选择文件",
+    chooseFolder: "选择此文件夹",
+    chooseFile: "选择此文件",
+    quick: "快捷：",
+    searchPlaceholder: "在目录中搜索文件/文件夹...",
+    newFolderPlaceholder: "新文件夹名称...",
+    create: "创建",
+    upToParent: ".. (返回上级)",
+    loading: "正在加载文件...",
+    noMatches: "没有匹配的条目",
+    selected: "✓ 已选择",
+    selectedLabel: "已选择：",
+    cancel: "取消",
+    projectRoot: "项目根目录",
+    project: "项目",
+    invalidFolderName: '文件夹名称包含非法字符 (/ \\ : * ? " < > |)。',
+    createFailed: "创建文件夹失败。",
+  },
+  settings: {
+    loadError: "无法加载设置：{{error}}",
+    retry: "重试",
+    resetDefaults: "恢复默认值",
+    autoFixTitle: "自动修复表单",
+    autoFixDescription:
+      "当智能体回复的 pfr-form 代码块未通过校验时，自动请求它重新发送更正后的代码块。此处设置连续请求的最多次数；设为 0 则关闭自动修复。错误框上的“请求智能体修复”按钮始终可用。",
+    maxRetries: "最大重试次数",
+    decreaseRetries: "减少重试次数",
+    increaseRetries: "增加重试次数",
+    hintOff: "自动修复已关闭。",
+    hint_other: "每条回复最多自动请求 {{count}} 次。",
+    saving: "保存中…",
+    preferFormsTitle: "优先使用表单",
+    preferFormsDescription:
+      "默认情况下，智能体只被告知可以使用 pfr-form。开启后，它必须通过表单询问选项、参数和确认，而不是纯文本。仅对之后创建的智能体生效。",
+    requireForms: "用户输入必须使用表单",
+    saveError: "无法保存：{{error}}",
+  },
+};
+
+export const messages = defineTranslations({
+  resources: {
+    en,
+    "zh-CN": zhCN,
+    zh: zhCN,
+  },
+});

package/client/project-file-modal.tsx

@@ -1,4 +1,5 @@
 import type { PluginHostProps } from "@getpaseo/plugin/client";
+import { useTranslation } from "@getpaseo/plugin/client";
 import React, { useEffect, useMemo, useState } from "react";
 import {
   Modal,
@@ -16,6 +17,7 @@ import {
   type FilePickerShortcut,
 } from "../shared/pickers";
 import { normalizeExtensions } from "../shared/schema";
+import { messages } from "./messages";
 import { usePfrRpc } from "./rpc-bridge";
 
 interface ProjectFileModalProps {
@@ -43,6 +45,7 @@ export function ProjectFileModal({
 }: ProjectFileModalProps) {
   const listProjectFiles = usePfrRpc(listProjectFilesRpc);
   const createDir = usePfrRpc(createDirectoryRpc);
+  const { t } = useTranslation(messages);
   const [currentPath, setCurrentPath] = useState("");
   const [parentPath, setParentPath] = useState<string | null>(null);
   const [entries, setEntries] = useState<ProjectFileEntry[]>([]);
@@ -112,7 +115,7 @@ export function ProjectFileModal({
     if (!agentId || !newFolderName.trim() || creatingFolderLoading) return;
     const name = newFolderName.trim();
     if (/[<>:"/\\|?*]/.test(name) || name === "." || name === "..") {
-      setNewFolderError('Folder name contains invalid characters (/ \\ : * ? " < > |).');
+      setNewFolderError(t("picker.invalidFolderName"));
       return;
     }
     setCreatingFolderLoading(true);
@@ -132,7 +135,7 @@ export function ProjectFileModal({
           setSelectedPath(res.relativePath || res.fullPath);
         }
       } else {
-        setNewFolderError(res.error || "Failed to create folder.");
+        setNewFolderError(res.error || t("picker.createFailed"));
       }
     } catch (err) {
       setNewFolderError(err instanceof Error ? err.message : String(err));
@@ -159,9 +162,9 @@ export function ProjectFileModal({
 
   const breadcrumbs = useMemo(() => {
     if (isWorkspaceRelative) {
-      if (!currentPath) return [{ label: "Project Root", path: "" }];
+      if (!currentPath) return [{ label: t("picker.projectRoot"), path: "" }];
       const parts = currentPath.split("/").filter(Boolean);
-      const crumbs = [{ label: "Project", path: "" }];
+      const crumbs = [{ label: t("picker.project"), path: "" }];
       let accum = "";
       for (const part of parts) {
         accum = accum ? `${accum}/${part}` : part;
@@ -190,7 +193,7 @@ export function ProjectFileModal({
       }
       return crumbs;
     }
-  }, [currentPath, isWorkspaceRelative]);
+  }, [currentPath, isWorkspaceRelative, t]);
 
   const handleEntryPress = (entry: ProjectFileEntry) => {
     if (entry.isDirectory) {
@@ -227,7 +230,7 @@ export function ProjectFileModal({
           <View style={[styles.header, { borderBottomColor: colors.border }]}>
             <View style={{ flexDirection: "row", alignItems: "center", gap: 8, flex: 1, marginRight: 8 }}>
               <Text style={[styles.title, { color: colors.foreground }]}>
-                {pickerType === "folder" ? "Select Folder" : "Select File"}
+                {pickerType === "folder" ? t("picker.selectFolder") : t("picker.selectFile")}
               </Text>
               {cleanExts && cleanExts.length > 0 && (
                 <View style={[styles.filterBadge, { backgroundColor: colors.surface1, borderColor: colors.border }]}>
@@ -245,7 +248,7 @@ export function ProjectFileModal({
           {/* Quick Shortcuts Bar */}
           {shortcuts.length > 0 && (
             <View style={[styles.shortcutsBar, { borderBottomColor: colors.border, backgroundColor: colors.surface1 }]}>
-              <Text style={[styles.shortcutsLabel, { color: colors.foregroundMuted }]}>Quick:</Text>
+              <Text style={[styles.shortcutsLabel, { color: colors.foregroundMuted }]}>{t("picker.quick")}</Text>
               <ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={styles.shortcutsList}>
                 {shortcuts.map((sc) => (
                   <Pressable
@@ -298,7 +301,7 @@ export function ProjectFileModal({
                   borderColor: colors.border,
                 },
               ]}
-              placeholder="Search files/folders in directory..."
+              placeholder={t("picker.searchPlaceholder")}
               placeholderTextColor={colors.foregroundMuted}
               value={search}
               onChangeText={setSearch}
@@ -353,7 +356,7 @@ export function ProjectFileModal({
                       borderColor: colors.border,
                     },
                   ]}
-                  placeholder="New folder name..."
+                  placeholder={t("picker.newFolderPlaceholder")}
                   placeholderTextColor={colors.foregroundMuted}
                   value={newFolderName}
                   onChangeText={(t) => {
@@ -375,7 +378,7 @@ export function ProjectFileModal({
                   ]}
                 >
                   <Text style={{ color: colors.surface0, fontSize: 12, fontWeight: "600" }}>
-                    {creatingFolderLoading ? "..." : "Create"}
+                    {creatingFolderLoading ? "..." : t("picker.create")}
                   </Text>
                 </Pressable>
                 <Pressable
@@ -407,16 +410,16 @@ export function ProjectFileModal({
                 onPress={() => loadDirectory(parentPath)}
               >
                 <Text style={styles.entryIcon}>📁</Text>
-                <Text style={{ color: colors.foregroundMuted, fontSize: 14 }}>.. (Up to parent)</Text>
+                <Text style={{ color: colors.foregroundMuted, fontSize: 14 }}>{t("picker.upToParent")}</Text>
               </Pressable>
             )}
 
             {loading ? (
-              <Text style={[styles.emptyText, { color: colors.foregroundMuted }]}>Loading files...</Text>
+              <Text style={[styles.emptyText, { color: colors.foregroundMuted }]}>{t("picker.loading")}</Text>
             ) : error ? (
               <Text style={[styles.emptyText, { color: colors.statusDanger }]}>{error}</Text>
             ) : filteredEntries.length === 0 ? (
-              <Text style={[styles.emptyText, { color: colors.foregroundMuted }]}>No matching entries found</Text>
+              <Text style={[styles.emptyText, { color: colors.foregroundMuted }]}>{t("picker.noMatches")}</Text>
             ) : (
               filteredEntries.map((entry) => {
                 const isSelected = selectedPath === entry.relativePath;
@@ -445,7 +448,7 @@ export function ProjectFileModal({
                       {entry.name}
                     </Text>
                     {isSelected && (
-                      <Text style={{ color: colors.accent, fontWeight: "600", fontSize: 13 }}>✓ Selected</Text>
+                      <Text style={{ color: colors.accent, fontWeight: "600", fontSize: 13 }}>{t("picker.selected")}</Text>
                     )}
                   </Pressable>
                 );
@@ -456,7 +459,7 @@ export function ProjectFileModal({
           {/* Footer */}
           <View style={[styles.footer, { borderTopColor: colors.border }]}>
             <View style={{ flex: 1, marginRight: 10, overflow: "hidden" }}>
-              <Text style={{ color: colors.foregroundMuted, fontSize: 12 }}>Selected:</Text>
+              <Text style={{ color: colors.foregroundMuted, fontSize: 12 }}>{t("picker.selectedLabel")}</Text>
               {effectiveSelected ? (
                 <ScrollView
                   horizontal
@@ -489,7 +492,7 @@ export function ProjectFileModal({
                 onPress={onClose}
                 style={[styles.actionBtn, { borderColor: colors.border, borderWidth: 1 }]}
               >
-                <Text style={{ color: colors.foreground, fontSize: 13 }}>Cancel</Text>
+                <Text style={{ color: colors.foreground, fontSize: 13 }}>{t("picker.cancel")}</Text>
               </Pressable>
 
               <Pressable
@@ -504,7 +507,7 @@ export function ProjectFileModal({
                 ]}
               >
                 <Text style={{ color: "#fff", fontWeight: "600", fontSize: 13 }}>
-                  {pickerType === "folder" ? "Choose Folder" : "Choose File"}
+                  {pickerType === "folder" ? t("picker.chooseFolder") : t("picker.chooseFile")}
                 </Text>
               </Pressable>
             </View>

package/client/renderer.tsx

@@ -1,5 +1,5 @@
 import type { PluginHostProps } from "@getpaseo/plugin/client";
-import { useRpc } from "@getpaseo/plugin/client";
+import { useRpc, useTranslation } from "@getpaseo/plugin/client";
 import React, { createContext, useContext, useRef, useState } from "react";
 import { View, Text, TextInput, Pressable, StyleSheet, Switch, ScrollView, Platform } from "react-native";
 import {
@@ -11,6 +11,7 @@ import {
   normalizeExtensions,
 } from "../shared/schema";
 import { extractInitialValues, validateForm, formatSubmissionMessage } from "../shared/form-helpers";
+import { messages } from "./messages";
 import { ProjectFileModal } from "./project-file-modal";
 
 const MENU_WIDTH = 220;
@@ -83,6 +84,7 @@ function DropdownSelect({
   const buttonRef = useRef<View>(null);
   const isOpen = menuCtx?.openMenuId === node.id;
   const selectedOption = node.options.find((opt) => opt.value === value);
+  const { t } = useTranslation(messages);
 
   return (
     <View style={styles.fieldContainer}>
@@ -111,7 +113,7 @@ function DropdownSelect({
               { color: selectedOption ? theme.colors.foreground : theme.colors.foregroundMuted },
             ]}
           >
-            {selectedOption ? selectedOption.label : "Select an option..."}
+            {selectedOption ? selectedOption.label : t("dropdown.placeholder")}
           </Text>
           <Text style={[styles.dropdownChevron, { color: theme.colors.foregroundMuted }]}>
             {isOpen ? "▲" : "▼"}
@@ -143,6 +145,7 @@ function DropdownMultiSelect({
   const buttonRef = useRef<View>(null);
   const isOpen = menuCtx?.openMenuId === node.id;
   const selectedOptions = node.options.filter((opt) => value.includes(opt.value));
+  const { t } = useTranslation(messages);
 
   return (
     <View style={styles.fieldContainer}>
@@ -174,7 +177,7 @@ function DropdownMultiSelect({
           >
             {selectedOptions.length > 0
               ? selectedOptions.map((o) => o.label).join(", ")
-              : (node.placeholder ?? "Select options...")}
+              : (node.placeholder ?? t("dropdown.multiPlaceholder"))}
           </Text>
           <Text style={[styles.dropdownChevron, { color: theme.colors.foregroundMuted }]}>
             {isOpen ? "▲" : "▼"}
@@ -205,6 +208,7 @@ function FilePickerField({
   onChange: (val: string) => void;
 }) {
   const [modalVisible, setModalVisible] = useState(false);
+  const { t } = useTranslation(messages);
   const colors = theme.colors;
   const cleanExts = normalizeExtensions(node.extensions, node.extension);
 
@@ -239,9 +243,7 @@ function FilePickerField({
           onChangeText={onChange}
           placeholder={
             node.placeholder ||
-            (node.pickerType === "folder"
-              ? "Enter or select folder..."
-              : "Enter or select file...")
+            (node.pickerType === "folder" ? t("file.folderPlaceholder") : t("file.filePlaceholder"))
           }
           placeholderTextColor={colors.foregroundMuted}
           editable={!disabled}
@@ -262,14 +264,14 @@ function FilePickerField({
             onPress={() => setModalVisible(true)}
             style={[styles.pickerBrowseBtn, { backgroundColor: colors.surface1, borderColor: colors.border }]}
           >
-            <Text style={{ color: colors.foreground, fontSize: 12, fontWeight: "500" }}>Browse...</Text>
+            <Text style={{ color: colors.foreground, fontSize: 12, fontWeight: "500" }}>{t("file.browse")}</Text>
           </Pressable>
         </View>
       </View>
 
       {value ? (
         <View style={[styles.pathInspector, { backgroundColor: colors.surface1, borderColor: colors.border }]}>
-          <Text style={[styles.pathInspectorLabel, { color: colors.foregroundMuted }]}>Full path:</Text>
+          <Text style={[styles.pathInspectorLabel, { color: colors.foregroundMuted }]}>{t("file.fullPath")}</Text>
           <ScrollView
             horizontal
             showsHorizontalScrollIndicator={true}
@@ -608,6 +610,7 @@ export const PfrFormView: React.FC<PfrFormViewProps> = ({ form, theme, agentId,
   // The dropdown menu floats over the form at its root (measured position), so opening it never moves anything.
   const [menuPos, setMenuPos] = useState<OpenDropdownMenu | null>(null);
   const rootRef = useRef<View>(null);
+  const { t } = useTranslation(messages);
 
   const toggleMenu = (
     id: string,
@@ -683,13 +686,13 @@ export const PfrFormView: React.FC<PfrFormViewProps> = ({ form, theme, agentId,
         />
         {status === "submitted" && (
           <View style={[styles.submittedBanner, { backgroundColor: theme.colors.surface2, borderColor: theme.colors.statusSuccess, borderWidth: 1 }]}>
-            <Text style={[styles.submittedText, { color: theme.colors.statusSuccess }]}>✓ Form Submitted</Text>
+            <Text style={[styles.submittedText, { color: theme.colors.statusSuccess }]}>{t("form.submitted")}</Text>
           </View>
         )}
         {menuPos ? (
           <>
             <Pressable
-              accessibilityLabel="Close dropdown menu"
+              accessibilityLabel={t("dropdown.close")}
               onPress={() => setMenuPos(null)}
               style={[StyleSheet.absoluteFill, { zIndex: 999 }]}
             />

package/client/settings-screen.tsx

@@ -1,11 +1,13 @@
 import type { PluginSurfaceProps } from "@getpaseo/plugin/client";
-import { useSettings } from "@getpaseo/plugin/client";
+import { useSettings, useTranslation } from "@getpaseo/plugin/client";
 import React from "react";
 import { ActivityIndicator, Pressable, StyleSheet, Switch, Text, View } from "react-native";
 import { MAX_AUTO_FIX_RETRIES, pfrSettings } from "../shared/settings";
+import { messages } from "./messages";
 
 export const PfrSettingsScreen: React.FC<PluginSurfaceProps> = ({ theme }) => {
   const settings = useSettings(pfrSettings);
+  const { t } = useTranslation(messages);
   const { colors } = theme;
 
   if (settings.status === "loading") {
@@ -20,20 +22,20 @@ export const PfrSettingsScreen: React.FC<PluginSurfaceProps> = ({ theme }) => {
     return (
       <View style={styles.container}>
         <Text style={[styles.errorText, { color: colors.statusDanger }]}>
-          Could not load settings: {settings.error}
+          {t("settings.loadError", { error: settings.error })}
         </Text>
         <Pressable
           style={[styles.stepButton, styles.retryButton, { borderColor: colors.border, backgroundColor: colors.surface2 }]}
           onPress={() => void settings.reload()}
         >
-          <Text style={[styles.stepText, { color: colors.foreground }]}>Retry</Text>
+          <Text style={[styles.stepText, { color: colors.foreground }]}>{t("settings.retry")}</Text>
         </Pressable>
         {settings.status === "invalid" && (
           <Pressable
             style={[styles.stepButton, styles.retryButton, { borderColor: colors.border, backgroundColor: colors.surface2 }]}
             onPress={() => void settings.reset()}
           >
-            <Text style={[styles.stepText, { color: colors.foreground }]}>Reset to defaults</Text>
+            <Text style={[styles.stepText, { color: colors.foreground }]}>{t("settings.resetDefaults")}</Text>
           </Pressable>
         )}
       </View>
@@ -53,18 +55,14 @@ export const PfrSettingsScreen: React.FC<PluginSurfaceProps> = ({ theme }) => {
 
   return (
     <View style={styles.container}>
-      <Text style={[styles.title, { color: colors.foreground }]}>Automatic form fixes</Text>
-      <Text style={[styles.description, { color: colors.foregroundMuted }]}>
-        When an agent replies with a pfr-form block that fails validation, ask it to re-send a corrected block
-        automatically. This sets how many times in a row the agent is asked; 0 turns automatic fixes off. The
-        "Ask agent to fix" button on an error box always works.
-      </Text>
+      <Text style={[styles.title, { color: colors.foreground }]}>{t("settings.autoFixTitle")}</Text>
+      <Text style={[styles.description, { color: colors.foregroundMuted }]}>{t("settings.autoFixDescription")}</Text>
 
       <View style={styles.row}>
-        <Text style={[styles.label, { color: colors.foreground }]}>Maximum retries</Text>
+        <Text style={[styles.label, { color: colors.foreground }]}>{t("settings.maxRetries")}</Text>
         <View style={styles.stepper}>
           <Pressable
-            accessibilityLabel="Decrease retries"
+            accessibilityLabel={t("settings.decreaseRetries")}
             disabled={value <= 0 || settings.saving}
             style={stepStyle(value <= 0 || settings.saving)}
             onPress={() => change(value - 1)}
@@ -73,7 +71,7 @@ export const PfrSettingsScreen: React.FC<PluginSurfaceProps> = ({ theme }) => {
           </Pressable>
           <Text style={[styles.value, { color: colors.foreground }]}>{value}</Text>
           <Pressable
-            accessibilityLabel="Increase retries"
+            accessibilityLabel={t("settings.increaseRetries")}
             disabled={value >= MAX_AUTO_FIX_RETRIES || settings.saving}
             style={stepStyle(value >= MAX_AUTO_FIX_RETRIES || settings.saving)}
             onPress={() => change(value + 1)}
@@ -84,26 +82,23 @@ export const PfrSettingsScreen: React.FC<PluginSurfaceProps> = ({ theme }) => {
       </View>
 
       <Text style={[styles.hint, { color: colors.foregroundMuted }]}>
-        {value === 0 ? "Automatic fixes are off." : `Up to ${value} automatic ${value === 1 ? "request" : "requests"} per reply.`}
-        {settings.saving ? " Saving…" : ""}
+        {value === 0 ? t("settings.hintOff") : t("settings.hint", { count: value })}
+        {settings.saving ? ` ${t("settings.saving")}` : ""}
       </Text>
 
-      <Text style={[styles.title, { color: colors.foreground }]}>Prefer forms</Text>
-      <Text style={[styles.description, { color: colors.foregroundMuted }]}>
-        By default the agent is only told it can use pfr-form. Turn this on to require it to ask for choices,
-        parameters, and confirmations with a form instead of plain text. Applies to agents created after the change.
-      </Text>
+      <Text style={[styles.title, { color: colors.foreground }]}>{t("settings.preferFormsTitle")}</Text>
+      <Text style={[styles.description, { color: colors.foregroundMuted }]}>{t("settings.preferFormsDescription")}</Text>
       <View style={styles.row}>
-        <Text style={[styles.label, { color: colors.foreground }]}>Require forms for user input</Text>
+        <Text style={[styles.label, { color: colors.foreground }]}>{t("settings.requireForms")}</Text>
         <Switch
-          accessibilityLabel="Require forms for user input"
+          accessibilityLabel={t("settings.requireForms")}
           value={settings.values.preferForms}
           disabled={settings.saving}
           onValueChange={(next) => void settings.save({ ...settings.values, preferForms: next }, settings.revision)}
         />
       </View>
       {settings.saveError && (
-        <Text style={[styles.errorText, { color: colors.statusDanger }]}>Could not save: {settings.saveError}</Text>
+        <Text style={[styles.errorText, { color: colors.statusDanger }]}>{t("settings.saveError", { error: settings.saveError })}</Text>
       )}
     </View>
   );

package/index.client.tsx

@@ -5,6 +5,7 @@ import { Platform } from "react-native";
 import { z } from "zod";
 import { hasFormBlock } from "./shared/parser";
 import { MessageContainer } from "./client/container";
+import { messages } from "./client/messages";
 import { PfrSettingsScreen } from "./client/settings-screen";
 import { showDemoForm } from "./shared/demo";
 import { PFR_PROMPT_INSTRUCTION } from "./shared/prompt";
@@ -78,7 +79,7 @@ export default function contribute(client: PluginClientContext) {
   // Slash command to enable pfr-form in an existing agent session
   client.addSlashCommand({
     name: "form",
-    description: "Instruct the agent to use pfr-form protocol",
+    description: messages.message("slash.form"),
     argumentHint: "[task]",
     context: "agent",
     async onSubmit({ args, paseo, agent }) {
@@ -90,7 +91,7 @@ export default function contribute(client: PluginClientContext) {
   // Slash command to show a sample form
   client.addSlashCommand({
     name: "form-demo",
-    description: "Show a demo interactive form",
+    description: messages.message("slash.formDemo"),
     argumentHint: "",
     context: "agent",
     async onSubmit({ rpc, agent }) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "paseo-form-render",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Interactive forms, dashboards, and metric displays in Paseo conversations using pfr-form code fences.",
   "license": "MIT",
   "files": [
@@ -21,8 +21,8 @@
     "e2e": "npm --prefix e2e run e2e --"
   },
   "devDependencies": {
-    "@getpaseo/client": "^0.11.2",
-    "@getpaseo/plugin": "^0.11.2",
+    "@getpaseo/client": "^0.13.0",
+    "@getpaseo/plugin": "^0.13.0",
     "@tanstack/react-query": "^5.90.11",
     "@types/node": "^22.20.4",
     "@types/react": "~19.2.0",

package/paseo-plugin.json

@@ -3,6 +3,6 @@
   "name": "Paseo Form Render",
   "description": "Render interactive forms, metrics, and dashboards in conversations using pfr-form code blocks",
   "requirements": {
-    "paseo": ">=0.11.4"
+    "paseo": ">=0.13.0"
   }
 }

package/server/auto-fix.ts

@@ -147,10 +147,29 @@ export function registerAutoFix(server: PluginServerContext, settings: PfrSettin
     return (await readPfrSettings(settings)).autoFixMaxRetries;
   }
 
+  /** The newest history of the agent, or null when it cannot be read (the caller then sends nothing). */
+  async function readTail(agent: {
+    timeline: { refetch(options: { direction: "tail"; limit: number; projection: "projected" }): Promise<unknown> };
+  }): Promise<TimelineEntry[] | null> {
+    try {
+      const history = timelineFromPayload(
+        await agent.timeline.refetch({ direction: "tail", limit: HISTORY_LIMIT, projection: "projected" }),
+      );
+      return history?.items ?? null;
+    } catch (error) {
+      console.warn("[paseo-form-render] could not fetch agent history, skipping auto-fix", error);
+      return null;
+    }
+  }
+
   return server.on("agent.turn_ended", async (event, { paseo, signal }) => {
     try {
+      const agent = paseo.agents.ref(event.agent.id);
+      // Paseo 0.13 sends an always-empty `timeline` on this event (deprecated), so the finished turn is read from history.
+      const turnTimeline = event.timeline.length > 0 ? event.timeline : await readTail(agent);
+      if (!turnTimeline) return;
       const turn: TurnInput = {
-        turnTimeline: event.timeline,
+        turnTimeline,
         outcome: event.outcome,
         maxRetries: await readMaxRetries(),
       };
@@ -161,7 +180,6 @@ export function registerAutoFix(server: PluginServerContext, settings: PfrSettin
       await new Promise<void>((resolve) => setTimeout(resolve, 0));
       if (signal.aborted) return;
 
-      const agent = paseo.agents.ref(event.agent.id);
       let history: ReturnType<typeof timelineFromPayload> = null;
       try {
         history = timelineFromPayload(