Browse Source

fix(gui-v2): move navigation for signIn/signOut to component level

# What's changed?

* navigateTo breaks app when used inside the composable scope (unsure if that is an actual bug with nuxt 3)

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>
pull/2716/head
Braks 2 years ago committed by Pranav C
parent
commit
3167da9206
  1. 7
      packages/nc-gui-v2/app.vue
  2. 6
      packages/nc-gui-v2/composables/useGlobalState.ts
  3. 3
      packages/nc-gui-v2/pages/signin.vue

7
packages/nc-gui-v2/app.vue

@ -6,6 +6,11 @@ import { navigateTo } from '#app'
const { $state } = useNuxtApp() const { $state } = useNuxtApp()
const email = computed(() => $state.user?.value?.email ?? '---') const email = computed(() => $state.user?.value?.email ?? '---')
const signOut = () => {
$state.signOut()
navigateTo('/signin')
}
</script> </script>
<template> <template>
@ -60,7 +65,7 @@ const email = computed(() => $state.user?.value?.email ?? '---')
<div <div
v-t="['a:navbar:user:sign-out']" v-t="['a:navbar:user:sign-out']"
class="group flex flex-row cursor-pointer hover:bg-gray-200 flex items-center p-2" class="group flex flex-row cursor-pointer hover:bg-gray-200 flex items-center p-2"
@click="$state.signOut" @click="signOut"
> >
<MdiLogout class="transition-colors duration-150 ease-in group-hover:text-red-500" />&nbsp; <MdiLogout class="transition-colors duration-150 ease-in group-hover:text-red-500" />&nbsp;
<span class="prose font-semibold text-gray-500">{{ $t('general.signOut') }}</span> <span class="prose font-semibold text-gray-500">{{ $t('general.signOut') }}</span>

6
packages/nc-gui-v2/composables/useGlobalState.ts

@ -36,8 +36,6 @@ export const useGlobalState = (): GlobalState => {
const signOut: Actions['signOut'] = () => { const signOut: Actions['signOut'] = () => {
storage.value.token = null storage.value.token = null
storage.value.user = null storage.value.user = null
navigateTo('/signin')
} }
const signIn: Actions['signIn'] = async (newToken) => { const signIn: Actions['signIn'] = async (newToken) => {
@ -52,10 +50,6 @@ export const useGlobalState = (): GlobalState => {
roles: payload.roles, roles: payload.roles,
} }
} }
await nextTick(() => {
navigateTo('/')
})
} }
return { ...toRefs(storage.value), signedIn, signOut, signIn } return { ...toRefs(storage.value), signedIn, signOut, signIn }

3
packages/nc-gui-v2/pages/signin.vue

@ -2,7 +2,7 @@
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { definePageMeta, useHead } from '#imports' import { definePageMeta, useHead } from '#imports'
import { extractSdkResponseErrorMsg } from '~/utils/errorUtils' import { extractSdkResponseErrorMsg } from '~/utils/errorUtils'
import { useNuxtApp } from '#app' import { navigateTo, useNuxtApp } from '#app'
import { isEmail } from '~/utils/validation' import { isEmail } from '~/utils/validation'
import MdiLogin from '~icons/mdi/login' import MdiLogin from '~icons/mdi/login'
import MaterialSymbolsWarning from '~icons/material-symbols/warning' import MaterialSymbolsWarning from '~icons/material-symbols/warning'
@ -55,6 +55,7 @@ const signIn = async () => {
try { try {
const { token } = await $api.auth.signin(form) const { token } = await $api.auth.signin(form)
$state.signIn(token!) $state.signIn(token!)
await navigateTo('/projects')
} catch (e: any) { } catch (e: any) {
// todo: errors should not expose what was wrong (i.e. do not show "Password is wrong" messages) // todo: errors should not expose what was wrong (i.e. do not show "Password is wrong" messages)
error = await extractSdkResponseErrorMsg(e) error = await extractSdkResponseErrorMsg(e)

Loading…
Cancel
Save