elk/components/nav/NavUser.vue

42 lines
1.2 KiB
Vue
Raw Normal View History

<script setup>
const { busy, oauth, singleInstanceServer } = useSignIn()
</script>
2022-11-27 11:16:27 +00:00
<template>
2023-01-15 08:38:02 +00:00
<VDropdown v-if="isHydrated && currentUser" sm:hidden>
2022-11-27 11:16:27 +00:00
<div style="-webkit-touch-callout: none;">
<AccountAvatar
:account="currentUser.account"
h-8
w-8
2022-11-27 11:16:27 +00:00
:draggable="false"
square
2022-11-27 11:16:27 +00:00
/>
</div>
<template #popper="{ hide }">
2023-03-19 12:12:20 +00:00
<UserSwitcher @click="hide()" />
2022-11-27 11:16:27 +00:00
</template>
</VDropdown>
<template v-else>
<button
v-if="singleInstanceServer"
flex="~ row"
gap-x-1 items-center justify-center btn-solid text-sm px-2 py-1 xl:hidden
:disabled="busy"
@click="oauth()"
>
<span v-if="busy" aria-hidden="true" block animate animate-spin preserve-3d class="rtl-flip">
<span block i-ri:loader-2-fill aria-hidden="true" />
</span>
<span v-else aria-hidden="true" block i-ri:login-circle-line class="rtl-flip" />
<i18n-t keypath="action.sign_in_to">
<strong>{{ currentServer }}</strong>
</i18n-t>
</button>
<button v-else btn-solid text-sm px-2 py-1 text-center xl:hidden @click="openSigninDialog()">
{{ $t('action.sign_in') }}
</button>
</template>
2022-11-27 11:16:27 +00:00
</template>