diff --git a/wp-content/themes/ccat/app/components/auth/LoginForm.vue b/wp-content/themes/ccat/app/components/auth/AuthLoginForm.vue similarity index 56% rename from wp-content/themes/ccat/app/components/auth/LoginForm.vue rename to wp-content/themes/ccat/app/components/auth/AuthLoginForm.vue index d9dcb57..8a54043 100644 --- a/wp-content/themes/ccat/app/components/auth/LoginForm.vue +++ b/wp-content/themes/ccat/app/components/auth/AuthLoginForm.vue @@ -1,9 +1,5 @@ diff --git a/wp-content/themes/ccat/app/components/auth/LogoutForm.vue b/wp-content/themes/ccat/app/components/auth/AuthLogoutForm.vue similarity index 69% rename from wp-content/themes/ccat/app/components/auth/LogoutForm.vue rename to wp-content/themes/ccat/app/components/auth/AuthLogoutForm.vue index 7c453f0..15a2ba0 100644 --- a/wp-content/themes/ccat/app/components/auth/LogoutForm.vue +++ b/wp-content/themes/ccat/app/components/auth/AuthLogoutForm.vue @@ -1,9 +1,5 @@ diff --git a/wp-content/themes/ccat/app/components/auth/AuthRedirecting.vue b/wp-content/themes/ccat/app/components/auth/AuthRedirecting.vue new file mode 100644 index 0000000..26bebe2 --- /dev/null +++ b/wp-content/themes/ccat/app/components/auth/AuthRedirecting.vue @@ -0,0 +1,15 @@ + + + + + + + Redirection en cours + + + Veuillez patienter... + + + + diff --git a/wp-content/themes/ccat/app/composables/useAuth.ts b/wp-content/themes/ccat/app/composables/useAuth.ts index e6760f5..9a97a70 100644 --- a/wp-content/themes/ccat/app/composables/useAuth.ts +++ b/wp-content/themes/ccat/app/composables/useAuth.ts @@ -11,12 +11,22 @@ export function useAuth() { return { isLoggedIn, isSwitchedTo, hasRole, isAdmin }; } +const isRedirecting = ref(false); + export function useAuthActions() { const { fetch: refreshUserSession } = useUserSession(); const routeRedirect = useRoute().query.redirect as string || undefined; - const router = useRouter(); const toast = useToast(); + async function redirectTo(to: string | undefined) { + isRedirecting.value = true; + await delay(1000); + await refreshUserSession(); + await navigateTo(to || routeRedirect || "/"); + await nextTick(); + isRedirecting.value = false; + } + // Login const loginFields = [ { @@ -35,14 +45,12 @@ export function useAuthActions() { ]; async function login({ data: args }: FormSubmitEvent, redirect?: string) { try { - const redirectTo = redirect || routeRedirect || "/"; const { data, errors } = await useGraphqlMutation("login", args); if (errors.length || !data.login) { console.error(errors); throw new Error("Une erreur est survenue."); } - await refreshUserSession(); - await router.push(redirectTo); + await redirectTo(redirect); } catch (error) { const message = error instanceof Error ? error.message : "Une erreur est survenue."; @@ -53,14 +61,11 @@ export function useAuthActions() { // Logout async function logout(redirect?: string) { try { - const redirectTo = redirect || routeRedirect || "/"; - console.log(redirectTo); const result = await $fetch("/api/logout", { method: "POST" }); if (!result.success) { throw new Error("Une erreur est survenue."); } - await refreshUserSession(); - await router.push(redirectTo); + await redirectTo(redirect); } catch (error) { const message = error instanceof Error ? error.message : "Une erreur est survenue."; @@ -71,15 +76,11 @@ export function useAuthActions() { // Switch to async function switchTo(userId: number, redirect?: string) { try { - const redirectTo = redirect || routeRedirect; const { data, errors } = await useGraphqlMutation("switchTo", { userId }); if (errors.length || !data.switchTo) { throw new Error("Une erreur est survenue"); } - await refreshUserSession(); - if (redirectTo) { - await router.push(redirectTo); - } + await redirectTo(redirect); } catch (error) { const message = error instanceof Error ? error.message : "Une erreur est survenue"; @@ -90,15 +91,11 @@ export function useAuthActions() { // Switch back async function switchBack(redirect?: string) { try { - const redirectTo = redirect || routeRedirect; const result = await $fetch("/api/switch-back", { method: "POST" }); if (!result.success) { throw new Error("Une erreur est survenue."); } - await refreshUserSession(); - if (redirectTo) { - await router.push(redirectTo); - } + await redirectTo(redirect); } catch (error) { const message = error instanceof Error ? error.message : "Une erreur est survenue"; @@ -106,5 +103,5 @@ export function useAuthActions() { } } - return { loginFields, login, logout, switchTo, switchBack }; + return { isRedirecting, loginFields, login, logout, switchTo, switchBack }; } diff --git a/wp-content/themes/ccat/app/pages/connexion.vue b/wp-content/themes/ccat/app/pages/connexion.vue index bc8ef85..6b0ca01 100644 --- a/wp-content/themes/ccat/app/pages/connexion.vue +++ b/wp-content/themes/ccat/app/pages/connexion.vue @@ -2,12 +2,17 @@ definePageMeta({ layout: "auth" }); const { isLoggedIn } = useAuth(); +const { isRedirecting } = useAuthActions(); + useSeoMeta({ title: isLoggedIn.value ? "Déconnexion" : "Connexion" }); - - + + + + + diff --git a/wp-content/themes/ccat/shared/utils/delay.ts b/wp-content/themes/ccat/shared/utils/delay.ts new file mode 100644 index 0000000..4493928 --- /dev/null +++ b/wp-content/themes/ccat/shared/utils/delay.ts @@ -0,0 +1,3 @@ +export async function delay(ms: number) { + return new Promise((resolve) => setTimeout(resolve, ms)); +}