local-it/vikunja-frontend
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

feat: OpenIdAuth script setup

Browse source
This commit is contained in:
Dominik Pschenitschni 2022-05-21 02:05:42 +02:00 committed by Gitea
parent 5ab0a4755c
commit d996e39a86
1 changed files with 78 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

74
src/views/user/OpenIdAuth.vue
View file

@ -11,29 +11,31 @@
<script lang="ts">
import {defineComponent} from 'vue'
import {mapState} from 'vuex'
export default defineComponent({ name: 'Auth' })
</script>
<script setup lang="ts">
import {ref, computed, onMounted} from 'vue'
import {useStore} from 'vuex'
import {useRoute, useRouter} from 'vue-router'
import {useI18n} from 'vue-i18n'
import {LOADING} from '@/store/mutation-types'
import {getErrorText} from '@/message'
import Message from '@/components/misc/message'
import {clearLastVisited, getLastVisited} from '../../helpers/saveLastVisited'
import Message from '@/components/misc/message.vue'
import {clearLastVisited, getLastVisited} from '@/helpers/saveLastVisited'
export default defineComponent({
name: 'Auth',
components: {Message},
data() {
return {
errorMessage: '',
}
},
computed: mapState({
loading: LOADING,
}),
mounted() {
this.authenticateWithCode()
},
methods: {
async authenticateWithCode() {
const {t} = useI18n()
const router = useRouter()
const route = useRoute()
const store = useStore()
const loading = computed(() => store.state.loading)
const errorMessage = ref('')
async function authenticateWithCode() {
// This component gets mounted twice: The first time when the actual auth request hits the frontend,
// the second time after that auth request succeeded and the outer component "content-no-auth" isn't used
// but instead the "content-auth" component is used. Because this component is just a route and thus
@ -47,45 +49,45 @@ export default defineComponent({
}
localStorage.setItem('authenticating', true)
this.errorMessage = ''
errorMessage.value = ''
if (typeof this.$route.query.error !== 'undefined') {
if (typeof route.query.error !== 'undefined') {
localStorage.removeItem('authenticating')
this.errorMessage = typeof this.$route.query.message !== 'undefined'
? this.$route.query.message
: this.$t('user.auth.openIdGeneralError')
errorMessage.value = typeof route.query.message !== 'undefined'
? route.query.message
: t('user.auth.openIdGeneralError')
return
}
const state = localStorage.getItem('state')
if (typeof this.$route.query.state === 'undefined' || this.$route.query.state !== state) {
if (typeof route.query.state === 'undefined' || route.query.state !== state) {
localStorage.removeItem('authenticating')
this.errorMessage = this.$t('user.auth.openIdStateError')
errorMessage.value = t('user.auth.openIdStateError')
return
}
try {
await this.$store.dispatch('auth/openIdAuth', {
provider: this.$route.params.provider,
code: this.$route.query.code,
await store.dispatch('auth/openIdAuth', {
provider: route.params.provider,
code: route.query.code,
})
const last = getLastVisited()
if (last !== null) {
this.$router.push({
router.push({
name: last.name,
params: last.params,
})
clearLastVisited()
} else {
this.$router.push({name: 'home'})
router.push({name: 'home'})
}
} catch(e) {
const err = getErrorText(e)
this.errorMessage = typeof err[1] !== 'undefined' ? err[1] : err[0]
errorMessage.value = typeof err[1] !== 'undefined' ? err[1] : err[0]
} finally {
localStorage.removeItem('authenticating')
}
},
},
})
}
onMounted(() => authenticateWithCode())
</script>