@allbluecn/web-app 0.9.4 → 0.10.0

package/src/components/notifications/team-notifications.tsx

@@ -3,7 +3,6 @@
 import { useMemo, useState } from 'react'
 import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'
 import { useNavigate } from '@tanstack/react-router'
-import { useTranslation } from 'react-i18next'
 import {
   Bell,
   Check,
@@ -58,6 +57,7 @@ import {
   markAllNotificationsReadFn,
   markNotificationReadFn,
 } from '@/server/serverFns/notifications'
+import { m } from "@/paraglide/messages.js";
 
 export const CATEGORY_ICONS: Record<NotificationCategory, LucideIcon> & { all: LucideIcon } = {
   all: Bell,
@@ -81,28 +81,26 @@ type StatusFilter = 'all' | 'unread' | 'read'
 
 const STATUS_FILTERS: StatusFilter[] = ['all', 'unread', 'read']
 
-const STATUS_LABEL_KEYS: Record<StatusFilter, string> = {
-  all: 'filters.all',
-  unread: 'unreadBadge',
-  read: 'filters.read',
+const STATUS_LABELS: Record<StatusFilter, () => string> = {
+  all: m.notifications_filters_all,
+  unread: m.notifications_unreadBadge,
+  read: m.notifications_filters_read,
 }
 
 export function formatRelativeTime(
-  createdAt: string,
-  t: (key: string, opts?: Record<string, unknown>) => string
+  createdAt: string
 ): string {
   const diffMs = Date.now() - new Date(createdAt).getTime()
   const minutes = Math.floor(diffMs / 60000)
   const hours = Math.floor(minutes / 60)
   const days = Math.floor(hours / 24)
-  if (minutes < 1) return t('relativeTime.justNow')
-  if (minutes < 60) return t('relativeTime.minutesAgo', { count: minutes })
-  if (hours < 24) return t('relativeTime.hoursAgo', { count: hours })
-  return t('relativeTime.daysAgo', { count: Math.min(days, 30) })
+  if (minutes < 1) return m.notifications_relativeTime_justNow()
+  if (minutes < 60) return m.notifications_relativeTime_minutesAgo({ count: minutes })
+  if (hours < 24) return m.notifications_relativeTime_hoursAgo({ count: hours })
+  return m.notifications_relativeTime_daysAgo({ count: Math.min(days, 30) })
 }
 
 export function TeamNotificationsPanel() {
-  const { t } = useTranslation('notifications')
   const navigate = useNavigate()
   const queryClient = useQueryClient()
   const { unreadCount } = useNotifications({ toastEnabled: false })
@@ -172,9 +170,9 @@ export function TeamNotificationsPanel() {
               {/* <CardTitle>{t('title')}</CardTitle> */}
               <CardDescription>
                 {unreadCount > 0 ? (
-                  <span className="text-primary">{t('unreadCount', { count: unreadCount })}</span>
+                  <span className="text-primary">{m.notifications_unreadCount({ count: unreadCount })}</span>
                 ) : (
-                  t('allCaughtUp')
+                  m.notifications_allCaughtUp()
                 )}
               </CardDescription>
             </div>
@@ -182,13 +180,13 @@ export function TeamNotificationsPanel() {
               {unreadCount > 0 && (
                 <Button onClick={handleMarkAllRead} size="sm" type="button" variant="outline">
                   <CheckCheck className="size-4" />
-                  {t('actions.markAllRead')}
+                  {m.notifications_actions_markAllRead()}
                 </Button>
               )}
               {items.length > 0 && (
                 <Button onClick={handleClearAll} size="sm" type="button" variant="outline">
                   <X className="size-4" />
-                  {t('actions.clearAll')}
+                  {m.notifications_actions_clearAll()}
                 </Button>
               )}
             </div>
@@ -199,12 +197,12 @@ export function TeamNotificationsPanel() {
               value={categoryFilter}
             >
               <SelectTrigger className="w-full md:w-[140px]">
-                <SelectValue placeholder={t('filters.allTypes')} />
+                <SelectValue placeholder={m.notifications_filters_allTypes()} />
               </SelectTrigger>
               <SelectContent>
                 {CATEGORY_FILTERS.map((key) => (
                   <SelectItem key={key} value={key}>
-                    {t(key === 'all' ? 'filters.allTypes' : `tabs.${key}`)}
+                    {key === 'all' ? m.notifications_filters_allTypes() : m[`notifications_tabs_${key}`]()}
                   </SelectItem>
                 ))}
               </SelectContent>
@@ -214,12 +212,12 @@ export function TeamNotificationsPanel() {
               value={statusFilter}
             >
               <SelectTrigger className="w-full md:w-[140px]">
-                <SelectValue placeholder={t('filters.all')} />
+                <SelectValue placeholder={m.notifications_filters_all()} />
               </SelectTrigger>
               <SelectContent>
                 {STATUS_FILTERS.map((key) => (
                   <SelectItem key={key} value={key}>
-                    {t(STATUS_LABEL_KEYS[key])}
+                    {STATUS_LABELS[key]()}
                   </SelectItem>
                 ))}
               </SelectContent>
@@ -236,8 +234,8 @@ export function TeamNotificationsPanel() {
               </EmptyMedia>
               <EmptyTitle>
                 {categoryFilter !== 'all' || statusFilter !== 'all'
-                  ? t('emptyFiltered')
-                  : t('empty')}
+                  ? m.notifications_emptyFiltered()
+                  : m.notifications_empty()}
               </EmptyTitle>
             </EmptyHeader>
           </Empty>
@@ -273,20 +271,20 @@ export function TeamNotificationsPanel() {
                         <span className="font-medium text-sm">{item.title}</span>
                         {isUnread && <div className="size-2 shrink-0 rounded-full bg-primary" />}
                         <Badge className="text-xs" variant="outline">
-                          {t(`tabs.${item.category}`)}
+                          {m[`notifications_tabs_${item.category}`]()}
                         </Badge>
                       </div>
                       {item.body && (
                         <p className="wrap-break-word text-muted-foreground text-sm">{item.body}</p>
                       )}
                       <span className="text-muted-foreground text-xs">
-                        {formatRelativeTime(item.createdAt, t)}
+                        {formatRelativeTime(item.createdAt)}
                       </span>
                     </div>
                     <DropdownMenu>
                       <DropdownMenuTrigger asChild>
                         <Button
-                          aria-label={t('moreOptions')}
+                          aria-label={m.notifications_moreOptions()}
                           size="icon-sm"
                           type="button"
                           variant="ghost"
@@ -299,13 +297,13 @@ export function TeamNotificationsPanel() {
                         {isUnread && (
                           <DropdownMenuItem onClick={() => void handleMarkRead(item.id)}>
                             <Check className="size-4" />
-                            {t('actions.markRead')}
+                            {m.notifications_actions_markRead()}
                           </DropdownMenuItem>
                         )}
                         {item.link && (
                           <DropdownMenuItem onClick={() => navigate({ to: item.link as never })}>
                             <MessageSquare className="size-4" />
-                            {t('actions.view')}
+                            {m.notifications_actions_view()}
                           </DropdownMenuItem>
                         )}
                         <DropdownMenuSeparator />
@@ -314,7 +312,7 @@ export function TeamNotificationsPanel() {
                           onClick={() => void handleDelete(item.id)}
                         >
                           <Trash2 className="size-4" />
-                          {t('actions.delete')}
+                          {m.notifications_actions_delete()}
                         </DropdownMenuItem>
                       </DropdownMenuContent>
                     </DropdownMenu>
@@ -332,7 +330,7 @@ export function TeamNotificationsPanel() {
                 type="button"
                 variant="ghost"
               >
-                {t('actions.loadMore')}
+                {m.notifications_actions_loadMore()}
               </Button>
             )}
           </div>

package/src/components/plugin-slots/__tests__/plugin-settings-tabs.test.tsx

@@ -3,12 +3,12 @@ import { mergeSettingsGroups } from '../plugin-settings-tabs'
 
 describe('mergeSettingsGroups', () => {
   it('空贡献时返回宿主 groups 原样', () => {
-    const host = [{ titleKey: 'tabs.general', tabs: [] }] as never[]
+    const host = [{ title: () => 'settings_tabs_general', tabs: [] }] as never[]
     expect(mergeSettingsGroups(host, [])).toEqual(host)
   })
 
   it('有 group 匹配的 tab 并入该组', () => {
-    const host = [{ titleKey: 'tabs.billing', tabs: [] }] as never[]
+    const host = [{ title: () => 'settings_tabs_billing', tabs: [] }] as never[]
     const merged = mergeSettingsGroups(host, [{
       labelKey: 'x',
       path: '/x',
@@ -19,12 +19,12 @@ describe('mergeSettingsGroups', () => {
   })
 
   it('无 group 的归入 plugins 组（追加末尾）', () => {
-    const host = [{ titleKey: 'tabs.billing', tabs: [] }] as never[]
+    const host = [{ title: () => 'settings_tabs_billing', tabs: [] }] as never[]
     const merged = mergeSettingsGroups(host, [{
       labelKey: 'x',
       path: '/x',
       icon: (() => null) as never,
     } as never])
-    expect(merged.at(-1)?.titleKey).toBe('tabs.plugins')
+    expect(merged.at(-1)?.title()).toBe('插件')
   })
 })

package/src/components/plugin-slots/plugin-settings-tabs.tsx

@@ -2,6 +2,7 @@ import type { SettingsGroup } from '../../routes/_nav/settings/-settings-tabs'
 import type { SettingsTabContribution } from '@allbluecn/kernel'
 import type { LucideIcon } from 'lucide-react'
 import { settingsTabs } from '@/plugins/ui.gen'
+import { m } from '@/paraglide/messages.js'
 
 export function mergeSettingsGroups(
   host: SettingsGroup[],
@@ -9,21 +10,24 @@ export function mergeSettingsGroups(
 ): SettingsGroup[] {
   if (contributed.length === 0) return host
 
-  const groups: SettingsGroup[] = host.map((g) => ({
-    ...g,
-    tabs: [
-      ...g.tabs,
-      ...contributed
-        .filter((t) => t.group === g.titleKey)
-        .map((t) => ({ ...t, icon: t.icon as unknown as LucideIcon })),
-    ],
-  }))
+  const groups: SettingsGroup[] = host.map((g) => {
+    const groupKey = g.title().replace('settings_tabs_', 'tabs.')
+    return {
+      ...g,
+      tabs: [
+        ...g.tabs,
+        ...contributed
+          .filter((t) => t.group === groupKey)
+          .map((t) => ({ label: () => t.labelKey, path: t.path, icon: t.icon as unknown as LucideIcon })),
+      ],
+    }
+  })
 
   const rest = contributed.filter((t) => !t.group)
   if (rest.length) {
     groups.push({
-      titleKey: 'tabs.plugins',
-      tabs: rest.map((t) => ({ ...t, icon: t.icon as unknown as LucideIcon })),
+      title: m.settings_tabs_plugins,
+      tabs: rest.map((t) => ({ label: () => t.labelKey, path: t.path, icon: t.icon as unknown as LucideIcon })),
     })
   }
   return groups

package/src/components/project/create-project-dialog.tsx

@@ -16,7 +16,6 @@
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 import { useState } from "react";
-import { useTranslation } from "react-i18next";
 import { useQuery } from "@tanstack/react-query";
 import { useForm } from "@tanstack/react-form";
 import { useRouter } from "@tanstack/react-router";
@@ -38,9 +37,10 @@ import {
 } from "@/components/ui/dialog";
 import { LucideIconPicker } from "@/components/shared-kit/icons/lucide-icon-picker";
 import { extractDisplayId, validateDisplayId } from "@/lib/project-display-id";
-import { checkDisplayIdAvailableFn, createProjectFn } from "@/server/serverFns/project";
+import { checkDisplayIdAvailableFn, createProjectFn, updateProjectFn } from "@/server/serverFns/project";
 import { listWorkspacesBriefFn } from "@/server/serverFns/workspace";
 import { createProjectSchema, type CreateProjectValues } from "./schemas/create-project";
+import { m } from "@/paraglide/messages.js";
 
 interface CreateProjectDialogProps {
   open: boolean;
@@ -48,6 +48,8 @@ interface CreateProjectDialogProps {
   onSuccess?: () => void;
   defaultWorkspaceId?: string;
   defaultWorkspaceName?: string;
+  editMode?: boolean;
+  defaultValues?: { id: string; name: string; icon: string; description: string };
 }
 
 export function CreateProjectDialog({
@@ -56,8 +58,9 @@ export function CreateProjectDialog({
   onSuccess,
   defaultWorkspaceId,
   defaultWorkspaceName,
+  editMode = false,
+  defaultValues,
 }: CreateProjectDialogProps) {
-  const { t } = useTranslation("projects");
   const router = useRouter();
   const [displayIdEdited, setDisplayIdEdited] = useState(false);
   const [displayIdError, setDisplayIdError] = useState("");
@@ -72,10 +75,10 @@ export function CreateProjectDialog({
 
   const form = useForm({
     defaultValues: {
-      name: "",
-      description: "",
-      icon: "",
-      displayId: "",
+      name: editMode && defaultValues ? defaultValues.name : "",
+      description: editMode && defaultValues ? defaultValues.description : "",
+      icon: editMode && defaultValues ? defaultValues.icon : "",
+      displayId: editMode && defaultValues ? extractDisplayId(defaultValues.name) : "",
       workspaceId: defaultWorkspaceId ?? "",
     },
     validators: [{ run: createProjectSchema as any, triggers: ['change'] }],
@@ -98,7 +101,7 @@ export function CreateProjectDialog({
 
   const handleSubmit = async () => {
     if (!form.state.values.name.trim()) {
-      setError(t("project.create.nameRequired"));
+      setError(m.projects_project_create_nameRequired());
       return;
     }
     const idError = validateDisplayId(form.state.values.displayId);
@@ -109,21 +112,37 @@ export function CreateProjectDialog({
     setLoading(true);
     setError("");
     try {
-       const project = await createProjectFn({
-         data: {
-           icon: form.state.values.icon,
-           name: form.state.values.name.trim(),
-           description: form.state.values.description.trim(),
-           displayId: form.state.values.displayId.toUpperCase(),
-           workspaceId: form.state.values.workspaceId,
-         },
-       });
+      if (editMode && defaultValues) {
+        await updateProjectFn({
+          data: {
+            projectId: defaultValues.id,
+            name: form.state.values.name.trim(),
+            icon: form.state.values.icon,
+            description: form.state.values.description.trim() || null,
+            displayId: form.state.values.displayId.toUpperCase(),
+          },
+        });
+      } else {
+        const project = await createProjectFn({
+          data: {
+            icon: form.state.values.icon,
+            name: form.state.values.name.trim(),
+            description: form.state.values.description.trim(),
+            displayId: form.state.values.displayId.toUpperCase(),
+            workspaceId: form.state.values.workspaceId,
+          },
+        });
+        onOpenChange(false);
+        onSuccess?.();
+        window.dispatchEvent(new CustomEvent("project-created"));
+        await router.navigate({ to: "/projects/$projectId", params: { projectId: project.id } });
+        return;
+      }
       onOpenChange(false);
       onSuccess?.();
-      window.dispatchEvent(new CustomEvent("project-created"));
-      await router.navigate({ to: "/projects/$projectId", params: { projectId: project.id } });
+      window.dispatchEvent(new CustomEvent("project-updated"));
     } catch (err) {
-      setError(err instanceof Error ? err.message : t("project.create.failed"));
+      setError(err instanceof Error ? err.message : m.projects_project_create_failed());
     } finally {
       setLoading(false);
     }
@@ -131,10 +150,17 @@ export function CreateProjectDialog({
 
   const handleOpenChange = (newOpen: boolean) => {
     if (newOpen) {
-      form.setFieldValue("icon", "");
-      form.setFieldValue("name", "");
-      form.setFieldValue("description", "");
-      form.setFieldValue("displayId", "");
+      if (editMode && defaultValues) {
+        form.setFieldValue("name", defaultValues.name);
+        form.setFieldValue("icon", defaultValues.icon);
+        form.setFieldValue("description", defaultValues.description);
+        form.setFieldValue("displayId", extractDisplayId(defaultValues.name));
+      } else {
+        form.setFieldValue("icon", "");
+        form.setFieldValue("name", "");
+        form.setFieldValue("description", "");
+        form.setFieldValue("displayId", "");
+      }
       form.setFieldValue("workspaceId", defaultWorkspaceId ?? "");
       setDisplayIdEdited(false);
       setDisplayIdError("");
@@ -147,7 +173,7 @@ export function CreateProjectDialog({
     <Dialog open={open} onOpenChange={handleOpenChange}>
       <DialogContent className="sm:max-w-260 -mt-50">
         <DialogHeader>
-          <DialogTitle className="text-xl">{t("project.create.title")}</DialogTitle>
+          <DialogTitle className="text-xl">{editMode ? m.projects_project_edit_title() : m.projects_project_create_title()}</DialogTitle>
         </DialogHeader>
 
         <div className="space-y-3 overflow-y-auto px-4 py-2 max-h-[60vh]">
@@ -164,14 +190,14 @@ export function CreateProjectDialog({
                 value={field.value ?? ""}
                 onChange={(e) => handleNameChange(e.target.value)}
                 onBlur={field.handleBlur}
-                placeholder={t("project.create.namePlaceholder")}
+                placeholder={m.projects_project_create_namePlaceholder()}
                 maxLength={100}
                 className="h-10 min-w-0 flex-1"
               />
             )} />
             {defaultWorkspaceId ? (
               <span className="flex h-10 shrink-0 max-w-60 items-center truncate rounded-md border bg-muted px-3 text-sm">
-                {defaultWorkspaceName ?? t("project.create.workspaceSelected")}
+                {defaultWorkspaceName ?? m.projects_project_create_workspaceSelected()}
               </span>
             ) : (
               <form.Field name="workspaceId" children={(field) => (
@@ -179,8 +205,8 @@ export function CreateProjectDialog({
                   value={field.value ?? ""}
                   onValueChange={(v) => field.handleChange(v)}
                 >
-                  <SelectTrigger className="h-10 w-44 shrink-0">
-                    <SelectValue placeholder={t("project.create.workspacePlaceholder")} />
+                  <SelectTrigger className="h-10 w-44 shrink-0 py-1">
+                    <SelectValue placeholder={m.projects_project_create_workspacePlaceholder()} />
                   </SelectTrigger>
                   <SelectContent>
                     {workspaces.map((ws) => (
@@ -203,9 +229,9 @@ export function CreateProjectDialog({
                   field.handleBlur();
                   if (!field.value || validateDisplayId(field.value)) return;
                   const res = await checkDisplayIdAvailableFn({ data: { displayId: field.value } });
-                  setDisplayIdError(res.available ? "" : res.reason ?? t("project.create.idUnavailable"));
+                  setDisplayIdError(res.available ? "" : res.reason ?? m.projects_project_create_idUnavailable());
                 }}
-                placeholder={t("project.create.idPlaceholder")}
+                placeholder={m.projects_project_create_idPlaceholder()}
                 maxLength={10}
                 className={`h-10 font-mono ${displayIdError ? "border-destructive" : ""}`}
               />
@@ -221,7 +247,7 @@ export function CreateProjectDialog({
                 value={field.value ?? ""}
                 onChange={(e) => field.handleChange(e.target.value)}
                 onBlur={field.handleBlur}
-                placeholder={t("project.create.introPlaceholder")}
+                placeholder={m.projects_project_create_introPlaceholder()}
                 maxLength={500}
                 className="flex-1 min-h-0 resize-none bg-transparent px-3 py-2 text-sm outline-none placeholder:text-muted-foreground"
               />
@@ -233,10 +259,10 @@ export function CreateProjectDialog({
 
         <DialogFooter className="items-center gap-3">
           <Button variant="outline" onClick={() => handleOpenChange(false)}>
-            {t("common:button.cancel")}
+            {m.common_button_cancel()}
           </Button>
           <Button onClick={handleSubmit} disabled={loading}>
-            {loading ? t("project.create.creating") : t("common:button.create")}
+            {loading ? m.projects_project_create_creating() : (editMode ? m.common_button_save() : m.common_button_create())}
           </Button>
         </DialogFooter>
       </DialogContent>

package/src/components/project/invite-member-dialog.tsx

@@ -16,7 +16,6 @@
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 import { useState, useEffect } from "react";
-import { useTranslation } from "react-i18next";
 import { useForm } from "@tanstack/react-form";
 import { Loader2 } from "lucide-react";
 import { toast } from '@/components/ui/sonner';
@@ -42,6 +41,7 @@ import { addProjectMemberFromTeamFn } from "@/server/serverFns/project";
 import { listTeamUsersFn } from "@/server/serverFns/team";
 import type { ProjectRole } from "@/types/project";
 import { UserAvatar } from "@/components/shared-kit";
+import { m } from "@/paraglide/messages.js";
 
 interface AssignMemberDialogProps {
   open: boolean;
@@ -60,10 +60,10 @@ interface TeamMember {
   seatType: 'owner' | 'member' | 'guest';
 }
 
-const ROLE_OPTIONS: { value: Exclude<ProjectRole, "owner">; labelKey: string; descKey: string }[] = [
-  { value: "admin", labelKey: "project.invite.adminLabel", descKey: "project.invite.adminDesc" },
-  { value: "member", labelKey: "project.invite.memberLabel", descKey: "project.invite.memberDesc" },
-  { value: "viewer", labelKey: "project.invite.viewerLabel", descKey: "project.invite.viewerDesc" },
+const ROLE_OPTIONS: { value: Exclude<ProjectRole, "owner">; label: () => string; desc: () => string }[] = [
+  { value: "admin", label: m.projects_project_invite_adminLabel, desc: m.projects_project_invite_adminDesc },
+  { value: "member", label: m.projects_project_invite_memberLabel, desc: m.projects_project_invite_memberDesc },
+  { value: "viewer", label: m.projects_project_invite_viewerLabel, desc: m.projects_project_invite_viewerDesc },
 ];
 
 export function InviteMemberDialog({
@@ -72,7 +72,6 @@ export function InviteMemberDialog({
   projectId,
   onSuccess,
 }: AssignMemberDialogProps) {
-  const { t } = useTranslation("projects");
   const [loading, setLoading] = useState(false);
   const [members, setMembers] = useState<TeamMember[]>([]);
   const [loadingMembers, setLoadingMembers] = useState(false);
@@ -103,7 +102,7 @@ export function InviteMemberDialog({
   const handleSubmit = async () => {
     const selectedUserId = form.state.values.userId;
     if (!selectedUserId) {
-      toast.error(t("project.invite.selectMember"));
+      toast.error(m.project_invite_selectMember());
       return;
     }
     setLoading(true);
@@ -115,13 +114,13 @@ export function InviteMemberDialog({
           role: form.state.values.role,
         },
       });
-      toast.success(t("project.invite.added"));
+      toast.success(m.project_invite_added());
       form.setFieldValue("userId", "");
       form.setFieldValue("role", "member");
       onOpenChange(false);
       onSuccess?.();
     } catch (err) {
-      toast.error(err instanceof Error ? err.message : t("project.invite.inviteFailed"));
+      toast.error(err instanceof Error ? err.message : m.projects_project_invite_inviteFailed());
     } finally {
       setLoading(false);
     }
@@ -141,16 +140,16 @@ export function InviteMemberDialog({
     >
       <DialogContent className="sm:max-w-md">
         <DialogHeader>
-          <DialogTitle>{t("project.invite.title")}</DialogTitle>
-          <DialogDescription>{t("project.invite.description")}</DialogDescription>
+          <DialogTitle>{m.projects_project_invite_title()}</DialogTitle>
+          <DialogDescription>{m.projects_project_invite_description()}</DialogDescription>
         </DialogHeader>
         <div className="grid gap-4 py-2">
           <div className="grid gap-2">
-            <Label>{t("project.invite.selectMember")}</Label>
+            <Label>{m.project_invite_selectMember()}</Label>
             <Input
               value={searchQuery}
               onChange={(e) => setSearchQuery(e.target.value)}
-              placeholder={t("project.invite.searchMember")}
+              placeholder={m.project_invite_searchMember()}
             />
             <div className="max-h-48 overflow-y-auto border rounded-md">
               {loadingMembers ? (
@@ -159,7 +158,7 @@ export function InviteMemberDialog({
                 </div>
               ) : filteredMembers.length === 0 ? (
                 <div className="py-6 text-center text-sm text-muted-foreground">
-                  {t("project.invite.noMembers")}
+                  {m.project_invite_noMembers()}
                 </div>
               ) : (
                 filteredMembers.map((member) => (
@@ -185,9 +184,9 @@ export function InviteMemberDialog({
                     />
                     <span className="text-sm font-medium">{member.username}</span>
                     <span className="text-xs text-muted-foreground ml-auto">
-                      {member.seatType === 'owner' ? t('project.invite.owner') :
-                       member.seatType === 'guest' ? t('project.invite.guest') :
-                       t('project.invite.member')}
+                      {member.seatType === 'owner' ? m.project_invite_owner() :
+                       member.seatType === 'guest' ? m.project_invite_guest() :
+                       m.project_invite_member()}
                     </span>
                   </label>
                 ))
@@ -195,7 +194,7 @@ export function InviteMemberDialog({
             </div>
           </div>
           <div className="grid gap-2">
-            <Label>{t("project.invite.roleLabel")}</Label>
+            <Label>{m.projects_project_invite_roleLabel()}</Label>
             <form.Field name="role" children={(field) => (
               <Select
                 value={field.value ?? "member"}
@@ -207,7 +206,7 @@ export function InviteMemberDialog({
                 <SelectContent>
                   {ROLE_OPTIONS.map((opt) => (
                     <SelectItem key={opt.value} value={opt.value}>
-                      {t(opt.labelKey)} · {t(opt.descKey)}
+                      {opt.label()} · {opt.desc()}
                     </SelectItem>
                   ))}
                 </SelectContent>
@@ -217,10 +216,10 @@ export function InviteMemberDialog({
         </div>
         <DialogFooter>
           <Button variant="outline" onClick={() => onOpenChange(false)}>
-            {t("button.cancel")}
+            {m.common_button_cancel()}
           </Button>
           <Button onClick={handleSubmit} disabled={loading}>
-            {loading ? <Loader2 className="size-4 animate-spin" /> : t("project.invite.sendInvite")}
+            {loading ? <Loader2 className="size-4 animate-spin" /> : m.projects_project_invite_sendInvite()}
           </Button>
         </DialogFooter>
       </DialogContent>