@live-change/user-frontend 0.9.177 → 0.9.180

package/front/locales/en.json

@@ -77,8 +77,13 @@
     "edit": "Edit",
     "view": "View",
     "close": "Close",
+    "ok": "OK",
+    "next": "Next",
     "testIndex": "Test Index",
-    "addTestNotification": "Add test notification"
+    "addTestNotification": "Add test notification",
+    "rejected": "Rejected",
+    "rejectedDetail": "You have rejected",
+    "rememberMe": "Remember me"
   },
   "app": {
     "updateAvailable": "Update available!",
@@ -124,7 +129,9 @@
     "phone": "phone",
     "google": "Google",
     "linkedin": "LinkedIn",
-    "github": "GitHub"
+    "github": "GitHub",
+    "accountConnected": "Account connected",
+    "accountConnectedSuccess": "Congratulations! You have successfully connected accounts."
   },
   "messageAuth": {
     "authenticationDone": "Authentication done",
@@ -140,23 +147,6 @@
     "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",
-    "next": "Next",
-    "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.",
@@ -235,5 +225,55 @@
     "openLink": "Or open authentication link:",
     "seeYouSoon": "See you soon",
     "teamSignature": "{brandName} Team"
+  },
+  "googleAuth": {
+    "title": "Google authentication",
+    "canceled": "Authentication canceled by user",
+    "waiting": "Waiting for server...",
+    "waitingForRedirect": "Authentication will open in this window.",
+    "error": "Error during authentication",
+    "errorWithColon": "Error during authentication:",
+    "unknownState": "Unknown authentication state: {state}",
+    "emailTaken": "Your account was created using email address. If you want to connect your Google account, you need to sign in with this email address. And connect your Google account using {link}.",
+    "emailTakenLink": "connected accounts page",
+    "invalidGrant": "Invalid grant. Please try again. You may used this link before, or google authentication failed.",
+    "connectedToAnotherUser": "This account is already connected to another user. Please sign in with your email address or google account.",
+    "emailAlreadyInUse": "Email is already in use",
+    "invalidGrantToast": "Invalid grant",
+    "connectedToAnotherUserToast": "Connected to another user",
+    "errorToast": "Error during google authentication"
+  },
+  "linkedinAuth": {
+    "title": "Linkedin authentication",
+    "canceled": "Authentication canceled by user",
+    "waiting": "Waiting for server...",
+    "waitingForRedirect": "Authentication will open in this window.",
+    "error": "Error during authentication",
+    "errorWithColon": "Error during authentication:",
+    "unknownState": "Unknown authentication state: {state}",
+    "errorToast": "Error during linkedin authentication"
+  },
+  "googleAccess": {
+    "title": "Google API Access",
+    "currentAccess": "You are currently granting us access to the following Google API features:",
+    "needAccess": "To use this feature, you need to grant us access to the Google APIs listed below:",
+    "clickButton": "Click the button below to go to the Google page where you can grant access.",
+    "authenticationButton": "Google Authentication",
+    "gainedTitle": "Signed In",
+    "gainedMessage": "Congratulations! You added offline access to your account. Now your account have access to:",
+    "next": "Next",
+    "redirectIn": "Redirect in {seconds}...",
+    "returnToIndex": "Return to {link}.",
+    "indexPage": "index page",
+    "signedInToast": "Signed in",
+    "signedInToastDetail": "Congratulations! You have successfully logged in to your account."
+  },
+  "password": {
+    "suggestions": "Suggestions",
+    "resetPasswordButton": "Reset password"
+  },
+  "signOut": {
+    "title": "Sign Out",
+    "signingOut": "Signing out"
   }
 }

package/front/locales/pl.json

@@ -77,8 +77,13 @@
     "edit": "Edytuj",
     "view": "Pokaż",
     "close": "Zamknij",
+    "ok": "OK",
+    "next": "Dalej",
     "testIndex": "Indeks testowy",
-    "addTestNotification": "Dodaj testowe powiadomienie"
+    "addTestNotification": "Dodaj testowe powiadomienie",
+    "rejected": "Odrzucone",
+    "rejectedDetail": "Odrzuciłeś",
+    "rememberMe": "Zapamiętaj mnie"
   },
   "app": {
     "updateAvailable": "Dostępna aktualizacja!",
@@ -124,7 +129,9 @@
     "phone": "telefon",
     "google": "Google",
     "linkedin": "LinkedIn",
-    "github": "GitHub"
+    "github": "GitHub",
+    "accountConnected": "Konto połączone",
+    "accountConnectedSuccess": "Gratulacje! Pomyślnie połączyłeś konta."
   },
   "messageAuth": {
     "authenticationDone": "Uwierzytelnianie zakończone",
@@ -140,23 +147,6 @@
     "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",
-    "next": "Dalej",
-    "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.",
@@ -235,5 +225,55 @@
     "openLink": "Lub otwórz link uwierzytelniania:",
     "seeYouSoon": "Do zobaczenia",
     "teamSignature": "Zespół {brandName}"
+  },
+  "googleAuth": {
+    "title": "Uwierzytelnianie Google",
+    "canceled": "Uwierzytelnianie anulowane przez użytkownika",
+    "waiting": "Oczekiwanie na serwer...",
+    "waitingForRedirect": "Uwierzytelnianie otworzy się w tym oknie.",
+    "error": "Błąd podczas uwierzytelniania",
+    "errorWithColon": "Błąd podczas uwierzytelniania:",
+    "unknownState": "Nieznany stan uwierzytelniania: {state}",
+    "emailTaken": "Twoje konto zostało utworzone przy użyciu adresu email. Jeśli chcesz połączyć swoje konto Google, musisz zalogować się tym adresem email. I połączyć swoje konto Google używając {link}.",
+    "emailTakenLink": "strony połączonych kont",
+    "invalidGrant": "Nieprawidłowy grant. Spróbuj ponownie. Możesz użyć tego linku wcześniej lub uwierzytelnianie Google nie powiodło się.",
+    "connectedToAnotherUser": "To konto jest już połączone z innym użytkownikiem. Zaloguj się swoim adresem email lub kontem Google.",
+    "emailAlreadyInUse": "Email jest już w użyciu",
+    "invalidGrantToast": "Nieprawidłowy grant",
+    "connectedToAnotherUserToast": "Połączone z innym użytkownikiem",
+    "errorToast": "Błąd podczas uwierzytelniania Google"
+  },
+  "linkedinAuth": {
+    "title": "Uwierzytelnianie LinkedIn",
+    "canceled": "Uwierzytelnianie anulowane przez użytkownika",
+    "waiting": "Oczekiwanie na serwer...",
+    "waitingForRedirect": "Uwierzytelnianie otworzy się w tym oknie.",
+    "error": "Błąd podczas uwierzytelniania",
+    "errorWithColon": "Błąd podczas uwierzytelniania:",
+    "unknownState": "Nieznany stan uwierzytelniania: {state}",
+    "errorToast": "Błąd podczas uwierzytelniania LinkedIn"
+  },
+  "googleAccess": {
+    "title": "Dostęp do Google API",
+    "currentAccess": "Obecnie udzielasz nam dostępu do następujących funkcji Google API:",
+    "needAccess": "Aby użyć tej funkcji, musisz udzielić nam dostępu do wymienionych poniżej Google API:",
+    "clickButton": "Kliknij przycisk poniżej, aby przejść do strony Google, gdzie możesz udzielić dostępu.",
+    "authenticationButton": "Uwierzytelnianie Google",
+    "gainedTitle": "Zalogowany",
+    "gainedMessage": "Gratulacje! Dodałeś dostęp offline do swojego konta. Teraz Twoje konto ma dostęp do:",
+    "next": "Dalej",
+    "redirectIn": "Przekierowanie za {seconds}...",
+    "returnToIndex": "Wróć do {link}.",
+    "indexPage": "strony głównej",
+    "signedInToast": "Zalogowany",
+    "signedInToastDetail": "Gratulacje! Pomyślnie zalogowałeś się do swojego konta."
+  },
+  "password": {
+    "suggestions": "Sugestie",
+    "resetPasswordButton": "Resetuj hasło"
+  },
+  "signOut": {
+    "title": "Wyloguj się",
+    "signingOut": "Wylogowywanie"
   }
 }

package/front/src/connected/ConnectFinished.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-6 text-xl">Account connected</div>
-      <div class="mt-0 p-0 leading-normal">Congratulations! You have successfully connected accounts.</div>
+      <div class="text-surface-900 dark:text-surface-0 font-medium mb-6 text-xl">{{ t('connected.accountConnected') }}</div>
+      <div class="mt-0 p-0 leading-normal">{{ t('connected.accountConnectedSuccess') }}</div>
     </div>
   </div>
 </template>
 
 <script setup>
