2022-11-23 12:48:01 +09:00
|
|
|
<script setup lang="ts">
|
2022-11-28 16:12:13 +09:00
|
|
|
import type { UserLogin } from '~/types'
|
2022-11-28 16:03:26 +09:00
|
|
|
|
2022-12-15 22:50:11 +09:00
|
|
|
const emits = defineEmits<{
|
|
|
|
(event: 'click'): void
|
|
|
|
}>()
|
|
|
|
|
2022-11-23 13:25:48 +09:00
|
|
|
const all = useUsers()
|
2022-11-23 13:20:59 +09:00
|
|
|
|
2022-11-23 13:25:48 +09:00
|
|
|
const sorted = computed(() => {
|
2022-11-23 13:20:59 +09:00
|
|
|
return [
|
|
|
|
currentUser.value!,
|
2022-11-23 13:25:48 +09:00
|
|
|
...all.value.filter(account => account.token !== currentUser.value?.token),
|
2022-11-23 13:20:59 +09:00
|
|
|
].filter(Boolean)
|
|
|
|
})
|
2022-11-28 16:03:26 +09:00
|
|
|
|
|
|
|
const router = useRouter()
|
2022-12-21 00:56:54 +09:00
|
|
|
const masto = useMasto()
|
2022-11-28 16:03:26 +09:00
|
|
|
const switchUser = (user: UserLogin) => {
|
|
|
|
if (user.account.id === currentUser.value?.account.id)
|
2022-12-01 02:15:18 +09:00
|
|
|
router.push(getAccountRoute(user.account))
|
2022-11-30 09:22:35 +09:00
|
|
|
else
|
2022-12-21 00:56:54 +09:00
|
|
|
masto.loginTo(user)
|
2022-11-28 16:03:26 +09:00
|
|
|
}
|
2022-11-23 12:48:01 +09:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
2022-12-15 22:50:11 +09:00
|
|
|
<div sm:min-w-80 max-w-100vw mxa py2 flex="~ col" @click="emits('click')">
|
2022-11-27 12:34:55 +09:00
|
|
|
<template v-for="user of sorted" :key="user.id">
|
2022-11-28 16:03:26 +09:00
|
|
|
<button
|
2022-11-27 12:34:55 +09:00
|
|
|
flex rounded px4 py3 text-left
|
2022-11-28 16:03:26 +09:00
|
|
|
hover:bg-active cursor-pointer transition-100
|
2022-11-30 06:24:26 +09:00
|
|
|
aria-label="Switch user"
|
2022-11-28 16:03:26 +09:00
|
|
|
@click="switchUser(user)"
|
2022-11-27 12:34:55 +09:00
|
|
|
>
|
2022-11-30 16:30:17 +09:00
|
|
|
<AccountInfo :account="user.account" :hover-card="false" />
|
2022-11-27 12:34:55 +09:00
|
|
|
<div flex-auto />
|
|
|
|
<div v-if="user.token === currentUser?.token" i-ri:check-line text-primary mya text-2xl />
|
2022-11-28 16:03:26 +09:00
|
|
|
</button>
|
2022-11-27 12:34:55 +09:00
|
|
|
</template>
|
|
|
|
<div border="t base" pt2>
|
2022-12-26 17:50:11 +09:00
|
|
|
<NuxtLink to="/settings">
|
|
|
|
<CommonDropdownItem
|
2022-12-28 02:49:15 +09:00
|
|
|
:text="$t('nav.settings')"
|
2022-12-26 17:50:11 +09:00
|
|
|
icon="i-ri:settings-4-line"
|
|
|
|
/>
|
|
|
|
</NuxtLink>
|
2022-12-28 08:03:50 +09:00
|
|
|
<CommonDropdownItem
|
|
|
|
:text="$t('user.add_existing')"
|
|
|
|
icon="i-ri:user-add-line"
|
|
|
|
@click="openSigninDialog"
|
|
|
|
/>
|
2022-11-30 08:25:29 +09:00
|
|
|
<CommonDropdownItem
|
2022-12-18 01:55:29 +09:00
|
|
|
v-if="isMastoInitialised && currentUser"
|
2022-11-30 08:25:29 +09:00
|
|
|
:text="$t('user.sign_out_account', [getFullHandle(currentUser.account)])"
|
2023-01-01 23:29:11 +09:00
|
|
|
icon="i-ri:logout-box-line rtl-flip"
|
2022-11-23 13:20:59 +09:00
|
|
|
@click="signout"
|
2022-11-30 08:25:29 +09:00
|
|
|
/>
|
2022-11-23 13:20:59 +09:00
|
|
|
</div>
|
2022-11-23 12:48:01 +09:00
|
|
|
</div>
|
|
|
|
</template>
|