@live-change/user-frontend 0.9.130 → 0.9.132

package/front/locales/en.json

@@ -1,4 +1,46 @@
 {
+  "auth": {
+    "welcomeBack": "Welcome Back",
+    "dontHaveAccount": "Don't have an account?",
+    "createToday": "Create today!",
+    "emailAddress": "Email address",
+    "passwordOptional": "Password (optional)",
+    "forgotPassword": "Forgot password?",
+    "signIn": "Sign In",
+    "signInWith": "Sign In with {provider}",
+    "signUp": "Sign Up",
+    "signUpWith": "Sign Up with {provider}",
+    "currentPassword": "Current password",
+    "newPassword": "New password",
+    "reenterPassword": "Re-enter password",
+    "resetPassword": "Reset password",
+    "passwordChanged": "Password changed",
+    "passwordChangedSuccess": "You have successfully set your password.",
+    "passwordResetSuccess": "You have successfully changed your password.",
+    "unknownLink": "Unknown link",
+    "unknownLinkDesc": "We can't find your secret link. Check if you copied the address correctly.",
+    "linkUsed": "Link used",
+    "linkUsedDesc": "This link was already used.",
+    "linkExpired": "Link expired",
+    "linkExpiredDesc": "Your password reset authentication already expired.",
+    "passwordSuggestions": "Suggestions",
+    "suggestionLowercase": "At least one lowercase",
+    "suggestionUppercase": "At least one uppercase",
+    "suggestionNumeric": "At least one numeric",
+    "alreadyHaveAccount": "Already have an account?",
+    "signInToday": "Sign in today!",
+    "signUpWithEmail": "Sign Up with email",
+    "privacyConsent": "By providing your email address or google account, you consent to its processing solely for registration and account verification purposes, in accordance with our",
+    "privacyPolicy": "Privacy Policy",
+    "authenticating": "Authenticating...",
+    "authentication": "Authentication",
+    "authenticationCanceled": "Authentication canceled by user",
+    "authenticationError": "Error during authentication",
+    "goBack": "Go back",
+    "tryAgain": "Try again",
+    "confirmEmail": "Confirm email",
+    "confirmPhone": "Confirm phone"
+  },
   "errors": {
     "emailTaken": "Email is already registered, try to sign-in.",
     "phoneTaken": "Phone is already registered, try to sign-in.",
@@ -9,9 +51,104 @@
     "unsafePassword": "Password is unsafe, try to use a stronger one.",
     "passwordNotMatch": "Passwords do not match."
   },
+  "common": {
+    "or": "OR",
+    "error": "Error",
+    "success": "Success",
+    "cancel": "Cancel",
+    "save": "Save",
+    "delete": "Delete",
+    "edit": "Edit",
+    "view": "View",
+    "close": "Close",
+    "testIndex": "Test Index",
+    "addTestNotification": "Add test notification"
+  },
   "app": {
     "updateAvailable": "Update available!",
     "newVersions": "New version of app is available!",
     "reload": "Reload"
+  },
+  "settings": {
+    "settings": "SETTINGS",
+    "identification": "Identification",
+    "generalSettings": "General Settings",
+    "languageAndLocale": "Language and Locale",
+    "notifications": "Notifications",
+    "authorization": "AUTHORIZATION",
+    "connectedAccounts": "Connected Accounts",
+    "changePassword": "Change Password",
+    "deleteAccount": "Delete Account",
+    "localeSettings": "Locale settings",
+    "language": "Language",
+    "autoDetect": "Auto-detect",
+    "apply": "Apply",
+    "settingsUpdated": "Settings updated",
+    "localeSettingsSaved": "Your locale settings have been saved",
+    "profile": "Profile",
+    "yourName": "Your name",
+    "saveName": "Save name",
+    "imageEditor": "Image Editor",
+    "userImageSaved": "User image saved",
+    "userNameSaved": "User name saved"
+  },
+  "connected": {
+    "connectedAccounts": "Connected accounts",
+    "addContactType": "Add {type}",
+    "addAccountType": "Add {type}",
+    "addEmail": "Add Email",
+    "addPhone": "Add Phone",
+    "addPhoneNumber": "Add phone number",
+    "phoneNumber": "Phone number",
+    "confirmDisconnectContact": "Do you want to disconnect {type} account {contact}?",
+    "confirmDisconnectAccount": "Do you want to disconnect {type} account {account}?",
+    "accountDisconnected": "Account disconnected",
+    "unknownAccount": "Unknown account",
+    "email": "email",
+    "phone": "phone",
+    "google": "Google",
+    "linkedin": "LinkedIn",
+    "github": "GitHub"
+  },
+  "messageAuth": {
+    "authenticationDone": "Authentication done",
+    "authenticatedInDifferentTab": "You authenticated in a different tab.",
+    "code": "Code",
+    "messageSent": "Message sent",
+    "messageSentDescription": "We sent special secret message to the contact you already provided.",
+    "callToAction": "Click on the link or enter the code you found in that message.",
+    "toSendAnotherCode": "To send another code click button below.",
+    "resendSecretCode": "Resend secret code",
+    "codeSent": "Code sent",
+    "newCodeSent": "New code sent to you",
+    "linkExpiredDesc": "Your secret link already expired. To send another link click button below.",
+    "resend": "Resend"
+  },
+  "common": {
+    "or": "OR",
+    "error": "Error",
+    "success": "Success",
+    "cancel": "Cancel",
+    "save": "Save",
+    "delete": "Delete",
+    "edit": "Edit",
+    "view": "View",
+    "close": "Close",
+    "ok": "OK",
+    "testIndex": "Test Index",
+    "addTestNotification": "Add test notification",
+    "rejected": "Rejected",
+    "rejectedDetail": "You have rejected"
+  },
+  "deleteAccount": {
+    "deleteAccount": "Delete account",
+    "warning": "Account deletion is irreversible, check the box below only if you are 100% sure that you want to delete your account.",
+    "confirmCheckbox": "I want to delete my account.",
+    "alreadyDeleted": "Account already deleted.",
+    "accountDeleted": "Account deleted",
+    "feedbackRequest": "Account has been deleted, please leave feedback why you are leaving us.",
+    "send": "Send",
+    "feedbackSent": "Feedback sent",
+    "thankYou": "Thank you for your feedback."
   }
 }

