versia-pub/frontend
2
0
Fork 0
mirror of https://github.com/versia-pub/frontend.git synced 2026-03-13 03:29:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: ♻️ Refactor Avatar usage into a single component

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-12-03 14:07:00 +01:00
parent caf4759d74
commit a7c8477efe
No known key found for this signature in database
9 changed files with 52 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

16
components/sidebars/account-switcher.vue
View file

@ -3,13 +3,8 @@
<DropdownMenuTrigger as-child>
<SidebarMenuButton size="lg"
class="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground">
<Avatar v-if="identity" shape="square" class="size-8">
<AvatarImage :src="identity?.account.avatar" alt="" />
<AvatarFallback class="rounded-lg"> AA </AvatarFallback>
</Avatar>
<Avatar v-else shape="square" class="size-8">
<AvatarFallback class="rounded-lg"> AB </AvatarFallback>
</Avatar>
<Avatar v-if="identity" class="size-8" :src="identity.account.avatar" :name="identity.account.display_name" />
<Avatar v-else class="size-8" name="AB" />
<div class="grid flex-1 text-left text-sm leading-tight">
<span class="truncate font-semibold" v-render-emojis="identity?.account.emojis">{{
identity?.account.display_name ?? "Not signed in"
@ -23,10 +18,7 @@
align="end" :side-offset="4">
<DropdownMenuLabel class="p-0 font-normal">
<div v-for="identity of identities" class="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
<Avatar shape="square" class="size-8">
<AvatarImage :src="identity.account.avatar" alt="" />
<AvatarFallback class="rounded-lg"> AA </AvatarFallback>
</Avatar>
<Avatar class="size-8" :src="identity.account.avatar" :name="identity.account.display_name" />
<div class="grid flex-1 text-left text-sm leading-tight">
<span class="truncate font-semibold" v-render-emojis="identity.account.emojis">{{
identity.account.display_name
@ -70,7 +62,6 @@ import {
LogIn,
} from "lucide-vue-next";
import { toast } from "vue-sonner";
import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
import {
DropdownMenu,
DropdownMenuContent,
@ -82,6 +73,7 @@ import {
} from "../ui/dropdown-menu";
import { SidebarMenuButton } from "../ui/sidebar";
import { NuxtLink } from "#components";
import Avatar from "../profiles/avatar.vue";
const appData = useAppData();

10
components/sidebars/left-sidebar.vue
View file

@ -6,11 +6,9 @@
<NuxtLink href="/">
<SidebarMenuButton size="lg"
class="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground">
<Avatar shape="square" class="size-8">
<AvatarImage :src="instance?.thumbnail.url ??
'https://cdn.versia.pub/branding/icon.svg'
" alt="" />
</Avatar>
<Avatar class="size-8" :src="instance?.thumbnail.url ??
'https://cdn.versia.pub/branding/icon.svg'
" :name="instance?.title" />
<div class="grid flex-1 text-left text-sm leading-tight">
<span class="truncate font-semibold">{{ instance?.title ?? 'Versia Server' }}</span>
<span class="truncate text-xs">{{ "A Versia Server instance" }}</span>
@ -104,7 +102,6 @@ import {
Pen,
Settings2,
} from "lucide-vue-next";
import { Avatar, AvatarImage } from "~/components/ui/avatar";
import {
Collapsible,
CollapsibleContent,
@ -128,6 +125,7 @@ import {
import { Button } from "../ui/button";
import AccountSwitcher from "./account-switcher.vue";
import ThemeSwitcher from "./theme-switcher.vue";
import Avatar from "../profiles/avatar.vue";
const data = {
navMain: [