mirror of
https://github.com/versia-pub/frontend.git
synced 2026-03-13 03:29:16 +01:00
refactor: ♻️ Refactor Avatar usage into a single component
This commit is contained in:
parent
caf4759d74
commit
a7c8477efe
9 changed files with 52 additions and 46 deletions
|
|
@ -1,10 +1,7 @@
|
|||
<template>
|
||||
<div v-if="relationship?.requested_by !== false" class="flex flex-row items-center gap-3 p-4">
|
||||
<NuxtLink :href="followerUrl" class="relative size-10">
|
||||
<Avatar shape="square" class="size-10 border border-border">
|
||||
<AvatarImage :src="follower.avatar" alt="" />
|
||||
<AvatarFallback class="rounded-lg"> AA </AvatarFallback>
|
||||
</Avatar>
|
||||
<Avatar class="size-10 border border-border" :src="follower.avatar" :name="follower.display_name" />
|
||||
</NuxtLink>
|
||||
<div class="flex flex-col gap-0.5 justify-center flex-1 text-left leading-tight text-sm">
|
||||
<span class="truncate font-semibold" v-render-emojis="follower.emojis">{{
|
||||
|
|
@ -44,8 +41,8 @@ import type { Account } from "@versia/client/types";
|
|||
import { Check, Loader, X } from "lucide-vue-next";
|
||||
import { toast } from "vue-sonner";
|
||||
import CopyableText from "~/components/notes/copyable-text.vue";
|
||||
import { Avatar, AvatarFallback, AvatarImage } from "~/components/ui/avatar";
|
||||
import { Button } from "~/components/ui/button";
|
||||
import Avatar from "../profiles/avatar.vue";
|
||||
|
||||
const { follower } = defineProps<{
|
||||
follower: Account;
|
||||
|
|
|
|||
|
|
@ -6,10 +6,7 @@
|
|||
<CardHeader v-if="notification.account"
|
||||
class="flex-row items-center gap-2 px-4 py-2 border-b border-border">
|
||||
<component :is="icon" class="size-5 shrink-0" />
|
||||
<Avatar shape="square" class="size-6 border border-card">
|
||||
<AvatarImage :src="notification.account.avatar" alt="" />
|
||||
<AvatarFallback> AA </AvatarFallback>
|
||||
</Avatar>
|
||||
<Avatar class="size-6 border border-card" :src="notification.account.avatar" :name="notification.account.display_name" />
|
||||
<span class="font-semibold" v-render-emojis="notification.account.emojis">{{
|
||||
notification.account.display_name
|
||||
}}</span>
|
||||
|
|
@ -46,7 +43,7 @@ import {
|
|||
UserCheck,
|
||||
UserPlus,
|
||||
} from "lucide-vue-next";
|
||||
import { Avatar, AvatarFallback, AvatarImage } from "~/components/ui/avatar";
|
||||
import Avatar from "../profiles/avatar.vue";
|
||||
import { Button } from "~/components/ui/button";
|
||||
import { Card, CardContent, CardHeader } from "~/components/ui/card";
|
||||
import {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue