diff --git a/src/App.vue b/src/App.vue index 75fe0ca5a..1b0c2f20e 100644 --- a/src/App.vue +++ b/src/App.vue @@ -76,7 +76,7 @@ import { CONFIG } from "@/graphql/config"; import { IConfig } from "@/types/config.model"; import { useRouter } from "vue-router"; import RouteName from "@/router/name"; -import { useLazyCurrentUserIdentities } from "./composition/apollo/actor"; +import { useCurrentUserIdentities } from "./composition/apollo/actor"; const { result: configResult } = useQuery<{ config: IConfig }>( CONFIG, @@ -145,23 +145,29 @@ interval.value = window.setInterval(async () => { } }, 60000) as unknown as number; -const { load: loadIdentities } = useLazyCurrentUserIdentities(); +const { identities } = useCurrentUserIdentities(); onBeforeMount(async () => { - console.debug("Before mount App"); - if (initializeCurrentUser()) { - try { - const result = await loadIdentities(); - if (!result) return; - await initializeCurrentActor(result.loggedUser.actors); - } catch (err) { - if (err instanceof NoIdentitiesException) { - await router.push({ - name: RouteName.CREATE_IDENTITY, - }); - } else { - throw err; - } + console.debug("App: onBeforeMount..."); + + // Try to init the user + if (!initializeCurrentUser()) return; +}); + +watch(identities, async () => { + // Try to init the identities and set one of them + console.log("identities has changed", identities.value); + try { + if (!identities.value) return; + + console.log("We will initializeCurrentActor"); + await initializeCurrentActor(identities.value); + } catch (err) { + if (err instanceof NoIdentitiesException) { + console.log("Route to CREATE_IDENTITY because user has no identity"); + router.push({ name: RouteName.CREATE_IDENTITY }); + } else { + throw err; } } }); @@ -258,43 +264,6 @@ const refreshApp = async ( const showOfflineNetworkWarning = (): void => { notifier?.error(t("You are offline")); }; -// const extractPageTitleFromRoute = (routeWatched: RouteLocation): string => { -// if (routeWatched.meta?.announcer?.message) { -// return routeWatched.meta?.announcer?.message(); -// } -// return document.title; -// }; - -// watch(route, (routeWatched) => { -// const pageTitle = extractPageTitleFromRoute(routeWatched); -// if (pageTitle) { -// // this.$announcer.polite( -// // t("Navigated to {pageTitle}", { -// // pageTitle, -// // }) as string -// // ); -// } -// // Set the focus to the router view -// // https://marcus.io/blog/accessible-routing-vuejs -// setTimeout(() => { -// const focusTarget = ( -// routerView.value?.$refs?.componentFocusTarget !== undefined -// ? routerView.value?.$refs?.componentFocusTarget -// : routerView.value?.$el -// ) as HTMLElement; -// if (focusTarget && focusTarget instanceof Element) { -// // Make focustarget programmatically focussable -// focusTarget.setAttribute("tabindex", "-1"); - -// // Focus element -// focusTarget.focus(); - -// // Remove tabindex from focustarget. -// // Reason: https://axesslab.com/skip-links/#update-3-a-comment-from-gov-uk -// focusTarget.removeAttribute("tabindex"); -// } -// }, 0); -// }); const router = useRouter(); diff --git a/src/composition/apollo/actor.ts b/src/composition/apollo/actor.ts index b9236cffa..e26ab7b58 100644 --- a/src/composition/apollo/actor.ts +++ b/src/composition/apollo/actor.ts @@ -6,7 +6,7 @@ import { } from "@/graphql/actor"; import { IPerson } from "@/types/actor"; import { ICurrentUser } from "@/types/current-user.model"; -import { useLazyQuery, useQuery } from "@vue/apollo-composable"; +import { useQuery } from "@vue/apollo-composable"; import { computed, Ref, unref } from "vue"; import { useCurrentUserClient } from "./user"; @@ -22,26 +22,6 @@ export function useCurrentActorClient() { return { currentActor, error, loading }; } -export function useLazyCurrentUserIdentities() { - const { currentUser } = useCurrentUserClient(); - return useLazyQuery<{ - loggedUser: Pick; - }>( - IDENTITIES, - { - // To ensure the request is re-executed when the user changes, - // we include a dummy `_user` parameter that's ignored by the server. - // This function does not depend on the user, the server identifies them by the token. - // So without this dummy parameter, the GraphQL call is not automatically reloaded - // when the actor changes. - _user: currentUser?.value?.id, - }, - { - fetchPolicy: "network-only", - } - ); -} - export function useCurrentUserIdentities() { const { currentUser } = useCurrentUserClient(); @@ -71,7 +51,7 @@ export function useCurrentUserIdentities() { ); const identities = computed(() => - enabled.value ? result.value?.loggedUser?.actors : null + enabled.value ? result.value?.loggedUser?.actors : undefined ); return { identities, error, loading }; diff --git a/src/views/User/LoginView.vue b/src/views/User/LoginView.vue index 4797f6708..80ef6bd23 100644 --- a/src/views/User/LoginView.vue +++ b/src/views/User/LoginView.vue @@ -133,10 +133,7 @@ import { IConfig } from "@/types/config.model"; import { IUser } from "@/types/current-user.model"; import { saveUserData, SELECTED_PROVIDERS } from "@/utils/auth"; import { storeUserLocationAndRadiusFromUserSettings } from "@/utils/location"; -import { - initializeCurrentActor, - NoIdentitiesException, -} from "@/utils/identity"; +import { NoIdentitiesException } from "@/utils/identity"; import { useMutation, useLazyQuery, useQuery } from "@vue/apollo-composable"; import { computed, reactive, ref, onMounted } from "vue"; import { useI18n } from "vue-i18n"; @@ -147,7 +144,6 @@ import { LoginError, LoginErrorCode } from "@/types/enums"; import { useCurrentUserClient } from "@/composition/apollo/user"; import { useHead } from "@/utils/head"; import { enumTransformer, useRouteQuery } from "vue-use-route-query"; -import { useLazyCurrentUserIdentities } from "@/composition/apollo/actor"; const { t } = useI18n({ useScope: "global" }); const router = useRouter(); @@ -185,8 +181,6 @@ const errorCode = useRouteQuery("code", null, enumTransformer(LoginErrorCode)); // Login const loginMutation = useMutation(LOGIN); -// Load user identities -const currentUserIdentitiesQuery = useLazyCurrentUserIdentities(); // Update user in cache const currentUserMutation = useMutation(UPDATE_CURRENT_USER_CLIENT); // Retrieve preferred location @@ -225,18 +219,9 @@ const loginAction = async (e: Event) => { role: loginData.login.user.role, }); - // Step 3a: Retrieving user location + // Step 3: Retrieving user location const loggedUserLocationPromise = loggedUserLocationQuery.load(); - // Step 3b: Setuping user's identities - const currentUserIdentitiesResult = await currentUserIdentitiesQuery.load(); - if (!currentUserIdentitiesResult) { - throw new Error("Loading user's identities failed"); - } - - await initializeCurrentActor(currentUserIdentitiesResult.loggedUser.actors); - - // Step 3a following const loggedUserLocationResult = await loggedUserLocationPromise; storeUserLocationAndRadiusFromUserSettings( loggedUserLocationResult?.loggedUser?.settings?.location