diff --git a/apps/mail/app/(error)/not-found.tsx b/apps/mail/app/(error)/not-found.tsx
index 5e6d24c89f..1c1dad7f51 100644
--- a/apps/mail/app/(error)/not-found.tsx
+++ b/apps/mail/app/(error)/not-found.tsx
@@ -3,26 +3,28 @@
 import { AlertCircle, ArrowLeft } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { useRouter } from "next/navigation";
+import { useTranslations } from "next-intl";
 
 export function NotFound() {
   const router = useRouter();
+  const t = useTranslations();
 
   return (
-    <div className="flex w-full items-center justify-center bg-white text-center dark:bg-background">
-      <div className="flex-col items-center justify-center dark:text-gray-100 md:flex">
+    <div className="dark:bg-background flex w-full items-center justify-center bg-white text-center">
+      <div className="flex-col items-center justify-center md:flex dark:text-gray-100">
         <div className="relative">
-          <h1 className="select-none text-[150px] font-bold text-muted-foreground/20">404</h1>
+          <h1 className="text-muted-foreground/20 select-none text-[150px] font-bold">404</h1>
           <div className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2">
-            <AlertCircle className="h-20 w-20 text-muted-foreground" />
+            <AlertCircle className="text-muted-foreground h-20 w-20" />
           </div>
         </div>
 
         {/* Message */}
         <div className="space-y-2">
-          <h2 className="text-2xl font-semibold tracking-tight">Page Not Found</h2>
-          <p className="text-muted-foreground">
-            Oops! The page you&apos;re looking for doesn&apos;t exist or has been moved.
-          </p>
+          <h2 className="text-2xl font-semibold tracking-tight">
+            {t("pages.error.notFound.title")}
+          </h2>
+          <p className="text-muted-foreground">{t("pages.error.notFound.description")}</p>
         </div>
 
         {/* Buttons */}
@@ -30,10 +32,10 @@ export function NotFound() {
           <Button
             variant="outline"
             onClick={() => router.back()}
-            className="gap-2 text-muted-foreground"
+            className="text-muted-foreground gap-2"
           >
             <ArrowLeft className="h-4 w-4" />
-            Go Back
+            {t("pages.error.notFound.goBack")}
           </Button>
         </div>
       </div>
diff --git a/apps/mail/app/(routes)/settings/[...settings]/page.tsx b/apps/mail/app/(routes)/settings/[...settings]/page.tsx
index b4dbf83cd4..96360eac08 100644
--- a/apps/mail/app/(routes)/settings/[...settings]/page.tsx
+++ b/apps/mail/app/(routes)/settings/[...settings]/page.tsx
@@ -6,6 +6,7 @@ import AppearancePage from "../appearance/page";
 import ShortcutsPage from "../shortcuts/page";
 import SecurityPage from "../security/page";
 import { useParams } from "next/navigation";
+import { useTranslations } from "next-intl";
 import GeneralPage from "../general/page";
 
 const settingsPages: Record<string, React.ComponentType> = {
@@ -20,11 +21,12 @@ const settingsPages: Record<string, React.ComponentType> = {
 export default function SettingsPage() {
   const params = useParams();
   const section = params.settings?.[0] || "general";
+  const t = useTranslations();
 
   const SettingsComponent = settingsPages[section];
 
   if (!SettingsComponent) {
-    return <div>404 - Settings page not found</div>;
+    return <div>{t("pages.error.settingsNotFound")}</div>;
   }
 
   return <SettingsComponent />;
diff --git a/apps/mail/app/(routes)/settings/appearance/page.tsx b/apps/mail/app/(routes)/settings/appearance/page.tsx
index a439bb4e2c..5888167f71 100644
--- a/apps/mail/app/(routes)/settings/appearance/page.tsx
+++ b/apps/mail/app/(routes)/settings/appearance/page.tsx
@@ -7,6 +7,7 @@ import { ModeToggle } from "@/components/theme/theme-switcher";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { Button } from "@/components/ui/button";
 import { Label } from "@/components/ui/label";
+import { useTranslations } from "next-intl";
 import { useForm } from "react-hook-form";
 import { useState } from "react";
 import * as z from "zod";
@@ -18,6 +19,7 @@ const formSchema = z.object({
 
 export default function AppearancePage() {
   const [isSaving, setIsSaving] = useState(false);
+  const t = useTranslations();
 
   const form = useForm<z.infer<typeof formSchema>>({
     resolver: zodResolver(formSchema),
@@ -37,15 +39,20 @@ export default function AppearancePage() {
   return (
     <div className="grid gap-6">
       <SettingsCard
-        title="Appearance"
-        description="Customize colors, fonts and view options."
+        title={t("pages.settings.appearance.title")}
+        description={t("pages.settings.appearance.description")}
+        footer={
+          <Button type="submit" form="appearance-form" disabled={isSaving}>
+            {isSaving ? t("common.actions.saving") : t("common.actions.saveChanges")}
+          </Button>
+        }
       >
         <Form {...form}>
           <form id="appearance-form" onSubmit={form.handleSubmit(onSubmit)} className="space-y-8">
             <div className="space-y-4">
               <div className="space-y-2">
-                <Label>Theme</Label>
-                <ModeToggle className="w-36 bg-popover" />
+                <Label>{t("pages.settings.appearance.theme")}</Label>
+                <ModeToggle className="bg-popover w-36" />
               </div>
             </div>
           </form>
diff --git a/apps/mail/app/(routes)/settings/connections/page.tsx b/apps/mail/app/(routes)/settings/connections/page.tsx
index 947b9bece1..b96cad62fd 100644
--- a/apps/mail/app/(routes)/settings/connections/page.tsx
+++ b/apps/mail/app/(routes)/settings/connections/page.tsx
@@ -11,13 +11,14 @@ import {
 } from "@/components/ui/dialog";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { SettingsCard } from "@/components/settings/settings-card";
+import { AddConnectionDialog } from "@/components/connection/add";
 import { emailProviders } from "@/constants/emailProviders";
 import { useConnections } from "@/hooks/use-connections";
 import { deleteConnection } from "@/actions/connections";
-import { AddConnectionDialog } from "@/components/connection/add";
 import { Skeleton } from "@/components/ui/skeleton";
 import { Button } from "@/components/ui/button";
 import { useSession } from "@/lib/auth-client";
+import { useTranslations } from "next-intl";
 import { Trash, Plus } from "lucide-react";
 import { useState } from "react";
 import Image from "next/image";
@@ -27,47 +28,51 @@ export default function ConnectionsPage() {
   const { refetch } = useSession();
   const { data: connections, mutate, isLoading } = useConnections();
   const [openTooltip, setOpenTooltip] = useState<string | null>(null);
+  const t = useTranslations();
 
   const disconnectAccount = async (connectionId: string) => {
     try {
       await deleteConnection(connectionId);
-      toast.success("Account disconnected successfully");
+      toast.success(t("pages.settings.connections.disconnectSuccess"));
       mutate();
       refetch();
     } catch (error) {
       console.error("Error disconnecting account:", error);
-      toast.error("Failed to disconnect account");
+      toast.error(t("pages.settings.connections.disconnectError"));
     }
   };
 
   return (
     <div className="grid gap-6">
-      <SettingsCard title="Email Connections" description="Connect your email accounts to Zero.">
+      <SettingsCard
+        title={t("pages.settings.connections.title")}
+        description={t("pages.settings.connections.description")}
+      >
         <div className="space-y-6">
           {isLoading ? (
-            <div className="grid md:grid-cols-3 gap-4">
+            <div className="grid gap-4 md:grid-cols-3">
               {[...Array(3)].map((_, i) => (
                 <div
                   key={i}
-                  className="flex items-center justify-between rounded-lg border p-4 bg-popover"
+                  className="bg-popover flex items-center justify-between rounded-lg border p-4"
                 >
                   <div className="flex min-w-0 items-center gap-4">
                     <Skeleton className="h-12 w-12 rounded-lg" />
-                    <div className="flex-col gap-1 flex">
+                    <div className="flex flex-col gap-1">
                       <Skeleton className="h-4 w-full lg:w-32" />
                       <Skeleton className="h-3 w-full lg:w-48" />
                     </div>
                   </div>
-                  <Skeleton className="h-8 w-8 rounded-full ml-4" />
+                  <Skeleton className="ml-4 h-8 w-8 rounded-full" />
                 </div>
               ))}
             </div>
           ) : connections?.length ? (
-            <div className="grid md:grid-cols-3 gap-4">
+            <div className="grid gap-4 md:grid-cols-3">
               {connections.map((connection) => (
                 <div
                   key={connection.id}
-                  className="flex items-center justify-between rounded-lg border p-4 bg-popover"
+                  className="bg-popover flex items-center justify-between rounded-lg border p-4"
                 >
                   <div className="flex min-w-0 items-center gap-4">
                     {connection.picture ? (
@@ -81,7 +86,7 @@ export default function ConnectionsPage() {
                     ) : (
                       <div className="bg-primary/10 flex h-12 w-12 shrink-0 items-center justify-center rounded-lg">
                         <svg viewBox="0 0 24 24" className="text-primary h-6 w-6">
-                            <path fill="currentColor" d={emailProviders[0]!.icon} />
+                          <path fill="currentColor" d={emailProviders[0]!.icon} />
                         </svg>
                       </div>
                     )}
@@ -123,24 +128,28 @@ export default function ConnectionsPage() {
                       <Button
                         variant="ghost"
                         size="icon"
-                        className="text-muted-foreground hover:text-primary shrink-0 ml-4"
+                        className="text-muted-foreground hover:text-primary ml-4 shrink-0"
                       >
                         <Trash className="h-4 w-4" />
                       </Button>
                     </DialogTrigger>
                     <DialogContent>
                       <DialogHeader>
-                        <DialogTitle>Disconnect Email Account</DialogTitle>
+                        <DialogTitle>{t("pages.settings.connections.disconnectTitle")}</DialogTitle>
                         <DialogDescription>
-                          Are you sure you want to disconnect this email?
+                          {t("pages.settings.connections.disconnectDescription")}
                         </DialogDescription>
                       </DialogHeader>
                       <div className="flex justify-end gap-4">
                         <DialogClose asChild>
-                          <Button variant="outline">Cancel</Button>
+                          <Button variant="outline">
+                            {t("pages.settings.connections.cancel")}
+                          </Button>
                         </DialogClose>
                         <DialogClose asChild>
-                          <Button onClick={() => disconnectAccount(connection.id)}>Remove</Button>
+                          <Button onClick={() => disconnectAccount(connection.id)}>
+                            {t("pages.settings.connections.remove")}
+                          </Button>
                         </DialogClose>
                       </div>
                     </DialogContent>
@@ -152,13 +161,13 @@ export default function ConnectionsPage() {
 
           <div className="flex items-center justify-start">
             <AddConnectionDialog>
-              <Button 
-                variant="outline" 
-                className="group relative w-9 overflow-hidden transition-all duration-200 hover:w-40"
+              <Button
+                variant="outline"
+                className="group relative w-9 overflow-hidden transition-all duration-200 hover:w-full sm:hover:w-[32.5%]"
               >
                 <Plus className="absolute left-2 h-4 w-4" />
                 <span className="whitespace-nowrap pl-7 opacity-0 transition-opacity duration-200 group-hover:opacity-100">
-                  Add Connection
+                  {t("pages.settings.connections.addEmail")}
                 </span>
               </Button>
             </AddConnectionDialog>
diff --git a/apps/mail/app/(routes)/settings/general/page.tsx b/apps/mail/app/(routes)/settings/general/page.tsx
index d11dce91b0..747e26eb05 100644
--- a/apps/mail/app/(routes)/settings/general/page.tsx
+++ b/apps/mail/app/(routes)/settings/general/page.tsx
@@ -16,12 +16,15 @@ import {
   SelectValue,
 } from "@/components/ui/select";
 import { SettingsCard } from "@/components/settings/settings-card";
+import { availableLocales, defaultLocale } from "@/i18n/config";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { Globe, Clock, LogOut } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Switch } from "@/components/ui/switch";
 import { signOut } from "@/lib/auth-client";
 import { useRouter } from "next/navigation";
+import { changeLocale } from "@/i18n/utils";
+import { useTranslations, useLocale } from "next-intl";
 import { useForm } from "react-hook-form";
 import { useState } from "react";
 import { toast } from "sonner";
@@ -37,11 +40,12 @@ const formSchema = z.object({
 export default function GeneralPage() {
   const router = useRouter();
   const [isSaving, setIsSaving] = useState(false);
+  const locale = useLocale();
 
   const form = useForm<z.infer<typeof formSchema>>({
     resolver: zodResolver(formSchema),
     defaultValues: {
-      language: "en",
+      language: locale,
       timezone: "UTC",
       dynamicContent: false,
       externalImages: true,
@@ -53,6 +57,8 @@ export default function GeneralPage() {
 
     // TODO: Save settings in user's account
 
+    changeLocale(values.language);
+
     // Simulate API call
     setTimeout(() => {
       console.log(values);
@@ -70,26 +76,28 @@ export default function GeneralPage() {
         },
       }),
       {
-        loading: "Signing out...",
-        success: () => "Signed out successfully!",
-        error: "Error signing out",
+        loading: t("common.actions.signingOut"),
+        success: () => t("common.actions.signedOutSuccess"),
+        error: t("common.actions.signOutError"),
       },
     );
   };
 
+  const t = useTranslations();
+
   return (
     <div className="grid gap-6">
       <SettingsCard
-        title="General Settings"
-        description="Manage settings for your language and email display preferences."
+        title={t("pages.settings.general.title")}
+        description={t("pages.settings.general.description")}
         footer={
           <div className="flex gap-4">
             <Button variant="destructive" onClick={handleSignOut}>
               <LogOut className="mr-2 h-4 w-4" />
-              Log out
+              {t("common.actions.logout")}
             </Button>
             <Button type="submit" form="general-form" disabled={isSaving}>
-              {isSaving ? "Saving..." : "Save changes"}
+              {isSaving ? t("common.actions.saving") : t("common.actions.saveChanges")}
             </Button>
           </div>
         }
@@ -102,7 +110,7 @@ export default function GeneralPage() {
                 name="language"
                 render={({ field }) => (
                   <FormItem>
-                    <FormLabel>Language</FormLabel>
+                    <FormLabel>{t("pages.settings.general.language")}</FormLabel>
                     <Select onValueChange={field.onChange} defaultValue={field.value}>
                       <FormControl>
                         <SelectTrigger className="w-36">
@@ -111,7 +119,11 @@ export default function GeneralPage() {
                         </SelectTrigger>
                       </FormControl>
                       <SelectContent>
-                        <SelectItem value="en">English</SelectItem>
+                        {availableLocales.map((locale) => (
+                          <SelectItem key={locale.code} value={locale.code}>
+                            {locale.name}
+                          </SelectItem>
+                        ))}
                       </SelectContent>
                     </Select>
                   </FormItem>
@@ -123,7 +135,7 @@ export default function GeneralPage() {
                 render={({ field }) => (
                   // TODO: Add all timezones
                   <FormItem>
-                    <FormLabel>Timezone</FormLabel>
+                    <FormLabel>{t("pages.settings.general.timezone")}</FormLabel>
                     <Select onValueChange={field.onChange} defaultValue={field.value}>
                       <FormControl>
                         <SelectTrigger className="w-36">
@@ -151,10 +163,14 @@ export default function GeneralPage() {
                 control={form.control}
                 name="dynamicContent"
                 render={({ field }) => (
-                  <FormItem className="flex flex-row items-center justify-between rounded-lg border bg-popover p-4">
+                  <FormItem className="bg-popover flex flex-row items-center justify-between rounded-lg border p-4">
                     <div className="space-y-0.5">
-                      <FormLabel className="text-base">Dynamic Content</FormLabel>
-                      <FormDescription>Allow emails to display dynamic content.</FormDescription>
+                      <FormLabel className="text-base">
+                        {t("pages.settings.general.dynamicContent")}
+                      </FormLabel>
+                      <FormDescription>
+                        {t("pages.settings.general.dynamicContentDescription")}
+                      </FormDescription>
                     </div>
                     <FormControl className="ml-4">
                       <Switch checked={field.value} onCheckedChange={field.onChange} />
@@ -166,11 +182,13 @@ export default function GeneralPage() {
                 control={form.control}
                 name="externalImages"
                 render={({ field }) => (
-                  <FormItem className="flex flex-row items-center justify-between rounded-lg border p-4 bg-popover">
+                  <FormItem className="bg-popover flex flex-row items-center justify-between rounded-lg border p-4">
                     <div className="space-y-0.5">
-                      <FormLabel className="text-base">Display External Images</FormLabel>
+                      <FormLabel className="text-base">
+                        {t("pages.settings.general.externalImages")}
+                      </FormLabel>
                       <FormDescription>
-                        Allow emails to display images from external sources.
+                        {t("pages.settings.general.externalImagesDescription")}
                       </FormDescription>
                     </div>
                     <FormControl className="ml-4">
diff --git a/apps/mail/app/(routes)/settings/security/page.tsx b/apps/mail/app/(routes)/settings/security/page.tsx
index d6cd49b15c..b2510aaa55 100644
--- a/apps/mail/app/(routes)/settings/security/page.tsx
+++ b/apps/mail/app/(routes)/settings/security/page.tsx
@@ -1,12 +1,20 @@
 "use client";
 
+import {
+  Form,
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+} from "@/components/ui/form";
 import { SettingsCard } from "@/components/settings/settings-card";
-import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel } from "@/components/ui/form";
+import { zodResolver } from "@hookform/resolvers/zod";
 import { Switch } from "@/components/ui/switch";
 import { Button } from "@/components/ui/button";
-import { KeyRound } from "lucide-react";
+import { useTranslations } from "next-intl";
 import { useForm } from "react-hook-form";
-import { zodResolver } from "@hookform/resolvers/zod";
+import { KeyRound } from "lucide-react";
 import { useState } from "react";
 import * as z from "zod";
 
@@ -17,6 +25,7 @@ const formSchema = z.object({
 
 export default function SecurityPage() {
   const [isSaving, setIsSaving] = useState(false);
+  const t = useTranslations();
 
   const form = useForm<z.infer<typeof formSchema>>({
     resolver: zodResolver(formSchema),
@@ -39,13 +48,13 @@ export default function SecurityPage() {
   return (
     <div className="grid gap-6">
       <SettingsCard
-        title="Security"
-        description="Manage your security preferences and account protection."
+        title={t("pages.settings.security.title")}
+        description={t("pages.settings.security.description")}
         footer={
           <div className="flex gap-4">
-            <Button variant="destructive">Delete Account</Button>
+            <Button variant="destructive">{t("pages.settings.security.deleteAccount")}</Button>
             <Button type="submit" form="security-form" disabled={isSaving}>
-              {isSaving ? "Saving..." : "Save changes"}
+              {isSaving ? t("common.actions.saving") : t("common.actions.saveChanges")}
             </Button>
           </div>
         }
@@ -57,11 +66,13 @@ export default function SecurityPage() {
                 control={form.control}
                 name="twoFactorAuth"
                 render={({ field }) => (
-                  <FormItem className="flex flex-row items-center justify-between rounded-lg border bg-popover p-4">
+                  <FormItem className="bg-popover flex flex-row items-center justify-between rounded-lg border p-4">
                     <div className="space-y-0.5">
-                      <FormLabel className="text-base">Two-Factor Authentication</FormLabel>
+                      <FormLabel className="text-base">
+                        {t("pages.settings.security.twoFactorAuth")}
+                      </FormLabel>
                       <FormDescription>
-                        Add an extra layer of security to your account
+                        {t("pages.settings.security.twoFactorAuthDescription")}
                       </FormDescription>
                     </div>
                     <FormControl className="ml-4">
@@ -74,11 +85,13 @@ export default function SecurityPage() {
                 control={form.control}
                 name="loginNotifications"
                 render={({ field }) => (
-                  <FormItem className="flex flex-row items-center justify-between rounded-lg border bg-popover p-4">
+                  <FormItem className="bg-popover flex flex-row items-center justify-between rounded-lg border p-4">
                     <div className="space-y-0.5">
-                      <FormLabel className="text-base">Login Notifications</FormLabel>
+                      <FormLabel className="text-base">
+                        {t("pages.settings.security.loginNotifications")}
+                      </FormLabel>
                       <FormDescription>
-                        Get notified about new login attempts
+                        {t("pages.settings.security.loginNotificationsDescription")}
                       </FormDescription>
                     </div>
                     <FormControl className="ml-4">
diff --git a/apps/mail/app/(routes)/settings/shortcuts/page.tsx b/apps/mail/app/(routes)/settings/shortcuts/page.tsx
index 8dd8ae0fd3..8e331bed07 100644
--- a/apps/mail/app/(routes)/settings/shortcuts/page.tsx
+++ b/apps/mail/app/(routes)/settings/shortcuts/page.tsx
@@ -2,28 +2,31 @@
 
 import { SettingsCard } from "@/components/settings/settings-card";
 import { keyboardShortcuts } from "@/config/shortcuts"; //import the shortcuts
+import { MessageKey } from "@/config/navigation";
 import { Button } from "@/components/ui/button";
+import { useTranslations } from "next-intl";
 import { ReactNode } from "react";
 
 export default function ShortcutsPage() {
   const shortcuts = keyboardShortcuts; //now gets shortcuts from the config file
+  const t = useTranslations();
 
   return (
     <div className="grid gap-6">
       <SettingsCard
-        title="Keyboard Shortcuts"
-        description="View and customize keyboard shortcuts for quick actions."
+        title={t("pages.settings.shortcuts.title")}
+        description={t("pages.settings.shortcuts.description")}
         footer={
           <div className="flex gap-4">
-            <Button variant="outline">Reset to Defaults</Button>
-            <Button>Save Changes</Button>
+            <Button variant="outline">{t("common.actions.resetToDefaults")}</Button>
+            <Button>{t("common.actions.saveChanges")}</Button>
           </div>
         }
       >
         <div className="grid gap-2 md:grid-cols-2">
           {shortcuts.map((shortcut, index) => (
             <Shortcut key={index} keys={shortcut.keys}>
-              {shortcut.action}
+              {t(`pages.settings.shortcuts.actions.${shortcut.action}` as MessageKey)}
             </Shortcut>
           ))}
         </div>
@@ -34,13 +37,13 @@ export default function ShortcutsPage() {
 
 function Shortcut({ children, keys }: { children: ReactNode; keys: string[] }) {
   return (
-    <div className="flex items-center justify-between gap-2 rounded-lg border bg-popover p-2 text-sm text-muted-foreground">
+    <div className="bg-popover text-muted-foreground flex items-center justify-between gap-2 rounded-lg border p-2 text-sm">
       <span className="font-medium">{children}</span>
       <div className="flex select-none gap-1">
         {keys.map((key) => (
           <kbd
             key={key}
-            className="h-6 rounded-[6px] border border-muted-foreground/10 bg-accent px-1.5 font-mono text-xs leading-6"
+            className="border-muted-foreground/10 bg-accent h-6 rounded-[6px] border px-1.5 font-mono text-xs leading-6"
           >
             {key}
           </kbd>
diff --git a/apps/mail/app/layout.tsx b/apps/mail/app/layout.tsx
index df14825ee8..db2cbe0f34 100644
--- a/apps/mail/app/layout.tsx
+++ b/apps/mail/app/layout.tsx
@@ -1,5 +1,7 @@
+import { getLocale, getMessages } from "next-intl/server";
 import { Geist, Geist_Mono } from "next/font/google";
 import { Analytics } from "@vercel/analytics/react";
+import { NextIntlClientProvider } from "next-intl";
 import { siteConfig } from "@/lib/site-config";
 import { Toast } from "@/components/ui/toast";
 import { Providers } from "@/lib/providers";
@@ -19,18 +21,22 @@ const geistMono = Geist_Mono({
 
 export const metadata = siteConfig;
 
-export default function RootLayout({
+export default async function RootLayout({
   children,
 }: Readonly<{
   children: React.ReactNode;
 }>) {
+  const locale = await getLocale();
+  const messages = await getMessages();
   return (
-    <html lang="en" suppressHydrationWarning>
+    <html lang={locale} suppressHydrationWarning>
       <body className={cn(geistSans.variable, geistMono.variable, "antialiased")}>
         <Providers attribute="class" defaultTheme="dark" enableSystem disableTransitionOnChange>
-          {children}
-          <Toast />
-          <Analytics />
+          <NextIntlClientProvider messages={messages}>
+            {children}
+            <Toast />
+            <Analytics />
+          </NextIntlClientProvider>
         </Providers>
       </body>
     </html>
diff --git a/apps/mail/components/connection/add.tsx b/apps/mail/components/connection/add.tsx
index 7eee83d93d..feacc0c45f 100644
--- a/apps/mail/components/connection/add.tsx
+++ b/apps/mail/components/connection/add.tsx
@@ -1,76 +1,94 @@
-import { Plus, UserPlus } from "lucide-react"
-import { Button } from "../ui/button"
-import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from "../ui/dialog"
-import { emailProviders } from "@/constants/emailProviders"
-import { cn } from "@/lib/utils"
-import { motion } from "motion/react"
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "../ui/dialog";
+import { emailProviders } from "@/constants/emailProviders";
+import { Plus, UserPlus } from "lucide-react";
+import { useTranslations } from "next-intl";
+import { motion } from "motion/react";
+import { Button } from "../ui/button";
+import { cn } from "@/lib/utils";
 
-export const AddConnectionDialog = ({ 
-    children, 
-    className, 
-    onOpenChange 
-}: { 
-    children?: React.ReactNode, 
-    className?: string,
-    onOpenChange?: (open: boolean) => void
+export const AddConnectionDialog = ({
+  children,
+  className,
+  onOpenChange,
+}: {
+  children?: React.ReactNode;
+  className?: string;
+  onOpenChange?: (open: boolean) => void;
 }) => {
-    return <Dialog onOpenChange={onOpenChange}>
-        <DialogTrigger asChild>
-            {children || (
-                <Button size={'dropdownItem'} variant={'dropdownItem'} className={cn("gap-2 w-full justify-start", className)}>
-                    <UserPlus size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
-                    <p className="text-[13px] opacity-60">Add email</p>
-                </Button>
-            )}
-        </DialogTrigger>
-        <DialogContent className="sm:max-w-md">
-            <DialogHeader>
-                <DialogTitle>Connect Email</DialogTitle>
-                <DialogDescription>Select an email provider to connect</DialogDescription>
-            </DialogHeader>
-            <motion.div 
-                className="mt-4 grid grid-cols-2 gap-4"
-                initial={{ opacity: 0 }}
-                animate={{ opacity: 1 }}
-                transition={{ duration: 0.3 }}
+  const t = useTranslations();
+
+  return (
+    <Dialog onOpenChange={onOpenChange}>
+      <DialogTrigger asChild>
+        {children || (
+          <Button
+            size={"dropdownItem"}
+            variant={"dropdownItem"}
+            className={cn("w-full justify-start gap-2", className)}
+          >
+            <UserPlus size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
+            <p className="text-[13px] opacity-60">{t("pages.settings.connections.addEmail")}</p>
+          </Button>
+        )}
+      </DialogTrigger>
+      <DialogContent className="sm:max-w-md">
+        <DialogHeader>
+          <DialogTitle>{t("pages.settings.connections.connectEmail")}</DialogTitle>
+          <DialogDescription>
+            {t("pages.settings.connections.connectEmailDescription")}
+          </DialogDescription>
+        </DialogHeader>
+        <motion.div
+          className="mt-4 grid grid-cols-2 gap-4"
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          transition={{ duration: 0.3 }}
+        >
+          {emailProviders.map((provider, index) => (
+            <motion.a
+              key={provider.name}
+              href={`/api/v1/mail/auth/${provider.providerId}/init`}
+              initial={{ opacity: 0, y: 20 }}
+              animate={{ opacity: 1, y: 0 }}
+              transition={{ delay: index * 0.1, duration: 0.3 }}
+              whileHover={{ scale: 1.03 }}
+              whileTap={{ scale: 0.97 }}
+            >
+              <Button
+                variant="outline"
+                className="h-24 w-full flex-col items-center justify-center gap-2"
+              >
+                <svg viewBox="0 0 24 24" className="h-12 w-12">
+                  <path fill="currentColor" d={provider.icon} />
+                </svg>
+                <span className="text-xs">{provider.name}</span>
+              </Button>
+            </motion.a>
+          ))}
+          <motion.div
+            initial={{ opacity: 0, y: 20 }}
+            animate={{ opacity: 1, y: 0 }}
+            transition={{ delay: emailProviders.length * 0.1, duration: 0.3 }}
+            whileHover={{ scale: 1.03 }}
+            whileTap={{ scale: 0.97 }}
+          >
+            <Button
+              variant="outline"
+              className="h-24 flex-col items-center justify-center gap-2 border-dashed"
             >
-                {emailProviders.map((provider, index) => (
-                    <motion.a 
-                        key={provider.name} 
-                        href={`/api/v1/mail/auth/${provider.providerId}/init`}
-                        initial={{ opacity: 0, y: 20 }}
-                        animate={{ opacity: 1, y: 0 }}
-                        transition={{ delay: index * 0.1, duration: 0.3 }}
-                        whileHover={{ scale: 1.03 }}
-                        whileTap={{ scale: 0.97 }}
-                    >
-                        <Button
-                            variant="outline"
-                            className="h-24 flex-col items-center justify-center gap-2 w-full"
-                        >
-                            <svg viewBox="0 0 24 24" className="h-12 w-12">
-                                <path fill="currentColor" d={provider.icon} />
-                            </svg>
-                            <span className="text-xs">{provider.name}</span>
-                        </Button>
-                    </motion.a>
-                ))}
-                <motion.div
-                    initial={{ opacity: 0, y: 20 }}
-                    animate={{ opacity: 1, y: 0 }}
-                    transition={{ delay: emailProviders.length * 0.1, duration: 0.3 }}
-                    whileHover={{ scale: 1.03 }}
-                    whileTap={{ scale: 0.97 }}
-                >
-                    <Button
-                        variant="outline"
-                        className="h-24 flex-col items-center justify-center gap-2 border-dashed w-full"
-                    >
-                        <Plus className="h-12 w-12" />
-                        <span className="text-xs">More Coming Soon</span>
-                    </Button>
-                </motion.div>
-            </motion.div>
-        </DialogContent>
+              <Plus className="h-12 w-12" />
+              <span className="text-xs">{t("pages.settings.connections.moreComingSoon")}</span>
+            </Button>
+          </motion.div>
+        </motion.div>
+      </DialogContent>
     </Dialog>
-}
\ No newline at end of file
+  );
+};
diff --git a/apps/mail/components/context/command-palette-context.tsx b/apps/mail/components/context/command-palette-context.tsx
index d0bbbb8ca8..3b97f6177a 100644
--- a/apps/mail/components/context/command-palette-context.tsx
+++ b/apps/mail/components/context/command-palette-context.tsx
@@ -17,6 +17,7 @@ import { navigationConfig, NavItem } from "@/config/navigation";
 import { useRouter, usePathname } from "next/navigation";
 import { keyboardShortcuts } from "@/config/shortcuts";
 import { ArrowUpRight } from "lucide-react";
+import { useTranslations } from "next-intl";
 import { CircleHelp } from "lucide-react";
 import { Pencil } from "lucide-react";
 import * as React from "react";
@@ -63,6 +64,8 @@ export function CommandPalette({ children }: { children: React.ReactNode }) {
     command();
   }, []);
 
+  const t = useTranslations();
+
   const allCommands = React.useMemo(() => {
     const mailCommands: { group: string; item: NavItem }[] = [];
     const settingsCommands: { group: string; item: NavItem }[] = [];
@@ -70,7 +73,7 @@ export function CommandPalette({ children }: { children: React.ReactNode }) {
 
     for (const sectionKey in navigationConfig) {
       const section = navigationConfig[sectionKey];
-      section.sections.forEach((group) => {
+      section?.sections.forEach((group) => {
         group.items.forEach((item) => {
           if (!(sectionKey === "settings" && item.isBackButton)) {
             if (sectionKey === "mail") {
@@ -88,25 +91,33 @@ export function CommandPalette({ children }: { children: React.ReactNode }) {
     }
 
     const combinedCommands = [
-      { group: "Mail", items: mailCommands.map((c) => c.item) },
-      { group: "Settings", items: settingsCommands.map((c) => c.item) },
+      { group: t("common.commandPalette.groups.mail"), items: mailCommands.map((c) => c.item) },
+      {
+        group: t("common.commandPalette.groups.settings"),
+        items: settingsCommands.map((c) => c.item),
+      },
       ...otherCommands.map((section) => ({ group: section.group, items: section.item })),
     ];
 
     const filteredCommands = combinedCommands.map((group) => {
-      if (group.group === "Settings") {
-        return {
-          ...group,
-          items: group.items.filter((item: NavItem) => {
-            return pathname.startsWith("/settings") || !item.isBackButton;
-          }),
-        };
+      if (group.group === t("common.commandPalette.groups.settings")) {
+        if (Array.isArray(group.items)) {
+          return {
+            ...group,
+            items: group.items.filter((item: NavItem) => {
+              return pathname.startsWith("/settings") || !item.isBackButton;
+            }),
+          };
+        }
       }
-      return group;
+      return {
+        ...group,
+        items: Array.isArray(group.items) ? group.items : [group.items],
+      };
     });
 
     return filteredCommands;
-  }, [pathname]);
+  }, [pathname, t]);
 
   return (
     <CommandPaletteContext.Provider
@@ -122,19 +133,19 @@ export function CommandPalette({ children }: { children: React.ReactNode }) {
     >
       <CommandDialog open={open} onOpenChange={setOpen}>
         <VisuallyHidden>
-          <DialogTitle>0 - Command Palette</DialogTitle>
-          <DialogDescription>Quick navigation and actions for 0.</DialogDescription>
+          <DialogTitle>{t("common.commandPalette.title")}</DialogTitle>
+          <DialogDescription>{t("common.commandPalette.description")}</DialogDescription>
         </VisuallyHidden>
-        <CommandInput autoFocus placeholder="Type a command or search..." />
+        <CommandInput autoFocus placeholder={t("common.commandPalette.placeholder")} />
         <CommandList>
-          <CommandEmpty>No results found.</CommandEmpty>
+          <CommandEmpty>{t("common.commandPalette.noResults")}</CommandEmpty>
           <CommandGroup className="pb-0">
-            <CommandItem onSelect={() => window.location.href = "/mail/create"}>
+            <CommandItem onSelect={() => (window.location.href = "/mail/create")}>
               <Pencil size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
-              <span>Compose message</span>
+              <span>{t("common.commandPalette.commands.composeMessage")}</span>
               <CommandShortcut>
                 {keyboardShortcuts
-                  .find((s: { action: string; keys: string[] }) => s.action === "New Email")
+                  .find((s: { action: string; keys: string[] }) => s.action === "newEmail")
                   ?.keys.join(" ")}
               </CommandShortcut>
             </CommandItem>
@@ -160,7 +171,7 @@ export function CommandPalette({ children }: { children: React.ReactNode }) {
                           aria-hidden="true"
                         />
                       )}
-                      <span>{item.title}</span>
+                      <span>{t(item.title)}</span>
                       {item.shortcut && <CommandShortcut>{item.shortcut}</CommandShortcut>}
                     </CommandItem>
                   ))}
@@ -170,15 +181,13 @@ export function CommandPalette({ children }: { children: React.ReactNode }) {
             </React.Fragment>
           ))}
           <CommandSeparator />
-          <CommandGroup heading="Help">
+          <CommandGroup heading={t("common.commandPalette.groups.help")}>
             <CommandItem onSelect={() => runCommand(() => console.log("Help with shortcuts"))}>
               <CircleHelp size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
-              <span>Help with shortcuts</span>
+              <span>{t("common.commandPalette.commands.helpWithShortcuts")}</span>
               <CommandShortcut>
                 {keyboardShortcuts
-                  .find(
-                    (s: { action: string; keys: string[] }) => s.action === "Help with shortcuts",
-                  )
+                  .find((s: { action: string; keys: string[] }) => s.action === "helpWithShortcuts")
                   ?.keys.join(" ")}
               </CommandShortcut>
             </CommandItem>
@@ -188,7 +197,7 @@ export function CommandPalette({ children }: { children: React.ReactNode }) {
               }
             >
               <ArrowUpRight size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
-              <span>Go to docs</span>
+              <span>{t("common.commandPalette.commands.goToDocs")}</span>
             </CommandItem>
           </CommandGroup>
         </CommandList>
diff --git a/apps/mail/components/create/create-email.tsx b/apps/mail/components/create/create-email.tsx
index c6f2965204..b0ca6f8a85 100644
--- a/apps/mail/components/create/create-email.tsx
+++ b/apps/mail/components/create/create-email.tsx
@@ -11,6 +11,7 @@ import { cn, truncateFileName } from "@/lib/utils";
 import Document from "@tiptap/extension-document";
 import { Button } from "@/components/ui/button";
 import { generateJSON } from "@tiptap/html";
+import { useTranslations } from "next-intl";
 import { sendEmail } from "@/actions/send";
 import Bold from "@tiptap/extension-bold";
 import Text from "@tiptap/extension-text";
@@ -90,6 +91,8 @@ export function CreateEmail() {
 
   const hasHiddenAttachments = attachments.length > MAX_VISIBLE_ATTACHMENTS;
 
+  const t = useTranslations();
+
   const isValidEmail = (email: string) => {
     const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
     return emailRegex.test(email);
@@ -199,7 +202,7 @@ export function CreateEmail() {
         attachments: attachments,
       });
 
-      toast.success("Email sent successfully");
+      toast.success(t("pages.createEmail.emailSentSuccessfully"));
       setToInput("");
       setToEmails([]);
       setSubjectInput("");
@@ -208,7 +211,7 @@ export function CreateEmail() {
       setMessageContent("");
     } catch (error) {
       console.error("Error sending email:", error);
-      toast.error("Failed to send email. Please try again.");
+      toast.error(t("pages.createEmail.failedToSendEmail"));
     }
   };
 
@@ -262,7 +265,7 @@ export function CreateEmail() {
         <div className="bg-background/80 border-primary/30 absolute inset-0 z-50 m-4 flex items-center justify-center rounded-2xl border-2 border-dashed backdrop-blur-sm">
           <div className="text-muted-foreground flex flex-col items-center gap-2">
             <Paperclip className="text-muted-foreground h-12 w-12" />
-            <p className="text-lg font-medium">Drop files to attach</p>
+            <p className="text-lg font-medium">{t("pages.createEmail.dropFilesToAttach")}</p>
           </div>
         </div>
       )}
@@ -276,7 +279,7 @@ export function CreateEmail() {
             <div className="space-y-3 md:px-1">
               <div className="flex items-center">
                 <div className="text-muted-foreground w-20 flex-shrink-0 pr-3 text-right text-[1rem] font-[600] opacity-50 md:w-24">
-                  To
+                  {t("common.mailDisplay.to")}
                 </div>
                 <div className="group relative left-[2px] flex w-full flex-wrap items-center gap-1 rounded-md border border-none bg-transparent p-1 transition-all focus-within:border-none focus:outline-none">
                   {toEmails.map((email, index) => (
@@ -302,7 +305,7 @@ export function CreateEmail() {
                   <input
                     type="email"
                     className="text-md relative left-[3px] min-w-[120px] flex-1 bg-transparent opacity-50 placeholder:text-[#616161] focus:outline-none"
-                    placeholder={toEmails.length ? "" : "luke@example.com"}
+                    placeholder={toEmails.length ? "" : t("pages.createEmail.example")}
                     value={toInput}
                     onChange={(e) => setToInput(e.target.value)}
                     onKeyDown={(e) => {
@@ -325,12 +328,12 @@ export function CreateEmail() {
 
               <div className="flex items-center">
                 <div className="text-muted-foreground w-20 flex-shrink-0 pr-3 text-right text-[1rem] font-[600] opacity-50 md:w-24">
-                  Subject
+                  {t("common.searchBar.subject")}
                 </div>
                 <input
                   type="text"
                   className="text-md relative left-[7.5px] w-full bg-transparent placeholder:text-[#616161] placeholder:opacity-50 focus:outline-none"
-                  placeholder="Subject"
+                  placeholder={t("common.searchBar.subject")}
                   value={subjectInput}
                   onChange={(e) => {
                     setSubjectInput(e.target.value);
@@ -341,7 +344,7 @@ export function CreateEmail() {
 
               <div className="flex">
                 <div className="text-muted-foreground text-md relative -top-[1px] w-20 flex-shrink-0 pr-3 pt-2 text-right font-[600] opacity-50 md:w-24">
-                  Body
+                  {t("pages.createEmail.body")}
                 </div>
                 <div className="w-full">
                   {defaultValue && (
@@ -349,7 +352,7 @@ export function CreateEmail() {
                       initialValue={defaultValue}
                       onChange={(newContent) => setMessageContent(newContent)}
                       key={resetEditorKey}
-                      placeholder="Write your message here..."
+                      placeholder={t("pages.createEmail.writeYourMessageHere")}
                     />
                   )}
                 </div>
@@ -366,16 +369,20 @@ export function CreateEmail() {
                   <Button variant="outline" className="flex items-center gap-2">
                     <Paperclip className="h-4 w-4" />
                     <span>
-                      {attachments.length} attachment{attachments.length !== 1 ? "s" : ""}
+                      {attachments.length}{" "}
+                      {t("common.replyCompose.fileCount", { count: attachments.length })}
                     </span>
                   </Button>
                 </PopoverTrigger>
                 <PopoverContent className="w-80 touch-auto" align="start">
                   <div className="space-y-2">
                     <div className="px-1">
-                      <h4 className="font-medium leading-none">Attachments</h4>
+                      <h4 className="font-medium leading-none">
+                        {t("pages.createEmail.attachments")}
+                      </h4>
                       <p className="text-muted-foreground text-sm">
-                        {attachments.length} file{attachments.length !== 1 ? "s" : ""} attached
+                        {attachments.length}{" "}
+                        {t("common.replyCompose.fileCount", { count: attachments.length })}
                       </p>
                     </div>
                     <Separator />
@@ -418,7 +425,7 @@ export function CreateEmail() {
               onClick={() => document?.getElementById("file-upload")?.click()}
             >
               <Plus className="mr-1 h-4 w-4" />
-              Attachments
+              {t("pages.createEmail.attachments")}
             </Button>
             <input
               id="file-upload"
@@ -466,7 +473,7 @@ export function CreateEmail() {
             >
               <ArrowUpIcon className="absolute left-2.5 h-4 w-4" />
               <span className="whitespace-nowrap pl-7 opacity-0 transition-opacity duration-200 group-hover:opacity-100">
-                Send
+                {t("common.replyCompose.send")}
               </span>
             </Button>
           </div>
diff --git a/apps/mail/components/mail/mail-display.tsx b/apps/mail/components/mail/mail-display.tsx
index b52f9bc2b6..93cef877ef 100644
--- a/apps/mail/components/mail/mail-display.tsx
+++ b/apps/mail/components/mail/mail-display.tsx
@@ -6,6 +6,7 @@ import AttachmentDialog from "./attachment-dialog";
 import { useSummary } from "@/hooks/use-summary";
 import { TextShimmer } from "../ui/text-shimmer";
 import { Separator } from "../ui/separator";
+import { useTranslations } from "next-intl";
 import { useEffect, useState } from "react";
 import { MailIframe } from "./mail-iframe";
 import { ParsedMessage } from "@/types";
@@ -86,6 +87,8 @@ const MailDisplay = ({ emailData, isMuted, index, demo }: Props) => {
     url: string;
   }>(null);
   const [openDetailsPopover, setOpenDetailsPopover] = useState<boolean>(false);
+  const t = useTranslations();
+
   const { data } = demo
     ? {
         data: {
@@ -143,7 +146,7 @@ const MailDisplay = ({ emailData, isMuted, index, demo }: Props) => {
                         className="h-auto p-0 text-xs underline hover:bg-transparent"
                         onClick={() => setOpenDetailsPopover(true)}
                       >
-                        Details
+                        {t("common.mailDisplay.details")}
                       </Button>
                     </PopoverTrigger>
                     <PopoverContent
@@ -152,7 +155,9 @@ const MailDisplay = ({ emailData, isMuted, index, demo }: Props) => {
                     >
                       <div className="space-y-1 text-sm">
                         <div className="flex">
-                          <span className="w-24 text-end text-gray-500">From:</span>
+                          <span className="w-24 text-end text-gray-500">
+                            {t("common.mailDisplay.from")}:
+                          </span>
                           <div className="ml-3">
                             <span className="text-muted-foreground pr-1 font-bold">
                               {emailData?.sender?.name}
@@ -163,39 +168,52 @@ const MailDisplay = ({ emailData, isMuted, index, demo }: Props) => {
                           </div>
                         </div>
                         <div className="flex">
-                          <span className="w-24 text-end text-gray-500">To:</span>
+                          <span className="w-24 text-end text-gray-500">
+                            {t("common.mailDisplay.to")}:
+                          </span>
                           <span className="text-muted-foreground ml-3">
                             {emailData?.sender?.email}
                           </span>
                         </div>
                         <div className="flex">
-                          <span className="w-24 text-end text-gray-500">Cc:</span>
+                          <span className="w-24 text-end text-gray-500">
+                            {t("common.mailDisplay.cc")}:
+                          </span>
                           <span className="text-muted-foreground ml-3">
                             {emailData?.sender?.email}
                           </span>
                         </div>
                         <div className="flex">
-                          <span className="w-24 text-end text-gray-500">Date:</span>
+                          <span className="w-24 text-end text-gray-500">
+                            {t("common.mailDisplay.date")}:
+                          </span>
                           <span className="text-muted-foreground ml-3">
                             {format(new Date(emailData?.receivedOn), "PPpp")}
                           </span>
                         </div>
                         <div className="flex">
-                          <span className="w-24 text-end text-gray-500">Mailed-By:</span>
+                          <span className="w-24 text-end text-gray-500">
+                            {t("common.mailDisplay.mailedBy")}:
+                          </span>
                           <span className="text-muted-foreground ml-3">
                             {emailData?.sender?.email}
                           </span>
                         </div>
                         <div className="flex">
-                          <span className="w-24 text-end text-gray-500">Signed-By:</span>
+                          <span className="w-24 text-end text-gray-500">
+                            {t("common.mailDisplay.signedBy")}:
+                          </span>
                           <span className="text-muted-foreground ml-3">
                             {emailData?.sender?.email}
                           </span>
                         </div>
                         <div className="flex items-center">
-                          <span className="w-24 text-end text-gray-500">Security:</span>
+                          <span className="w-24 text-end text-gray-500">
+                            {t("common.mailDisplay.security")}:
+                          </span>
                           <div className="text-muted-foreground ml-3 flex items-center gap-1">
-                            <Lock className="h-4 w-4 text-green-600" /> Standard encryption (TLS)
+                            <Lock className="h-4 w-4 text-green-600" />{" "}
+                            {t("common.mailDisplay.standardEncryption")} (TLS)
                           </div>
                         </div>
                       </div>
diff --git a/apps/mail/components/mail/mail-iframe.tsx b/apps/mail/components/mail/mail-iframe.tsx
index e6f33ca876..6b2bf71dc7 100644
--- a/apps/mail/components/mail/mail-iframe.tsx
+++ b/apps/mail/components/mail/mail-iframe.tsx
@@ -1,5 +1,6 @@
 import { fixNonReadableColors, template } from "@/lib/email-utils";
 import { useEffect, useMemo, useRef, useState } from "react";
+import { useTranslations } from "next-intl";
 import { Loader2 } from "lucide-react";
 import { useTheme } from "next-themes";
 import { cn } from "@/lib/utils";
@@ -12,6 +13,8 @@ export function MailIframe({ html }: { html: string }) {
 
   const iframeDoc = useMemo(() => template(html), [html]);
 
+  const t = useTranslations();
+
   useEffect(() => {
     if (!iframeRef.current) return;
     const url = URL.createObjectURL(new Blob([iframeDoc], { type: "text/html" }));
@@ -44,7 +47,7 @@ export function MailIframe({ html }: { html: string }) {
       {!loaded && (
         <div className="flex h-full w-full items-center justify-center gap-4 p-8">
           <Loader2 className="size-4 animate-spin" />
-          <span>Loading email content...</span>
+          <span>{t("common.mailDisplay.loadingMailContent")}</span>
         </div>
       )}
       <iframe
diff --git a/apps/mail/components/mail/mail.tsx b/apps/mail/components/mail/mail.tsx
index a8bcefd28f..1e3329059a 100644
--- a/apps/mail/components/mail/mail.tsx
+++ b/apps/mail/components/mail/mail.tsx
@@ -1,29 +1,30 @@
 "use client";
 
-
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "@/components/ui/resizable";
-import { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from "@/components/ui/drawer";
 import { ArchiveX, BellOff, X, Inbox, Tag, AlertTriangle, User, Bell } from "lucide-react";
-import { useState, useCallback, useMemo, useEffect, useRef } from "react";
+import { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from "@/components/ui/drawer";
 import { ThreadDisplay, ThreadDemo } from "@/components/mail/thread-display";
+import { useState, useCallback, useMemo, useEffect, useRef } from "react";
 import { MailList, MailListDemo } from "@/components/mail/mail-list";
 import { useParams, useSearchParams } from "next/navigation";
 import { useMediaQuery } from "../../hooks/use-media-query";
 import { useSearchValue } from "@/hooks/use-search-value";
+import { SearchIcon } from "../icons/animated/search";
 import { useMail } from "@/components/mail/use-mail";
 import { SidebarToggle } from "../ui/sidebar-toggle";
 import { Skeleton } from "@/components/ui/skeleton";
+import { cn, defaultPageSize } from "@/lib/utils";
 import { useThreads } from "@/hooks/use-threads";
+import { MessageKey } from "@/config/navigation";
 import { Button } from "@/components/ui/button";
 import { useHotKey } from "@/hooks/use-hot-key";
 import { useSession } from "@/lib/auth-client";
+import { XIcon } from "../icons/animated/x";
 import { useRouter } from "next/navigation";
+import { useTranslations } from "next-intl";
 import { SearchBar } from "./search-bar";
-import { cn, defaultPageSize } from "@/lib/utils";
 import items from "./demo.json";
-import { XIcon } from "../icons/animated/x";
-import { SearchIcon } from "../icons/animated/search";
 
 export function DemoMailLayout() {
   const [mail, setMail] = useState({
@@ -45,16 +46,14 @@ export function DemoMailLayout() {
       setFilteredItems(items);
     } else {
       const categoryMap = {
-        "Important": "important",
-        "Personal": "personal",
-        "Updates": "updates",
-        "Promotions": "promotions"
+        Important: "important",
+        Personal: "personal",
+        Updates: "updates",
+        Promotions: "promotions",
       };
-      
+
       const filterTag = categoryMap[activeCategory as keyof typeof categoryMap];
-      const filtered = items.filter(item => 
-        item.tags && item.tags.includes(filterTag)
-      );
+      const filtered = items.filter((item) => item.tags && item.tags.includes(filterTag));
       setFilteredItems(filtered);
     }
   }, [activeCategory]);
@@ -89,8 +88,8 @@ export function DemoMailLayout() {
               >
                 <SidebarToggle className="h-fit px-2" />
                 <div>
-                  <MailCategoryTabs 
-                    iconsOnly={true} 
+                  <MailCategoryTabs
+                    iconsOnly={true}
                     onCategoryChange={setActiveCategory}
                     initialCategory={activeCategory}
                   />
@@ -118,7 +117,7 @@ export function DemoMailLayout() {
                     ))}
                   </div>
                 ) : (
-                    <MailListDemo items={filteredItems} />
+                  <MailListDemo items={filteredItems} />
                 )}
               </div>
             </div>
@@ -175,7 +174,12 @@ export function MailLayout() {
     }
   }, [session?.user, isPending]);
 
-  const { isLoading, isValidating } = useThreads(folder, undefined, searchValue.value, defaultPageSize);
+  const { isLoading, isValidating } = useThreads(
+    folder,
+    undefined,
+    searchValue.value,
+    defaultPageSize,
+  );
 
   const [open, setOpen] = useState(false);
   const isDesktop = useMediaQuery("(min-width: 768px)");
@@ -244,7 +248,7 @@ export function MailLayout() {
               />
               <div
                 className={cn(
-                  "sticky top-0 z-10 flex items-center justify-between gap-1.5 p-2 transition-colors border-b",
+                  "sticky top-0 z-10 flex items-center justify-between gap-1.5 border-b p-2 transition-colors",
                 )}
               >
                 <SidebarToggle className="h-fit px-2" />
@@ -260,7 +264,7 @@ export function MailLayout() {
                     </Button>
                   </div>
                 )}
-                
+
                 {!searchMode && (
                   <>
                     {mail.bulkSelected.length > 0 ? (
@@ -288,7 +292,7 @@ export function MailLayout() {
                     ) : (
                       <>
                         <div className="flex-1 text-center text-sm font-medium capitalize">
-                            <MailCategoryTabs iconsOnly={!!mail.selected} />
+                          <MailCategoryTabs iconsOnly={!!mail.selected} />
                         </div>
                         <div className="flex items-center gap-1.5">
                           <Button
@@ -327,9 +331,7 @@ export function MailLayout() {
                     ))}
                   </div>
                 ) : (
-                    <MailList
-                      isCompact={true}
-                  />
+                  <MailList isCompact={true} />
                 )}
               </div>
             </div>
@@ -395,70 +397,79 @@ function BulkSelectActions() {
 
 const categories = [
   {
-    name: "Primary",
+    name: "common.mailCategories.primary",
     searchValue: "",
     icon: <Inbox className="h-4 w-4" />,
-    colors: "border-0 bg-gray-200 text-gray-700 dark:bg-gray-800/50 dark:text-gray-400 dark:hover:bg-gray-800/70"
+    colors:
+      "border-0 bg-gray-200 text-gray-700 dark:bg-gray-800/50 dark:text-gray-400 dark:hover:bg-gray-800/70",
   },
   {
-    name: "Important",
+    name: "common.mailCategories.important",
     searchValue: "is:important",
     icon: <AlertTriangle className="h-4 w-4" />,
-    colors: "border-0 text-amber-800 bg-amber-100 dark:bg-amber-900/20 dark:text-amber-500 dark:hover:bg-amber-900/30"
+    colors:
+      "border-0 text-amber-800 bg-amber-100 dark:bg-amber-900/20 dark:text-amber-500 dark:hover:bg-amber-900/30",
   },
   {
-    name: "Personal",
+    name: "common.mailCategories.personal",
     searchValue: "is:personal",
     icon: <User className="h-4 w-4" />,
-    colors: "border-0 text-green-800 bg-green-100 dark:bg-green-900/20 dark:text-green-500 dark:hover:bg-green-900/30"
+    colors:
+      "border-0 text-green-800 bg-green-100 dark:bg-green-900/20 dark:text-green-500 dark:hover:bg-green-900/30",
   },
   {
-    name: "Updates",
+    name: "common.mailCategories.updates",
     searchValue: "is:updates",
     icon: <Bell className="h-4 w-4" />,
-    colors: "border-0 text-purple-800 bg-purple-100 dark:bg-purple-900/20 dark:text-purple-500 dark:hover:bg-purple-900/30"
+    colors:
+      "border-0 text-purple-800 bg-purple-100 dark:bg-purple-900/20 dark:text-purple-500 dark:hover:bg-purple-900/30",
   },
   {
-    name: "Promotions",
+    name: "common.mailCategories.promotions",
     searchValue: "is:promotions",
     icon: <Tag className="h-4 w-4 rotate-90" />,
-    colors: "border-0 text-red-800 bg-red-100 dark:bg-red-900/20 dark:text-red-500 dark:hover:bg-red-900/30"
+    colors:
+      "border-0 text-red-800 bg-red-100 dark:bg-red-900/20 dark:text-red-500 dark:hover:bg-red-900/30",
   },
 ];
 
-function MailCategoryTabs({ 
-  iconsOnly = false, 
+function MailCategoryTabs({
+  iconsOnly = false,
   isLoading = false,
   onCategoryChange,
-  initialCategory
-}: { 
-  iconsOnly?: boolean, 
-  isLoading?: boolean,
-  onCategoryChange?: (category: string) => void,
-  initialCategory?: string
+  initialCategory,
+}: {
+  iconsOnly?: boolean;
+  isLoading?: boolean;
+  onCategoryChange?: (category: string) => void;
+  initialCategory?: string;
 }) {
   const [, setSearchValue] = useSearchValue();
-  
+  const t = useTranslations();
+
   // Initialize with just the initialCategory or "Primary"
   const [activeCategory, setActiveCategory] = useState(initialCategory || "Primary");
-  
+
   // Move localStorage logic to a useEffect
   useEffect(() => {
     // Check localStorage only after initial render
-    const savedCategory = localStorage.getItem('mailActiveCategory');
+    const savedCategory = localStorage.getItem("mailActiveCategory");
     if (savedCategory && !initialCategory) {
       setActiveCategory(savedCategory);
     }
   }, [initialCategory]);
-  
+
   const containerRef = useRef<HTMLDivElement>(null);
   const activeTabElementRef = useRef<HTMLButtonElement>(null);
 
-  const activeTab = useMemo(() => categories.find(cat => cat.name === activeCategory), [activeCategory]);
+  const activeTab = useMemo(
+    () => categories.find((cat) => cat.name === activeCategory),
+    [activeCategory],
+  );
 
   // Save to localStorage when activeCategory changes
   useEffect(() => {
-    localStorage.setItem('mailActiveCategory', activeCategory);
+    localStorage.setItem("mailActiveCategory", activeCategory);
     if (onCategoryChange) {
       onCategoryChange(activeCategory);
     }
@@ -484,7 +495,7 @@ function MailCategoryTabs({
       const clipLeft = Math.max(0, offsetLeft - 2);
       const clipRight = Math.min(container.offsetWidth, offsetLeft + offsetWidth + 2);
       const containerWidth = container.offsetWidth;
-      
+
       if (containerWidth) {
         container.style.clipPath = `inset(0 ${Number(100 - (clipRight / containerWidth) * 100).toFixed(2)}% 0 ${Number((clipLeft / containerWidth) * 100).toFixed(2)}%)`;
       }
@@ -502,7 +513,7 @@ function MailCategoryTabs({
     const timer = setTimeout(() => {
       updateClipPath();
     }, 10);
-    
+
     return () => clearTimeout(timer);
   }, [iconsOnly, updateClipPath]);
 
@@ -512,12 +523,12 @@ function MailCategoryTabs({
       updateClipPath();
     };
 
-    window.addEventListener('resize', handleResize);
-    return () => window.removeEventListener('resize', handleResize);
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
   }, [updateClipPath]);
 
   return (
-    <div className="relative w-fit mx-auto">
+    <div className="relative mx-auto w-fit">
       <ul className="flex justify-center gap-1.5">
         {categories.map((category) => (
           <li key={category.name}>
@@ -530,21 +541,21 @@ function MailCategoryTabs({
                     setActiveCategory(category.name);
                   }}
                   className={cn(
-                    "flex h-7 items-center gap-1.5 px-2 text-xs font-medium rounded-md transition-all duration-200",
-                    activeCategory === category.name 
+                    "flex h-7 items-center gap-1.5 rounded-full px-2 text-xs font-medium transition-all duration-200",
+                    activeCategory === category.name
                       ? category.colors
-                      : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
+                      : "text-muted-foreground hover:text-foreground hover:bg-muted/50",
                   )}
                 >
-                    {category.icon}
-                    <span className={cn("hidden", (!iconsOnly && "md:inline"))}>
-                      {category.name}
-                    </span>
+                  {category.icon}
+                  <span className={cn("hidden", !iconsOnly && "md:inline")}>
+                    {t(category.name as MessageKey)}
+                  </span>
                 </button>
               </TooltipTrigger>
               {iconsOnly && (
                 <TooltipContent>
-                  <span>{category.name}</span>
+                  <span>{t(category.name as MessageKey)}</span>
                 </TooltipContent>
               )}
             </Tooltip>
@@ -552,9 +563,9 @@ function MailCategoryTabs({
         ))}
       </ul>
 
-      <div 
-        aria-hidden 
-        className="absolute inset-0 z-10 overflow-hidden transition-[clip-path] duration-300 ease-in-out shadow-sm " 
+      <div
+        aria-hidden
+        className="absolute inset-0 z-10 overflow-hidden shadow-sm transition-[clip-path] duration-300 ease-in-out"
         ref={containerRef}
       >
         <ul className="flex justify-center gap-1.5">
@@ -566,14 +577,14 @@ function MailCategoryTabs({
                   setActiveCategory(category.name);
                 }}
                 className={cn(
-                  "flex h-7 items-center gap-1.5 px-2 text-xs font-medium rounded-md",
-                  category.colors
+                  "flex h-7 items-center gap-1.5 rounded-full px-2 text-xs font-medium",
+                  category.colors,
                 )}
                 tabIndex={-1}
               >
                 {category.icon}
-                <span className={cn("hidden", (!iconsOnly && "md:inline"))}>
-                  {category.name}
+                <span className={cn("hidden", !iconsOnly && "md:inline")}>
+                  {t(category.name as MessageKey)}
                 </span>
               </button>
             </li>
diff --git a/apps/mail/components/mail/reply-composer.tsx b/apps/mail/components/mail/reply-composer.tsx
index bd8f1c5e23..127e3fe975 100644
--- a/apps/mail/components/mail/reply-composer.tsx
+++ b/apps/mail/components/mail/reply-composer.tsx
@@ -1,15 +1,16 @@
+import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
+import { Dispatch, SetStateAction, useRef, useState, useEffect } from "react";
+import { UploadedFileIcon } from "@/components/create/uploaded-file-icon";
 import { ArrowUp, Paperclip, Reply, X, Plus } from "lucide-react";
 import { cleanEmailAddress, truncateFileName } from "@/lib/utils";
+import { Separator } from "@/components/ui/separator";
 import Editor from "@/components/create/editor";
 import { Button } from "@/components/ui/button";
+import { useTranslations } from "next-intl";
 import { sendEmail } from "@/actions/send";
-import { Dispatch, SetStateAction, useRef, useState, useEffect } from "react";
 import { ParsedMessage } from "@/types";
 import { cn } from "@/lib/utils";
 import { toast } from "sonner";
-import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
-import { Separator } from "@/components/ui/separator";
-import { UploadedFileIcon } from "@/components/create/uploaded-file-icon";
 
 interface ReplyComposeProps {
   emailData: ParsedMessage[];
@@ -17,11 +18,7 @@ interface ReplyComposeProps {
   setIsOpen?: Dispatch<SetStateAction<boolean>>;
 }
 
-export default function ReplyCompose({ 
-  emailData, 
-  isOpen, 
-  setIsOpen 
-}: ReplyComposeProps) {
+export default function ReplyCompose({ emailData, isOpen, setIsOpen }: ReplyComposeProps) {
   const editorRef = useRef<HTMLTextAreaElement>(null);
   const [attachments, setAttachments] = useState<File[]>([]);
   const [isUploading, setIsUploading] = useState(false);
@@ -29,6 +26,7 @@ export default function ReplyCompose({
   const [isComposerOpen, setIsComposerOpen] = useState(false);
   const [isDragging, setIsDragging] = useState(false);
   const [isEditorFocused, setIsEditorFocused] = useState(false);
+  const t = useTranslations();
 
   // Use external state if provided, otherwise use internal state
   const composerIsOpen = isOpen !== undefined ? isOpen : isComposerOpen;
@@ -43,7 +41,7 @@ export default function ReplyCompose({
   // Handle keyboard shortcuts for sending email
   const handleKeyDown = (e: React.KeyboardEvent) => {
     // Check for Cmd/Ctrl + Enter
-    if ((e.metaKey || e.ctrlKey) && e.key === 'Enter') {
+    if ((e.metaKey || e.ctrlKey) && e.key === "Enter") {
       e.preventDefault();
       if (isFormValid) {
         handleSendEmail(e as unknown as React.MouseEvent<HTMLButtonElement>);
@@ -68,7 +66,7 @@ export default function ReplyCompose({
   };
 
   const handleDragOver = (e: React.DragEvent) => {
-    if (!e.target || !(e.target as HTMLElement).closest('.ProseMirror')) {
+    if (!e.target || !(e.target as HTMLElement).closest(".ProseMirror")) {
       e.preventDefault();
       e.stopPropagation();
       setIsDragging(true);
@@ -76,7 +74,7 @@ export default function ReplyCompose({
   };
 
   const handleDragLeave = (e: React.DragEvent) => {
-    if (!e.target || !(e.target as HTMLElement).closest('.ProseMirror')) {
+    if (!e.target || !(e.target as HTMLElement).closest(".ProseMirror")) {
       e.preventDefault();
       e.stopPropagation();
       setIsDragging(false);
@@ -84,11 +82,11 @@ export default function ReplyCompose({
   };
 
   const handleDrop = (e: React.DragEvent) => {
-    if (!e.target || !(e.target as HTMLElement).closest('.ProseMirror')) {
+    if (!e.target || !(e.target as HTMLElement).closest(".ProseMirror")) {
       e.preventDefault();
       e.stopPropagation();
       setIsDragging(false);
-      
+
       if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
         setAttachments([...attachments, ...Array.from(e.dataTransfer.files)]);
         // Open the composer if it's not already open
@@ -169,10 +167,10 @@ export default function ReplyCompose({
 
       setMessageContent("");
       setComposerIsOpen(false);
-      toast.success("Email sent successfully!");
+      toast.success(t("pages.createEmail.emailSentSuccessfully"));
     } catch (error) {
       console.error("Error sending email:", error);
-      toast.error("Failed to send email. Please try again.");
+      toast.error(t("pages.createEmail.failedToSendEmail"));
     }
   };
 
@@ -189,26 +187,29 @@ export default function ReplyCompose({
       // Give the editor time to render before focusing
       const timer = setTimeout(() => {
         // Focus the editor - Novel editor typically has a ProseMirror element
-        const editorElement = document.querySelector('.ProseMirror');
+        const editorElement = document.querySelector(".ProseMirror");
         if (editorElement instanceof HTMLElement) {
           editorElement.focus();
         }
       }, 100);
-      
+
       return () => clearTimeout(timer);
     }
   }, [composerIsOpen]);
 
   // Check if the message is empty
-  const isMessageEmpty = !messageContent || messageContent === JSON.stringify({
-    type: "doc",
-    content: [
-      {
-        type: "paragraph",
-        content: [],
-      },
-    ],
-  });
+  const isMessageEmpty =
+    !messageContent ||
+    messageContent ===
+      JSON.stringify({
+        type: "doc",
+        content: [
+          {
+            type: "paragraph",
+            content: [],
+          },
+        ],
+      });
 
   // Check if form is valid for submission
   const isFormValid = !isMessageEmpty || attachments.length > 0;
@@ -222,7 +223,10 @@ export default function ReplyCompose({
           variant="outline"
         >
           <Reply className="h-4 w-4" />
-          <span>Reply to {emailData[emailData.length - 1]?.sender?.name || "this email"}</span>
+          <span>
+            {t("common.replyCompose.replyTo")}{" "}
+            {emailData[emailData.length - 1]?.sender?.name || t("common.replyCompose.thisEmail")}
+          </span>
         </Button>
       </div>
     );
@@ -232,8 +236,8 @@ export default function ReplyCompose({
     <div className="bg-offsetLight dark:bg-offsetDark w-full p-2">
       <form
         className={cn(
-          "border-border flex h-[300px] flex-col space-y-2.5 rounded-[10px] border px-2 py-2 transition-shadow duration-300 ease-in-out ring-offset-background",
-          isEditorFocused ? "ring-2 ring-[#3D3D3D] ring-offset-1" : ""
+          "border-border ring-offset-background flex h-[300px] flex-col space-y-2.5 rounded-[10px] border px-2 py-2 transition-shadow duration-300 ease-in-out",
+          isEditorFocused ? "ring-2 ring-[#3D3D3D] ring-offset-1" : "",
         )}
         onDragOver={handleDragOver}
         onDragLeave={handleDragLeave}
@@ -245,14 +249,14 @@ export default function ReplyCompose({
         onKeyDown={handleKeyDown}
       >
         {isDragging && (
-          <div className="absolute inset-0 bg-background/80 backdrop-blur-sm z-50 flex items-center justify-center border-2 border-dashed border-primary/30 rounded-2xl m-4">
-            <div className="flex flex-col items-center gap-2 text-muted-foreground">
-              <Paperclip className="h-12 w-12 text-muted-foreground" />
-              <p className="text-lg font-medium">Drop files to attach</p>
+          <div className="bg-background/80 border-primary/30 absolute inset-0 z-50 m-4 flex items-center justify-center rounded-2xl border-2 border-dashed backdrop-blur-sm">
+            <div className="text-muted-foreground flex flex-col items-center gap-2">
+              <Paperclip className="text-muted-foreground h-12 w-12" />
+              <p className="text-lg font-medium">{t("common.replyCompose.dropFiles")}</p>
             </div>
           </div>
         )}
-        
+
         <div className="text-muted-foreground flex items-center justify-between text-sm">
           <div className="flex items-center gap-2">
             <Reply className="h-4 w-4" />
@@ -275,7 +279,7 @@ export default function ReplyCompose({
         </div>
 
         <div className="w-full flex-grow overflow-hidden p-1">
-          <div 
+          <div
             className="h-full w-full overflow-y-auto"
             onDragOver={(e) => e.stopPropagation()}
             onDragLeave={(e) => e.stopPropagation()}
@@ -285,7 +289,7 @@ export default function ReplyCompose({
               onChange={(content) => {
                 setMessageContent(content);
               }}
-              className=" md:max-w-[2050px] sm:max-w-[600px]"
+              className="sm:max-w-[600px] md:max-w-[2050px]"
               initialValue={{
                 type: "doc",
                 content: [
@@ -319,26 +323,30 @@ export default function ReplyCompose({
             >
               <Plus className="absolute left-[9px] h-6 w-6" />
               <span className="whitespace-nowrap pl-7 opacity-0 transition-opacity duration-200 group-hover:opacity-100">
-                Attachments
+                {t("common.replyCompose.attachments")}
               </span>
             </Button>
-            
+
             {attachments.length > 0 && (
               <Popover>
                 <PopoverTrigger asChild>
                   <Button variant="outline" className="flex items-center gap-2">
                     <Paperclip className="h-4 w-4" />
                     <span>
-                      {attachments.length} attachment{attachments.length !== 1 ? "s" : ""}
+                      {attachments.length}{" "}
+                      {t("common.replyCompose.attachmentCount", { count: attachments.length })}
                     </span>
                   </Button>
                 </PopoverTrigger>
                 <PopoverContent className="w-80 touch-auto" align="start">
                   <div className="space-y-2">
                     <div className="px-1">
-                      <h4 className="font-medium leading-none">Attachments</h4>
+                      <h4 className="font-medium leading-none">
+                        {t("common.replyCompose.attachments")}
+                      </h4>
                       <p className="text-muted-foreground text-sm">
-                        {attachments.length} file{attachments.length !== 1 ? "s" : ""} attached
+                        {attachments.length}{" "}
+                        {t("common.replyCompose.fileCount", { count: attachments.length })}
                       </p>
                     </div>
                     <Separator />
@@ -381,10 +389,10 @@ export default function ReplyCompose({
           </div>
           <div className="mr-2 flex items-center gap-2">
             <Button variant="ghost" size="sm" className="h-8">
-              Save draft
+              {t("common.replyCompose.saveDraft")}
             </Button>
-            <Button 
-              size="sm" 
+            <Button
+              size="sm"
               className="group relative h-8 w-9 overflow-hidden transition-all duration-200 hover:w-24"
               onClick={(e) => {
                 e.preventDefault();
@@ -394,7 +402,7 @@ export default function ReplyCompose({
               type="button"
             >
               <span className="whitespace-nowrap pr-7 opacity-0 transition-opacity duration-200 group-hover:opacity-100">
-                Send
+                {t("common.replyCompose.send")}
               </span>
               <ArrowUp className="absolute right-2.5 h-4 w-4" />
             </Button>
diff --git a/apps/mail/components/mail/search-bar.tsx b/apps/mail/components/mail/search-bar.tsx
index c01176cda8..f6e22b1608 100644
--- a/apps/mail/components/mail/search-bar.tsx
+++ b/apps/mail/components/mail/search-bar.tsx
@@ -26,8 +26,10 @@ import {
   filterSuggestionsFunction,
   filterSuggestions
 } from "@/lib/filter";
-
+import { useTranslations } from "next-intl";
 function DateFilter({ date, setDate }: { date: DateRange; setDate: (date: DateRange) => void }) {
+  const t = useTranslations("common.searchBar");
+
   return (
     <div className="grid gap-2">
       <Popover>
@@ -51,7 +53,7 @@ function DateFilter({ date, setDate }: { date: DateRange; setDate: (date: DateRa
                 format(date.from, "LLL dd, y")
               )
             ) : (
-              <span>Pick a date or a range</span>
+              <span>{t('pickDateRange')}</span>
             )}
           </Button>
         </PopoverTrigger>
@@ -97,6 +99,8 @@ export function SearchBar() {
     category: "",
   });
   
+  const t = useTranslations();
+  
   const [suggestionsState, setSuggestionsState] = useState({
     show: false,
     filtered: [] as FilterSuggestion[],
@@ -543,7 +547,7 @@ export function SearchBar() {
       <form className="relative flex items-center" onSubmit={form.handleSubmit(submitSearch)}>
         <Search className="absolute left-2.5 h-4 w-4 text-muted-foreground" aria-hidden="true" />
         <Input
-          placeholder="Search"
+          placeholder={t("common.searchBar.search")}
           autoFocus
           ref={inputRef}
           className="h-8 w-full rounded-md border-none bg-muted/50 pl-9 pr-14 text-muted-foreground shadow-none ring-1 ring-muted transition-colors placeholder:text-muted-foreground/70 hover:bg-muted focus-visible:bg-background focus-visible:ring-2 focus-visible:ring-ring"
@@ -561,7 +565,7 @@ export function SearchBar() {
               className="rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
             >
               <X className="h-4 w-4" />
-              <span className="sr-only">Clear search</span>
+              <span className="sr-only">{t("common.searchBar.clearSearch")}</span>
             </button>
           )}
           <Popover open={popoverOpen} onOpenChange={setPopoverOpen}>
@@ -576,7 +580,7 @@ export function SearchBar() {
                 type="button"
               >
                 <SlidersHorizontal className="h-4 w-4" />
-                <span className="sr-only">Advanced search</span>
+                <span className="sr-only">{t("common.searchBar.advancedSearch")}</span>
               </Button>
             </PopoverTrigger>
             <PopoverContent
@@ -588,7 +592,7 @@ export function SearchBar() {
             >
               <div className="space-y-5">
                 <div>
-                  <h2 className="mb-3 text-xs font-semibold">Quick Filters</h2>
+                  <h2 className="mb-3 text-xs font-semibold">{t("common.searchBar.quickFilters")}</h2>
                   <div className="flex flex-wrap gap-2">
                     <Button
                       variant="outline"
@@ -596,7 +600,7 @@ export function SearchBar() {
                       className="h-7 rounded-md bg-muted/50 text-xs hover:bg-muted"
                       onClick={() => form.setValue("q", "is:unread")}
                     >
-                      Unread
+                      {t("common.searchBar.unread")}
                     </Button>
                     <Button
                       variant="outline"
@@ -604,7 +608,7 @@ export function SearchBar() {
                       className="h-7 rounded-md bg-muted/50 text-xs hover:bg-muted"
                       onClick={() => form.setValue("q", "has:attachment")}
                     >
-                      Has Attachment
+                      {t("common.searchBar.hasAttachment")}
                     </Button>
                     <Button
                       variant="outline"
@@ -612,7 +616,7 @@ export function SearchBar() {
                       className="h-7 rounded-md bg-muted/50 text-xs hover:bg-muted"
                       onClick={() => form.setValue("q", "is:starred")}
                     >
-                      Starred
+                      {t("common.searchBar.starred")}
                     </Button>
                   </div>
                 </div>
@@ -621,7 +625,7 @@ export function SearchBar() {
 
                 <div className="grid gap-5">
                   <div className="space-y-2">
-                    <label className="text-xs font-semibold">Search in</label>
+                    <label className="text-xs font-semibold">{t("common.searchBar.searchIn")}</label>
                     <Select
                       onValueChange={(value) => form.setValue("folder", value)}
                       value={form.watch("folder")}
@@ -640,9 +644,9 @@ export function SearchBar() {
                   </div>
 
                   <div className="space-y-2">
-                    <label className="text-xs font-semibold">Subject</label>
+                    <label className="text-xs font-semibold">{t("common.searchBar.subject")}</label>
                     <Input
-                      placeholder="Email subject"
+                      placeholder={t("common.searchBar.subject")}
                       {...form.register("subject")}
                       className="h-8 rounded-md bg-muted/50"
                     />
@@ -650,18 +654,18 @@ export function SearchBar() {
 
                   <div className="grid gap-4 sm:grid-cols-2">
                     <div className="space-y-2">
-                      <label className="text-xs font-semibold">From</label>
+                      <label className="text-xs font-semibold">{t("common.mailDisplay.from")}</label>
                       <Input
-                        placeholder="Sender"
+                        placeholder={t("common.searchBar.sender")}
                         {...form.register("from")}
                         className="h-8 rounded-md bg-muted/50"
                       />
                     </div>
 
                     <div className="space-y-2">
-                      <label className="text-xs font-semibold">To</label>
+                      <label className="text-xs font-semibold">{t("common.mailDisplay.to")}</label>
                       <Input
-                        placeholder="Recipient"
+                        placeholder={t("common.searchBar.recipient")}
                         {...form.register("to")}
                         className="h-8 rounded-md bg-muted/50"
                       />
@@ -669,7 +673,7 @@ export function SearchBar() {
                   </div>
 
                   <div className="space-y-2">
-                    <label className="text-xs font-semibold">Date Range</label>
+                    <label className="text-xs font-semibold">{t("common.searchBar.dateRange")}</label>
                     <DateFilter
                       date={value.dateRange}
                       setDate={(range) => form.setValue("dateRange", range)}
@@ -680,7 +684,7 @@ export function SearchBar() {
                 <Separator className="bg-border/50" />
 
                 <div>
-                  <h2 className="mb-3 text-xs font-semibold">Category</h2>
+                  <h2 className="mb-3 text-xs font-semibold">{t("common.searchBar.category")}</h2>
                   <div className="flex flex-wrap gap-2">
                     <Toggle
                       variant="outline"
@@ -691,7 +695,7 @@ export function SearchBar() {
                         form.setValue("category", pressed ? "primary" : "")
                       }
                     >
-                      Primary
+                      {t("common.mailCategories.primary")}
                     </Toggle>
                     <Toggle
                       variant="outline"
@@ -702,7 +706,7 @@ export function SearchBar() {
                         form.setValue("category", pressed ? "updates" : "")
                       }
                     >
-                      Updates
+                      {t("common.mailCategories.updates")}
                     </Toggle>
                     <Toggle
                       variant="outline"
@@ -713,7 +717,7 @@ export function SearchBar() {
                         form.setValue("category", pressed ? "promotions" : "")
                       }
                     >
-                      Promotions
+                      {t("common.mailCategories.promotions")}
                     </Toggle>
                     <Toggle
                       variant="outline"
@@ -724,7 +728,7 @@ export function SearchBar() {
                         form.setValue("category", pressed ? "social" : "")
                       }
                     >
-                      Social
+                      {t("common.mailCategories.social")}
                     </Toggle>
                   </div>
                 </div>
@@ -736,7 +740,7 @@ export function SearchBar() {
                     size="sm"
                     className="h-8 rounded-md text-xs text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
                   >
-                    Reset
+                    {t("common.searchBar.reset")}
                   </Button>
                   <Button
                     size="sm"
@@ -744,7 +748,7 @@ export function SearchBar() {
                     type="submit"
                     onClick={() => setPopoverOpen(false)}
                   >
-                    Apply Filters
+                    {t("common.searchBar.applyFilters")}
                   </Button>
                 </div>
               </div>
diff --git a/apps/mail/components/mail/thread-display.tsx b/apps/mail/components/mail/thread-display.tsx
index cf827c7c03..13cfeb1c31 100644
--- a/apps/mail/components/mail/thread-display.tsx
+++ b/apps/mail/components/mail/thread-display.tsx
@@ -18,15 +18,16 @@ import { useState, useEffect, useCallback, useRef } from "react";
 import { ArchiveIcon } from "../icons/animated/archive";
 import { ExpandIcon } from "../icons/animated/expand";
 import { MailDisplaySkeleton } from "./mail-skeleton";
+import { ReplyIcon } from "../icons/animated/reply";
 import { Button } from "@/components/ui/button";
 import { useThread } from "@/hooks/use-threads";
 import { XIcon } from "../icons/animated/x";
 import ReplyCompose from "./reply-composer";
+import { useTranslations } from "next-intl";
 import MailDisplay from "./mail-display";
 import { useMail } from "./use-mail";
 import { cn } from "@/lib/utils";
 import React from "react";
-import { ReplyIcon } from "../icons/animated/reply";
 
 interface ThreadDisplayProps {
   mail: any;
@@ -85,7 +86,7 @@ export function ThreadDemo({ mail: emailData, onClose, isMobile }: ThreadDisplay
             <Tooltip>
               <TooltipTrigger asChild>
                 <Button variant="ghost" className="md:h-fit md:px-2" disabled={!emailData}>
-                  <ArchiveIcon className="h-4 w-4 relative top-0.5" />
+                  <ArchiveIcon className="relative top-0.5 h-4 w-4" />
                   <span className="sr-only">Archive</span>
                 </Button>
               </TooltipTrigger>
@@ -195,6 +196,7 @@ export function ThreadDisplay({ mail, onClose, isMobile }: ThreadDisplayProps) {
   const [isMuted, setIsMuted] = useState(false);
   const [isReplyOpen, setIsReplyOpen] = useState(false);
   const [isFullscreen, setIsFullscreen] = useState(false);
+  const t = useTranslations();
 
   const moreVerticalIconRef = useRef<any>(null);
 
@@ -237,52 +239,60 @@ export function ThreadDisplay({ mail, onClose, isMobile }: ThreadDisplayProps) {
         >
           <div className="flex flex-shrink-0 items-center border-b px-1 pb-1 md:px-3 md:pb-2 md:pt-[10px]">
             <div className="flex flex-1 items-center">
-              <ThreadActionButton icon={XIcon} label="Close" onClick={handleClose} />
+              <ThreadActionButton
+                icon={XIcon}
+                label={t("common.actions.close")}
+                onClick={handleClose}
+              />
             </div>
             <div className="flex items-center gap-1 sm:gap-2 md:gap-6">
               <ThreadActionButton
                 icon={isFullscreen ? ExpandIcon : ExpandIcon}
-                label={isFullscreen ? "Exit fullscreen" : "Enter fullscreen"}
+                label={
+                  isFullscreen
+                    ? t("common.threadDisplay.exitFullscreen")
+                    : t("common.threadDisplay.enterFullscreen")
+                }
                 onClick={() => setIsFullscreen(!isFullscreen)}
               />
-              
+
               <ThreadActionButton
                 icon={ArchiveIcon}
-                label="Archive"
+                label={t("common.threadDisplay.archive")}
                 disabled={true}
                 className="relative top-0.5"
               />
-              
+
               <ThreadActionButton
                 icon={ReplyIcon}
-                label="Reply"
+                label={t("common.threadDisplay.reply")}
                 disabled={true}
               />
-              
+
               <DropdownMenu>
                 <DropdownMenuTrigger asChild>
-                  <Button 
-                    variant="ghost" 
-                    className="h-8 w-8 p-0 md:h-fit md:w-auto md:px-2" 
+                  <Button
+                    variant="ghost"
+                    className="h-8 w-8 p-0 md:h-fit md:w-auto md:px-2"
                     disabled={true}
                   >
                     <MoreVerticalIcon className="h-4 w-4" />
-                    <span className="sr-only">More options</span>
+                    <span className="sr-only">{t("common.threadDisplay.moreOptions")}</span>
                   </Button>
                 </DropdownMenuTrigger>
                 <DropdownMenuContent align="end">
                   <DropdownMenuItem>
-                    <ArchiveX className="mr-2 h-4 w-4" /> Move to spam
+                    <ArchiveX className="mr-2 h-4 w-4" /> {t("common.threadDisplay.moveToSpam")}
                   </DropdownMenuItem>
                   <DropdownMenuItem>
-                    <ReplyAll className="mr-2 h-4 w-4" /> Reply all
+                    <ReplyAll className="mr-2 h-4 w-4" /> {t("common.threadDisplay.replyAll")}
                   </DropdownMenuItem>
                   <DropdownMenuItem>
-                    <Forward className="mr-2 h-4 w-4" /> Forward
+                    <Forward className="mr-2 h-4 w-4" /> {t("common.threadDisplay.forward")}
                   </DropdownMenuItem>
-                  <DropdownMenuItem>Mark as unread</DropdownMenuItem>
-                  <DropdownMenuItem>Add label</DropdownMenuItem>
-                  <DropdownMenuItem>Mute thread</DropdownMenuItem>
+                  <DropdownMenuItem>{t("common.threadDisplay.markAsUnread")}</DropdownMenuItem>
+                  <DropdownMenuItem>{t("common.threadDisplay.addLabel")}</DropdownMenuItem>
+                  <DropdownMenuItem>{t("common.threadDisplay.muteThread")}</DropdownMenuItem>
                 </DropdownMenuContent>
               </DropdownMenu>
             </div>
@@ -317,7 +327,7 @@ export function ThreadDisplay({ mail, onClose, isMobile }: ThreadDisplayProps) {
           <div className="flex flex-1 items-center">
             <ThreadActionButton
               icon={XIcon}
-              label="Close"
+              label={t("common.actions.close")}
               disabled={!emailData}
               onClick={handleClose}
             />
@@ -325,19 +335,23 @@ export function ThreadDisplay({ mail, onClose, isMobile }: ThreadDisplayProps) {
           <div className="flex items-center md:gap-6">
             <ThreadActionButton
               icon={isFullscreen ? ExpandIcon : ExpandIcon}
-              label={isFullscreen ? "Exit fullscreen" : "Enter fullscreen"}
+              label={
+                isFullscreen
+                  ? t("common.threadDisplay.exitFullscreen")
+                  : t("common.threadDisplay.enterFullscreen")
+              }
               disabled={!emailData}
               onClick={() => setIsFullscreen(!isFullscreen)}
             />
             <ThreadActionButton
               icon={ArchiveIcon}
-              label="Archive"
+              label={t("common.threadDisplay.archive")}
               disabled={!emailData}
               className="relative top-0.5"
             />
             <ThreadActionButton
               icon={ReplyIcon}
-              label="Reply"
+              label={t("common.threadDisplay.reply")}
               disabled={!emailData}
               onClick={() => setIsReplyOpen(true)}
             />
@@ -351,22 +365,22 @@ export function ThreadDisplay({ mail, onClose, isMobile }: ThreadDisplayProps) {
                   onMouseLeave={() => moreVerticalIconRef.current?.stopAnimation?.()}
                 >
                   <MoreVerticalIcon ref={moreVerticalIconRef} className="h-4 w-4" />
-                  <span className="sr-only">More options</span>
+                  <span className="sr-only">{t("common.threadDisplay.moreOptions")}</span>
                 </Button>
               </DropdownMenuTrigger>
               <DropdownMenuContent align="end">
                 <DropdownMenuItem>
-                  <ArchiveX className="mr-2 h-4 w-4" /> Move to spam
+                  <ArchiveX className="mr-2 h-4 w-4" /> {t("common.threadDisplay.moveToSpam")}
                 </DropdownMenuItem>
                 <DropdownMenuItem>
-                  <ReplyAll className="mr-2 h-4 w-4" /> Reply all
+                  <ReplyAll className="mr-2 h-4 w-4" /> {t("common.threadDisplay.replyAll")}
                 </DropdownMenuItem>
                 <DropdownMenuItem>
-                  <Forward className="mr-2 h-4 w-4" /> Forward
+                  <Forward className="mr-2 h-4 w-4" /> {t("common.threadDisplay.forward")}
                 </DropdownMenuItem>
-                <DropdownMenuItem>Mark as unread</DropdownMenuItem>
-                <DropdownMenuItem>Add label</DropdownMenuItem>
-                <DropdownMenuItem>Mute thread</DropdownMenuItem>
+                <DropdownMenuItem>{t("common.threadDisplay.markAsUnread")}</DropdownMenuItem>
+                <DropdownMenuItem>{t("common.threadDisplay.addLabel")}</DropdownMenuItem>
+                <DropdownMenuItem>{t("common.threadDisplay.muteThread")}</DropdownMenuItem>
               </DropdownMenuContent>
             </DropdownMenu>
           </div>
diff --git a/apps/mail/components/theme/theme-switcher.tsx b/apps/mail/components/theme/theme-switcher.tsx
index f3faf3dd59..cee742b359 100644
--- a/apps/mail/components/theme/theme-switcher.tsx
+++ b/apps/mail/components/theme/theme-switcher.tsx
@@ -9,10 +9,11 @@ import {
 } from "@/components/ui/select";
 import { useEffect, useState } from "react";
 
+import { MessageKey } from "@/config/navigation";
 import { Laptop, Moon, Sun } from "lucide-react";
+import { useTranslations } from "next-intl";
 import { useTheme } from "next-themes";
 import { cn } from "@/lib/utils";
-
 interface ModeToggleProps {
   className?: string;
 }
@@ -20,6 +21,8 @@ interface ModeToggleProps {
 export function ModeToggle({ className }: ModeToggleProps) {
   const [mounted, setMounted] = useState(false);
 
+  const t = useTranslations();
+
   // Fixes SSR hydration
   useEffect(() => {
     setMounted(true);
@@ -55,11 +58,11 @@ export function ModeToggle({ className }: ModeToggleProps) {
     <Select value={theme} onValueChange={handleThemeChange}>
       <SelectTrigger className={cn(className)}>
         <SelectValue placeholder="Select theme">
-          <div className="flex items-center gap-2">
+          <div className="flex items-center gap-2 capitalize">
             {theme === "dark" && <Moon className="h-4 w-4" />}
             {theme === "light" && <Sun className="h-4 w-4" />}
             {theme === "system" && <Laptop className="h-4 w-4" />}
-            {theme?.charAt(0)?.toUpperCase() + theme?.slice(1)}
+            {t(`common.themes.${theme}` as MessageKey)}
           </div>
         </SelectValue>
       </SelectTrigger>
@@ -67,19 +70,19 @@ export function ModeToggle({ className }: ModeToggleProps) {
         <SelectItem value="dark">
           <div className="flex items-center gap-2">
             <Moon className="h-4 w-4" />
-            Dark
+            {t("common.themes.dark")}
           </div>
         </SelectItem>
         <SelectItem value="system">
           <div className="flex items-center gap-2">
             <Laptop className="h-4 w-4" />
-            System
+            {t("common.themes.system")}
           </div>
         </SelectItem>
         <SelectItem value="light">
           <div className="flex items-center gap-2">
             <Sun className="h-4 w-4" />
-            Light
+            {t("common.themes.light")}
           </div>
         </SelectItem>
       </SelectContent>
diff --git a/apps/mail/components/ui/app-sidebar.tsx b/apps/mail/components/ui/app-sidebar.tsx
index 5bf341a5a5..3574dbb5d9 100644
--- a/apps/mail/components/ui/app-sidebar.tsx
+++ b/apps/mail/components/ui/app-sidebar.tsx
@@ -12,6 +12,7 @@ import { usePathname } from "next/navigation";
 import { useStats } from "@/hooks/use-stats";
 import { useRouter } from "next/navigation";
 import { useAISidebar } from "./ai-sidebar";
+import { useTranslations } from "next-intl";
 import { FOLDERS } from "@/lib/utils";
 import { NavMain } from "./nav-main";
 import { NavUser } from "./nav-user";
@@ -129,7 +130,7 @@ function ComposeButton() {
   const { state } = useSidebar();
   const isMobile = useIsMobile();
   const router = useRouter();
-
+  const t = useTranslations();
   return (
     <Button
       onClick={() => router.push("/mail/create")}
@@ -141,7 +142,7 @@ function ComposeButton() {
         <SquarePenIcon ref={iconRef} className="size-4" />
       ) : (
         <>
-          <span className="text-center text-sm">Create Email</span>
+          <span className="text-center text-sm">{t("common.actions.create")}</span>
         </>
       )}
     </Button>
diff --git a/apps/mail/components/ui/nav-main.tsx b/apps/mail/components/ui/nav-main.tsx
index bd51766ef1..f712828b80 100644
--- a/apps/mail/components/ui/nav-main.tsx
+++ b/apps/mail/components/ui/nav-main.tsx
@@ -7,6 +7,8 @@ import Link from "next/link";
 
 import { SidebarGroup, SidebarMenu, SidebarMenuItem, SidebarMenuButton } from "./sidebar";
 import { Collapsible, CollapsibleTrigger } from "@/components/ui/collapsible";
+import { MessageKeys, useTranslations } from "next-intl";
+import { MessageKey } from "@/config/navigation";
 import { Badge } from "@/components/ui/badge";
 import { useStats } from "@/hooks/use-stats";
 import { BASE_URL } from "@/lib/constants";
@@ -174,6 +176,8 @@ function NavItem(item: NavItemProps & { href: string }) {
   const iconRef = useRef<IconRefType>(null);
   const { data: stats } = useStats();
 
+  const t = useTranslations();
+
   if (item.disabled) {
     return (
       <SidebarMenuButton
@@ -181,7 +185,7 @@ function NavItem(item: NavItemProps & { href: string }) {
         className="flex cursor-not-allowed items-center opacity-50"
       >
         {item.icon && <item.icon ref={iconRef} className="relative mr-2.5 h-3 w-3.5" />}
-        <p className="mt-0.5 text-[13px]">{item.title}</p>
+        <p className="mt-0.5 text-[13px]">{t(item.title as MessageKey)}</p>
       </SidebarMenuButton>
     );
   }
@@ -203,12 +207,14 @@ function NavItem(item: NavItemProps & { href: string }) {
       )}
     >
       {item.icon && <item.icon ref={iconRef} className="mr-2" />}
-      <p className="mt-0.5 text-[13px]">{item.title}</p>
+      <p className="mt-0.5 text-[13px]">{t(item.title as MessageKey)}</p>
       {stats && stats.find((stat) => stat.label?.toLowerCase() === item.title?.toLowerCase()) && (
         <Badge className="ml-auto rounded-md" variant="outline">
           {stats
+
             .find((stat) => stat.label?.toLowerCase() === item.title?.toLowerCase())
-            ?.count?.toLocaleString()}
+
+            ?.count?.toLocaleString() || "0"}
         </Badge>
       )}
     </SidebarMenuButton>
diff --git a/apps/mail/components/ui/nav-user.tsx b/apps/mail/components/ui/nav-user.tsx
index c359c32fa6..a87ee2f7cb 100644
--- a/apps/mail/components/ui/nav-user.tsx
+++ b/apps/mail/components/ui/nav-user.tsx
@@ -28,6 +28,7 @@ import { AddConnectionDialog } from "../connection/add";
 import { putConnection } from "@/actions/connections";
 import { useEffect, useMemo, useState } from "react";
 import { SunIcon } from "../icons/animated/sun";
+import { useTranslations } from "next-intl";
 import { useTheme } from "next-themes";
 import { IConnection } from "@/types";
 import { Button } from "./button";
@@ -42,6 +43,7 @@ export function NavUser() {
   const pathname = usePathname();
   const [isRendered, setIsRendered] = useState(false);
   const { theme, resolvedTheme, setTheme } = useTheme();
+  const t = useTranslations();
 
   const activeAccount = useMemo(() => {
     if (!session) return null;
@@ -142,16 +144,16 @@ export function NavUser() {
         <DropdownMenuItem onClick={() => router.push("/support")}>
           <div className="flex cursor-pointer items-center gap-2 text-[13px]">
             <HelpCircle size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
-            <p className="text-[13px] opacity-60">Customer Support</p>
+            <p className="text-[13px] opacity-60">{t("common.navUser.customerSupport")}</p>
           </div>
         </DropdownMenuItem>
-        <DropdownMenuItem
-          onClick={() => window.open("https://github.com/Mail-0/Zero", "_blank")}
-        >
-          <div className="flex cursor-pointer items-center gap-2 text-[13px]">
-            <Book size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
-            <p className="text-[13px] opacity-60">Documentation</p>
-          </div>
+        <DropdownMenuItem asChild>
+          <a href="https://github.com/Mail-0/Zero" target="_blank">
+            <div className="flex cursor-pointer items-center gap-2 text-[13px]">
+              <Book size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
+              <p className="text-[13px] opacity-60">{t("common.navUser.documentation")}</p>
+            </div>
+          </a>
         </DropdownMenuItem>
         <DropdownMenuItem onClick={handleThemeToggle}>
           <div className="flex cursor-pointer items-center gap-2 text-[13px]">
@@ -160,14 +162,16 @@ export function NavUser() {
             ) : (
               <SunIcon className="opacity-60" />
             )}
-            <p className="text-[13px] opacity-60">App Theme</p>
+            <p className="text-[13px] opacity-60">{t("common.navUser.appTheme")}</p>
           </div>
         </DropdownMenuItem>
         <DropdownMenuSeparator />
         <div className="space-y-1">
           {session ? (
             <>
-              <p className="text-muted-foreground px-1 py-0.5 text-[11px]">Accounts</p>
+              <p className="text-muted-foreground px-1 py-0.5 text-[11px]">
+                {t("common.navUser.accounts")}
+              </p>
 
               {connections?.map((connection) => (
                 <DropdownMenuItem
@@ -206,16 +210,19 @@ export function NavUser() {
               ))}
               <AddConnectionDialog />
               <DropdownMenuSeparator />
-              <DropdownMenuItem className="cursor-pointer text-muted-foreground" onClick={handleLogout}>
+              <DropdownMenuItem
+                className="text-muted-foreground cursor-pointer"
+                onClick={handleLogout}
+              >
                 <LogOut size={16} strokeWidth={2} className="mr-1" aria-hidden="true" />
-                <p className="text-[13px]">Log out</p>
+                <p className="text-[13px]">{t("common.actions.logout")}</p>
               </DropdownMenuItem>
             </>
           ) : (
             <>
               <DropdownMenuItem className="cursor-pointer" onClick={() => router.push("/login")}>
                 <LogIn size={16} strokeWidth={2} className="opacity-60" aria-hidden="true" />
-                <p className="text-[13px] opacity-60">Sign in</p>
+                <p className="text-[13px] opacity-60">{t("common.navUser.signIn")}</p>
               </DropdownMenuItem>
             </>
           )}
diff --git a/apps/mail/config/navigation.ts b/apps/mail/config/navigation.ts
index 48b46d8540..f517ab7d1f 100644
--- a/apps/mail/config/navigation.ts
+++ b/apps/mail/config/navigation.ts
@@ -6,10 +6,12 @@ import { ShieldCheckIcon } from "@/components/icons/animated/shield";
 import { KeyboardIcon } from "@/components/icons/animated/keyboard";
 import { SparklesIcon } from "@/components/icons/animated/sparkles";
 import { ArchiveIcon } from "@/components/icons/animated/archive";
+import { DeleteIcon } from "@/components/icons/animated/trash";
 import { UsersIcon } from "@/components/icons/animated/users";
 import { InboxIcon } from "@/components/icons/animated/inbox";
-import { DeleteIcon } from "@/components/icons/animated/trash";
 import { XIcon } from "@/components/icons/animated/x";
+import { NestedKeyOf } from "next-intl";
+import { MessageKeys } from "next-intl";
 export interface NavItem {
   title: string;
   url: string;
@@ -19,6 +21,7 @@ export interface NavItem {
   isSettingsButton?: boolean;
   disabled?: boolean;
 }
+export type MessageKey = MessageKeys<IntlMessages, NestedKeyOf<IntlMessages>>;
 
 interface NavSection {
   title: string;
@@ -30,6 +33,7 @@ interface NavConfig {
   sections: NavSection[];
 }
 
+// ! items title has to be a message key (check messages/en.json)
 export const navigationConfig: Record<string, NavConfig> = {
   mail: {
     path: "/mail",
@@ -38,39 +42,39 @@ export const navigationConfig: Record<string, NavConfig> = {
         title: "",
         items: [
           {
-            title: "Inbox",
+            title: "navigation.sidebar.inbox",
             url: "/mail/inbox",
             icon: InboxIcon,
           },
           {
-            title: "Drafts",
+            title: "navigation.sidebar.drafts",
             url: "/mail/draft",
             icon: BookTextIcon,
           },
           {
-            title: "Sent",
+            title: "navigation.sidebar.sent",
             url: "/mail/sent",
             icon: CheckCheckIcon,
           },
           {
-            title: "Spam",
+            title: "navigation.sidebar.spam",
             url: "/mail/spam",
             icon: XIcon,
           },
           {
-            title: "Archive",
+            title: "navigation.sidebar.archive",
             url: "/mail/archive",
             icon: ArchiveIcon,
             disabled: true,
           },
           {
-            title: "Bin",
+            title: "navigation.sidebar.bin",
             url: "/mail/bin",
             icon: DeleteIcon,
             disabled: true,
           },
           {
-            title: "Settings",
+            title: "navigation.sidebar.settings",
             url: "/settings/general",
             icon: SettingsGearIcon,
             isSettingsButton: true,
@@ -125,34 +129,34 @@ export const navigationConfig: Record<string, NavConfig> = {
         title: "Settings",
         items: [
           {
-            title: "Back",
+            title: "common.actions.back",
             url: "/mail",
             icon: ArrowLeftIcon,
             isBackButton: true,
           },
 
           {
-            title: "General",
+            title: "navigation.settings.general",
             url: "/settings/general",
             icon: SettingsGearIcon,
           },
           {
-            title: "Connections",
+            title: "navigation.settings.connections",
             url: "/settings/connections",
             icon: UsersIcon,
           },
           {
-            title: "Security",
+            title: "navigation.settings.security",
             url: "/settings/security",
             icon: ShieldCheckIcon,
           },
           {
-            title: "Appearance",
+            title: "navigation.settings.appearance",
             url: "/settings/appearance",
             icon: SparklesIcon,
           },
           {
-            title: "Shortcuts",
+            title: "navigation.settings.shortcuts",
             url: "/settings/shortcuts",
             icon: KeyboardIcon,
           },
diff --git a/apps/mail/config/shortcuts.ts b/apps/mail/config/shortcuts.ts
index 4fb008e641..21a2f0382a 100644
--- a/apps/mail/config/shortcuts.ts
+++ b/apps/mail/config/shortcuts.ts
@@ -1,24 +1,24 @@
 // config/shortcuts.ts
 export const keyboardShortcuts = [
-  { keys: ["⌘", "n"], action: "New Email" },
-  { keys: ["⌘", "Enter"], action: "Send Email" },
-  { keys: ["⌘", "r"], action: "Reply" },
-  { keys: ["⌘", "Shift", "r"], action: "Reply All" },
-  { keys: ["⌘", "f"], action: "Forward" },
-  { keys: ["⌘", "Shift", "d"], action: "Drafts" },
-  { keys: ["⌘", "Shift", "i"], action: "Inbox" },
-  { keys: ["⌘", "Shift", "s"], action: "Sent Mail" },
-  { keys: ["⌘", "Backspace"], action: "Delete" },
-  { keys: ["⌘", "/"], action: "Search" },
-  { keys: ["⌘", "Shift", "u"], action: "Mark as Unread" },
-  { keys: ["⌘", "Shift", "m"], action: "Mute Thread" },
-  { keys: ["⌘", "Shift", "p"], action: "Print Email" },
-  { keys: ["⌘", "Shift", "h"], action: "Archive Email" },
-  { keys: ["⌘", "Shift", "j"], action: "Mark as Spam" },
-  { keys: ["⌘", "Shift", "e"], action: "Move to Folder" },
-  { keys: ["⌘", "Shift", "t"], action: "Undo Last Action" },
-  { keys: ["⌘", "Shift", "v"], action: "View Email Details" },
-  { keys: ["⌘", "Shift", "g"], action: "Go to Drafts" },
-  { keys: ["⌘", "Shift", "x"], action: "Expand Email View" },
-  { keys: ["⌘", "?"], action: "Help with shortcuts" },
+  { keys: ["⌘", "n"], action: "newEmail" },
+  { keys: ["⌘", "Enter"], action: "sendEmail" },
+  { keys: ["⌘", "r"], action: "reply" },
+  { keys: ["⌘", "Shift", "r"], action: "replyAll" },
+  { keys: ["⌘", "f"], action: "forward" },
+  { keys: ["⌘", "Shift", "d"], action: "drafts" },
+  { keys: ["⌘", "Shift", "i"], action: "inbox" },
+  { keys: ["⌘", "Shift", "s"], action: "sentMail" },
+  { keys: ["⌘", "Backspace"], action: "delete" },
+  { keys: ["⌘", "/"], action: "search" },
+  { keys: ["⌘", "Shift", "u"], action: "markAsUnread" },
+  { keys: ["⌘", "Shift", "m"], action: "muteThread" },
+  { keys: ["⌘", "Shift", "p"], action: "printEmail" },
+  { keys: ["⌘", "Shift", "h"], action: "archiveEmail" },
+  { keys: ["⌘", "Shift", "j"], action: "markAsSpam" },
+  { keys: ["⌘", "Shift", "e"], action: "moveToFolder" },
+  { keys: ["⌘", "Shift", "t"], action: "undoLastAction" },
+  { keys: ["⌘", "Shift", "v"], action: "viewEmailDetails" },
+  { keys: ["⌘", "Shift", "g"], action: "goToDrafts" },
+  { keys: ["⌘", "Shift", "x"], action: "expandEmailView" },
+  { keys: ["⌘", "?"], action: "helpWithShortcuts" },
 ];
diff --git a/apps/mail/global.d.ts b/apps/mail/global.d.ts
new file mode 100644
index 0000000000..633d350ef9
--- /dev/null
+++ b/apps/mail/global.d.ts
@@ -0,0 +1,8 @@
+import en from "./locales/en.json";
+
+type Messages = typeof en;
+
+declare global {
+  // Use type safe message keys with `next-intl`
+  interface IntlMessages extends Messages {}
+}
diff --git a/apps/mail/i18n/config.ts b/apps/mail/i18n/config.ts
new file mode 100644
index 0000000000..9893f3c445
--- /dev/null
+++ b/apps/mail/i18n/config.ts
@@ -0,0 +1,23 @@
+export type Locale = (typeof locales)[number];
+
+export const availableLocales = [
+  {
+    code: "en",
+    name: "English",
+  },
+  {
+    code: "fr",
+    name: "French",
+  },
+  {
+    code: "tr",
+    name: "Turkish",
+  },
+  {
+    code: "es-ES",
+    name: "Spanish",
+  },
+];
+
+export const locales = availableLocales.map((locale) => locale.code);
+export const defaultLocale: Locale = "en";
diff --git a/apps/mail/i18n/request.ts b/apps/mail/i18n/request.ts
new file mode 100644
index 0000000000..6e2ad3a35a
--- /dev/null
+++ b/apps/mail/i18n/request.ts
@@ -0,0 +1,16 @@
+import { getRequestConfig } from "next-intl/server";
+import { getLocale } from "./utils";
+import deepmerge from "deepmerge";
+
+export default getRequestConfig(async () => {
+  const locale = await getLocale();
+
+  const userMessages = (await import(`../locales/${locale}.json`)).default;
+  const defaultMessages = (await import(`../locales/en.json`)).default;
+  const messages = deepmerge(defaultMessages, userMessages);
+
+  return {
+    locale,
+    messages,
+  };
+});
diff --git a/apps/mail/i18n/utils.ts b/apps/mail/i18n/utils.ts
new file mode 100644
index 0000000000..8f3a0a1969
--- /dev/null
+++ b/apps/mail/i18n/utils.ts
@@ -0,0 +1,40 @@
+"use server";
+
+import { I18N_LOCALE_COOKIE_NAME } from "@/lib/constants";
+import { defaultLocale, locales, Locale } from "./config";
+import { cookies, headers } from "next/headers";
+
+export async function getLocale() {
+  const headersList = await headers();
+  const cookieStore = await cookies();
+
+  // get locale from cookie or fall back to browser locale
+  const cookieLocale = cookieStore.get(I18N_LOCALE_COOKIE_NAME)?.value;
+
+  if (cookieLocale) {
+    return cookieLocale;
+  }
+
+  // extract browser locale from accept-language header
+  const acceptLanguage = headersList.get("accept-language");
+  if (acceptLanguage) {
+    // try to get the locale with and without region (ex: "en" and "en-US")
+    const reqLocale = acceptLanguage.split(",")[0]?.trim();
+    const reqLocaleWithoutRegion = reqLocale?.split("-")[0]?.trim();
+
+    // check if the locale is supported
+    if (locales.includes(reqLocale as Locale)) {
+      return reqLocale;
+    } else if (locales.includes(reqLocaleWithoutRegion as Locale)) {
+      return reqLocaleWithoutRegion;
+    }
+  }
+
+  // default fallback locale
+  return defaultLocale;
+}
+
+export async function changeLocale(locale: Locale) {
+  const cookieStore = await cookies();
+  cookieStore.set(I18N_LOCALE_COOKIE_NAME, locale);
+}
diff --git a/apps/mail/lib/constants.ts b/apps/mail/lib/constants.ts
index c39801a0ad..6d6d1d28f5 100644
--- a/apps/mail/lib/constants.ts
+++ b/apps/mail/lib/constants.ts
@@ -1,3 +1,4 @@
+export const I18N_LOCALE_COOKIE_NAME = "i18n:locale";
 export const SIDEBAR_COOKIE_NAME = "sidebar:state";
 export const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 export const SIDEBAR_WIDTH = "12rem";
diff --git a/apps/mail/locales/en.json b/apps/mail/locales/en.json
new file mode 100644
index 0000000000..5748e23865
--- /dev/null
+++ b/apps/mail/locales/en.json
@@ -0,0 +1,225 @@
+{
+  "common": {
+    "actions": {
+      "logout": "Logout",
+      "back": "Back",
+      "create": "Create Email",
+      "saveChanges": "Save changes",
+      "saving": "Saving...",
+      "resetToDefaults": "Reset to Defaults",
+      "close": "Close",
+      "signingOut": "Signing out...",
+      "signedOutSuccess": "Signed out successfully!",
+      "signOutError": "Error signing out"
+    },
+    "themes": {
+      "dark": "Dark",
+      "light": "Light",
+      "system": "System"
+    },
+    "commandPalette": {
+      "title": "Command Palette",
+      "description": "Quick navigation and actions for Mail-0",
+      "placeholder": "Type a command or search...",
+      "noResults": "No results found",
+      "groups": {
+        "mail": "Mail",
+        "settings": "Settings",
+        "actions": "Actions",
+        "help": "Help",
+        "navigation": "Navigation"
+      },
+      "commands": {
+        "goToInbox": "Go to Inbox",
+        "goToDrafts": "Go to Drafts",
+        "goToSent": "Go to Sent",
+        "goToSpam": "Go to Spam",
+        "goToArchive": "Go to Archive",
+        "goToBin": "Go to Bin",
+        "goToSettings": "Go to Settings",
+        "newEmail": "New Email",
+        "composeMessage": "Compose message",
+        "searchEmails": "Search Emails",
+        "toggleTheme": "Toggle Theme",
+        "backToMail": "Back to Mail",
+        "goToDocs": "Go to docs",
+        "helpWithShortcuts": "Help with shortcuts"
+      }
+    },
+    "searchBar": {
+      "pickDateRange": "Pick a date or a range",
+      "search": "Search",
+      "clearSearch": "Clear search",
+      "advancedSearch": "Advanced search",
+      "quickFilters": "Quick filters",
+      "searchIn": "Search in",
+      "recipient": "Recipient",
+      "sender": "Sender",
+      "subject": "Subject",
+      "dateRange": "Date range",
+      "category": "Category",
+      "folder": "Folder",
+      "allMail": "All Mail",
+      "unread": "Unread",
+      "hasAttachment": "Has Attachment",
+      "starred": "Starred",
+      "applyFilters": "Apply filters",
+      "reset": "Reset"
+    },
+    "navUser": {
+      "customerSupport": "Customer Support",
+      "documentation": "Documentation",
+      "appTheme": "App Theme",
+      "accounts": "Accounts",
+      "signIn": "Sign in"
+    },
+    "mailCategories": {
+      "primary": "Primary",
+      "important": "Important",
+      "personal": "Personal",
+      "updates": "Updates",
+      "promotions": "Promotions",
+      "social": "Social"
+    },
+    "replyCompose": {
+      "replyTo": "Reply to",
+      "thisEmail": "this email",
+      "dropFiles": "Drop files to attach",
+      "attachments": "Attachments",
+      "attachmentCount": "{count, plural, =0 {attachments} one {attachment} other {attachments}}",
+      "fileCount": "{count, plural, =0 {files} one {file} other {files}}",
+      "saveDraft": "Save draft",
+      "send": "Send"
+    },
+    "mailDisplay": {
+      "details": "Details",
+      "from": "From",
+      "to": "To",
+      "cc": "Cc",
+      "date": "Date",
+      "mailedBy": "Mailed-By",
+      "signedBy": "Signed-By",
+      "security": "Security",
+      "standardEncryption": "Standard encryption (TLS)",
+      "loadingMailContent": "Loading mail content..."
+    },
+    "threadDisplay": {
+      "exitFullscreen": "Exit fullscreen",
+      "enterFullscreen": "Enter fullscreen",
+      "archive": "Archive",
+      "reply": "Reply",
+      "moreOptions": "More options",
+      "moveToSpam": "Move to spam",
+      "replyAll": "Reply all",
+      "forward": "Forward",
+      "markAsUnread": "Mark as unread",
+      "addLabel": "Add label",
+      "muteThread": "Mute thread"
+    }
+  },
+  "navigation": {
+    "sidebar": {
+      "inbox": "Inbox",
+      "drafts": "Drafts",
+      "sent": "Sent",
+      "spam": "Spam",
+      "archive": "Archive",
+      "bin": "Bin",
+      "settings": "Settings"
+    },
+    "settings": {
+      "general": "General",
+      "connections": "Connections",
+      "security": "Security",
+      "appearance": "Appearance",
+      "shortcuts": "Shortcuts"
+    }
+  },
+  "pages": {
+    "error": {
+      "notFound": {
+        "title": "Page Not Found",
+        "description": "Oops! The page you're looking for doesn't exist or has been moved.",
+        "goBack": "Go Back"
+      },
+      "settingsNotFound": "404 - Settings page not found"
+    },
+    "settings": {
+      "general": {
+        "title": "General",
+        "description": "Manage settings for your language and email display preferences.",
+        "language": "Language",
+        "timezone": "Timezone",
+        "dynamicContent": "Dynamic Content",
+        "dynamicContentDescription": "Allow emails to display dynamic content.",
+        "externalImages": "Display External Images",
+        "externalImagesDescription": "Allow emails to display images from external sources."
+      },
+      "connections": {
+        "title": "Email Connections",
+        "description": "Connect your email accounts to Zero.",
+        "disconnectTitle": "Disconnect Email Account",
+        "disconnectDescription": "Are you sure you want to disconnect this email?",
+        "cancel": "Cancel",
+        "remove": "Remove",
+        "disconnectSuccess": "Account disconnected successfully",
+        "disconnectError": "Failed to disconnect account",
+        "addEmail": "Add Connection",
+        "connectEmail": "Connect Email",
+        "connectEmailDescription": "Select an email provider to connect",
+        "moreComingSoon": "More coming soon"
+      },
+      "security": {
+        "title": "Security",
+        "description": "Manage your security preferences and account protection.",
+        "twoFactorAuth": "Two-Factor Authentication",
+        "twoFactorAuthDescription": "Add an extra layer of security to your account",
+        "loginNotifications": "Login Notifications",
+        "loginNotificationsDescription": "Get notified about new login attempts",
+        "deleteAccount": "Delete Account"
+      },
+      "appearance": {
+        "title": "Appearance",
+        "description": "Customize colors, fonts and view options.",
+        "theme": "Theme",
+        "inboxType": "Inbox Type"
+      },
+      "shortcuts": {
+        "title": "Keyboard Shortcuts",
+        "description": "View and customize keyboard shortcuts for quick actions.",
+        "actions": {
+          "newEmail": "New Email",
+          "sendEmail": "Send Email",
+          "reply": "Reply",
+          "replyAll": "Reply All",
+          "forward": "Forward",
+          "drafts": "Drafts",
+          "inbox": "Inbox",
+          "sentMail": "Sent Mail",
+          "delete": "Delete",
+          "search": "Search",
+          "markAsUnread": "Mark as Unread",
+          "muteThread": "Mute Thread",
+          "printEmail": "Print Email",
+          "archiveEmail": "Archive Email",
+          "markAsSpam": "Mark as Spam",
+          "moveToFolder": "Move to Folder",
+          "undoLastAction": "Undo Last Action",
+          "viewEmailDetails": "View Email Details",
+          "goToDrafts": "Go to Drafts",
+          "expandEmailView": "Expand Email View",
+          "helpWithShortcuts": "Help with shortcuts"
+        }
+      }
+    },
+    "createEmail": {
+      "body": "Body",
+      "example": "zero@0.email",
+      "attachments": "Attachments",
+      "dropFilesToAttach": "Drop files to attach",
+      "writeYourMessageHere": "Write your message here...",
+      "emailSentSuccessfully": "Email sent successfully",
+      "failedToSendEmail": "Failed to send email. Please try again."
+    }
+  }
+}
diff --git a/apps/mail/locales/es-ES.json b/apps/mail/locales/es-ES.json
new file mode 100644
index 0000000000..e525443dca
--- /dev/null
+++ b/apps/mail/locales/es-ES.json
@@ -0,0 +1,224 @@
+{
+  "common": {
+    "actions": {
+      "logout": "Cerrar sesión",
+      "back": "Volver",
+      "create": "Crear un email",
+      "saveChanges": "Guardar los cambios",
+      "saving": "Guardando...",
+      "resetToDefaults": "Reiniciar a valores por defecto",
+      "close": "Cerrar",
+      "signingOut": "Cerrando sesión...",
+      "signedOutSuccess": "Sesión cerrada correctamente",
+      "signOutError": "Error al cerrar sesión"
+    },
+    "themes": {
+      "dark": "Oscuro",
+      "light": "Claro",
+      "system": "Sistema"
+    },
+    "commandPalette": {
+      "title": "Paleta de Comandos",
+      "description": "Navegación rápida y acciones para Mail-0",
+      "placeholder": "Escriba un comando o buscar...",
+      "noResults": "No se han encontrado resultados",
+      "groups": {
+        "mail": "Correo",
+        "settings": "Configuraciones",
+        "actions": "Acciones",
+        "help": "Ayuda",
+        "navigation": "Navegación"
+      },
+      "commands": {
+        "goToInbox": "Ir a la bandeja de entrada",
+        "goToDrafts": "Ir a la carpeta de borradores",
+        "goToSent": "Ir a la carpeta de Enviados",
+        "goToSpam": "Ir a spam",
+        "goToArchive": "Ir a archivo",
+        "goToBin": "Ir a la papelera",
+        "goToSettings": "Ir a la configuración",
+        "newEmail": "Nuevo email",
+        "composeMessage": "Redactar mensaje",
+        "searchEmails": "Buscar correos",
+        "toggleTheme": "Cambiar tema",
+        "backToMail": "Volver al correo",
+        "goToDocs": "Ir a documentos",
+        "helpWithShortcuts": "Ayuda con accesos directos"
+      }
+    },
+    "searchBar": {
+      "pickDateRange": "Elige una fecha o rango",
+      "search": "Buscar",
+      "clearSearch": "Limpiar búsqueda",
+      "advancedSearch": "Búsqueda avanzada",
+      "quickFilters": "Filtros rápidos",
+      "searchIn": "Buscar en",
+      "recipient": "Recipiente",
+      "sender": "Remitente",
+      "subject": "Asunto",
+      "dateRange": "Rango de fechas",
+      "category": "Categoría",
+      "folder": "Carpeta",
+      "allMail": "Todo el correo",
+      "unread": "Sin leer",
+      "hasAttachment": "Tiene archivos adjuntos",
+      "starred": "Favoritos",
+      "applyFilters": "Aplicar filtros",
+      "reset": "Restablecer"
+    },
+    "navUser": {
+      "customerSupport": "Soporte al cliente",
+      "documentation": "Documentación",
+      "appTheme": "Tema de la app",
+      "accounts": "Cuentas",
+      "signIn": "Registrarse"
+    },
+    "mailCategories": {
+      "primary": "Principal",
+      "important": "Importante",
+      "personal": "Particular",
+      "updates": "Actualizaciones",
+      "promotions": "Promociones",
+      "social": "Social"
+    },
+    "replyCompose": {
+      "replyTo": "Responder a",
+      "thisEmail": "Este correo electrónico",
+      "dropFiles": "Suelte los archivos para adjuntarlos",
+      "attachments": "Adjuntos",
+      "attachmentCount": "{count, plural, =0 {sin adjuntos} one {adjunto} other {adjuntos}}",
+      "fileCount": "{count, plural, =0 {archivos} one {archivo} other {archivos}}",
+      "saveDraft": "Guardar borrador",
+      "send": "Enviar"
+    },
+    "mailDisplay": {
+      "details": "Detalles",
+      "from": "De",
+      "to": "Hasta",
+      "date": "Fecha",
+      "mailedBy": "Errores-Por",
+      "signedBy": "Firmado por",
+      "security": "Seguridad",
+      "standardEncryption": "Encriptación estándar (TLS)",
+      "loadingMailContent": "Cargando el contenido del correo..."
+    },
+    "threadDisplay": {
+      "exitFullscreen": "Salir de pantalla completa",
+      "enterFullscreen": "Mostrar en pantalla completa",
+      "archive": "Archivar",
+      "reply": "Responder",
+      "moreOptions": "Más opciones",
+      "moveToSpam": "Mover a spam",
+      "replyAll": "Responder a todos",
+      "forward": "Reenviar",
+      "markAsUnread": "Marcar como no leído",
+      "addLabel": "Añadir etiqueta",
+      "muteThread": "Silenciar hilo"
+    }
+  },
+  "navigation": {
+    "sidebar": {
+      "inbox": "Buzón",
+      "drafts": "Borradores",
+      "sent": "Enviado",
+      "spam": "Spam",
+      "archive": "Archivar",
+      "bin": "Papelera de reciclaje",
+      "settings": "Configuraciones"
+    },
+    "settings": {
+      "general": "General",
+      "connections": "Conexiones",
+      "security": "Seguridad",
+      "appearance": "Apariencia",
+      "shortcuts": "Accesos directos"
+    }
+  },
+  "pages": {
+    "error": {
+      "notFound": {
+        "title": "Página no encontrada",
+        "description": "¡Uy! La página que estás buscando no existe o ha sido movida.",
+        "goBack": "Regresar"
+      },
+      "settingsNotFound": "404 - Página de configuración no encontrada"
+    },
+    "settings": {
+      "general": {
+        "title": "General",
+        "description": "Administre la configuración de sus preferencias de idioma y correo electrónico.",
+        "language": "Idioma",
+        "timezone": "Zona horaria",
+        "dynamicContent": "Contenido dinámico",
+        "dynamicContentDescription": "Permitir que los correos electrónicos muestren contenido dinámico.",
+        "externalImages": "Mostrar imágenes externas",
+        "externalImagesDescription": "Permitir que los correos electrónicos muestren imágenes de fuentes externas."
+      },
+      "connections": {
+        "title": "Conexiones de correo",
+        "description": "Conecte sus cuentas de correo electrónico a Zero.",
+        "disconnectTitle": "Desconectar cuenta de correo",
+        "disconnectDescription": "¿Estás seguro de que quieres desconectar este correo electrónico?",
+        "cancel": "Cancelar",
+        "remove": "Eliminar",
+        "disconnectSuccess": "Cuenta desconectada correctamente",
+        "disconnectError": "Error al desconectar la cuenta",
+        "addEmail": "Añadir Conexión",
+        "connectEmail": "Conectar correo electrónico",
+        "connectEmailDescription": "Seleccione un proveedor de correo electrónico para conectar",
+        "moreComingSoon": "Próximamente más"
+      },
+      "security": {
+        "title": "Seguridad",
+        "description": "Administre sus preferencias de seguridad y protección de cuenta.",
+        "twoFactorAuth": "Autenticación de dos factores",
+        "twoFactorAuthDescription": "Añade una capa extra de seguridad a su cuenta.",
+        "loginNotifications": "Notificaciones de inicio de sesión",
+        "loginNotificationsDescription": "Recibir notificaciones de nuevos intentos de inicio de sesión",
+        "deleteAccount": "Eliminar cuenta"
+      },
+      "appearance": {
+        "title": "Apariencia",
+        "description": "Personalizar colores, fuentes y opciones de visualización.",
+        "theme": "Temas",
+        "inboxType": "Tipo de bandeja de entrada"
+      },
+      "shortcuts": {
+        "title": "Atajos de teclado",
+        "description": "Ver y personalizar los atajos de teclado para acciones rápidas.",
+        "actions": {
+          "newEmail": "Nuevo email",
+          "sendEmail": "Enviar correo electrónico",
+          "reply": "Responder",
+          "replyAll": "Responder a todos",
+          "forward": "Reenviar",
+          "drafts": "Borradores",
+          "inbox": "Buzón",
+          "sentMail": "Enviados",
+          "delete": "Borrar",
+          "search": "Buscar",
+          "markAsUnread": "Marcar como no leído",
+          "muteThread": "Silencia hilos",
+          "printEmail": "Imprimir correo electrónico",
+          "archiveEmail": "Archivo Correo",
+          "markAsSpam": "Marcar como Spam",
+          "moveToFolder": "Mover a Directorio",
+          "undoLastAction": "Deshacer última acción",
+          "viewEmailDetails": "Ver detalles de email",
+          "goToDrafts": "Ir a la carpeta de borradores",
+          "expandEmailView": "Expandir vista de email",
+          "helpWithShortcuts": "Ayuda con accesos directos"
+        }
+      }
+    },
+    "createEmail": {
+      "body": "Cuerpo",
+      "example": "zero@0.email",
+      "attachments": "Adjuntos",
+      "dropFilesToAttach": "Suelte los archivos para adjuntarlos",
+      "writeYourMessageHere": "Escribe tu mensaje aquí...",
+      "emailSentSuccessfully": "E-mail enviado con éxito",
+      "failedToSendEmail": "Error al enviar el correo electrónico. Por favor, inténtalo de nuevo."
+    }
+  }
+}
diff --git a/apps/mail/locales/fr.json b/apps/mail/locales/fr.json
new file mode 100644
index 0000000000..b6d86baa0a
--- /dev/null
+++ b/apps/mail/locales/fr.json
@@ -0,0 +1,222 @@
+{
+  "common": {
+    "actions": {
+      "logout": "Déconnexion",
+      "back": "Retour",
+      "create": "Créer un email",
+      "saveChanges": "Enregistrer les modifications",
+      "saving": "Enregistrement...",
+      "resetToDefaults": "Réinitialiser par défaut",
+      "close": "Fermer",
+      "signingOut": "Déconnexion...",
+      "signedOutSuccess": "Déconnexion réussie!",
+      "signOutError": "Erreur de déconnexion"
+    },
+    "themes": {
+      "dark": "Sombre",
+      "light": "Clair",
+      "system": "Système"
+    },
+    "commandPalette": {
+      "title": "Palette de commandes",
+      "description": "Navigation rapide et actions pour Mail-0",
+      "placeholder": "Tapez une commande ou recherchez...",
+      "noResults": "Aucun résultat trouvé",
+      "groups": {
+        "mail": "Email",
+        "settings": "Paramètres",
+        "actions": "Actions",
+        "help": "Aide",
+        "navigation": "Navigation"
+      },
+      "commands": {
+        "goToInbox": "Aller à la boîte de réception",
+        "goToDrafts": "Aller aux brouillons",
+        "goToSent": "Aller aux envoyés",
+        "goToSpam": "Aller au spam",
+        "goToArchive": "Aller à l'archive",
+        "goToBin": "Aller à la corbeille",
+        "goToSettings": "Aller aux paramètres",
+        "newEmail": "Nouvel email",
+        "composeMessage": "Composer un message",
+        "searchEmails": "Rechercher des emails",
+        "toggleTheme": "Changer de thème",
+        "backToMail": "Retour aux emails",
+        "goToDocs": "Voir la documentation",
+        "helpWithShortcuts": "Aide sur les raccourcis"
+      }
+    },
+    "searchBar": {
+      "pickDateRange": "Choisir une date ou une plage",
+      "search": "Rechercher",
+      "clearSearch": "Effacer la recherche",
+      "advancedSearch": "Recherche avancée",
+      "quickFilters": "Filtres rapides",
+      "searchIn": "Rechercher dans",
+      "recipient": "Destinataire",
+      "sender": "Expéditeur",
+      "subject": "Sujet",
+      "dateRange": "Plage de dates",
+      "category": "Catégorie",
+      "folder": "Dossier",
+      "allMail": "Tous les emails",
+      "unread": "Non lu",
+      "hasAttachment": "Avec pièce jointe",
+      "starred": "Étoilé",
+      "applyFilters": "Appliquer les filtres",
+      "reset": "Réinitialiser"
+    },
+    "navUser": {
+      "customerSupport": "Support client",
+      "documentation": "Documentation",
+      "appTheme": "Thème de l'application",
+      "accounts": "Comptes",
+      "signIn": "Se connecter"
+    },
+    "mailCategories": {
+      "primary": "Principale",
+      "important": "Important",
+      "personal": "Personnel",
+      "updates": "Mises à jour",
+      "promotions": "Promotions"
+    },
+    "replyCompose": {
+      "replyTo": "Répondre à",
+      "thisEmail": "cet email",
+      "dropFiles": "Déposer les fichiers à joindre",
+      "attachments": "Pièces jointes",
+      "attachmentCount": "{count, plural, =0 {pièces jointes} one {pièce jointe} other {pièces jointes}}",
+      "fileCount": "{count, plural, =0 {fichiers} one {fichier} other {fichiers}}",
+      "saveDraft": "Enregistrer le brouillon",
+      "send": "Envoyer"
+    },
+    "mailDisplay": {
+      "details": "Détails",
+      "from": "De",
+      "to": "À",
+      "cc": "Cc",
+      "date": "Date",
+      "mailedBy": "Expédié par",
+      "signedBy": "Signé par",
+      "security": "Sécurité",
+      "standardEncryption": "Chiffrement standard (TLS)",
+      "loadingMailContent": "Chargement du contenu de l'email..."
+    },
+    "threadDisplay": {
+      "exitFullscreen": "Quitter le mode plein écran",
+      "enterFullscreen": "Passer en mode plein écran",
+      "archive": "Archiver",
+      "reply": "Répondre",
+      "moreOptions": "Plus d'options",
+      "moveToSpam": "Déplacer vers le spam",
+      "replyAll": "Répondre à tous",
+      "forward": "Transférer",
+      "markAsUnread": "Marquer comme non lu",
+      "addLabel": "Ajouter un label",
+      "muteThread": "Mettre en sourdine"
+    }
+  },
+  "navigation": {
+    "sidebar": {
+      "inbox": "Boîte de réception",
+      "drafts": "Brouillons",
+      "sent": "Envoyés",
+      "spam": "Spam",
+      "archive": "Archive",
+      "bin": "Corbeille",
+      "settings": "Paramètres"
+    },
+    "settings": {
+      "general": "Général",
+      "connections": "Connexions",
+      "security": "Sécurité",
+      "appearance": "Apparence",
+      "shortcuts": "Raccourcis"
+    }
+  },
+  "pages": {
+    "error": {
+      "notFound": {
+        "title": "Page Non Trouvée",
+        "description": "Oups ! La page que vous recherchez n'existe pas ou a été déplacée.",
+        "goBack": "Retour"
+      },
+      "settingsNotFound": "404 - Page des paramètres non trouvée"
+    },
+    "settings": {
+      "general": {
+        "title": "Paramètres généraux",
+        "description": "Gérez les paramètres de votre langue et vos préférences de visualisation des emails.",
+        "language": "Langue",
+        "timezone": "Fuseau horaire",
+        "dynamicContent": "Contenu dynamique",
+        "dynamicContentDescription": "Autoriser les emails à afficher du contenu dynamique.",
+        "externalImages": "Afficher les images externes",
+        "externalImagesDescription": "Autoriser les emails à afficher des images provenant de sources externes."
+      },
+      "connections": {
+        "title": "Connexions Email",
+        "description": "Connectez vos comptes email à Zero.",
+        "disconnectTitle": "Déconnecter le compte email",
+        "disconnectDescription": "Êtes-vous sûr de vouloir déconnecter cet email ?",
+        "cancel": "Annuler",
+        "remove": "Supprimer",
+        "disconnectSuccess": "Compte déconnecté avec succès",
+        "disconnectError": "Échec de la déconnexion du compte",
+        "addEmail": "Ajouter une connexion",
+        "connectEmail": "Connecter un email",
+        "connectEmailDescription": "Sélectionnez un fournisseur de courrier pour vous connecter",
+        "moreComingSoon": "Plus bientôt"
+      },
+      "security": {
+        "title": "Sécurité",
+        "description": "Gérez vos préférences de sécurité et la protection de votre compte.",
+        "twoFactorAuth": "Authentification à deux facteurs",
+        "twoFactorAuthDescription": "Ajoutez une couche de sécurité supplémentaire à votre compte",
+        "loginNotifications": "Notifications de connexion",
+        "loginNotificationsDescription": "Soyez informé des nouvelles tentatives de connexion",
+        "deleteAccount": "Supprimer le compte"
+      },
+      "appearance": {
+        "title": "Apparence",
+        "description": "Personnalisez les couleurs, les polices et les options d'affichage.",
+        "theme": "Thème",
+        "inboxType": "Type de boîte de réception"
+      },
+      "shortcuts": {
+        "title": "Raccourcis clavier",
+        "description": "Consultez et personnalisez les raccourcis clavier pour des actions rapides.",
+        "actions": {
+          "newEmail": "Nouvel email",
+          "sendEmail": "Envoyer l'email",
+          "reply": "Répondre",
+          "replyAll": "Répondre à tous",
+          "forward": "Transférer",
+          "drafts": "Brouillons",
+          "inbox": "Boîte de réception",
+          "sentMail": "Emails envoyés",
+          "delete": "Supprimer",
+          "search": "Rechercher",
+          "markAsUnread": "Marquer comme non lu",
+          "muteThread": "Mettre en sourdine",
+          "printEmail": "Imprimer l'email",
+          "archiveEmail": "Archiver l'email",
+          "markAsSpam": "Marquer comme spam",
+          "moveToFolder": "Déplacer vers un dossier",
+          "undoLastAction": "Annuler la dernière action",
+          "viewEmailDetails": "Voir les détails de l'email",
+          "goToDrafts": "Aller aux brouillons",
+          "expandEmailView": "Agrandir la vue de l'email",
+          "helpWithShortcuts": "Aide sur les raccourcis"
+        }
+      }
+    },
+    "createEmail": {
+      "body": "Corps",
+      "example": "zero@0.email",
+      "attachments": "Pièces jointes",
+      "dropFilesToAttach": "Déposez des fichiers pour les joindre",
+      "writeYourMessageHere": "Écrivez votre message ici..."
+    }
+  }
+}
diff --git a/apps/mail/locales/tr.json b/apps/mail/locales/tr.json
new file mode 100644
index 0000000000..e674a5c6ae
--- /dev/null
+++ b/apps/mail/locales/tr.json
@@ -0,0 +1,223 @@
+{
+  "common": {
+    "actions": {
+      "logout": "Çıkış Yap",
+      "back": "Geri",
+      "create": "Email Oluştur",
+      "saveChanges": "Değişiklikleri Kaydet",
+      "saving": "Kaydediliyor...",
+      "resetToDefaults": "Varsayılanlara Sıfırla",
+      "close": "Kapat",
+      "signingOut": "Çıkış yapılıyor...",
+      "signedOutSuccess": "Çıkış yapıldı!",
+      "signOutError": "Çıkış yapılırken hata oluştu"
+    },
+    "themes": {
+      "dark": "Koyu",
+      "light": "Açık",
+      "system": "Sistem"
+    },
+    "commandPalette": {
+      "title": "Komut Paleti",
+      "description": "Mail-0 için hızlı gezinme ve işlemler",
+      "placeholder": "Bir komut yazın veya arayın...",
+      "noResults": "Sonuç bulunamadı",
+      "groups": {
+        "mail": "E-posta",
+        "settings": "Ayarlar",
+        "actions": "İşlemler",
+        "help": "Yardım",
+        "navigation": "Gezinme"
+      },
+      "commands": {
+        "goToInbox": "Gelen Kutusuna Git",
+        "goToDrafts": "Taslaklara Git",
+        "goToSent": "Gönderilenlere Git",
+        "goToSpam": "Spam'a Git",
+        "goToArchive": "Arşive Git",
+        "goToBin": "Çöp Kutusuna Git",
+        "goToSettings": "Ayarlara Git",
+        "newEmail": "Yeni E-posta",
+        "composeMessage": "Mesaj oluştur",
+        "searchEmails": "E-postaları Ara",
+        "toggleTheme": "Temayı Değiştir",
+        "backToMail": "E-postaya Geri Dön",
+        "goToDocs": "Dokümanlara Git",
+        "helpWithShortcuts": "Kısayollar Hakkında Yardım"
+      }
+    },
+    "searchBar": {
+      "pickDateRange": "Tarih seçin veya aralık seçin",
+      "search": "Ara",
+      "clearSearch": "Aramayı temizle",
+      "advancedSearch": "Gelişmiş arama",
+      "quickFilters": "Hızlı filtreler",
+      "searchIn": "Ara",
+      "recipient": "Alıcı",
+      "sender": "Gönderen",
+      "subject": "Konu",
+      "dateRange": "Tarih aralığı",
+      "category": "Kategori",
+      "folder": "Klasör",
+      "allMail": "Tüm E-postalar",
+      "unread": "Okunmamış",
+      "hasAttachment": "Ekli",
+      "starred": "Yıldızlı",
+      "applyFilters": "Filtreleri Uygula",
+      "reset": "Sıfırla"
+    },
+    "navUser": {
+      "customerSupport": "Müşteri Desteği",
+      "documentation": "Dokümantasyon",
+      "appTheme": "Uygulama Teması",
+      "accounts": "Hesaplar",
+      "signIn": "Giriş Yap"
+    },
+    "mailCategories": {
+      "primary": "Birincil",
+      "important": "Önemli",
+      "personal": "Kişisel",
+      "updates": "Güncellemeler",
+      "promotions": "Tanıtımlar"
+    },
+    "replyCompose": {
+      "replyTo": "Yanıtla",
+      "thisEmail": "bu e-postaya",
+      "dropFiles": "Eklemek için dosyaları bırakın",
+      "attachments": "Ekler",
+      "attachmentCount": "{count, plural, =0 {ekler} one {ek} other {ekler}}",
+      "fileCount": "{count, plural, =0 {dosyalar} one {dosya} other {dosyalar}}",
+      "saveDraft": "Taslağı kaydet",
+      "send": "Gönder"
+    },
+    "mailDisplay": {
+      "details": "Detaylar",
+      "from": "Kimden",
+      "to": "Kime",
+      "cc": "Cc",
+      "date": "Tarih",
+      "mailedBy": "Gönderen",
+      "signedBy": "İmzalayan",
+      "security": "Güvenlik",
+      "standardEncryption": "Standart şifreleme (TLS)",
+      "loadingMailContent": "E-posta içeriği yükleniyor..."
+    },
+    "threadDisplay": {
+      "close": "Kapat",
+      "exitFullscreen": "Tam ekrandan çık",
+      "enterFullscreen": "Tam ekrana geç",
+      "archive": "Arşivle",
+      "reply": "Yanıtla",
+      "moreOptions": "Daha fazla seçenek",
+      "moveToSpam": "Spam'a taşı",
+      "replyAll": "Tümünü yanıtla",
+      "forward": "İlet",
+      "markAsUnread": "Okunmamış olarak işaretle",
+      "addLabel": "Etiket ekle",
+      "muteThread": "Konuyu sessize al"
+    }
+  },
+  "navigation": {
+    "sidebar": {
+      "inbox": "Posta Kutusu",
+      "drafts": "Taslaklar",
+      "sent": "Gönderilenler",
+      "spam": "Spam",
+      "archive": "Arşiv",
+      "bin": "Çöp",
+      "settings": "Ayarlar"
+    },
+    "settings": {
+      "general": "Genel",
+      "connections": "Bağlantılar",
+      "security": "Güvenlik",
+      "appearance": "Görünüm",
+      "shortcuts": "Kısayollar"
+    }
+  },
+  "pages": {
+    "error": {
+      "notFound": {
+        "title": "Sayfa Bulunamadı",
+        "description": "Üzgünüz! Aradığınız sayfa mevcut değil veya taşınmış.",
+        "goBack": "Geri Dön"
+      },
+      "settingsNotFound": "404 - Ayarlar sayfası bulunamadı"
+    },
+    "settings": {
+      "general": {
+        "title": "Genel Ayarlar",
+        "description": "Dil ve email görünümü ayarlarını yönetin.",
+        "language": "Dil",
+        "timezone": "Saat Dilimi",
+        "dynamicContent": "Dinamik İçerik",
+        "dynamicContentDescription": "E-postaların dinamik içerik göstermesine izin verin.",
+        "externalImages": "Harici Görselleri Göster",
+        "externalImagesDescription": "E-postaların harici kaynaklardan görselleri göstermesine izin verin."
+      },
+      "connections": {
+        "title": "E-posta Bağlantıları",
+        "description": "E-posta hesaplarınızı Zero'ya bağlayın.",
+        "disconnectTitle": "E-posta Hesabını Bağlantıyı Kes",
+        "disconnectDescription": "Bu e-posta bağlantısını kesmek istediğinizden emin misiniz?",
+        "cancel": "İptal",
+        "remove": "Kaldır",
+        "disconnectSuccess": "Hesap bağlantısı başarıyla kesildi",
+        "disconnectError": "Hesap bağlantısı kesilirken hata oluştu",
+        "addEmail": "E-posta Bağlantısı Ekle",
+        "connectEmail": "E-posta Bağlantısı",
+        "connectEmailDescription": "E-posta sağlayıcısını seçin",
+        "moreComingSoon": "Yakında daha fazla geliyor"
+      },
+      "security": {
+        "title": "Güvenlik",
+        "description": "Güvenlik tercihlerinizi ve hesap korumanızı yönetin.",
+        "twoFactorAuth": "İki Faktörlü Kimlik Doğrulama",
+        "twoFactorAuthDescription": "Hesabınıza ekstra bir güvenlik katmanı ekleyin",
+        "loginNotifications": "Giriş Bildirimleri",
+        "loginNotificationsDescription": "Yeni giriş denemeleri hakkında bildirim alın",
+        "deleteAccount": "Hesabı Sil"
+      },
+      "appearance": {
+        "title": "Görünüm",
+        "description": "Renkleri, yazı tiplerini ve görünüm seçeneklerini özelleştirin.",
+        "theme": "Tema",
+        "inboxType": "Gelen Kutusu Tipi"
+      },
+      "shortcuts": {
+        "title": "Klavye Kısayolları",
+        "description": "Hızlı işlemler için klavye kısayollarını görüntüleyin ve özelleştirin.",
+        "actions": {
+          "newEmail": "Yeni E-posta",
+          "sendEmail": "E-posta Gönder",
+          "reply": "Yanıtla",
+          "replyAll": "Tümünü Yanıtla",
+          "forward": "İlet",
+          "drafts": "Taslaklar",
+          "inbox": "Gelen Kutusu",
+          "sentMail": "Gönderilen Postalar",
+          "delete": "Sil",
+          "search": "Ara",
+          "markAsUnread": "Okunmadı Olarak İşaretle",
+          "muteThread": "Konuyu Sessize Al",
+          "printEmail": "E-postayı Yazdır",
+          "archiveEmail": "E-postayı Arşivle",
+          "markAsSpam": "Spam Olarak İşaretle",
+          "moveToFolder": "Klasöre Taşı",
+          "undoLastAction": "Son İşlemi Geri Al",
+          "viewEmailDetails": "E-posta Detaylarını Görüntüle",
+          "goToDrafts": "Taslaklara Git",
+          "expandEmailView": "E-posta Görünümünü Genişlet",
+          "helpWithShortcuts": "Kısayollar Hakkında Yardım"
+        }
+      }
+    },
+    "createEmail": {
+      "body": "İçerik",
+      "example": "zero@0.email",
+      "attachments": "Ekler",
+      "dropFilesToAttach": "Eklemek için dosyaları bırakın",
+      "writeYourMessageHere": "Mesajınızı buraya yazın..."
+    }
+  }
+}
diff --git a/apps/mail/next.config.ts b/apps/mail/next.config.ts
index f54456f809..762497a4ce 100644
--- a/apps/mail/next.config.ts
+++ b/apps/mail/next.config.ts
@@ -1,10 +1,14 @@
+import createNextIntlPlugin from "next-intl/plugin";
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
   compiler: {
-    removeConsole: process.env.NODE_ENV === "production" ? {
-      exclude: ["warn", "error"]
-    } : undefined,
+    removeConsole:
+      process.env.NODE_ENV === "production"
+        ? {
+            exclude: ["warn", "error"],
+          }
+        : undefined,
   },
   images: {
     remotePatterns: [
@@ -41,4 +45,6 @@ const nextConfig: NextConfig = {
   },
 };
 
-export default nextConfig;
+const withNextIntl = createNextIntlPlugin("./i18n/request.ts");
+
+export default withNextIntl(nextConfig);
diff --git a/apps/mail/package.json b/apps/mail/package.json
index 13a8f062c1..a755bbce1b 100644
--- a/apps/mail/package.json
+++ b/apps/mail/package.json
@@ -59,6 +59,7 @@
     "cmdk": "1.0.0",
     "color": "5.0.0",
     "date-fns": "4.1.0",
+    "deepmerge": "^4.3.1",
     "dexie": "4.0.11",
     "dexie-react-hooks": "1.1.7",
     "drizzle-orm": "0.39.3",
@@ -74,6 +75,7 @@
     "mini-svg-data-uri": "1.4.4",
     "motion": "12.4.7",
     "next": "15.2.0",
+    "next-intl": "^3.26.5",
     "next-themes": "0.4.4",
     "novel": "1.0.2",
     "nuqs": "2.4.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index bba155c4ba..9cc718754a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -189,6 +189,9 @@ importers:
       date-fns:
         specifier: 4.1.0
         version: 4.1.0
+      deepmerge:
+        specifier: ^4.3.1
+        version: 4.3.1
       dexie:
         specifier: 4.0.11
         version: 4.0.11
@@ -234,6 +237,9 @@ importers:
       next:
         specifier: 15.2.0
         version: 15.2.0(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      next-intl:
+        specifier: ^3.26.5
+        version: 3.26.5(next@15.2.0(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0)
       next-themes:
         specifier: 0.4.4
         version: 0.4.4(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
@@ -765,6 +771,24 @@ packages:
   '@floating-ui/utils@0.2.9':
     resolution: {integrity: sha512-MDWhGtE+eHw5JW7lq4qhc5yRLS11ERl1c7Z6Xd0a58DozHES6EnNNwUWbMiG4J9Cgj053Bhk8zvlhFYKVhULwg==}
 
+  '@formatjs/ecma402-abstract@2.3.3':
+    resolution: {integrity: sha512-pJT1OkhplSmvvr6i3CWTPvC/FGC06MbN5TNBfRO6Ox62AEz90eMq+dVvtX9Bl3jxCEkS0tATzDarRZuOLw7oFg==}
+
+  '@formatjs/fast-memoize@2.2.6':
+    resolution: {integrity: sha512-luIXeE2LJbQnnzotY1f2U2m7xuQNj2DA8Vq4ce1BY9ebRZaoPB1+8eZ6nXpLzsxuW5spQxr7LdCg+CApZwkqkw==}
+
+  '@formatjs/icu-messageformat-parser@2.11.1':
+    resolution: {integrity: sha512-o0AhSNaOfKoic0Sn1GkFCK4MxdRsw7mPJ5/rBpIqdvcC7MIuyUSW8WChUEvrK78HhNpYOgqCQbINxCTumJLzZA==}
+
+  '@formatjs/icu-skeleton-parser@1.8.13':
+    resolution: {integrity: sha512-N/LIdTvVc1TpJmMt2jVg0Fr1F7Q1qJPdZSCs19unMskCmVQ/sa0H9L8PWt13vq+gLdLg1+pPsvBLydL1Apahjg==}
+
+  '@formatjs/intl-localematcher@0.5.10':
+    resolution: {integrity: sha512-af3qATX+m4Rnd9+wHcjJ4w2ijq+rAVP3CCinJQvFv1kgSu1W6jypUmvleJxcewdxmutM8dmIRZFxO/IQBZmP2Q==}
+
+  '@formatjs/intl-localematcher@0.6.0':
+    resolution: {integrity: sha512-4rB4g+3hESy1bHSBG3tDFaMY2CH67iT7yne1e+0CLTsGLDcmoEWWpJjjpWVaYgYfYuohIRuo0E+N536gd2ZHZA==}
+
   '@hexagon/base64@1.1.28':
     resolution: {integrity: sha512-lhqDEAvWixy3bZ+UOYbPwUbBkwBq5C1LAJ/xPC8Oi+lL54oyakv/npbA0aU2hgCsx/1NUd4IBvV03+aUBWxerw==}
 
@@ -2648,6 +2672,9 @@ packages:
   decimal.js-light@2.5.1:
     resolution: {integrity: sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==}
 
+  decimal.js@10.5.0:
+    resolution: {integrity: sha512-8vDa8Qxvr/+d94hSh5P3IJwI5t8/c0KsMp+g8bNw9cY2icONa5aPfvKeieW1WlG0WQYwwhJ7mjui2xtiePQSXw==}
+
   decode-named-character-reference@1.0.2:
     resolution: {integrity: sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==}
 
@@ -3365,6 +3392,9 @@ packages:
     resolution: {integrity: sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==}
     engines: {node: '>=12'}
 
+  intl-messageformat@10.7.15:
+    resolution: {integrity: sha512-LRyExsEsefQSBjU2p47oAheoKz+EOJxSLDdjOaEjdriajfHsMXOmV/EhMvYSg9bAgCUHasuAC+mcUBe/95PfIg==}
+
   is-alphabetical@2.0.1:
     resolution: {integrity: sha512-FWyyY60MeTNyeSRpkM2Iry0G9hpr7/9kD40mD/cGQEuilcZYS4okz8SN2Q6rLCJ8gbCt6fN+rC+6tMGS99LaxQ==}
 
@@ -3887,6 +3917,16 @@ packages:
   natural-compare@1.4.0:
     resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
 
+  negotiator@1.0.0:
+    resolution: {integrity: sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==}
+    engines: {node: '>= 0.6'}
+
+  next-intl@3.26.5:
+    resolution: {integrity: sha512-EQlCIfY0jOhRldiFxwSXG+ImwkQtDEfQeSOEQp6ieAGSLWGlgjdb/Ck/O7wMfC430ZHGeUKVKax8KGusTPKCgg==}
+    peerDependencies:
+      next: ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0 || ^14.0.0 || ^15.0.0
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || >=19.0.0-rc <19.0.0 || ^19.0.0
+
   next-themes@0.4.4:
     resolution: {integrity: sha512-LDQ2qIOJF0VnuVrrMSMLrWGjRMkq+0mpgl6e0juCLqdJ+oo8Q84JRWT6Wh11VDQKkMMe+dVzDKLWs5n87T+PkQ==}
     peerDependencies:
@@ -4987,6 +5027,11 @@ packages:
       '@types/react':
         optional: true
 
+  use-intl@3.26.5:
+    resolution: {integrity: sha512-OdsJnC/znPvHCHLQH/duvQNXnP1w0hPfS+tkSi3mAbfjYBGh4JnyfdwkQBfIVf7t8gs9eSX/CntxUMvtKdG2MQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || >=19.0.0-rc <19.0.0 || ^19.0.0
+
   use-sidecar@1.1.3:
     resolution: {integrity: sha512-Fedw0aZvkhynoPYlA5WXrMCAMm+nSWdZt6lzJQ7Ok8S6Q+VsHmHpRWndVRJ8Be0ZbkfPc5LRYH+5XrzXcEeLRQ==}
     engines: {node: '>=10'}
@@ -5366,6 +5411,36 @@ snapshots:
 
   '@floating-ui/utils@0.2.9': {}
 
+  '@formatjs/ecma402-abstract@2.3.3':
+    dependencies:
+      '@formatjs/fast-memoize': 2.2.6
+      '@formatjs/intl-localematcher': 0.6.0
+      decimal.js: 10.5.0
+      tslib: 2.8.1
+
+  '@formatjs/fast-memoize@2.2.6':
+    dependencies:
+      tslib: 2.8.1
+
+  '@formatjs/icu-messageformat-parser@2.11.1':
+    dependencies:
+      '@formatjs/ecma402-abstract': 2.3.3
+      '@formatjs/icu-skeleton-parser': 1.8.13
+      tslib: 2.8.1
+
+  '@formatjs/icu-skeleton-parser@1.8.13':
+    dependencies:
+      '@formatjs/ecma402-abstract': 2.3.3
+      tslib: 2.8.1
+
+  '@formatjs/intl-localematcher@0.5.10':
+    dependencies:
+      tslib: 2.8.1
+
+  '@formatjs/intl-localematcher@0.6.0':
+    dependencies:
+      tslib: 2.8.1
+
   '@hexagon/base64@1.1.28': {}
 
   '@hookform/resolvers@4.1.2(react-hook-form@7.54.2(react@19.0.0))':
@@ -7264,6 +7339,8 @@ snapshots:
 
   decimal.js-light@2.5.1: {}
 
+  decimal.js@10.5.0: {}
+
   decode-named-character-reference@1.0.2:
     dependencies:
       character-entities: 2.0.2
@@ -8142,6 +8219,13 @@ snapshots:
 
   internmap@2.0.3: {}
 
+  intl-messageformat@10.7.15:
+    dependencies:
+      '@formatjs/ecma402-abstract': 2.3.3
+      '@formatjs/fast-memoize': 2.2.6
+      '@formatjs/icu-messageformat-parser': 2.11.1
+      tslib: 2.8.1
+
   is-alphabetical@2.0.1: {}
 
   is-alphanumerical@2.0.1:
@@ -8790,6 +8874,16 @@ snapshots:
 
   natural-compare@1.4.0: {}
 
+  negotiator@1.0.0: {}
+
+  next-intl@3.26.5(next@15.2.0(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0):
+    dependencies:
+      '@formatjs/intl-localematcher': 0.5.10
+      negotiator: 1.0.0
+      next: 15.2.0(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      react: 19.0.0
+      use-intl: 3.26.5(react@19.0.0)
+
   next-themes@0.4.4(react-dom@19.0.0(react@19.0.0))(react@19.0.0):
     dependencies:
       react: 19.0.0
@@ -10078,6 +10172,12 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  use-intl@3.26.5(react@19.0.0):
+    dependencies:
+      '@formatjs/fast-memoize': 2.2.6
+      intl-messageformat: 10.7.15
+      react: 19.0.0
+
   use-sidecar@1.1.3(@types/react@19.0.10)(react@19.0.0):
     dependencies:
       detect-node-es: 1.1.0