package/front/locales/pl.js

@@ -0,0 +1,34 @@
+import messages from "./pl.json"
+
+import { locales as autoFormLocales } from "@live-change/frontend-auto-form"
+
+export { messages }
+
+export const numberFormats = {
+  "pln": {
+    "style": "currency",
+    "currency": "PLN",
+    "notation": "standard"
+  },
+  "usd": {
+    "style": "currency",
+    "currency": "USD",
+    "notation": "standard"
+  }
+}
+
+export const datetimeFormats = {
+  "short": {
+    "year": "numeric", "month": "short", "day": "numeric"
+  },
+  "shortTime": {
+    "dateStyle": "short", "timeStyle": "short", "hour12": false
+  },
+  "shortestTime": {
+    "month": "numeric", "day": "numeric", "hour": "numeric", "minute": "numeric", "hour12": false
+  },
+  "long": {
+    "year": "numeric", "month": "short", "day": "numeric",
+    "weekday": "short", "hour": "numeric", "minute": "numeric"
+  }
+}

package/front/locales/pl.json

@@ -0,0 +1,154 @@
+{
+  "auth": {
+    "welcomeBack": "Witaj ponownie",
+    "dontHaveAccount": "Nie masz konta?",
+    "createToday": "Utwórz dzisiaj!",
+    "emailAddress": "Adres email",
+    "passwordOptional": "Hasło (opcjonalne)",
+    "forgotPassword": "Zapomniałeś hasła?",
+    "signIn": "Zaloguj się",
+    "signInWith": "Zaloguj się przez {provider}",
+    "signUp": "Zarejestruj się",
+    "signUpWith": "Zarejestruj się przez {provider}",
+    "currentPassword": "Aktualne hasło",
+    "newPassword": "Nowe hasło",
+    "reenterPassword": "Powtórz hasło",
+    "resetPassword": "Resetuj hasło",
+    "passwordChanged": "Hasło zmienione",
+    "passwordChangedSuccess": "Pomyślnie ustawiłeś swoje hasło.",
+    "passwordResetSuccess": "Pomyślnie zmieniłeś swoje hasło.",
+    "unknownLink": "Nieznany link",
+    "unknownLinkDesc": "Nie możemy znaleźć twojego tajnego linku. Sprawdź, czy skopiowałeś adres poprawnie.",
+    "linkUsed": "Link użyty",
+    "linkUsedDesc": "Ten link został już użyty.",
+    "linkExpired": "Link wygasł",
+    "linkExpiredDesc": "Twoja autoryzacja resetu hasła już wygasła.",
+    "passwordSuggestions": "Sugestie",
+    "suggestionLowercase": "Co najmniej jedna mała litera",
+    "suggestionUppercase": "Co najmniej jedna wielka litera",
+    "suggestionNumeric": "Co najmniej jedna cyfra",
+    "alreadyHaveAccount": "Masz już konto?",
+    "signInToday": "Zaloguj się dzisiaj!",
+    "signUpWithEmail": "Zarejestruj się przez email",
+    "privacyConsent": "Podając swój adres email lub konto google, wyrażasz zgodę na jego przetwarzanie wyłącznie w celach rejestracji i weryfikacji konta, zgodnie z naszą",
+    "privacyPolicy": "Polityką Prywatności",
+    "authenticating": "Uwierzytelnianie...",
+    "authentication": "Uwierzytelnianie",
+    "authenticationCanceled": "Uwierzytelnianie anulowane przez użytkownika",
+    "authenticationError": "Błąd podczas uwierzytelniania",
+    "goBack": "Wróć",
+    "tryAgain": "Spróbuj ponownie",
+    "confirmEmail": "Potwierdź email",
+    "confirmPhone": "Potwierdź telefon"
+  },
+  "errors": {
+    "emailTaken": "Email jest już zarejestrowany, spróbuj się zalogować.",
+    "phoneTaken": "Telefon jest już zarejestrowany, spróbuj się zalogować.",
+    "codeNotFound": "Tajny kod nierozpoznany.",
+    "codeExpired": "Tajny kod wygasł.",
+    "wrongPassword": "Błędne hasło.",
+    "emailNotFound": "Email nie znaleziony.",
+    "unsafePassword": "Hasło niebezpieczne, spróbuj użyć silniejszego.",
+    "passwordNotMatch": "Hasła nie pasują."
+  },
+  "common": {
+    "or": "LUB",
+    "error": "Błąd",
+    "success": "Sukces",
+    "cancel": "Anuluj",
+    "save": "Zapisz",
+    "delete": "Usuń",
+    "edit": "Edytuj",
+    "view": "Pokaż",
+    "close": "Zamknij",
+    "testIndex": "Indeks testowy",
+    "addTestNotification": "Dodaj testowe powiadomienie"
+  },
+  "app": {
+    "updateAvailable": "Dostępna aktualizacja!",
+    "newVersions": "Dostępna nowa wersja aplikacji!",
+    "reload": "Odśwież"
+  },
+  "settings": {
+    "settings": "USTAWIENIA",
+    "identification": "Identyfikacja",
+    "generalSettings": "Ustawienia ogólne",
+    "languageAndLocale": "Język i lokalizacja",
+    "notifications": "Powiadomienia",
+    "authorization": "AUTORYZACJA",
+    "connectedAccounts": "Połączone konta",
+    "changePassword": "Zmień hasło",
+    "deleteAccount": "Usuń konto",
+    "localeSettings": "Ustawienia lokalizacji",
+    "language": "Język",
+    "autoDetect": "Automatyczne wykrywanie",
+    "apply": "Zastosuj",
+    "settingsUpdated": "Ustawienia zaktualizowane",
+    "localeSettingsSaved": "Twoje ustawienia lokalizacji zostały zapisane",
+    "profile": "Profil",
+    "yourName": "Twoje imię",
+    "saveName": "Zapisz imię",
+    "imageEditor": "Edytor obrazów",
+    "userImageSaved": "Obraz użytkownika zapisany",
+    "userNameSaved": "Imię użytkownika zapisane"
+  },
+  "connected": {
+    "connectedAccounts": "Połączone konta",
+    "addContactType": "Dodaj {type}",
+    "addAccountType": "Dodaj {type}",
+    "addEmail": "Dodaj Email",
+    "addPhone": "Dodaj Telefon",
+    "addPhoneNumber": "Dodaj numer telefonu",
+    "phoneNumber": "Numer telefonu",
+    "confirmDisconnectContact": "Czy chcesz odłączyć konto {type} {contact}?",
+    "confirmDisconnectAccount": "Czy chcesz odłączyć konto {type} {account}?",
+    "accountDisconnected": "Konto odłączone",
+    "unknownAccount": "Nieznane konto",
+    "email": "email",
+    "phone": "telefon",
+    "google": "Google",
+    "linkedin": "LinkedIn",
+    "github": "GitHub"
+  },
+  "messageAuth": {
+    "authenticationDone": "Uwierzytelnianie zakończone",
+    "authenticatedInDifferentTab": "Uwierzytelniłeś się w innej karcie.",
+    "code": "Kod",
+    "messageSent": "Wiadomość wysłana",
+    "messageSentDescription": "Wysłaliśmy specjalną tajną wiadomość na podany przez Ciebie kontakt.",
+    "callToAction": "Kliknij w link lub wprowadź kod, który znalazłeś w tej wiadomości.",
+    "toSendAnotherCode": "Aby wysłać kolejny kod, kliknij przycisk poniżej.",
+    "resendSecretCode": "Wyślij ponownie tajny kod",
+    "codeSent": "Kod wysłany",
+    "newCodeSent": "Nowy kod został do Ciebie wysłany",
+    "linkExpiredDesc": "Twój tajny link już wygasł. Aby wysłać kolejny link, kliknij przycisk poniżej.",
+    "resend": "Wyślij ponownie"
+  },
+  "common": {
+    "or": "LUB",
+    "error": "Błąd",
+    "success": "Sukces",
+    "cancel": "Anuluj",
+    "save": "Zapisz",
+    "delete": "Usuń",
+    "edit": "Edytuj",
+    "view": "Pokaż",
+    "close": "Zamknij",
+    "ok": "OK",
+    "testIndex": "Indeks testowy",
+    "addTestNotification": "Dodaj testowe powiadomienie",
+    "rejected": "Odrzucone",
+    "rejectedDetail": "Odrzuciłeś"
+  },
+  "deleteAccount": {
+    "deleteAccount": "Usuń konto",
+    "warning": "Usunięcie konta jest nieodwracalne, zaznacz pole poniżej tylko jeśli jesteś w 100% pewny, że chcesz usunąć swoje konto.",
+    "confirmCheckbox": "Chcę usunąć moje konto.",
+    "alreadyDeleted": "Konto już usunięte.",
+    "accountDeleted": "Konto usunięte",
+    "feedbackRequest": "Konto zostało usunięte, zostaw opinię dlaczego nas opuszczasz.",
+    "send": "Wyślij",
+    "feedbackSent": "Opinia wysłana",
+    "thankYou": "Dziękujemy za Twoją opinię."
+  }
+}

