@jupyterlite/ai 0.9.1 → 0.10.0

package/lib/components/clear-button.d.ts

@@ -1,4 +1,5 @@
 import { InputToolbarRegistry } from '@jupyter/chat';
+import type { TranslationBundle } from '@jupyterlab/translation';
 /**
  * Properties of the clear button.
  */
@@ -7,6 +8,10 @@ export interface IClearButtonProps extends InputToolbarRegistry.IToolbarItemProp
      * The function to clear messages.
      */
     clearMessages: () => void;
+    /**
+     * The application language translator.
+     */
+    translator: TranslationBundle;
 }
 /**
  * The clear button component.
@@ -15,4 +20,4 @@ export declare function ClearButton(props: IClearButtonProps): JSX.Element;
 /**
  * Factory returning the clear button toolbar item.
  */
-export declare function clearItem(): InputToolbarRegistry.IToolbarItem;
+export declare function clearItem(translator: TranslationBundle): InputToolbarRegistry.IToolbarItem;

package/lib/components/clear-button.js

@@ -5,7 +5,8 @@ import React from 'react';
  * The clear button component.
  */
 export function ClearButton(props) {
-    const tooltip = 'Clear chat';
+    const { translator: trans } = props;
+    const tooltip = trans.__('Clear chat');
     return (React.createElement(TooltippedButton, { onClick: props.clearMessages, tooltip: tooltip, buttonProps: {
             size: 'small',
             variant: 'outlined',
@@ -17,12 +18,16 @@ export function ClearButton(props) {
 /**
  * Factory returning the clear button toolbar item.
  */
-export function clearItem() {
+export function clearItem(translator) {
     return {
         element: (props) => {
             const { model } = props;
             const clearMessages = () => model.chatContext.clearMessages();
-            const clearProps = { ...props, clearMessages };
+            const clearProps = {
+                ...props,
+                clearMessages,
+                translator
+            };
             return ClearButton(clearProps);
         },
         position: 0,

package/lib/components/completion-status.d.ts

@@ -1,5 +1,6 @@
 import { AISettingsModel } from '../models/settings-model';
 import { ReactWidget } from '@jupyterlab/ui-components';
+import type { TranslationBundle } from '@jupyterlab/translation';
 /**
  * The completion status props.
  */
@@ -8,6 +9,10 @@ interface ICompletionStatusProps {
      * The settings model.
      */
     settingsModel: AISettingsModel;
+    /**
+     * The application language translator.
+     */
+    translator: TranslationBundle;
 }
 /**
  * The completion status widget that will be added to the status bar.

package/lib/components/completion-status.js

@@ -7,6 +7,7 @@ const COMPLETION_DISABLED_CLASS = 'jp-ai-completion-disabled';
  * The completion status component.
  */
 function CompletionStatus(props) {
+    const { translator: trans } = props;
     const [disabled, setDisabled] = useState(true);
     const [title, setTitle] = useState('');
     /**
@@ -16,15 +17,15 @@ function CompletionStatus(props) {
         const stateChanged = (model) => {
             if (model.config.useSameProviderForChatAndCompleter) {
                 setDisabled(false);
-                setTitle(`Completion using ${model.getDefaultProvider()?.model}`);
+                setTitle(trans.__('Completion using %1', model.getDefaultProvider()?.model ?? ''));
             }
             else if (model.config.activeCompleterProvider) {
                 setDisabled(false);
-                setTitle(`Completion using ${model.getProvider(model.config.activeCompleterProvider)?.model}`);
+                setTitle(trans.__('Completion using %1', model.getProvider(model.config.activeCompleterProvider)?.model ?? ''));
             }
             else {
                 setDisabled(true);
-                setTitle('No completion');
+                setTitle(trans.__('No completion'));
             }
         };
         props.settingsModel.stateChanged.connect(stateChanged);
@@ -32,7 +33,7 @@ function CompletionStatus(props) {
         return () => {
             props.settingsModel.stateChanged.disconnect(stateChanged);
         };
-    }, [props.settingsModel]);
+    }, [props.settingsModel, trans]);
     return (React.createElement(jupyternautIcon.react, { className: disabled ? COMPLETION_DISABLED_CLASS : '', top: '2px', width: '16px', stylesheet: 'statusBar', title: title }));
 }
 /**

package/lib/components/model-select.d.ts

@@ -1,4 +1,5 @@
 import { InputToolbarRegistry } from '@jupyter/chat';
+import type { TranslationBundle } from '@jupyterlab/translation';
 import { AISettingsModel } from '../models/settings-model';
 /**
  * Properties for the model select component.
@@ -8,6 +9,10 @@ export interface IModelSelectProps extends InputToolbarRegistry.IToolbarItemProp
      * The settings model to get available models and current selection from.
      */
     settingsModel: AISettingsModel;
+    /**
+     * The application language translator.
+     */
+    translator: TranslationBundle;
 }
 /**
  * The model select component for choosing AI models.
@@ -16,4 +21,4 @@ export declare function ModelSelect(props: IModelSelectProps): JSX.Element;
 /**
  * Factory function returning the toolbar item for model selection.
  */
-export declare function createModelSelectItem(settingsModel: AISettingsModel): InputToolbarRegistry.IToolbarItem;
+export declare function createModelSelectItem(settingsModel: AISettingsModel, translator: TranslationBundle): InputToolbarRegistry.IToolbarItem;

package/lib/components/model-select.js

@@ -6,7 +6,7 @@ import React, { useCallback, useEffect, useState } from 'react';
  * The model select component for choosing AI models.
  */
 export function ModelSelect(props) {
-    const { settingsModel, model } = props;
+    const { settingsModel, model, translator: trans } = props;
     const agentManager = model.chatContext
         .agentManager;
     const [currentProvider, setCurrentProvider] = useState(agentManager.activeProvider ?? '');
@@ -60,28 +60,28 @@ export function ModelSelect(props) {
     }));
     // Show a message if no providers are configured
     if (availableModels.length === 0) {
-        return (React.createElement(TooltippedButton, { onClick: () => { }, tooltip: "No providers configured. Please go to AI Settings to add a provider.", buttonProps: {
+        return (React.createElement(TooltippedButton, { onClick: () => { }, tooltip: trans.__('No providers configured. Please go to AI Settings to add a provider.'), buttonProps: {
                 size: 'small',
                 variant: 'outlined',
                 color: 'warning',
                 disabled: true,
-                title: 'No Providers Available'
+                title: trans.__('No Providers Available')
             }, sx: {
                 minWidth: 'auto',
                 display: 'flex',
                 alignItems: 'center',
                 height: '29px'
             } },
-            React.createElement(Typography, { variant: "caption", sx: { fontSize: '0.7rem', fontWeight: 500 } }, "No Providers")));
+            React.createElement(Typography, { variant: "caption", sx: { fontSize: '0.7rem', fontWeight: 500 } }, trans.__('No Providers'))));
     }
     return (React.createElement(React.Fragment, null,
         React.createElement(TooltippedButton, { onClick: e => {
                 openMenu(e.currentTarget);
-            }, tooltip: `Current Model: ${currentProviderLabel} - ${currentModel}`, buttonProps: {
+            }, tooltip: trans.__('Current Model: %1 - %2', currentProviderLabel, currentModel), buttonProps: {
                 size: 'small',
                 variant: 'contained',
                 color: 'primary',
-                title: 'Select AI Model',
+                title: trans.__('Select AI Model'),
                 onKeyDown: e => {
                     if (e.key !== 'Enter' && e.key !== ' ') {
                         return;
@@ -144,7 +144,7 @@ export function ModelSelect(props) {
 /**
  * Factory function returning the toolbar item for model selection.
  */
-export function createModelSelectItem(settingsModel) {
+export function createModelSelectItem(settingsModel, translator) {
     return {
         element: (props) => {
             const chatContext = props.model.chatContext;
@@ -153,7 +153,8 @@ export function createModelSelectItem(settingsModel) {
             }
             const modelSelectProps = {
                 ...props,
-                settingsModel
+                settingsModel,
+                translator
             };
             return React.createElement(ModelSelect, { ...modelSelectProps });
         },

package/lib/components/stop-button.d.ts

@@ -1,4 +1,5 @@
 import { InputToolbarRegistry } from '@jupyter/chat';
+import type { TranslationBundle } from '@jupyterlab/translation';
 /**
  * Properties of the stop button.
  */
@@ -7,6 +8,10 @@ export interface IStopButtonProps extends InputToolbarRegistry.IToolbarItemProps
      * The function to stop streaming.
      */
     stopStreaming: () => void;
+    /**
+     * The application language translator.
+     */
+    translator: TranslationBundle;
 }
 /**
  * The stop button component.
@@ -15,4 +20,4 @@ export declare function StopButton(props: IStopButtonProps): JSX.Element;
 /**
  * Factory returning the stop button toolbar item.
  */
-export declare function stopItem(): InputToolbarRegistry.IToolbarItem;
+export declare function stopItem(translator: TranslationBundle): InputToolbarRegistry.IToolbarItem;

package/lib/components/stop-button.js

@@ -5,7 +5,8 @@ import React from 'react';
  * The stop button component.
  */
 export function StopButton(props) {
-    const tooltip = 'Stop streaming';
+    const { translator: trans } = props;
+    const tooltip = trans.__('Stop streaming');
     return (React.createElement(TooltippedButton, { onClick: props.stopStreaming, tooltip: tooltip, buttonProps: {
             size: 'small',
             variant: 'contained',
@@ -17,12 +18,16 @@ export function StopButton(props) {
 /**
  * Factory returning the stop button toolbar item.
  */
-export function stopItem() {
+export function stopItem(translator) {
     return {
         element: (props) => {
             const { model } = props;
             const stopStreaming = () => model.chatContext.stopStreaming();
-            const stopProps = { ...props, stopStreaming };
+            const stopProps = {
+                ...props,
+                stopStreaming,
+                translator
+            };
             return StopButton(stopProps);
         },
         position: 50,

package/lib/components/token-usage-display.d.ts

@@ -1,4 +1,5 @@
 import { ReactWidget } from '@jupyterlab/ui-components';
+import type { TranslationBundle } from '@jupyterlab/translation';
 import React from 'react';
 import { ISignal } from '@lumino/signaling';
 import { AISettingsModel } from '../models/settings-model';
@@ -19,6 +20,10 @@ export interface ITokenUsageDisplayProps {
      * Initial token usage.
      */
     initialTokenUsage?: ITokenUsage;
+    /**
+     * The application language translator.
+     */
+    translator: TranslationBundle;
 }
 /**
  * React component that displays token usage information.

package/lib/components/token-usage-display.js

@@ -5,7 +5,7 @@ import React from 'react';
  * Shows input/output token counts with up/down arrows.
  * Only renders when token usage display is enabled in settings.
  */
-export const TokenUsageDisplay = ({ tokenUsageChanged, settingsModel, initialTokenUsage }) => {
+export const TokenUsageDisplay = ({ tokenUsageChanged, settingsModel, initialTokenUsage, translator: trans }) => {
     return (React.createElement(UseSignal, { signal: settingsModel.stateChanged, initialArgs: undefined }, () => {
         const config = settingsModel.config;
         if (!config.showTokenUsage) {
@@ -30,7 +30,7 @@ export const TokenUsageDisplay = ({ tokenUsageChanged, settingsModel, initialTok
                     border: '1px solid var(--jp-border-color1)',
                     borderRadius: '4px',
                     whiteSpace: 'nowrap'
-                }, title: `Token Usage - Sent: ${tokenUsage.inputTokens.toLocaleString()}, Received: ${tokenUsage.outputTokens.toLocaleString()}, Total: ${total.toLocaleString()}` },
+                }, title: trans.__('Token Usage - Sent: %1, Received: %2, Total: %3', tokenUsage.inputTokens.toLocaleString(), tokenUsage.outputTokens.toLocaleString(), total.toLocaleString()) },
                 React.createElement("span", { style: {
                         display: 'flex',
                         alignItems: 'center',

package/lib/components/tool-select.d.ts

@@ -1,4 +1,5 @@
 import { InputToolbarRegistry } from '@jupyter/chat';
+import type { TranslationBundle } from '@jupyterlab/translation';
 import { IToolRegistry } from '../tokens';
 /**
  * Properties for the tool select component.
@@ -16,6 +17,10 @@ export interface IToolSelectProps extends InputToolbarRegistry.IToolbarItemProps
      * Function to handle tool selection changes.
      */
     onToolSelectionChange: (selectedToolNames: string[]) => void;
+    /**
+     * The application language translator.
+     */
+    translator: TranslationBundle;
 }
 /**
  * The tool select component for choosing AI tools.
@@ -24,4 +29,4 @@ export declare function ToolSelect(props: IToolSelectProps): JSX.Element;
 /**
  * Factory function returning the toolbar item for tool selection.
  */
-export declare function createToolSelectItem(toolRegistry: IToolRegistry, toolsEnabled?: boolean): InputToolbarRegistry.IToolbarItem;
+export declare function createToolSelectItem(toolRegistry: IToolRegistry, toolsEnabled: boolean | undefined, translator: TranslationBundle): InputToolbarRegistry.IToolbarItem;

package/lib/components/tool-select.js

@@ -8,7 +8,7 @@ const SELECT_ITEM_CLASS = 'jp-AIToolSelect-item';
  * The tool select component for choosing AI tools.
  */
 export function ToolSelect(props) {
-    const { toolRegistry, onToolSelectionChange, toolsEnabled } = props;
+    const { toolRegistry, onToolSelectionChange, toolsEnabled, translator: trans } = props;
     const [selectedToolNames, setSelectedToolNames] = useState([]);
     const [tools, setTools] = useState(toolRegistry?.namedTools || []);
     const [menuAnchorEl, setMenuAnchorEl] = useState(null);
@@ -63,11 +63,11 @@ export function ToolSelect(props) {
     return (React.createElement(React.Fragment, null,
         React.createElement(TooltippedButton, { onClick: e => {
                 openMenu(e.currentTarget);
-            }, tooltip: `Tools (${selectedToolNames.length}/${tools.length} selected)`, buttonProps: {
+            }, tooltip: trans.__('Tools (%1/%2 selected)', selectedToolNames.length.toString(), tools.length.toString()), buttonProps: {
                 size: 'small',
                 variant: selectedToolNames.length > 0 ? 'contained' : 'outlined',
                 color: 'primary',
-                title: 'Select AI Tools',
+                title: trans.__('Select AI Tools'),
                 onKeyDown: e => {
                     if (e.key !== 'Enter' && e.key !== ' ') {
                         return;
@@ -106,7 +106,7 @@ export function ToolSelect(props) {
 /**
  * Factory function returning the toolbar item for tool selection.
  */
-export function createToolSelectItem(toolRegistry, toolsEnabled = true) {
+export function createToolSelectItem(toolRegistry, toolsEnabled = true, translator) {
     return {
         element: (props) => {
             const onToolSelectionChange = (tools) => {
@@ -121,7 +121,8 @@ export function createToolSelectItem(toolRegistry, toolsEnabled = true) {
                 ...props,
                 toolRegistry,
                 onToolSelectionChange,
-                toolsEnabled
+                toolsEnabled,
+                translator
             };
             return React.createElement(ToolSelect, { ...toolSelectProps });
         },

package/lib/index.js

@@ -9,6 +9,7 @@ import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
 import { IKernelSpecManager } from '@jupyterlab/services';
 import { ISettingRegistry } from '@jupyterlab/settingregistry';
 import { IStatusBar } from '@jupyterlab/statusbar';
+import { ITranslator, nullTranslator } from '@jupyterlab/translation';
 import { settingsIcon, Toolbar, ToolbarButton } from '@jupyterlab/ui-components';
 import { ISecretsManager, SecretsManager } from 'jupyter-secrets-manager';
 import { PromiseDelegate, UUID } from '@lumino/coreutils';
@@ -108,9 +109,10 @@ const chatModelRegistry = {
     description: 'Registry for the current chat model',
     autoStart: true,
     requires: [IAISettingsModel, IAgentManagerFactory, IDocumentManager],
-    optional: [IProviderRegistry, INotebookTracker, IToolRegistry],
+    optional: [IProviderRegistry, INotebookTracker, IToolRegistry, ITranslator],
     provides: IChatModelRegistry,
-    activate: (app, settingsModel, agentManagerFactory, docManager, providerRegistry, notebookTracker, toolRegistry) => {
+    activate: (app, settingsModel, agentManagerFactory, docManager, providerRegistry, notebookTracker, toolRegistry, translator) => {
+        const trans = (translator ?? nullTranslator).load('jupyterlite_ai');
         // Create ActiveCellManager if notebook tracker is available
         let activeCellManager;
         if (notebookTracker) {
@@ -125,7 +127,8 @@ const chatModelRegistry = {
             agentManagerFactory,
             docManager,
             providerRegistry,
-            toolRegistry
+            toolRegistry,
+            trans
         });
     }
 };
@@ -142,8 +145,9 @@ const plugin = {
         IChatModelRegistry,
         IAISettingsModel
     ],
-    optional: [IThemeManager, ILayoutRestorer, ILabShell],
-    activate: (app, rmRegistry, inputToolbarFactory, modelRegistry, settingsModel, themeManager, restorer, labShell) => {
+    optional: [IThemeManager, ILayoutRestorer, ILabShell, ITranslator],
+    activate: (app, rmRegistry, inputToolbarFactory, modelRegistry, settingsModel, themeManager, restorer, labShell, translator) => {
+        const trans = (translator ?? nullTranslator).load('jupyterlite_ai');
         // Create attachment opener registry to handle file attachments
         const attachmentOpenerRegistry = new AttachmentOpenerRegistry();
         attachmentOpenerRegistry.set('file', attachment => {
@@ -178,14 +182,14 @@ const plugin = {
         });
         chatPanel.id = '@jupyterlite/ai:chat-panel';
         chatPanel.title.icon = chatIcon;
-        chatPanel.title.caption = 'Chat with AI assistant'; // TODO: i18n/
+        chatPanel.title.caption = trans.__('Chat with AI assistant');
         chatPanel.toolbar.addItem('spacer', Toolbar.createSpacerItem());
         chatPanel.toolbar.addItem('settings', new ToolbarButton({
             icon: settingsIcon,
             onClick: () => {
                 app.commands.execute('@jupyterlite/ai:open-settings');
             },
-            tooltip: 'Open AI Settings'
+            tooltip: trans.__('Open AI Settings')
         }));
         chatPanel.sectionAdded.connect((_, section) => {
             const { widget } = section;
@@ -199,7 +203,8 @@ const plugin = {
             const tokenUsageWidget = new TokenUsageWidget({
                 tokenUsageChanged: model.tokenUsageChanged,
                 settingsModel,
-                initialTokenUsage: model.agentManager.tokenUsage
+                initialTokenUsage: model.agentManager.tokenUsage,
+                translator: trans
             });
             section.toolbar.insertBefore('markRead', 'token-usage', tokenUsageWidget);
             model.writersChanged?.connect((_, writers) => {
@@ -216,7 +221,8 @@ const plugin = {
             });
             // Associate an approval buttons object to the chat.
             const approvalButton = new ApprovalButtons({
-                chatPanel: widget
+                chatPanel: widget,
+                agentManager: model.agentManager
             });
             widget.disposed.connect(() => {
                 // Dispose of the approval buttons widget when the chat is disposed.
@@ -251,14 +257,14 @@ const plugin = {
                 app.commands.execute(CommandIds.openChat);
             }
         });
-        registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry, inputToolbarFactory, settingsModel, tracker, modelRegistry, themeManager, labShell);
+        registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry, inputToolbarFactory, settingsModel, tracker, modelRegistry, trans, themeManager, labShell);
     }
 };
-function registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry, inputToolbarFactory, settingsModel, tracker, modelRegistry, themeManager, labShell) {
+function registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry, inputToolbarFactory, settingsModel, tracker, modelRegistry, trans, themeManager, labShell) {
     const { commands } = app;
     if (labShell) {
         commands.addCommand(CommandIds.reposition, {
-            label: 'Reposition Widget',
+            label: trans.__('Reposition Widget'),
             execute: (args) => {
                 const { widgetId, area, mode } = args;
                 const widget = widgetId
@@ -284,16 +290,16 @@ function registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry,
                     properties: {
                         widgetId: {
                             type: 'string',
-                            description: 'The widget ID to reposition in the application shell'
+                            description: trans.__('The widget ID to reposition in the application shell')
                         },
                         area: {
                             type: 'string',
-                            description: 'The name of the area to reposition the widget to'
+                            description: trans.__('The name of the area to reposition the widget to')
                         },
                         mode: {
                             type: 'string',
                             enum: ['split-left', 'split-right', 'split-top', 'split-bottom'],
-                            description: 'The mode to use when repositioning the widget'
+                            description: trans.__('The mode to use when repositioning the widget')
                         }
                     }
                 }
@@ -307,7 +313,12 @@ function registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry,
                 inputToolbarRegistry: inputToolbarFactory.create(),
                 attachmentOpenerRegistry
             });
-            const widget = new MainAreaChat({ content, commands, settingsModel });
+            const widget = new MainAreaChat({
+                content,
+                commands,
+                settingsModel,
+                trans
+            });
             app.shell.add(widget, 'main');
             // Add the widget to the tracker.
             tracker.add(widget);
@@ -321,7 +332,7 @@ function registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry,
             });
         };
         commands.addCommand(CommandIds.openChat, {
-            label: 'Open a chat',
+            label: trans.__('Open a chat'),
             execute: async (args) => {
                 const area = args.area === 'main' ? 'main' : 'side';
                 const provider = args.provider ?? undefined;
@@ -348,22 +359,22 @@ function registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry,
                         area: {
                             type: 'string',
                             enum: ['main', 'side'],
-                            description: 'The name of the area to open the chat to'
+                            description: trans.__('The name of the area to open the chat to')
                         },
                         name: {
                             type: 'string',
-                            description: 'The name of the chat'
+                            description: trans.__('The name of the chat')
                         },
                         provider: {
                             type: 'string',
-                            description: 'The provider/model to use with this chat'
+                            description: trans.__('The provider/model to use with this chat')
                         }
                     }
                 }
             }
         });
         commands.addCommand(CommandIds.moveChat, {
-            caption: 'Move chat between area',
+            caption: trans.__('Move chat between area'),
             execute: async (args) => {
                 const area = args.area;
                 if (!['side', 'main'].includes(area)) {
@@ -399,7 +410,7 @@ function registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry,
                 const status = await Promise.any([
                     trackerUpdated.promise,
                     new Promise(r => setTimeout(() => {
-                        return false;
+                        r(false);
                     }, 2000))
                 ]);
                 tracker.widgetUpdated.disconnect(widgetUpdated);
@@ -427,11 +438,11 @@ function registerCommands(app, rmRegistry, chatPanel, attachmentOpenerRegistry,
                         area: {
                             type: 'string',
                             enum: ['main', 'side'],
-                            description: 'The name of the area to move the chat to'
+                            description: trans.__('The name of the area to move the chat to')
                         },
                         name: {
                             type: 'string',
-                            description: 'The name of the chat to move'
+                            description: trans.__('The name of the chat to move')
                         }
                     },
                     requires: ['area', 'name']
@@ -454,9 +465,11 @@ const agentManagerFactory = SecretsManager.sign(SECRETS_NAMESPACE, token => ({
         ICompletionProviderManager,
         ILayoutRestorer,
         ISecretsManager,
-        IThemeManager
+        IThemeManager,
+        ITranslator
     ],
-    activate: (app, settingsModel, providerRegistry, palette, completionManager, restorer, secretsManager, themeManager) => {
+    activate: (app, settingsModel, providerRegistry, palette, completionManager, restorer, secretsManager, themeManager, translator) => {
+        const trans = (translator ?? nullTranslator).load('jupyterlite_ai');
         const agentManagerFactory = new AgentManagerFactory({
             settingsModel,
             secretsManager,
@@ -469,7 +482,8 @@ const agentManagerFactory = SecretsManager.sign(SECRETS_NAMESPACE, token => ({
             themeManager,
             providerRegistry,
             secretsManager,
-            token
+            token,
+            trans
         });
         settingsWidget.id = 'jupyterlite-ai-settings';
         settingsWidget.title.icon = settingsIcon;
@@ -491,8 +505,8 @@ const agentManagerFactory = SecretsManager.sign(SECRETS_NAMESPACE, token => ({
             restorer.add(settingsWidget, settingsWidget.id);
         }
         app.commands.addCommand(CommandIds.openSettings, {
-            label: 'AI Settings',
-            caption: 'Configure AI providers and behavior',
+            label: trans.__('AI Settings'),
+            caption: trans.__('Configure AI providers and behavior'),
             icon: settingsIcon,
             iconClass: 'jp-ai-settings-icon',
             execute: () => {
@@ -515,7 +529,7 @@ const agentManagerFactory = SecretsManager.sign(SECRETS_NAMESPACE, token => ({
         if (palette) {
             palette.addItem({
                 command: CommandIds.openSettings,
-                category: 'AI Assistant'
+                category: trans.__('AI Assistant')
             });
         }
         return agentManagerFactory;
@@ -612,11 +626,13 @@ const inputToolbarFactory = {
     autoStart: true,
     provides: IInputToolbarRegistryFactory,
     requires: [IAISettingsModel, IToolRegistry],
-    activate: (app, settingsModel, toolRegistry) => {
-        const stopButton = stopItem();
-        const clearButton = clearItem();
-        const toolSelectButton = createToolSelectItem(toolRegistry, settingsModel.config.toolsEnabled);
-        const modelSelectButton = createModelSelectItem(settingsModel);
+    optional: [ITranslator],
+    activate: (app, settingsModel, toolRegistry, translator) => {
+        const trans = (translator ?? nullTranslator).load('jupyterlite_ai');
+        const stopButton = stopItem(trans);
+        const clearButton = clearItem(trans);
+        const toolSelectButton = createToolSelectItem(toolRegistry, settingsModel.config.toolsEnabled, trans);
+        const modelSelectButton = createModelSelectItem(settingsModel, trans);
         return {
             create() {
                 const inputToolbarRegistry = InputToolbarRegistry.defaultToolbarRegistry();
@@ -644,12 +660,16 @@ const completionStatus = {
     description: 'The completion status displayed in the status bar',
     autoStart: true,
     requires: [IAISettingsModel],
-    optional: [IStatusBar],
-    activate: (app, settingsModel, statusBar) => {
+    optional: [IStatusBar, ITranslator],
+    activate: (app, settingsModel, statusBar, translator) => {
         if (!statusBar) {
             return;
         }
-        const item = new CompletionStatusWidget({ settingsModel });
+        const trans = (translator ?? nullTranslator).load('jupyterlite_ai');
+        const item = new CompletionStatusWidget({
+            settingsModel,
+            translator: trans
+        });
         statusBar?.registerStatusItem('completionState', {
             item,
             align: 'right',

package/lib/models/settings-model.d.ts

@@ -2,7 +2,7 @@ import { VDomModel } from '@jupyterlab/ui-components';
 import { ISettingRegistry } from '@jupyterlab/settingregistry';
 export interface IProviderParameters {
     temperature?: number;
-    maxTokens?: number;
+    maxOutputTokens?: number;
     maxTurns?: number;
     supportsFillInMiddle?: boolean;
     useFilterText?: boolean;