mirror of
https://github.com/versia-pub/frontend.git
synced 2026-01-26 12:26:02 +01:00
30 lines
834 B
Vue
30 lines
834 B
Vue
<template>
|
|
<Avatar :class="['rounded-md bg-secondary']">
|
|
<AvatarFallback v-if="name">{{ getInitials(name) }}</AvatarFallback>
|
|
<AvatarImage v-if="src" :src="src" :alt="`${name}'s avatar`"/>
|
|
</Avatar>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
|
|
|
|
const { name } = defineProps<{
|
|
src?: string;
|
|
name?: string;
|
|
}>();
|
|
|
|
/**
|
|
* Gets the initials of any string, even if it's not a name.
|
|
* If not a name, it will return the first two characters.
|
|
* @param name
|
|
*/
|
|
const getInitials = (name: string): string => {
|
|
const initials = name.match(/\b\w/g) || [];
|
|
|
|
const firstLetter = initials.shift() || name[0] || "";
|
|
const secondLetter = initials.pop() || name[1] || "";
|
|
|
|
return `${firstLetter}${secondLetter}`.toUpperCase();
|
|
};
|
|
</script>
|