package/front/src/Index.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="w-full lg:w-6/12 md:w-9/12">
     <div class="bg-surface-0 dark:bg-surface-900 rounded-border shadow p-6">
-      <div class="text-surface-900 dark:text-surface-0 text-red-500 font-medium mb-4 text-xl">Test Index</div>
+      <div class="text-surface-900 dark:text-surface-0 text-red-500 font-medium mb-4 text-xl">{{ t('common.testIndex') }}</div>
       <div>
-        <Button @click="testNotification" label="Add test notification" />
+        <Button @click="testNotification" :label="t('common.addTestNotification')" />
       </div>
     </div>
   </div>
@@ -12,6 +12,8 @@
 <script setup>
 
   import { useApi } from '@live-change/vue3-ssr'
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
 
   const api = useApi()
 

package/front/src/connected/ConnectEmail.vue

@@ -2,7 +2,7 @@
   <div class="w-full lg:w-6/12 md:w-9/12 max-w-[32rem]" v-shared-element:form="{ duration: '300ms', includeChildren: true }">
     <div class="bg-surface-0 dark:bg-surface-900 p-6 shadow rounded-border">
       <div class="text-center mb-8">
-        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">Add email</div>
+        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">{{ t('connected.addEmail') }}</div>
       </div>
 
       <command-form service="messageAuthentication" action="connectEmail" v-slot="{ data }"
