27 lines
836 B
Vue
27 lines
836 B
Vue
<script setup lang="ts">
|
|
import type { AuthUser } from '~/types/auth';
|
|
|
|
const { user } = defineProps<{
|
|
user: AuthUser;
|
|
}>();
|
|
|
|
// TODO: Remove once this is a field on the users
|
|
const AVATAR =
|
|
'https://cdn.discordapp.com/avatars/285424924049276939/0368b00056c416cae689ab1434c0aac0.webp';
|
|
</script>
|
|
|
|
<template>
|
|
<div class="group/user flex flex-row items-center justify-between gap-4">
|
|
<Avatar>
|
|
<AvatarImage :src="AVATAR" />
|
|
</Avatar>
|
|
<div class="flex grow flex-col leading-4">
|
|
<span class="text-sm font-medium">{{ user.name }}</span>
|
|
<span class="text-muted-foreground text-xs">{{ user.email }}</span>
|
|
</div>
|
|
<div class="opacity-0 transition-all group-hover/user:opacity-100">
|
|
<slot name="actions" />
|
|
</div>
|
|
</div>
|
|
</template>
|