-
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
 </script>
 
 <style>

package/front/src/connected/Connected.vue

@@ -152,12 +152,12 @@
 
   await Promise.all([ ...contactPromises, ...accountPromises ])
 
-  const contacts = computed(() => contactsTypes.map((c,i) => c.contacts.value.map(v => ({
+  const contacts = computed(() => contactsTypes.map((c,i) => (c.contacts.value || []).map(v => ({
     contactType: c,
     ...(v)
   }))).flat())
 
-  const accounts = computed(() => accountTypes.map((c,i) => c.accounts.value.map(v => ({
+  const accounts = computed(() => accountTypes.map((c,i) => (c.accounts.value || []).map(v => ({
     accountType: c,
     ...(v)
   }))).flat())

package/front/src/google-access/GoogleAccess.vue

@@ -1,10 +1,10 @@
 <template>
   <div v-if="additionalScopes.length > 0" class="w-full flex flex-row justify-center">
     <div class="bg-surface-0 dark:bg-surface-900 rounded-border shadow p-6 w-[30rem]">
-      <div class="text-surface-900 dark:text-surface-0 font-medium mb-4 text-xl mb-6">Google API Access</div>
+      <div class="text-surface-900 dark:text-surface-0 font-medium mb-4 text-xl mb-6">{{ t('googleAccess.title') }}</div>
       <div v-if="currentAccess.length > 0">
         <p class="mt-0 p-0 leading-normal">
-          You are currently granting us access to the following Google API features:
+          {{ t('googleAccess.currentAccess') }}
         </p>
         <ul>
           <li v-for="scope in currentAccess">
@@ -14,7 +14,7 @@
       </div>
       <div>
         <p>
-          To use this feature, you need to grant us access to the Google APIs listed below:
+          {{ t('googleAccess.needAccess') }}
         </p>
         <ul>
           <li v-for="scope in additionalScopes" class="font-semibold text-gray-700">
@@ -22,7 +22,7 @@
           </li>
         </ul>
         <p>
-          Click the button below to go to the Google page where you can grant access.
+          {{ t('googleAccess.clickButton') }}
         </p>
       </div>
       <router-link
@@ -32,7 +32,7 @@
           accessType: 'offline',
           scopes: allScopes
         } }">
-        <Button icon="pi pi-key" label="Google Authentication" />
+        <Button icon="pi pi-key" :label="t('googleAccess.authenticationButton')" />
       </router-link>
     </div>
   </div>
@@ -43,6 +43,9 @@
 
   import Button from 'primevue/button'
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   import { onMounted, ref } from 'vue'
   const isMounted = ref(false)
   onMounted(() => isMounted.value = true)

package/front/src/google-access/GoogleAccessGained.vue

@@ -1,9 +1,9 @@
 <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">Signed In</div>
+      <div class="text-surface-900 dark:text-surface-0 font-medium mb-4 text-xl mb-6">{{ t('googleAccess.gainedTitle') }}</div>
       <p class="mt-0 p-0 leading-normal">
-        Congratulations! You added offline access to your account. Now your account have access to:
+        {{ t('googleAccess.gainedMessage') }}
         <ul>
           <li v-for="access in accessList">
             {{ access }}
@@ -13,14 +13,18 @@
       </p>
       <div v-if="afterGoogleAccessGained" class="flex flex-row items-center">
         <router-link :to="afterGoogleAccessGained" class="no-underline">
-          <Button label="Next" v-ripple />
+          <Button :label="t('googleAccess.next')" v-ripple />
         </router-link>
         <p class="ml-6" v-if="isMounted && redirectTime">
-          Redirect in {{ pluralize('second', Math.ceil((redirectTime - currentTime) / 1000), true) }}...
+          {{ t('googleAccess.redirectIn', { seconds: pluralize('second', Math.ceil((redirectTime - currentTime) / 1000), true) }) }}
         </p>
       </div>
       <div v-else>
-        Return to <router-link to="/">index page</router-link>.
+        <i18n-t keypath="googleAccess.returnToIndex" tag="span">
+          <template #link>
+            <router-link to="/">{{ t('googleAccess.indexPage') }}</router-link>
+          </template>
+        </i18n-t>
       </div>
     </div>
   </div>
@@ -30,6 +34,9 @@
 
   import Button from 'primevue/button'
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   import { onMounted, ref } from 'vue'
   const isMounted = ref(false)
   onMounted(() => isMounted.value = true)
@@ -43,6 +50,9 @@
   import { usePath, live, useApi } from "@live-change/vue3-ssr"
   const api = useApi()
 
+  import { useToast } from 'primevue/usetoast'
+  const toast = useToast()
+
   const userClientConfig = api.getServiceDefinition('user')?.clientConfig
 
   import pluralize from 'pluralize'
@@ -68,8 +78,8 @@
         setTimeout(() => { // it could be next tick
           toast.add({
             severity: 'info', life: 6000,
-            summary: 'Signed in',
-            detail: 'Congratulations! You have successfully logged in to your account.'
+            summary: t('googleAccess.signedInToast'),
+            detail: t('googleAccess.signedInToastDetail')
           })
           router.push(route)
         }, 100)

package/front/src/password/ResetPasswordForm.vue

@@ -33,12 +33,12 @@
                       v-model="data.passwordHash">
               <template #footer>
                 <Divider />
-                <p class="p-mt-2">Suggestions</p>
+                <p class="p-mt-2">{{ t('password.suggestions') }}</p>
                 <ul class="p-pl-2 p-ml-2 p-mt-0" style="line-height: 1.5">
-                  <li>At least one lowercase</li>
-                  <li>At least one uppercase</li>
-                  <li>At least one numeric</li>
-                  <li>Minimum 8 characters</li>
+                  <li>{{ t('auth.suggestionLowercase') }}</li>
+                  <li>{{ t('auth.suggestionUppercase') }}</li>
+                  <li>{{ t('auth.suggestionNumeric') }}</li>
+                  <li>{{ t('auth.suggestionMinLength') }}</li>
                 </ul>
               </template>
             </Password>
@@ -56,7 +56,7 @@
 
         </template>
 
-        <Button type="submit" label="Reset password" icon="pi pi-key" class="w-full"></Button>
+        <Button type="submit" :label="t('password.resetPasswordButton')" icon="pi pi-key" class="w-full"></Button>
 
       </command-form>
     </div>

package/front/src/sign/GoogleAuth.vue

@@ -3,28 +3,28 @@
     <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">Google authentication</div>
+        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">{{ t('googleAuth.title') }}</div>
       </div>
 
       <div v-if="state === 'canceled'" class="text-center">
-        <div>Authentication canceled by user</div>
+        <div>{{ t('googleAuth.canceled') }}</div>
         <div class="flex flex-row">
-          <Button @click="back" label="Go back" icon="pi pi-arrow-left" class="w-full p-button-secondary mb-1" />
-          <Button @click="googleAuth" label="Try again" icon="pi pi-google" class="w-full p-button-secondary mb-1" />
+          <Button @click="back" :label="t('auth.goBack')" icon="pi pi-arrow-left" class="w-full p-button-secondary mb-1" />
+          <Button @click="googleAuth" :label="t('auth.tryAgain')" icon="pi pi-google" class="w-full p-button-secondary mb-1" />
         </div>
       </div>
       <div v-else-if="state === 'waiting'" class="text-center">
-        Authentication will open in this window.
+        {{ t('googleAuth.waitingForRedirect') }}
       </div>
       <div v-else-if="state === 'working'" class="text-center">
-        Waiting for server...
+        {{ t('googleAuth.waiting') }}
       </div>
       <div v-else-if="state === 'error'" class="text-center">
-        <div>Error during authentication:</div>
+        <div>{{ t('googleAuth.errorWithColon') }}</div>
         <div>{{ error }}</div>
       </div>
       <div v-else>
-        Unknown authentication state: {{ state }}
+        {{ t('googleAuth.unknownState', { state }) }}
       </div>
 
     </div>
@@ -37,6 +37,9 @@
   import { useRouter } from 'vue-router'
   const router = useRouter()
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   const workingZone = inject('workingZone')
 
   import { googleAuthRedirect } from '../utils/googleAuth.js'
@@ -66,6 +69,8 @@
   function googleAuth() {
     state.value = 'waiting'
 
+    localStorage.googleAuthScopes = JSON.stringify(scopes.value)
+
     workingZone.addPromise('google auth', new Promise((resolve, reject) => {
       setTimeout(() => {
         state.value = 'error'

package/front/src/sign/GoogleAuthReturn.vue

@@ -3,32 +3,48 @@
     <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">Google authentication</div>
+        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">{{ t('googleAuth.title') }}</div>
       </div>
 
       <div v-if="state === 'canceled'" class="text-center">
-        <div>Authentication canceled by user</div>
+        <div>{{ t('googleAuth.canceled') }}</div>
         <div class="flex flex-row">
-          <Button @click="back" label="Go back" icon="pi pi-arrow-left"
+          <Button @click="back" :label="t('auth.goBack')" icon="pi pi-arrow-left"
                   class="w-full p-button-secondary mb-1" />
         </div>
       </div>
       <div v-else-if="state === 'working'" class="text-center">
-        Waiting for server...
+        {{ t('googleAuth.waiting') }}
       </div>
       <div v-else-if="state === 'error'" class="text-center">
-        <div>Error during authentication</div>
+        <div>{{ t('googleAuth.error') }}</div>
         <div>{{ error }}</div>
       </div>
       <div v-else-if="state === 'emailTaken'" class="text-center">
         <div>
-          Your account was created using email address. If you want to connect your Google account, 
-          you need to sign in with this email address. And connect your Google account using 
-          <router-link :to="{ name: 'user:connected' }">connected accounts page</router-link>.
+          <i18n-t keypath="googleAuth.emailTaken" tag="span">
+            <template #link>
+              <router-link :to="{ name: 'user:connected' }">{{ t('googleAuth.emailTakenLink') }}</router-link>
+            </template>
+          </i18n-t>
+        </div>
+      </div>
+      <div v-else-if="state === 'invalidGrant'" class="text-center">
+        <div>
+          {{ t('googleAuth.invalidGrant') }}
+          <div class="flex flex-row">
+            <Button @click="back" :label="t('auth.goBack')" icon="pi pi-arrow-left" class="w-full p-button-secondary mb-1" />
+            <Button @click="googleAuth" :label="t('auth.tryAgain')" icon="pi pi-google" class="w-full p-button-secondary mb-1" />
+          </div>
+        </div>
+      </div>
+      <div v-else-if="state === 'connectedToAnotherUser'" class="text-center">
+        <div>
+          {{ t('googleAuth.connectedToAnotherUser') }}
         </div>
       </div>
       <div v-else>
-        Unknown authentication state: {{ state }}
+        {{ t('googleAuth.unknownState', { state }) }}
       </div>
 
     </div>
@@ -44,6 +60,9 @@
   import { useToast } from 'primevue/usetoast'
   const toast = useToast()
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   const workingZone = inject('workingZone')
 
   import { useRouter, useRoute } from 'vue-router'
@@ -81,6 +100,7 @@
         while(user && api.client.value.user !== user) {
           await new Promise(resolve => setTimeout(resolve, 100))
         }
+        localStorage.removeItem('googleAuthScopes')
         if(actionDone === 'signIn') {
           router.push({ name: 'user:signInFinished' })
         } else if(actionDone === 'signUp') {
@@ -94,12 +114,22 @@
         }
       } catch(err) {
         if(err?.properties?.email == 'emailTaken') {
-          toast.add({ severity: 'error', summary: 'Error', detail: 'Email is already in use', life: 3000 })
+          toast.add({ severity: 'error', summary: t('common.error'), detail: t('googleAuth.emailAlreadyInUse'), life: 3000 })
           state.value = 'emailTaken'
           return
         }
+        if((typeof err == 'string') && err.startsWith('invalid_grant')) {
+          toast.add({ severity: 'error', summary: t('common.error'), detail: t('googleAuth.invalidGrantToast'), life: 3000 })
+          state.value = 'invalidGrant'
+          return
+        }
+        if(err === 'connectedToAnotherUser') {
+          toast.add({ severity: 'error', summary: t('common.error'), detail: t('googleAuth.connectedToAnotherUserToast'), life: 3000 })
+          state.value = 'connectedToAnotherUser'
+          return
+        }
         console.error("Google auth error", err)
-        toast.add({ severity: 'error', summary: 'Error', detail: 'Error during google authentication', life: 3000 })
+        toast.add({ severity: 'error', summary: t('common.error'), detail: t('googleAuth.errorToast'), life: 3000 })
         state.value = 'error' 
         error.value = err
       } 
@@ -110,6 +140,15 @@
     router.go(-1)
   }
 
+  async function googleAuth() {
+    if(localStorage.googleAuthScopes) {
+      const scopes = JSON.parse(localStorage.googleAuthScopes)
+      router.push({ name: 'user:googleAuthScopes', params: { action: action.value, accessType: 'offline', scopes: scopes } })
+    } else {
+      router.push({ name: 'user:googleAuth', params: { action: action.value } })
+    }
+  }
+
 </script>
 
 <style scoped>

package/front/src/sign/LinkedinAuth.vue

@@ -3,28 +3,28 @@
     <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">Linkedin authentication</div>
+        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">{{ t('linkedinAuth.title') }}</div>
       </div>
 
       <div v-if="state === 'canceled'" class="text-center">
-        <div class="mb-1">Authentication canceled by user</div>
+        <div class="mb-1">{{ t('linkedinAuth.canceled') }}</div>
         <div class="flex flex-row">
-          <Button @click="back" label="Go back" icon="pi pi-arrow-left" class="w-full p-button-secondary mb-1" />
-          <Button @click="linkedinAuth" label="Try again" icon="pi pi-linkedin" class="w-full p-button-secondary mb-1" />
+          <Button @click="back" :label="t('auth.goBack')" icon="pi pi-arrow-left" class="w-full p-button-secondary mb-1" />
+          <Button @click="linkedinAuth" :label="t('auth.tryAgain')" icon="pi pi-linkedin" class="w-full p-button-secondary mb-1" />
         </div>
       </div>
       <div v-else-if="state === 'waiting'" class="text-center">
-        Authentication will open in this window.
+        {{ t('linkedinAuth.waitingForRedirect') }}
       </div>
       <div v-else-if="state === 'working'" class="text-center">
-        Waiting for server...
+        {{ t('linkedinAuth.waiting') }}
       </div>
       <div v-else-if="state === 'error'" class="text-center">
-        <div>Error during authentication:</div>
+        <div>{{ t('linkedinAuth.errorWithColon') }}</div>
         <div>{{ error }}</div>
       </div>
       <div v-else>
-        Unknown authentication state: {{ state }}
+        {{ t('linkedinAuth.unknownState', { state }) }}
       </div>
 
     </div>
@@ -37,6 +37,9 @@
   import { useRouter } from 'vue-router'
   const router = useRouter()
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   const workingZone = inject('workingZone')
 
   import { linkedinAuthRedirect } from '../utils/linkedinAuth.js'

package/front/src/sign/LinkedinAuthReturn.vue

@@ -3,25 +3,25 @@
     <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">Linkedin authentication</div>
+        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">{{ t('linkedinAuth.title') }}</div>
       </div>
 
       <div v-if="state === 'canceled'" class="text-center">
-        <div class="mb-2 text-red-500">Authentication canceled by user</div>
+        <div class="mb-2 text-red-500">{{ t('linkedinAuth.canceled') }}</div>
         <div class="flex flex-row">
-          <Button @click="back" label="Go back" icon="pi pi-arrow-left"
+          <Button @click="back" :label="t('auth.goBack')" icon="pi pi-arrow-left"
                   class="w-full p-button-secondary mb-1" />
         </div>
       </div>
       <div v-else-if="state === 'working'" class="text-center">
-        Waiting for server...
+        {{ t('linkedinAuth.waiting') }}
       </div>
       <div v-else-if="state === 'error'" class="text-center">
-        <div>Error during authentication</div>
+        <div>{{ t('linkedinAuth.error') }}</div>
         <div>{{ error }}</div>
       </div>
       <div v-else>
-        Unknown authentication state: {{ state }}
+        {{ t('linkedinAuth.unknownState', { state }) }}
       </div>
 
     </div>
@@ -37,6 +37,9 @@
   import { useToast } from 'primevue/usetoast'
   const toast = useToast()
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   const workingZone = inject('workingZone')
 
   import { useRouter, useRoute } from 'vue-router'
@@ -88,7 +91,7 @@
       }
     } catch(error) {
       console.error("Linkedin auth error", error)
-      toast.add({ severity: 'error', summary: 'Error', detail: 'Error during linkedin authentication', life: 3000 })
+      toast.add({ severity: 'error', summary: t('common.error'), detail: t('linkedinAuth.errorToast'), life: 3000 })
       state.value = 'error'
       error.value = error
     }

package/front/src/sign/SignOut.vue

@@ -1,8 +1,8 @@
 <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">Sign Out</div>
-      <p class="mt-0 p-0 leading-normal">Signing out</p>
+      <div class="text-surface-900 dark:text-surface-0 font-medium mb-4 text-xl mb-6">{{ t('signOut.title') }}</div>
+      <p class="mt-0 p-0 leading-normal">{{ t('signOut.signingOut') }}</p>
       <ProgressSpinner v-if="isMounted" class="m-4" />
     </div>
   </div>
@@ -11,6 +11,9 @@
 <script setup>
   import ProgressSpinner from "primevue/progressspinner"
 
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+
   import { onMounted, ref } from 'vue'
   const isMounted = ref(false)
   onMounted(() => isMounted.value = true)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@live-change/user-frontend",
-  "version": "0.9.177",
+  "version": "0.9.180",
   "scripts": {
     "memDev": "tsx --inspect --expose-gc server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
     "localDevInit": "tsx server/start.js localDev --enableSessions --initScript ./init.js --dbAccess",
@@ -36,29 +36,29 @@
   },
   "type": "module",
   "dependencies": {
-    "@live-change/cli": "^0.9.177",
-    "@live-change/dao": "^0.9.177",
-    "@live-change/dao-vue3": "^0.9.177",
-    "@live-change/dao-websocket": "^0.9.177",
-    "@live-change/email-service": "^0.9.177",
-    "@live-change/framework": "^0.9.177",
-    "@live-change/identicon-service": "^0.9.177",
-    "@live-change/image-frontend": "^0.9.177",
-    "@live-change/message-authentication-service": "^0.9.177",
-    "@live-change/notification-service": "^0.9.177",
-    "@live-change/password-authentication-service": "^0.9.177",
-    "@live-change/pattern": "^0.9.177",
-    "@live-change/secret-code-service": "^0.9.177",
-    "@live-change/secret-link-service": "^0.9.177",
-    "@live-change/security-frontend": "^0.9.177",
-    "@live-change/security-service": "^0.9.177",
-    "@live-change/session-service": "^0.9.177",
-    "@live-change/timer-service": "^0.9.177",
-    "@live-change/upload-service": "^0.9.177",
-    "@live-change/user-identification-service": "^0.9.177",
-    "@live-change/user-service": "^0.9.177",
-    "@live-change/vue3-components": "^0.9.177",
-    "@live-change/vue3-ssr": "^0.9.177",
+    "@live-change/cli": "^0.9.180",
+    "@live-change/dao": "^0.9.180",
+    "@live-change/dao-vue3": "^0.9.180",
+    "@live-change/dao-websocket": "^0.9.180",
+    "@live-change/email-service": "^0.9.180",
+    "@live-change/framework": "^0.9.180",
+    "@live-change/identicon-service": "^0.9.180",
+    "@live-change/image-frontend": "^0.9.180",
+    "@live-change/message-authentication-service": "^0.9.180",
+    "@live-change/notification-service": "^0.9.180",
+    "@live-change/password-authentication-service": "^0.9.180",
+    "@live-change/pattern": "^0.9.180",
+    "@live-change/secret-code-service": "^0.9.180",
+    "@live-change/secret-link-service": "^0.9.180",
+    "@live-change/security-frontend": "^0.9.180",
+    "@live-change/security-service": "^0.9.180",
+    "@live-change/session-service": "^0.9.180",
+    "@live-change/timer-service": "^0.9.180",
+    "@live-change/upload-service": "^0.9.180",
+    "@live-change/user-identification-service": "^0.9.180",
+    "@live-change/user-service": "^0.9.180",
+    "@live-change/vue3-components": "^0.9.180",
+    "@live-change/vue3-ssr": "^0.9.180",
     "@vueuse/core": "^12.3.0",
     "codeceptjs-assert": "^0.0.5",
     "codeceptjs-video-helper": "0.1.3",
@@ -79,7 +79,7 @@
     "wtfnode": "^0.9.1"
   },
   "devDependencies": {
-    "@live-change/codeceptjs-helper": "^0.9.177",
+    "@live-change/codeceptjs-helper": "^0.9.180",
     "codeceptjs": "^3.6.10",
     "generate-password": "1.7.1",
     "playwright": "1.49.1",
@@ -90,5 +90,5 @@
   "author": "Michał Łaszczewski <michal@laszczewski.pl>",
   "license": "BSD-3-Clause",
   "description": "",
-  "gitHead": "d75c8c63935b7b78623248d255820b1da2676929"
+  "gitHead": "c6ee30c8f36f989714e8fc7ec71daadb895b2b6e"
 }