@@ -10,7 +10,7 @@
 
         <div class="p-field mb-4">
           <label for="email" class="block text-surface-900 dark:text-surface-0 font-medium mb-2">
-            Email address
+            {{ t('auth.emailAddress') }}
           </label>
           <InputText id="email" type="text" class="w-full"
                      aria-describedby="email-help" :invalid="!!data.emailError"
@@ -20,14 +20,14 @@
           </Message>
         </div>
 
-        <Button label="Add Email" icon="pi pi-envelope" class="w-full" type="submit" />
+        <Button :label="t('connected.addEmail')" icon="pi pi-envelope" class="w-full" type="submit" />
 
         <Divider align="center" class="my-6">
-          <span class="text-surface-600 dark:text-surface-200 font-normal text-sm">OR</span>
+          <span class="text-surface-600 dark:text-surface-200 font-normal text-sm">{{ t('common.or') }}</span>
         </Divider>
 
         <router-link :to="{ name: 'user:connect-phone' }">
-          <Button label="Add Phone" icon="pi pi-mobile" class="w-full p-button-secondary mb-2" />
+          <Button :label="t('connected.addPhone')" icon="pi pi-mobile" class="w-full p-button-secondary mb-2" />
         </router-link>
 
 <!--        <Button label="Connect GitHub account" icon="pi pi-github" class="w-full p-button-secondary mb-2"></Button>

package/front/src/connected/ConnectPhone.vue

@@ -2,7 +2,7 @@
   <div class="w-full lg:w-6/12 md:w-9/12 max-w-[32rem]" v-shared-element:form="{ duration: '300ms', includeChildren: true }">
     <div class="bg-surface-0 dark:bg-surface-900 p-6 shadow rounded-border">
       <div class="text-center mb-8">
-        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">Add phone number</div>
+        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">{{ t('connected.addPhoneNumber') }}</div>
       </div>
 
       <command-form service="messageAuthentication" action="connectPhone" v-slot="{ data }"
@@ -10,7 +10,7 @@
 
         <div class="p-field mb-4">
           <label for="email" class="block text-surface-900 dark:text-surface-0 font-medium mb-2">
-            Phone number
+            {{ t('connected.phoneNumber') }}
           </label>
           <PhoneInput id="phone" class="w-full"
                      aria-describedby="phone-help" :class="{ 'p-invalid': data.phoneError }"
@@ -20,14 +20,14 @@
           </Message>
         </div>
 
-        <Button label="Add Phone" icon="pi pi-mobile" class="w-full" type="submit" />
+        <Button :label="t('connected.addPhone')" icon="pi pi-mobile" class="w-full" type="submit" />
 
         <Divider align="center" class="my-6">
-          <span class="text-surface-600 dark:text-surface-200 font-normal text-sm">OR</span>
+          <span class="text-surface-600 dark:text-surface-200 font-normal text-sm">{{ t('common.or') }}</span>
         </Divider>
 
         <router-link :to="{ name: 'user:connect-email' }">
-          <Button label="Add Email" icon="pi pi-envelope" class="w-full p-button-secondary mb-2" />
+          <Button :label="t('connected.addEmail')" icon="pi pi-envelope" class="w-full p-button-secondary mb-2" />
         </router-link>
 
 <!--        <Button label="Connect GitHub account" icon="pi pi-github" class="w-full p-button-secondary mb-2"></Button>-->

package/front/src/connected/Connected.vue

@@ -5,7 +5,7 @@
     <Toast v-if="isMounted" />
 
     <div class="bg-surface-0 dark:bg-surface-900 rounded-border shadow p-6">
-      <div class="text-surface-900 dark:text-surface-0 font-medium mb-4 text-xl">Connected accounts</div>
+      <div class="text-surface-900 dark:text-surface-0 font-medium mb-4 text-xl">{{ t('connected.connectedAccounts') }}</div>
 
       <ul class="list-none p-0 m-0 mt-8 mb-6">
 
@@ -40,15 +40,15 @@
         <router-link v-for="contactType in contactsTypes"
                      :to="{ name: 'user:connect-'+contactType.contactType }" class="mr-2 no-underline block mb-1">
           <Button v-if="contactType.contactType === 'email'"
-                  :label="'Add '+contactType.contactType" icon="pi pi-envelope" id="connect" />
+                  :label="t('connected.addEmail')" icon="pi pi-envelope" id="connect" />
           <Button v-else-if="contactType.contactType === 'phone'"
-                  :label="'Add '+contactType.contactType" icon="pi pi-phone" id="connect" />
-          <Button v-else :label="'Add '+contactType.contactType" icon="pi pi-envelope" id="connect" />
+                  :label="t('connected.addPhone')" icon="pi pi-phone" id="connect" />
+          <Button v-else :label="t('connected.addContactType', { type: t(`connected.${contactType.contactType}`) })" icon="pi pi-envelope" id="connect" />
         </router-link>
         <template v-for="accountType in accountTypes">
           <router-link v-if="connectAccountRoute(accountType)"
                       :to="connectAccountRoute(accountType)" class="mr-2 no-underline block mb-1">
-            <Button v :label="'Add '+accountType.accountType" icon="pi pi-google" id="connect" />
+            <Button v :label="t('connected.addAccountType', { type: t(`connected.${accountType.accountType}`) })" icon="pi pi-google" id="connect" />
           </router-link>
         </template>
 
@@ -86,6 +86,9 @@
 
   import { formatPhoneNumber } from '../phone/phoneNumber.js'
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   const workingZone = inject('workingZone')
 
   import { useApi, live, usePath, useActions } from '@live-change/vue3-ssr'
@@ -98,18 +101,18 @@
     const { contactType, id: contact } = contactData
     confirm.require({
       target: event.currentTarget,
-      message: `Do you want to disconnect ${contactType.contactType} account ${contact}?`,
+      message: t('connected.confirmDisconnectContact', { type: t(`connected.${contactType.contactType}`), contact }),
       icon: 'pi pi-info-circle',
       acceptClass: 'p-button-danger',
       accept: async () => {
         const upperCaseType = contactType.contactType[0].toUpperCase() + contactType.contactType.slice(1)
         workingZone.addPromise('disconnectContact', (async () => {
           await messageAuthenticationApi['disconnect'+upperCaseType]({ [contactType.contactType]: contact })
-          toast.add({ severity: 'info', summary: 'Account disconnected', life: 1500 })
+          toast.add({ severity: 'info', summary: t('connected.accountDisconnected'), life: 1500 })
         })())
       },
       reject: () => {
-        toast.add({ severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000 })
+        toast.add({ severity: 'error', summary: t('common.rejected'), detail: t('common.rejectedDetail'), life: 3000 })
       }
     })
   }
@@ -118,18 +121,18 @@
     const { accountType, id: account } = contactData
     confirm.require({
       target: event.currentTarget,
-      message: `Do you want to disconnect ${accountType.accountType} account ${name || account}?`,
+      message: t('connected.confirmDisconnectAccount', { type: t(`connected.${accountType.accountType}`), account: name || account }),
       icon: 'pi pi-info-circle',
       acceptClass: 'p-button-danger',
       accept: async () => {
         const upperCaseType = accountType.accountType[0].toUpperCase() + accountType.accountType.slice(1)
         workingZone.addPromise('disconnectAccount', (async () => {
           await api.actions[accountType.accountType+'Authentication']['disconnect'+upperCaseType]({ account })
-          toast.add({ severity: 'info', summary: 'Account disconnected', life: 1500 })
+          toast.add({ severity: 'info', summary: t('connected.accountDisconnected'), life: 1500 })
         })())
       },
       reject: () => {
-        toast.add({ severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000 })
+        toast.add({ severity: 'error', summary: t('common.rejected'), detail: t('common.rejectedDetail'), life: 3000 })
       }
     })
   }

