Add localization support for various components, including dialogs and views, in English, Spanish, and French. Implemented translations for user profile management, payment processes, and creator functionalities. Updated existing components to utilize the new translation system.

frontend/src/views/LoginView.vue

@@ -2,11 +2,9 @@
 import {ref} from 'vue';
 import {GoogleLogin} from "vue3-google-login";
 import {useAuthStore} from '@/stores/authStore.js';
+import {useTranslations} from '@/translations/translations';
 
-import {useFacebookLogin} from "@/composables/useFacebookLogin";
-import Facebook from "@/views/svg/Facebook.vue";
-
-const {loginWithFacebook} = useFacebookLogin();
+const t = useTranslations();
 
 const authStore = useAuthStore();
 
@@ -22,21 +20,14 @@ async function googleCallback(token) {
 </script>
 
 <template>
-
   <div class="flex min-h-full justify-center items-center p-20 w-full">
-
     <div class="card justify-items-center">
-
-      <img alt="hutopy login"
+      <img :alt="t('alt')"
            src="/images/hutopymedia/loginpage/hutopylogin.svg"/>
-
-
       <div class="flex flex-col gap-10">
-
         <h1 class="text-2xl font-bold login-text text-center ">
-          Connexion
+          {{ t('title') }}
         </h1>
-
         <div class="flex flex-col gap-4">
           <google-login :callback="googleCallback"
                         popup-type="TOKEN">
@@ -45,24 +36,11 @@ async function googleCallback(token) {
               Google
             </button>
           </google-login>
-          <!--          <button class="secondary"-->
-          <!--                  @click="loginWithFacebook">-->
-          <!--            <facebook class="social-icon"></facebook>-->
-          <!--            Facebook-->
-          <!--          </button>-->
         </div>
-
       </div>
-
     </div>
-
   </div>
-
 </template>
 
 <style scoped>
-.social-icon {
-  @apply w-5 h-5;
-  @apply text-base;
-}
 </style>