setup localization for twenty-emails (#9806)

One of the steps to address #8128 

How to test:
Please change the locale in the settings and click on change password
button. A password reset email in the preferred locale will be sent.


![image](https://github.com/user-attachments/assets/2b0c2f81-5c4d-4e49-b021-8ee76e7872f2)

![image](https://github.com/user-attachments/assets/0453e321-e5aa-42ea-beca-86e2e97dbee2)

Todo:
- Remove the hardcoded locales for invitation, warn suspended workspace
email, clean suspended workspace emails
- Need to test invitation, email verification, warn suspended workspace
email, clean suspended workspace emails
- The duration variable `5 minutes` is always in english. Do we need to
do something about that? It does seems odd in case of chinese
translations.

Notes:
- Only tested the password reset , password update notify templates.
- Cant test email verification due to error during sign up `Internal
server error: New workspace setup is disabled`

---------

Co-authored-by: Félix Malfait <felix@twenty.com>

packages/twenty-emails/src/emails/password-update-notify.email.tsx

@@ -1,38 +1,49 @@
-import { format } from 'date-fns';
+import { i18n } from '@lingui/core';
+import { t } from '@lingui/core/macro';
+import { Trans } from '@lingui/react/macro';
 
 import { BaseEmail } from 'src/components/BaseEmail';
 import { CallToAction } from 'src/components/CallToAction';
 import { MainText } from 'src/components/MainText';
 import { Title } from 'src/components/Title';
+import { APP_LOCALES } from 'twenty-shared';
 
 type PasswordUpdateNotifyEmailProps = {
   userName: string;
   email: string;
   link: string;
+  locale: keyof typeof APP_LOCALES;
 };
 
 export const PasswordUpdateNotifyEmail = ({
   userName,
   email,
   link,
+  locale,
 }: PasswordUpdateNotifyEmailProps) => {
-  const helloString = userName?.length > 1 ? `Dear ${userName}` : 'Dear';
+  const helloString = userName?.length > 1 ? t`Dear ${userName}` : t`Hello`;
+  const formattedDate = i18n.date(new Date());
+
   return (
-    <BaseEmail>
-      <Title value="Password updated" />
+    <BaseEmail locale={locale}>
+      <Title value={t`Password updated`} />
       <MainText>
         {helloString},
         <br />
         <br />
-        This is a confirmation that password for your account ({email}) was
-        successfully changed on {format(new Date(), 'MMMM d, yyyy')}.
+        <Trans>
+          This is a confirmation that password for your account ({email}) was
+          successfully changed on {formattedDate}.
+        </Trans>
         <br />
         <br />
-        If you did not initiate this change, please contact your workspace owner
-        immediately.
+        <Trans>
+          If you did not initiate this change, please contact your workspace
+          owner immediately.
+        </Trans>
         <br />
       </MainText>
-      <CallToAction value="Connect to Twenty" href={link} />
+      <CallToAction value={t`Connect to Twenty`} href={link} />
     </BaseEmail>
   );
 };