package/front/src/connected/accountTypes/UnknownAccountItem.vue

@@ -17,8 +17,11 @@
 
   const { account } = toRefs(props)
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   const cleanAccountInfo = computed(() => {
-    if(!account.value) return "Unknown account"
+    if(!account.value) return t('connected.unknownAccount')
     const { accountType, ...rest } = account.value
     return { ...rest, accountType: accountType.accountType }
   })

package/front/src/delete/Delete.vue

@@ -3,24 +3,23 @@
 
     <div class="bg-surface-0 dark:bg-surface-900 p-6 shadow rounded-border">
       <div class="text-center mb-8">
-        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">Delete account</div>
+        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">{{ t('deleteAccount.deleteAccount') }}</div>
       </div>
 
       <div v-if="client.user">
         <p>
-          Account deletion is irreversible, check the box below only if you are
-          100% sure that you want to delete your account.
+          {{ t('deleteAccount.warning') }}
         </p>
         <div class="p-field-checkbox mb-4">
           <Checkbox id="deleteCheckbox" v-model="wantDelete" :binary="true" />
-          <label for="deleteCheckbox" class="ml-2">I want to delete my account.</label>
+          <label for="deleteCheckbox" class="ml-2">{{ t('deleteAccount.confirmCheckbox') }}</label>
         </div>
 
-        <Button id="delete" label="Delete account" icon="pi pi-user-minus" class="p-button-lg"
+        <Button id="delete" :label="t('deleteAccount.deleteAccount')" icon="pi pi-user-minus" class="p-button-lg"
                 :disabled="!wantDelete" @click="deleteUser" />
       </div>
       <div v-else>
-        Account already deleted.
+        {{ t('deleteAccount.alreadyDeleted') }}
       </div>
     </div>
   </div>
@@ -37,6 +36,9 @@
   import { useClient } from '@live-change/vue3-ssr'
   const client = useClient()
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   const workingZone = inject('workingZone')
 
   const wantDelete = ref(false)

package/front/src/delete/DeleteFeedbackSent.vue

@@ -1,14 +1,15 @@
 <template>
   <div class="w-full lg:w-6/12 md:w-9/12 max-w-[32rem]" v-shared-element:form="{ duration: '300ms', includeChildren: true }">
     <div class="bg-surface-0 dark:bg-surface-900 rounded-border shadow p-6">
-      <div class="text-surface-900 dark:text-surface-0 font-medium mb-4 text-xl mb-6">Feedback sent</div>
-      <p class="mt-0 p-0 leading-normal">Thank you for your feedback.</p>
+      <div class="text-surface-900 dark:text-surface-0 font-medium mb-4 text-xl mb-6">{{ t('deleteAccount.feedbackSent') }}</div>
+      <p class="mt-0 p-0 leading-normal">{{ t('deleteAccount.thankYou') }}</p>
     </div>
   </div>
 </template>
 
 <script setup>
-
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
 </script>
 
 <style>

package/front/src/delete/DeleteFinished.vue

@@ -2,16 +2,16 @@
   <div class="w-full lg:w-6/12 md:w-9/12 max-w-[32rem]" v-shared-element:form="{ duration: '300ms', includeChildren: true }">
     <div class="bg-surface-0 dark:bg-surface-900 p-6 shadow rounded-border">
       <div class="text-center mb-8">
-        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">Account deleted</div>
+        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">{{ t('deleteAccount.accountDeleted') }}</div>
       </div>
 
       <div class="mb-4">
-        Account has been deleted, please leave feedback why you are leaving us.
+        {{ t('deleteAccount.feedbackRequest') }}
       </div>
 
       <Textarea class="w-full" :autoResize="true" rows="4" cols="30" />
       <div class="flex flex-row items-end">
-        <Button label="Send" icon="pi pi-send" class="ml-auto p-button-lg"></Button>
+        <Button :label="t('deleteAccount.send')" icon="pi pi-send" class="ml-auto p-button-lg"></Button>
       </div>
 
     </div>
@@ -25,6 +25,9 @@
   import Divider from "primevue/divider"
   import Textarea from "primevue/textarea"
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
 </script>
 
 <style>