@allbluecn/web-app 0.9.5 → 0.10.0

package/src/components/tiptap/notion-like/notion-like-editor-header.tsx

@@ -15,9 +15,7 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-
 import { useContext, useEffect, useState } from "react"
-import { useTranslation } from 'react-i18next'
 import { EditorContext } from "@tiptap/react"
 import { FolderOpen } from "lucide-react"
 import { ThemeToggle } from "./notion-like-editor-theme-toggle.tsx"
@@ -42,9 +40,9 @@ import {
 
 // --- Styles ---
 import "./notion-like-editor-header.scss"
+import { m } from "@/paraglide/messages.js";
 
 export function NotionEditorHeader() {
-  const { t } = useTranslation('editor')
   const { editor } = useContext(EditorContext)!
   const [showLocalFileBtn, setShowLocalFileBtn] = useState(false)
 
@@ -77,7 +75,7 @@ export function NotionEditorHeader() {
                   <FolderOpen className="size-4" />
                 </Button>
               </TooltipTrigger>
-              <TooltipContent> {t('insert-local-file') } </TooltipContent>
+              <TooltipContent> {m['editor_insert-local-file']() } </TooltipContent>
             </Tooltip>
           </ButtonGroup>
         )}

package/src/components/tiptap/notion-like/notion-like-editor-mobile-toolbar.tsx

@@ -1,4 +1,3 @@
-import { useTranslation } from "react-i18next"
 // SPDX-License-Identifier: AGPL-3.0-or-later
 // AllBlue - 理想之海
 // Copyright (C) 2026 AllBlue Contributors
@@ -16,7 +15,6 @@ import { useTranslation } from "react-i18next"
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-
 import { cloneElement, useEffect, useMemo, useRef, useState } from "react"
 import { type Editor } from "@tiptap/react"
 
@@ -97,6 +95,7 @@ import {
 import { MoveNodeButton } from "../ui/move-node-button/index.tsx"
 import { useCursorVisibility } from "../hooks/use-cursor-visibility.ts"
 import { ImageNodeFloating } from "../node/image-node/image-node-floating.tsx"
+import { m } from "@/paraglide/messages.js";
 
 // =============================================================================
 // Types & Constants
@@ -166,11 +165,11 @@ function hasTextSelection(editor: Editor | null): boolean {
 // Toolbar View Registry
 // =============================================================================
 
-function createToolbarViewRegistry(t: (key: string) => string): ToolbarViewRegistry {
+function createToolbarViewRegistry(): ToolbarViewRegistry {
   return {
     [TOOLBAR_VIEWS.HIGHLIGHTER]: {
       id: TOOLBAR_VIEWS.HIGHLIGHTER,
-      title: t('text-highlight'),
+      title: m['editor_text-highlight'](),
       icon: <HighlighterIcon className="tiptap-button-icon" />,
       content: <ColorHighlightPopoverContent />,
       mobileButton: (onClick: () => void) => (
@@ -183,7 +182,7 @@ function createToolbarViewRegistry(t: (key: string) => string): ToolbarViewRegis
     },
     [TOOLBAR_VIEWS.LINK]: {
       id: TOOLBAR_VIEWS.LINK,
-      title: t('link-edit'),
+      title: m['editor_link-edit'](),
       icon: <LinkIcon className="tiptap-button-icon" />,
       content: <LinkContent />,
       mobileButton: (onClick: () => void) => <LinkButton onClick={onClick} />,
@@ -256,7 +255,6 @@ function FormattingGroup() {
 }
 
 function ColorActionGroup() {
-  const { t } = useTranslation('editor')
   const { recentColors, isInitialized, addRecentColor } = useRecentColors()
 
   const renderRecentColors = () => {
@@ -265,7 +263,7 @@ function ColorActionGroup() {
     return (
       <>
         <DropdownMenuGroup>
-          <DropdownMenuLabel> {t('recently-used-colors') } </DropdownMenuLabel>
+          <DropdownMenuLabel> {m['editor_recently-used-colors']() } </DropdownMenuLabel>
           {recentColors.map((colorObj) => (
             <DropdownMenuItem
               key={`${colorObj.type}-${colorObj.value}`}
@@ -313,7 +311,7 @@ function ColorActionGroup() {
       <DropdownMenuSubTrigger asChild>
         <Button variant="ghost">
           <PaintBucketIcon className="tiptap-button-icon" />
-          <span className="tiptap-button-text"> {t('color') } </span>
+          <span className="tiptap-button-text"> {m.editor_color() } </span>
           <Spacer />
           <ChevronRightIcon className="tiptap-button-icon" />
         </Button>
@@ -324,7 +322,7 @@ function ColorActionGroup() {
           {renderRecentColors()}
 
           <DropdownMenuGroup>
-            <DropdownMenuLabel> {t('text-color') } </DropdownMenuLabel>
+            <DropdownMenuLabel> {m['editor_text-color']() } </DropdownMenuLabel>
 
             {TEXT_COLORS.map((textColor) => (
               <DropdownMenuItem key={textColor.value} asChild>
@@ -344,7 +342,7 @@ function ColorActionGroup() {
           <Separator orientation="horizontal" />
 
           <DropdownMenuGroup>
-            <DropdownMenuLabel> {t('highlight-color') } </DropdownMenuLabel>
+            <DropdownMenuLabel> {m['editor_highlight-color']() } </DropdownMenuLabel>
 
             {HIGHLIGHT_COLORS.map((highlightColor) => (
               <DropdownMenuItem key={highlightColor.value} asChild>
@@ -370,13 +368,12 @@ function ColorActionGroup() {
 }
 
 function TransformActionGroup() {
-  const { t } = useTranslation('editor')
   return (
     <DropdownMenuSub>
       <DropdownMenuSubTrigger asChild>
         <Button variant="ghost">
           <Repeat2Icon className="tiptap-button-icon" />
-          <span className="tiptap-button-text"> {t('convert-to') } </span>
+          <span className="tiptap-button-text"> {m['editor_convert-to']() } </span>
           <Spacer />
           <ChevronRightIcon className="tiptap-button-icon" />
         </Button>
@@ -399,7 +396,6 @@ interface DropdownMenuActionsProps {
 }
 
 function DropdownMenuActions({ editor }: DropdownMenuActionsProps) {
-  const { t } = useTranslation('editor')
   const isMobile = useIsBreakpoint()
 
   return (
@@ -411,7 +407,7 @@ function DropdownMenuActions({ editor }: DropdownMenuActionsProps) {
         <TransformActionGroup />
 
         <DropdownMenuItem asChild>
-          <ResetAllFormattingButton text={t('reset-format')} />
+          <ResetAllFormattingButton text={m['editor_reset-format']()} />
         </DropdownMenuItem>
       </DropdownMenuGroup>
 
@@ -419,17 +415,17 @@ function DropdownMenuActions({ editor }: DropdownMenuActionsProps) {
 
       <DropdownMenuGroup>
         <DropdownMenuItem asChild>
-          <DuplicateButton text={t('copy-node')} showShortcut={!isMobile} />
+          <DuplicateButton text={m['editor_copy-node']()} showShortcut={!isMobile} />
         </DropdownMenuItem>
         <DropdownMenuItem asChild>
           <CopyToClipboardButton
-            text={t('copy-to-clipboard')}
+            text={m['editor_copy-to-clipboard']()}
             showShortcut={!isMobile}
           />
         </DropdownMenuItem>
         <DropdownMenuItem asChild>
           <CopyAnchorLinkButton
-            text={t('copy-anchor-link')}
+            text={m['editor_copy-anchor-link']()}
             showShortcut={!isMobile}
           />
         </DropdownMenuItem>
@@ -439,7 +435,7 @@ function DropdownMenuActions({ editor }: DropdownMenuActionsProps) {
 
       <DropdownMenuGroup>
         <DropdownMenuItem asChild>
-          <AiAskButton text={t('ask-ai')} showShortcut={!isMobile} />
+          <AiAskButton text={m['editor_ask-ai']()} showShortcut={!isMobile} />
         </DropdownMenuItem>
       </DropdownMenuGroup>
 
@@ -447,7 +443,7 @@ function DropdownMenuActions({ editor }: DropdownMenuActionsProps) {
 
       <DropdownMenuGroup>
         <DropdownMenuItem asChild>
-          <DeleteNodeButton text={t('delete')} showShortcut={!isMobile} />
+          <DeleteNodeButton text={m.editor_delete()} showShortcut={!isMobile} />
         </DropdownMenuItem>
       </DropdownMenuGroup>
     </>
@@ -559,7 +555,6 @@ function MainToolbarContent({
   toolbarViews,
   onViewChange,
 }: MainToolbarContentProps) {
-  const { t } = useTranslation('editor')
   const hasSelection = hasTextSelection(editor)
   const hasContent = (editor?.getText().length ?? 0) > 0
 
@@ -598,7 +593,7 @@ function MainToolbarContent({
           <IndentGroup />
 
           <ToolbarGroup>
-            <ImageUploadButton text={t('add')} />
+            <ImageUploadButton text={m.editor_add()} />
             <ToolbarSeparator />
           </ToolbarGroup>
         </>
@@ -652,10 +647,9 @@ export interface MobileToolbarProps {
 export function MobileToolbar({ editor: providedEditor }: MobileToolbarProps) {
   const { editor } = useTiptapEditor(providedEditor)
   const isMobile = useIsBreakpoint("max", 480)
-  const { t } = useTranslation('editor')
   const toolbarRef = useRef<HTMLDivElement>(null)
   const toolbarState = useToolbarState(isMobile)
-  const toolbarViews = useMemo(() => createToolbarViewRegistry(t), [t])
+  const toolbarViews = useMemo(() => createToolbarViewRegistry(), [])
 
   const currentView = toolbarState.isMainView
     ? null

package/src/components/tiptap/notion-like/notion-like-editor-theme-toggle.tsx

@@ -15,19 +15,16 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-
 import { useEffect, useState } from "react"
-
-import { useTranslation } from 'react-i18next'
 // --- UI Primitives ---
 import { Button } from "../ui-primitive/button/index.tsx"
 
 // --- Icons ---
 import { SunIcon } from "../icons/sun-icon.tsx"
 import { MoonStarIcon } from "../icons/moon-star-icon.tsx"
+import { m } from "@/paraglide/messages.js";
 
 export function ThemeToggle() {
-  const { t } = useTranslation('editor')
   const [isDarkMode, setIsDarkMode] = useState<boolean>(false)
 
   useEffect(() => {
@@ -53,7 +50,7 @@ export function ThemeToggle() {
   return (
     <Button
       onClick={toggleDarkMode}
-      aria-label={t('theme-switch-to', { mode: isDarkMode ? t('light') : t('dark') })}
+      aria-label={m['editor_theme-switch-to']({ mode: isDarkMode ? m.editor_light() : m.editor_dark() })}
       variant="ghost"
     >
       {isDarkMode ? (

package/src/components/tiptap/notion-like/notion-like-editor-toolbar-floating.tsx

@@ -14,10 +14,7 @@
 //
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import { getClientI18n } from "@/i18n/client"
 import { useEffect, useState } from "react"
-import { useTranslation } from 'react-i18next'
 import { type Editor } from "@tiptap/react"
 import { NodeSelection } from "@tiptap/pm/state"
 import { ExternalLink, Type, LayoutGrid, Trash2, Palette, ChevronDown } from "lucide-react"
@@ -69,6 +66,7 @@ import { Separator } from "../ui-primitive/separator/index.tsx"
 
 // --- UI Utils ---
 import { FloatingElement } from "../ui-utils/floating-element/index.tsx"
+import { m } from "@/paraglide/messages.js";
 
 export function NotionToolbarFloating({ hideAi }: { hideAi?: boolean }) {
   const { editor } = useTiptapEditor()
@@ -252,7 +250,7 @@ export function MoreOptions({
               variant="ghost"
               role="button"
               tabIndex={-1}
-              tooltip={getClientI18n().t('more-options')}
+              tooltip={m['editor_more-options']()}
               {...props}
             >
               <MoreVerticalIcon className="tiptap-button-icon" />
@@ -315,9 +313,15 @@ function DocRefButtons({
     const attrs = getSelAttrs()
     if (!attrs) return
     const { id, docGroup } = attrs
-    if (docGroup && [getClientI18n().t('laws-regulations'), getClientI18n().t('industry-compliance'), getClientI18n().t('dictionary-entry'), getClientI18n().t('website-bookmark')].includes(docGroup)) {
-      const m: Record<string, string> = { [getClientI18n().t('laws-regulations')]: "law", [getClientI18n().t('industry-compliance')]: "compliance", [getClientI18n().t('dictionary-entry')]: "dictionary", [getClientI18n().t('website-bookmark')]: "bookmarks" }
-      window.open(`/knowledge/${m[docGroup]}/${id}`, "_blank")
+    const docGroupLabels: Record<string, string> = {
+        [m["editor_laws-regulations"]()]: "law",
+        [m["editor_industry-compliance"]()]: "compliance",
+        [m["editor_dictionary-entry"]()]: "dictionary",
+        [m["editor_website-bookmark"]()]: "bookmarks"
+      }
+      if (docGroup && Object.values(docGroupLabels).includes(docGroup)) {
+      const _m = docGroupLabels
+      window.open(`/knowledge/${_m[docGroup]}/${id}`, "_blank")
     } else {
       window.open(`/knowledge/doc/${id}`, "_blank")
     }
@@ -405,20 +409,20 @@ function DocRefButtons({
 
   return (
     <>
-      <Button variant="ghost" type="button" tooltip={getClientI18n().t('open-in-new-tab')} onClick={handleOpenNewTab}>
+      <Button variant="ghost" type="button" tooltip={m['editor_open-in-new-tab']()} onClick={handleOpenNewTab}>
         <ExternalLink className="tiptap-button-icon" />
       </Button>
       <Separator />
-      <Button variant="ghost" type="button" tooltip={getClientI18n().t('heading-view')} data-active-state={isMention ? "on" : "off"} onClick={() => handleSwitch("title")}>
+      <Button variant="ghost" type="button" tooltip={m['editor_heading-view']()} data-active-state={isMention ? "on" : "off"} onClick={() => handleSwitch("title")}>
         <Type className="tiptap-button-icon" />
       </Button>
-      <Button variant="ghost" type="button" tooltip={getClientI18n().t('card-view')} data-active-state={isDocCard ? "on" : "off"} onClick={() => handleSwitch("card")}>
+      <Button variant="ghost" type="button" tooltip={m['editor_card-view']()} data-active-state={isDocCard ? "on" : "off"} onClick={() => handleSwitch("card")}>
         <LayoutGrid className="tiptap-button-icon" />
       </Button>
       <Separator />
       <Popover open={colorOpen} onOpenChange={setColorOpen}>
         <PopoverTrigger asChild>
-          <Button variant="ghost" type="button" tooltip={getClientI18n().t('color')}>
+          <Button variant="ghost" type="button" tooltip={m.editor_color()}>
             <Palette className="tiptap-button-icon" />
           </Button>
         </PopoverTrigger>
@@ -427,7 +431,7 @@ function DocRefButtons({
         </PopoverContent>
       </Popover>
       <Separator />
-      <Button variant="ghost" type="button" tooltip={getClientI18n().t('delete')} onClick={handleDelete}>
+      <Button variant="ghost" type="button" tooltip={m.agents_agent_delete()} onClick={handleDelete}>
         <Trash2 className="tiptap-button-icon" />
       </Button>
     </>

package/src/components/tiptap/notion-like/notion-like-editor.tsx

@@ -16,7 +16,6 @@
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 import { useCallback, useContext, useEffect, useMemo, useRef, useState, createContext } from "react"
-import { useTranslation } from 'react-i18next'
 import { useDebouncedCallback, EDITOR_CHANGE_DEBOUNCE_MS } from "../lib/pacer.ts"
 import { EditorContent, EditorContext, useEditor, type Editor } from "@tiptap/react"
 import { createPortal } from "react-dom"
@@ -111,6 +110,7 @@ import { FullWidthBlockquote } from "../extension/fullwidth-blockquote-extension
 import { CodeBlockEllipsisInput } from "../extension/code-block-ellipsis-input-extension.ts"
 import { Indent } from "../extension/indent-extension.ts"
 import { TripleClickBlockSelection } from "../extension/triple-click-block-selection-extension.ts"
+import { m } from "@/paraglide/messages.js";
 
 export interface DocumentPreviewData {
   id: string
@@ -177,7 +177,6 @@ const KbIdContext = createContext<string | undefined>(undefined)
  * Loading spinner component shown while connecting to the notion server
  */
 export function LoadingSpinner({ text = "Connecting..." }: { text?: string }) {
-  const { t } = useTranslation('editor')
   return (
     <div className="spinner-container">
       <div className="spinner-content">
@@ -299,13 +298,11 @@ function NotionDocEditorContent({
   mentionUserSource,
   aiModelState,
 }: NotionDocEditorProps) {
-  const { t } = useTranslation('editor')
   const { setTocContent } = useToc()
 
   const onChangeRef = useRef(onChange)
   onChangeRef.current = onChange
 
-
   const getInitialContent = useCallback(() => {
     if (!content) return "<p></p>"
     if (
@@ -500,7 +497,6 @@ function NotionDocEditorContent({
      }
    }, [content, editor])
 
-
   useEffect(() => {
     editor?.setEditable(!readOnly)
   }, [readOnly, editor])
@@ -564,8 +560,7 @@ export function NotionDocEditor({
   mentionUserSource,
   aiModelState,
 }: NotionDocEditorProps) {
-  const { t } = useTranslation('editor')
-  const resolvedPlaceholder = placeholder ?? t('start-writing')
+  const resolvedPlaceholder = placeholder ?? m['editor_start-writing']()
   return (
     <TocProvider>
       <NotionDocEditorContent

package/src/components/tiptap/notion-like/setup-error-message/setup-error-message.tsx

@@ -15,7 +15,6 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-
 import "./setup-error-message.scss"
 import { Button } from "../../ui-primitive/button/index.tsx"
 import { ExternalLinkIcon } from "../../icons/external-link-icon.tsx"

package/src/components/tiptap/ui/ai-ask-button/ai-ask-button.tsx

@@ -15,7 +15,6 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-
 import { forwardRef, useCallback } from "react"
 
 // --- Lib ---

package/src/components/tiptap/ui/ai-ask-button/use-ai-ask.ts

@@ -1,4 +1,3 @@
-import { getClientI18n } from '@/i18n/client'
 // SPDX-License-Identifier: AGPL-3.0-or-later
 // AllBlue - 理想之海
 // Copyright (C) 2026 AllBlue Contributors
@@ -16,7 +15,6 @@ import { getClientI18n } from '@/i18n/client'
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-
 import { useCallback, useEffect, useState } from "react"
 import { isNodeSelection, type Editor } from "@tiptap/react"
 import { useHotkeys } from "react-hotkeys-hook"
@@ -33,6 +31,7 @@ import { useIsBreakpoint } from "../../hooks/use-is-breakpoint.ts"
 
 // --- Icons ---
 import { AiSparklesIcon } from "../../icons/ai-sparkles-icon.tsx"
+import { m } from "@/paraglide/messages.js";
 
 export interface UseAiAskConfig {
   /**
@@ -185,7 +184,7 @@ export function useAiAsk(config: UseAiAskConfig = {}) {
     isVisible,
     handleAiAsk,
     canAiAsk,
-    label: getClientI18n().t('ask-ai-assistant'),
+    label: m['editor_ask-ai-assistant'](),
     shortcutKeys: AI_ASK_SHORTCUT_KEY,
     Icon: AiSparklesIcon,
   }

package/src/components/tiptap/ui/ai-menu/ai-menu-actions/ai-menu-actions.tsx

@@ -15,9 +15,7 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-
 import { useCallback } from "react"
-import { useTranslation } from 'react-i18next'
 import type { Editor } from "@tiptap/react"
 import { Button } from "../../../ui-primitive/button/index.tsx"
 import { RefreshAiIcon } from "../../../icons/refresh-ai-icon.tsx"
@@ -28,6 +26,7 @@ import { useUiEditorState } from "../../../hooks/use-ui-editor-state.ts"
 import { ButtonGroup } from "../../../ui-primitive/button-group/index.tsx"
 
 import "./ai-menu-actions.scss"
+import { m } from "@/paraglide/messages.js";
 
 export interface AiMenuActionsProps {
   editor: Editor | null
@@ -44,7 +43,6 @@ editor,
   onAccept,
   onReject,
 }: AiMenuActionsProps) {
-  const { t } = useTranslation('editor')
   const { aiGenerationIsLoading } = useUiEditorState(editor)
 
   const handleRegenerate = useCallback(() => {
@@ -74,7 +72,7 @@ editor,
           onClick={handleRegenerate}
           disabled={aiGenerationIsLoading}
         >
-          <RefreshAiIcon className="tiptap-button-icon" /> {t('retry') } </Button>
+          <RefreshAiIcon className="tiptap-button-icon" /> {m.editor_retry() } </Button>
       </div>
 
       <div className="tiptap-ai-menu-commit">
@@ -85,7 +83,7 @@ editor,
               className="tiptap-button"
               onClick={handleDiscard}
             >
-              <XIcon className="tiptap-button-icon" /> {t('cancel') } </Button>
+              <XIcon className="tiptap-button-icon" /> {m.editor_cancel() } </Button>
           </ButtonGroup>
 
           <ButtonGroup>
@@ -94,7 +92,7 @@ editor,
               className="tiptap-button"
               onClick={handleApply}
             >
-              <CheckIcon className="tiptap-button-icon" /> {t('app') } </Button>
+              <CheckIcon className="tiptap-button-icon" /> {m.editor_app() } </Button>
           </ButtonGroup>
         </ButtonGroup>
       </div>

package/src/components/tiptap/ui/ai-menu/ai-menu-input/ai-menu-input.tsx

@@ -14,12 +14,7 @@
 //
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-
-import { getClientI18n } from "@/i18n/client"
 import { useCallback, useState } from "react"
-
-import { useTranslation } from 'react-i18next'
 // Tiptap Core Extensions
 import type { Tone } from "../../../lib/ai-types.ts"
 
@@ -54,6 +49,7 @@ import type { AiMenuInputTextareaProps } from "./ai-menu-input-types.ts"
 
 // Styles
 import "./ai-menu-input.scss"
+import { m } from "@/paraglide/messages.js";
 
 export function AiMenuInputPlaceholder({
   onPlaceholderClick,
@@ -67,7 +63,7 @@ export function AiMenuInputPlaceholder({
     >
       <div className="tiptap-ai-prompt-input-placeholder-content">
         <AiSparklesIcon className="tiptap-ai-prompt-input-placeholder-icon" />
-        <span className="tiptap-ai-prompt-input-placeholder-text"> {getClientI18n().t('tell-ai-more-changes')} </span>
+        <span className="tiptap-ai-prompt-input-placeholder-text"> {m['editor_tell-ai-more-changes']()} </span>
       </div>
       <Button data-style="primary" disabled>
         <ArrowUpIcon className="tiptap-button-icon" />
@@ -92,10 +88,10 @@ export function ToneSelector({
           data-active-state={tone ? "on" : "off"}
           role="button"
           tabIndex={-1}
-          aria-label={getClientI18n().t('tone-adjust-options')}
+          aria-label={m['editor_tone-adjust-options']()}
         >
           <MicAiIcon className="tiptap-button-icon" />
-          <span className="tiptap-button-text"> {getClientI18n().t('tone') } </span>
+          <span className="tiptap-button-text"> {m.editor_tone() } </span>
         </Button>
       </DropdownMenuTrigger>
 
@@ -164,7 +160,7 @@ export function AiPromptInputToolbar({
           onClick={handleSubmit}
           disabled={isEmpty}
           data-style="primary"
-          aria-label={getClientI18n().t('send')}
+          aria-label={m.chat_globalChat_send()}
         >
           <ArrowUpIcon className="tiptap-button-icon" />
         </Button>
@@ -184,7 +180,7 @@ export function AiMenuInputTextarea({
   showPlaceholder = false,
   ...props
 }: AiMenuInputTextareaProps) {
-  const resolvedPlaceholder = props.placeholder ?? getClientI18n().t('describe-need-to-ai')
+  const resolvedPlaceholder = props.placeholder ?? m['editor_describe-need-to-ai']()
   const [promptValue, setPromptValue] = useComboboxValueState()
   const [isFocused, setIsFocused] = useState(false)
 

package/src/components/tiptap/ui/ai-menu/ai-menu-items/ai-menu-items-constants.ts

@@ -1,4 +1,3 @@
-import { getClientI18n } from '@/i18n/client'
 // SPDX-License-Identifier: AGPL-3.0-or-later
 // AllBlue - 理想之海
 // Copyright (C) 2026 AllBlue Contributors
@@ -17,47 +16,48 @@ import { getClientI18n } from '@/i18n/client'
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 import type { Language } from "../../../lib/ai-types.ts"
+import { m } from "@/paraglide/messages.js";
 
 export const SUPPORTED_LANGUAGES: Array<{
   label: string
   value: Language
 }> = [
-  { label: getClientI18n().t('english'), value: "en" },
-  { label: getClientI18n().t('korean'), value: "ko" },
-  { label: getClientI18n().t('chinese'), value: "zh" },
-  { label: getClientI18n().t('japanese'), value: "ja" },
-  { label: getClientI18n().t('spanish'), value: "es" },
-  { label: getClientI18n().t('russian'), value: "ru" },
-  { label: getClientI18n().t('french'), value: "fr" },
-  { label: getClientI18n().t('portuguese'), value: "pt" },
-  { label: getClientI18n().t('german'), value: "de" },
-  { label: getClientI18n().t('italian'), value: "it" },
-  { label: getClientI18n().t('dutch'), value: "nl" },
-  { label: getClientI18n().t('indonesian'), value: "id" },
-  { label: getClientI18n().t('vietnamese'), value: "vi" },
-  { label: getClientI18n().t('turkish'), value: "tr" },
-  { label: getClientI18n().t('arabic'), value: "ar" },
+  { label: m.editor_english(), value: "en" },
+  { label: m.editor_korean(), value: "ko" },
+  { label: m.editor_chinese(), value: "zh" },
+  { label: m.editor_japanese(), value: "ja" },
+  { label: m.editor_spanish(), value: "es" },
+  { label: m.editor_russian(), value: "ru" },
+  { label: m.editor_french(), value: "fr" },
+  { label: m.editor_portuguese(), value: "pt" },
+  { label: m.editor_german(), value: "de" },
+  { label: m.editor_italian(), value: "it" },
+  { label: m.editor_dutch(), value: "nl" },
+  { label: m.editor_indonesian(), value: "id" },
+  { label: m.editor_vietnamese(), value: "vi" },
+  { label: m.editor_turkish(), value: "tr" },
+  { label: m.editor_arabic(), value: "ar" },
 ]
 
 export const SUPPORTED_TONES: Array<{ label: string; value: string }> = [
-  { label: getClientI18n().t('academic'), value: "academic" },
-  { label: getClientI18n().t('business'), value: "business" },
-  { label: getClientI18n().t('casual'), value: "casual" },
-  { label: getClientI18n().t('child-friendly'), value: "childfriendly" },
-  { label: getClientI18n().t('confident'), value: "confident" },
-  { label: getClientI18n().t('colloquial'), value: "conversational" },
-  { label: getClientI18n().t('creative'), value: "creative" },
-  { label: getClientI18n().t('emotional'), value: "emotional" },
-  { label: getClientI18n().t('excited'), value: "excited" },
-  { label: getClientI18n().t('formal'), value: "formal" },
-  { label: getClientI18n().t('friendly'), value: "friendly" },
-  { label: getClientI18n().t('humorous'), value: "funny" },
-  { label: getClientI18n().t('humorous'), value: "humorous" },
-  { label: getClientI18n().t('informative'), value: "informative" },
-  { label: getClientI18n().t('inspirational'), value: "inspirational" },
-  { label: getClientI18n().t('emoji-style'), value: "memeify" },
-  { label: getClientI18n().t('narrative'), value: "narrative" },
-  { label: getClientI18n().t('objective'), value: "objective" },
-  { label: getClientI18n().t('persuasive'), value: "persuasive" },
-  { label: getClientI18n().t('poetic'), value: "poetic" },
+  { label: m.editor_academic(), value: "academic" },
+  { label: m.editor_business(), value: "business" },
+  { label: m.editor_casual(), value: "casual" },
+  { label: m['editor_child-friendly'](), value: "childfriendly" },
+  { label: m.editor_confident(), value: "confident" },
+  { label: m.editor_colloquial(), value: "conversational" },
+  { label: m.editor_creative(), value: "creative" },
+  { label: m.editor_emotional(), value: "emotional" },
+  { label: m.editor_excited(), value: "excited" },
+  { label: m.editor_formal(), value: "formal" },
+  { label: m.editor_friendly(), value: "friendly" },
+  { label: m.editor_humorous(), value: "funny" },
+  { label: m.editor_humorous(), value: "humorous" },
+  { label: m.editor_informative(), value: "informative" },
+  { label: m.editor_inspirational(), value: "inspirational" },
+  { label: m['editor_emoji-style'](), value: "memeify" },
+  { label: m.editor_narrative(), value: "narrative" },
+  { label: m.editor_objective(), value: "objective" },
+  { label: m.editor_persuasive(), value: "persuasive" },
+  { label: m.editor_poetic(), value: "poetic" },
 ]