MirrorMirror
/
funkwhale
mirror of https://dev.funkwhale.audio/funkwhale/funkwhale.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(front): authorize page

This commit is contained in:
ArneBo 2025-01-15 16:28:24 +01:00
parent bd4093e6bc
commit 9f7b7612c7
1 changed files with 11 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
front/src/components/auth/Authorize.vue
View File

@ -10,6 +10,7 @@ import useSharedLabels from '~/composables/locale/useSharedLabels'
import useScopes from '~/composables/auth/useScopes' import useScopes from '~/composables/auth/useScopes'
import useFormData from '~/composables/useFormData' import useFormData from '~/composables/useFormData'
import Button from '~/components/ui/Button.vue' import Button from '~/components/ui/Button.vue'
import Layout from '~/components/ui/Layout.vue'
interface Props { interface Props {
clientId: string clientId: string
@ -113,29 +114,26 @@ whenever(() => props.clientId, fetchApplication, { immediate: true })
</script> </script>
<template> <template>
<main <layout main
v-title="labels.title" v-title="labels.title"
class="main" class="main"
> >
<section class="ui vertical stripe segment"> <section class="ui vertical stripe segment">
<div class="ui small text container"> <div class="ui small text container">
<h2> <h2>
<i class="lock open icon" />{{ t('components.auth.Authorize.header.authorize') }} <i class="bi bi-unlock-fill" />{{ t('components.auth.Authorize.header.authorize') }}
</h2> </h2>
<div <Alert red
v-if="errors.length > 0" v-if="errors.length > 0"
role="alert" role="alert"
class="ui negative message"
> >
<h4 <h4
v-if="application" v-if="application"
class="header"
> >
{{ t('components.auth.Authorize.header.authorizeFailure') }} {{ t('components.auth.Authorize.header.authorizeFailure') }}
</h4> </h4>
<h4 <h4
v-else v-else
class="header"
> >
{{ t('components.auth.Authorize.header.fetchFailure') }} {{ t('components.auth.Authorize.header.fetchFailure') }}
</h4> </h4>
@ -147,13 +145,11 @@ whenever(() => props.clientId, fetchApplication, { immediate: true })
{{ error }} {{ error }}
</li> </li>
</ul> </ul>
</div> </Alert>
<div <Loader
v-if="isLoading" v-if="isLoading"
class="ui inverted active dimmer" class="ui inverted active dimmer"
> />
<div class="ui loader" />
</div>
<form <form
v-else-if="application && !code" v-else-if="application && !code"
:class="['ui', {loading: isLoading}, 'form']" :class="['ui', {loading: isLoading}, 'form']"
@ -172,7 +168,7 @@ whenever(() => props.clientId, fetchApplication, { immediate: true })
v-if="topic.write && !topic.read" v-if="topic.write && !topic.read"
:class="['ui', 'basic', 'right floated', 'tiny', 'vertically-spaced component-label label']" :class="['ui', 'basic', 'right floated', 'tiny', 'vertically-spaced component-label label']"
> >
<i class="pencil icon" /> <i class="bi bi-pencil" />
{{ t('components.auth.Authorize.header.writeOnly') }} {{ t('components.auth.Authorize.header.writeOnly') }}
</span> </span>
<span <span
@ -185,10 +181,10 @@ whenever(() => props.clientId, fetchApplication, { immediate: true })
v-else-if="topic.write && topic.read" v-else-if="topic.write && topic.read"
:class="['ui', 'basic', 'right floated', 'tiny', 'vertically-spaced component-label label']" :class="['ui', 'basic', 'right floated', 'tiny', 'vertically-spaced component-label label']"
> >
<i class="pencil icon" /> <i class="bi bi-pencil" />
{{ t('components.auth.Authorize.header.allScopes') }} {{ t('components.auth.Authorize.header.allScopes') }}
</span> </span>
<i :class="[topic.icon, 'icon']" /> <i :class="[topic.icon, 'bi']" />
<div class="content"> <div class="content">
{{ topic.label }} {{ topic.label }}
<div class="sub header"> <div class="sub header">
@ -230,5 +226,5 @@ whenever(() => props.clientId, fetchApplication, { immediate: true })
</div> </div>
</div> </div>
</section> </section>
</main> </layout>
</template> </template>