@allbluecn/web-app 0.9.5 → 0.10.0

package/src/components/settings/personal-team/account/settings-profile.tsx

@@ -19,7 +19,6 @@
 
 import { Loader2, Save, Upload } from "lucide-react";
 import { useState } from "react"
-import { useTranslation } from "react-i18next";
 import { cn } from "@/lib/utils";
 import { Button } from "@/components/ui/button";
 import {
@@ -47,6 +46,7 @@ import type {
   AvatarConfig,
   ShapeType,
 } from "@/components/settings/personal-team/account/avatar/avatar-config";
+import { m } from "@/paraglide/messages.js";
 
 export interface SocialLink {
   platform: string;
@@ -82,20 +82,20 @@ export interface SettingsProfileProps {
 const defaultSocialPlatforms = [
   {
     id: "twitter",
-    labelKey: "profile.socialTwitter",
+    label: m.settings_profile_socialTwitter,
     placeholder: "https://x.com/preetsuthar17",
   },
   {
     id: "github",
-    labelKey: "profile.socialGitHub",
+    label: m.settings_profile_socialGitHub,
     placeholder: "https://github.com/preetsuthar17",
   },
   {
     id: "linkedin",
-    labelKey: "profile.socialLinkedIn",
+    label: m.settings_profile_socialLinkedIn,
     placeholder: "https://linkedin.com/in/preetsuthar17",
   },
-  { id: "website", labelKey: "profile.socialWebsite", placeholder: "https://preetsuthar.me" },
+  { id: "website", label: m.settings_profile_socialWebsite, placeholder: "https://preetsuthar.me" },
 ];
 
 export default function SettingsProfile({
@@ -113,7 +113,6 @@ export default function SettingsProfile({
   const [isChangingEmail, setIsChangingEmail] = useState(false);
   const [showEmailChangeForm, setShowEmailChangeForm] = useState(false);
   const [errors, setErrors] = useState<Record<string, string>>({});
-  const { t } = useTranslation("settings");
 
   const [formData, setFormData] = useState<ProfileData>({
     name: profile?.name || "",
@@ -133,18 +132,18 @@ export default function SettingsProfile({
     setErrors({});
 
     if (!formData.name.trim()) {
-      setErrors({ name: t("profile.enterName") });
+      setErrors({ name: m.settings_profile_enterName() });
       return;
     }
 
     if (!formData.email.trim()) {
-      setErrors({ email: t("profile.enterEmail") });
+      setErrors({ email: m.settings_profile_enterEmail() });
       return;
     }
 
     const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
     if (!emailRegex.test(formData.email)) {
-      setErrors({ email: t("profile.invalidEmail") });
+      setErrors({ email: m.settings_profile_invalidEmail() });
       return;
     }
 
@@ -152,7 +151,7 @@ export default function SettingsProfile({
       try {
         new URL(formData.website);
       } catch {
-        setErrors({ website: t("profile.invalidUrl") });
+        setErrors({ website: m.settings_profile_invalidUrl() });
         return;
       }
     }
@@ -163,7 +162,7 @@ export default function SettingsProfile({
     } catch (error) {
       setErrors({
         _general:
-          error instanceof Error ? error.message : t("profile.saveFailed"),
+          error instanceof Error ? error.message : m.settings_profile_saveFailed(),
       });
     } finally {
       setIsSaving(false);
@@ -174,18 +173,18 @@ export default function SettingsProfile({
     setErrors({});
 
     if (!emailChangeData.newEmail.trim()) {
-      setErrors({ newEmail: t("profile.enterNewEmail") });
+      setErrors({ newEmail: m.settings_profile_enterNewEmail() });
       return;
     }
 
     const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
     if (!emailRegex.test(emailChangeData.newEmail)) {
-      setErrors({ newEmail: t("profile.invalidEmail") });
+      setErrors({ newEmail: m.settings_profile_invalidEmail() });
       return;
     }
 
     if (!emailChangeData.currentPassword.trim()) {
-      setErrors({ currentPassword: t("profile.enterCurrentPassword") });
+      setErrors({ currentPassword: m.settings_profile_enterCurrentPassword() });
       return;
     }
 
@@ -202,7 +201,7 @@ export default function SettingsProfile({
     } catch (error) {
       setErrors({
         emailChange:
-          error instanceof Error ? error.message : t("profile.emailChangeFailed"),
+          error instanceof Error ? error.message : m.settings_profile_emailChangeFailed(),
       });
     } finally {
       setIsChangingEmail(false);
@@ -239,9 +238,9 @@ export default function SettingsProfile({
       <CardHeader>
         <div className="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
           <div className="flex min-w-0 flex-1 flex-col gap-2">
-            <CardTitle className="wrap-break-word">{t("profile.title")}</CardTitle>
+            <CardTitle className="wrap-break-word">{m.settings_profile_title()}</CardTitle>
             <CardDescription className="wrap-break-word">
-              {t("profile.description")}
+              {m.settings_profile_description()}
             </CardDescription>
           </div>
           <div className="flex shrink-0 gap-2">
@@ -254,12 +253,12 @@ export default function SettingsProfile({
               {isSaving ? (
                 <>
                   <Loader2 className="size-4 animate-spin" />
-                  <span className="whitespace-nowrap">{t("profile.saving")}</span>
+                  <span className="whitespace-nowrap">{m.settings_profile_saving()}</span>
                 </>
               ) : (
                 <>
                   <Save className="size-4" />
-                  <span className="whitespace-nowrap">{t("profile.saveChanges")}</span>
+                  <span className="whitespace-nowrap">{m.settings_profile_saveChanges()}</span>
                 </>
               )}
             </Button>
@@ -275,13 +274,13 @@ export default function SettingsProfile({
           )}
 
           <div className="flex flex-col gap-4">
-            <FieldLabel>{t("profile.avatar")}</FieldLabel>
+            <FieldLabel>{m.settings_profile_avatar()}</FieldLabel>
             <div className="flex flex-col gap-4 sm:flex-row sm:items-center">
               <NotionAvatarEditor
                 currentConfig={avatarConfig ?? undefined}
                 currentBgShape={bgShape}
                 currentBgColor={bgColor}
-                userName={formData.name || t("profile.defaultUser")}
+                userName={formData.name || m.settings_profile_defaultUser()}
                 onSave={
                   onAvatarEdit
                     ? (config, shape, color) =>
@@ -293,11 +292,11 @@ export default function SettingsProfile({
                 <div className="flex flex-col gap-2 sm:flex-row">
                   <Button disabled type="button" variant="outline">
                     <Upload className="size-4" />
-                    {t("profile.uploadImage")}
+                    {m.settings_profile_uploadImage()}
                   </Button>
                 </div>
                 <p className="text-muted-foreground text-xs">
-                  {t("profile.avatarDescription")}
+                  {m.settings_profile_avatarDescription()}
                 </p>
                 {errors.avatar && (
                   <p className="text-destructive text-xs">{errors.avatar}</p>
@@ -311,7 +310,7 @@ export default function SettingsProfile({
           <div className="flex flex-col gap-4">
             <Field>
               <FieldLabel htmlFor="name">
-                {t("profile.name")} <span className="text-destructive">*</span>
+                {m.settings_profile_name()} <span className="text-destructive">*</span>
               </FieldLabel>
               <FieldContent>
                 <InputGroup>
@@ -320,7 +319,7 @@ export default function SettingsProfile({
                     onChange={(e) =>
                       setFormData((prev) => ({ ...prev, name: e.target.value }))
                     }
-                    placeholder={t("profile.namePlaceholder")}
+                    placeholder={m.settings_profile_namePlaceholder()}
                     value={formData.name}
                   />
                 </InputGroup>
@@ -329,7 +328,7 @@ export default function SettingsProfile({
             </Field>
 
             <Field>
-              <FieldLabel htmlFor="email">{t("profile.email")}</FieldLabel>
+              <FieldLabel htmlFor="email">{m.settings_profile_email()}</FieldLabel>
               <FieldContent>
                 <div className="flex items-center gap-2">
                   <InputGroup className="min-w-0 flex-1">
@@ -356,7 +355,7 @@ export default function SettingsProfile({
                       type="button"
                       variant="outline"
                     >
-                      {showEmailChangeForm ? t("common.cancel") : t("profile.changeEmail")}
+                      {showEmailChangeForm ? m.common_cancel() : m.settings_profile_changeEmail()}
                     </Button>
                   )}
                 </div>
@@ -368,7 +367,7 @@ export default function SettingsProfile({
               <div className="flex flex-col gap-4 rounded-lg border bg-muted/30 p-4">
                 <Field>
                   <FieldLabel htmlFor="new-email">
-                    {t("profile.newEmail")} <span className="text-destructive">*</span>
+                    {m.settings_profile_newEmail()} <span className="text-destructive">*</span>
                   </FieldLabel>
                   <FieldContent>
                     <InputGroup>
@@ -393,7 +392,7 @@ export default function SettingsProfile({
 
                 <Field>
                   <FieldLabel htmlFor="current-password">
-                    {t("profile.currentPassword")} <span className="text-destructive">*</span>
+                    {m.settings_profile_currentPassword()} <span className="text-destructive">*</span>
                   </FieldLabel>
                   <FieldContent>
                     <InputGroup>
@@ -405,7 +404,7 @@ export default function SettingsProfile({
                             currentPassword: e.target.value,
                           }))
                         }
-                        placeholder={t("profile.currentPasswordPlaceholder")}
+                        placeholder={m.settings_profile_currentPasswordPlaceholder()}
                         type="password"
                         value={emailChangeData.currentPassword}
                       />
@@ -428,35 +427,35 @@ export default function SettingsProfile({
                   {isChangingEmail ? (
                     <>
                   <Loader2 className="size-4 animate-spin" />
-                  {t("profile.changingEmail")}
+                  {m.settings_profile_changingEmail()}
                 </>
               ) : (
-                t("profile.confirmChange")
+                m.settings_profile_confirmChange()
               )}
                 </Button>
               </div>
             )}
 
             <Field>
-              <FieldLabel htmlFor="bio">{t("profile.bio")}</FieldLabel>
+              <FieldLabel htmlFor="bio">{m.settings_profile_bio()}</FieldLabel>
               <FieldContent>
                 <Textarea
                   id="bio"
                   onChange={(e) =>
                     setFormData((prev) => ({ ...prev, bio: e.target.value }))
                   }
-                  placeholder={t("profile.bioPlaceholder")}
+                  placeholder={m.settings_profile_bioPlaceholder()}
                   rows={4}
                   value={formData.bio || ""}
                 />
                 <FieldDescription>
-                  {t("profile.bioDescription")}
+                  {m.settings_profile_bioDescription()}
                 </FieldDescription>
               </FieldContent>
             </Field>
 
             <Field>
-              <FieldLabel htmlFor="location">{t("profile.location")}</FieldLabel>
+              <FieldLabel htmlFor="location">{m.settings_profile_location()}</FieldLabel>
               <FieldContent>
                 <InputGroup>
                   <InputGroupInput
@@ -467,7 +466,7 @@ export default function SettingsProfile({
                         location: e.target.value,
                       }))
                     }
-                    placeholder={t("profile.locationPlaceholder")}
+                    placeholder={m.settings_profile_locationPlaceholder()}
                     value={formData.location || ""}
                   />
                 </InputGroup>
@@ -475,7 +474,7 @@ export default function SettingsProfile({
             </Field>
 
             <Field>
-              <FieldLabel htmlFor="website">{t("profile.website")}</FieldLabel>
+              <FieldLabel htmlFor="website">{m.settings_profile_website()}</FieldLabel>
               <FieldContent>
                 <InputGroup>
                   <InputGroupInput
@@ -499,12 +498,12 @@ export default function SettingsProfile({
           <Separator />
 
           <div className="flex flex-col gap-4">
-            <FieldLabel>{t("profile.socialLinks")}</FieldLabel>
+            <FieldLabel>{m.settings_profile_socialLinks()}</FieldLabel>
             <div className="flex flex-col gap-3">
               {defaultSocialPlatforms.map((platform) => (
                 <Field key={platform.id}>
                   <FieldLabel htmlFor={`social-${platform.id}`}>
-                    {t(platform.labelKey)}
+                    {platform.label()}
                   </FieldLabel>
                   <FieldContent>
                     <InputGroup>

package/src/components/settings/personal-team/team/team-client.tsx

@@ -17,7 +17,6 @@
 
 import { useState, useEffect } from "react"
 import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query"
-import { useTranslation } from "react-i18next"
 import { toast } from "sonner"
 import { useResource } from "@/components/billing/use-resource"
 import {
@@ -69,6 +68,7 @@ import {
 import { Trash2, Infinity as InfinityIcon } from "lucide-react"
 import TeamInvitations, { type TeamInvitation, type TeamJoinRequestItem } from "@/components/settings/personal-team/team/team-invitations"
 import TeamMemberList, { type TeamMember } from "@/components/settings/personal-team/team/team-member-list"
+import { m } from "@/paraglide/messages.js";
 
 type TeamClientProps = {
   user: {
@@ -88,7 +88,6 @@ function seatTypeToRole(seatType: "member" | "guest" | "owner"): "owner" | "memb
 }
 
 export default function TeamClient({ user }: TeamClientProps) {
-  const { t } = useTranslation("settings")
   const qc = useQueryClient()
   const seats = useResource("seats")
   const guestSeats = useResource("guestSeats")
@@ -131,55 +130,55 @@ export default function TeamClient({ user }: TeamClientProps) {
       message?: string
     }) => createTeamInvitationFn({ data }),
     onSuccess: () => {
-      toast.success(t("team.inviteSent"))
+      toast.success(m.settings_team_inviteSent())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.inviteCreateFailed"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_inviteCreateFailed())
     },
   })
 
   const revokeMutation = useMutation({
     mutationFn: (invitationId: string) => revokeTeamInvitationFn({ data: { invitationId } }),
     onSuccess: () => {
-      toast.success(t("team.revoke"))
+      toast.success(m.settings_team_revoke())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.revoke"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_revoke())
     },
   })
 
   const resendMutation = useMutation({
     mutationFn: (invitationId: string) => resendTeamInvitationFn({ data: { invitationId } }),
     onSuccess: () => {
-      toast.success(t("team.inviteSent"))
+      toast.success(m.settings_team_inviteSent())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.resendInvite"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_resendInvite())
     },
   })
 
   const removeMemberMutation = useMutation({
     mutationFn: (membershipId: string) => removeTeamMemberFn({ data: { membershipId } }),
     onSuccess: () => {
-      toast.success(t("team.removeMember"))
+      toast.success(m.settings_team_removeMember())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.removeMember"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_removeMember())
     },
   })
 
   const leaveTeamMutation = useMutation({
     mutationFn: () => leaveTeamFn({ data: {} }),
     onSuccess: () => {
-      toast.success(t("team.leaveTeam"))
+      toast.success(m.settings_team_leaveTeam())
       window.location.reload()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.leaveTeam"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_leaveTeam())
     },
   })
 
@@ -187,11 +186,11 @@ export default function TeamClient({ user }: TeamClientProps) {
     mutationFn: ({ invitationId, seatType }: { invitationId: string; seatType: 'member' | 'guest' }) =>
       approveTeamInvitationFn({ data: { invitationId, seatType } }),
     onSuccess: () => {
-      toast.success(t("team.inviteApproved"))
+      toast.success(m.settings_team_inviteApproved())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.inviteCreateFailed"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_inviteCreateFailed())
     },
   })
 
@@ -214,7 +213,7 @@ export default function TeamClient({ user }: TeamClientProps) {
     status: inv.status as "pending" | "pending_approval" | "accepted" | "expired" | "revoked",
     applicantEmail: inv.applicantEmail ?? undefined,
     invitedBy: {
-      name: inv.owner?.username ?? user.name ?? t("team.you"),
+      name: inv.owner?.username ?? user.name ?? m.settings_team_you(),
       email: inv.owner?.email ?? user.email ?? "",
     },
     expiresAt: inv.expiresAt ? new Date(inv.expiresAt) : undefined,
@@ -264,7 +263,7 @@ export default function TeamClient({ user }: TeamClientProps) {
       email: data.email,
       role: data.role,
       status: "pending",
-      invitedBy: { name: user.name ?? t("team.you"), email: user.email ?? "" },
+      invitedBy: { name: user.name ?? m.settings_team_you(), email: user.email ?? "" },
       createdAt: new Date(),
       expiresAt: new Date(Date.now() + expiresDays * 24 * 60 * 60 * 1000),
     } as TeamInvitation
@@ -294,7 +293,7 @@ export default function TeamClient({ user }: TeamClientProps) {
       link: `${APP_URL}/invite/${result.token}`,
       role: "member",
       status: "pending",
-      invitedBy: { name: user.name ?? t("team.you"), email: user.email ?? "" },
+      invitedBy: { name: user.name ?? m.settings_team_you(), email: user.email ?? "" },
       createdAt: new Date(),
       expiresAt: new Date(Date.now() + days * 24 * 60 * 60 * 1000),
     } as TeamInvitation
@@ -304,22 +303,22 @@ export default function TeamClient({ user }: TeamClientProps) {
     mutationFn: ({ requestId, seatType }: { requestId: string; seatType: "member" | "guest" }) =>
       approveTeamJoinRequestFn({ data: { requestId, seatType } }),
     onSuccess: () => {
-      toast.success(t("team.inviteApproved"))
+      toast.success(m.settings_team_inviteApproved())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.inviteCreateFailed"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_inviteCreateFailed())
     },
   })
 
   const rejectRequestMutation = useMutation({
     mutationFn: (requestId: string) => rejectTeamJoinRequestFn({ data: { requestId } }),
     onSuccess: () => {
-      toast.success(t("team.joinRequests.requestRejected"))
+      toast.success(m.settings_team_joinRequests_requestRejected())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.inviteCreateFailed"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_inviteCreateFailed())
     },
   })
 
@@ -337,22 +336,22 @@ export default function TeamClient({ user }: TeamClientProps) {
   const deleteInvitationMutation = useMutation({
     mutationFn: (invitationId: string) => deleteTeamInvitationFn({ data: { invitationId } }),
     onSuccess: () => {
-      toast.success(t("team.invite.deleteRecord"))
+      toast.success(m.settings_team_invite_deleteRecord())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.inviteCreateFailed"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_inviteCreateFailed())
     },
   })
 
   const deleteRequestMutation = useMutation({
     mutationFn: (requestId: string) => deleteTeamJoinRequestFn({ data: { requestId } }),
     onSuccess: () => {
-      toast.success(t("team.invite.deleteRecord"))
+      toast.success(m.settings_team_invite_deleteRecord())
       invalidate()
     },
     onError: (err) => {
-      toast.error(err instanceof Error ? err.message : t("team.inviteCreateFailed"))
+      toast.error(err instanceof Error ? err.message : m.settings_team_inviteCreateFailed())
     },
   })
 
@@ -385,19 +384,19 @@ export default function TeamClient({ user }: TeamClientProps) {
     return (
       <div className="space-y-6">
         <div>
-          <h2 className="text-lg font-semibold">{t("team.title")}</h2>
+          <h2 className="text-lg font-semibold">{m.settings_team_title()}</h2>
           <p className="text-sm text-muted-foreground">
-            {t("team.joinedTeam", { username: teamOwner.username })}
+            {m.settings_team_joinedTeam({ username: teamOwner.username })}
           </p>
         </div>
 
         <Card>
           <CardHeader>
-            <CardTitle>{t("team.memberInfo")}</CardTitle>
+            <CardTitle>{m.settings_team_memberInfo()}</CardTitle>
             <CardDescription>
               {myEntry?.seatType === "guest"
-                ? t("team.seatGuests")
-                : t("team.seatMembers")}
+                ? m.settings_team_seatGuests()
+                : m.settings_team_seatMembers()}
             </CardDescription>
           </CardHeader>
           <CardContent>
@@ -411,18 +410,17 @@ export default function TeamClient({ user }: TeamClientProps) {
         </Card>
 
         <FieldSet>
-          <FieldLegend className="text-destructive">{t("team.dangerZone")}</FieldLegend>
-          <FieldDescription>{t("team.dangerZoneDesc")}</FieldDescription>
+          <FieldLegend className="text-destructive">{m.settings_team_dangerZone()}</FieldLegend>
+          <FieldDescription>{m.settings_team_dangerZoneDesc()}</FieldDescription>
           <FieldGroup>
             <Field orientation="horizontal">
               <FieldContent>
-                <FieldTitle>{t("team.leaveTeamTitle")}</FieldTitle>
-                <FieldDescription>{t("team.leaveTeamDesc")}</FieldDescription>
+                <FieldTitle>{m.settings_team_leaveTeamTitle()}</FieldTitle>
+                <FieldDescription>{m.settings_team_leaveTeamDesc()}</FieldDescription>
               </FieldContent>
               <LeaveTeamButton
                 onConfirm={handleLeave}
                 isPending={leaveTeamMutation.isPending}
-                t={t}
               />
             </Field>
           </FieldGroup>
@@ -439,20 +437,20 @@ export default function TeamClient({ user }: TeamClientProps) {
   return (
     <div className="space-y-6">
       <div>
-        <h2 className="text-lg font-semibold">{t("team.title")}</h2>
-        <p className="text-sm text-muted-foreground">{t("team.subtitle")}</p>
+        <h2 className="text-lg font-semibold">{m.settings_team_title()}</h2>
+        <p className="text-sm text-muted-foreground">{m.settings_team_subtitle()}</p>
       </div>
 
       <div className="grid gap-4 xl:grid-cols-2 border rounded-lg p-4">
         <SeatCard
-          title={t("team.seatMembers")}
-          description={t("team.seatMembersHint")}
+          title={m.settings_team_seatMembers()}
+          description={m.settings_team_seatMembersHint()}
           usage={seatUsage}
           limit={seatLimit}
         />
         <SeatCard
-          title={t("team.seatGuests")}
-          description={t("team.seatGuestsHint")}
+          title={m.settings_team_seatGuests()}
+          description={m.settings_team_seatGuestsHint()}
           usage={guestSeatUsage}
           limit={guestSeatLimit}
         />
@@ -498,7 +496,6 @@ function SeatCard({
   usage: number
   limit: number | "unlimited"
 }) {
-  const { t } = useTranslation("settings")
   return (
     <Card>
       <CardHeader className="pb-2">
@@ -508,7 +505,7 @@ function SeatCard({
           {limit === "unlimited" ? (
             <span className="flex items-center gap-1">
               <InfinityIcon className="size-3" />
-              {t("team.unlimited")}
+              {m.settings_team_unlimited()}
             </span>
           ) : (
             `${usage} / ${limit}`
@@ -528,11 +525,9 @@ function SeatCard({
 function LeaveTeamButton({
   onConfirm,
   isPending,
-  t,
 }: {
   onConfirm: () => Promise<void>
   isPending: boolean
-  t: (key: string) => string
 }) {
   const [open, setOpen] = useState(false)
 
@@ -545,16 +540,16 @@ function LeaveTeamButton({
         onClick={() => setOpen(true)}
       >
         <Trash2 className="size-4" data-icon="inline-start" />
-        {t("team.leaveTeam")}
+        {m.settings_team_leaveTeam()}
       </Button>
       <AlertDialog open={open} onOpenChange={setOpen}>
         <AlertDialogContent>
           <AlertDialogHeader>
-            <AlertDialogTitle>{t("team.leaveTeamTitle")}</AlertDialogTitle>
-            <AlertDialogDescription>{t("team.leaveTeamDesc")}</AlertDialogDescription>
+            <AlertDialogTitle>{m.settings_team_leaveTeamTitle()}</AlertDialogTitle>
+            <AlertDialogDescription>{m.settings_team_leaveTeamDesc()}</AlertDialogDescription>
           </AlertDialogHeader>
           <AlertDialogFooter>
-            <AlertDialogCancel>{t("common.cancel")}</AlertDialogCancel>
+            <AlertDialogCancel>{m.common_cancel()}</AlertDialogCancel>
             <AlertDialogAction
               disabled={isPending}
               onClick={async () => {
@@ -563,7 +558,7 @@ function LeaveTeamButton({
               }}
               className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
             >
-              {t("team.leaveTeam")}
+              {m.settings_team_leaveTeam()}
             </AlertDialogAction>
           </AlertDialogFooter>
         </AlertDialogContent>