Fix: Vue type checking for AvatarImage component (#33)

fftfaisal · web-flow · commit c22e63ed6384 · 2025-02-25T08:17:24.000-06:00
diff --git a/resources/js/components/AppHeader.vue b/resources/js/components/AppHeader.vue
@@ -166,7 +166,7 @@ const rightNavItems: NavItem[] = [
                                 class="relative size-10 w-auto rounded-full p-1 focus-within:ring-2 focus-within:ring-primary"
                             >
                                 <Avatar class="size-8 overflow-hidden rounded-full">
-                                    <AvatarImage :src="auth.user.avatar" :alt="auth.user.name" />
+                                    <AvatarImage v-if="auth.user.avatar" :src="auth.user.avatar" :alt="auth.user.name" />
                                     <AvatarFallback class="rounded-lg bg-neutral-200 font-semibold text-black dark:bg-neutral-700 dark:text-white">
                                         {{ getInitials(auth.user?.name) }}
                                     </AvatarFallback>

Original file line number	Diff line number	Diff line change
`@@ -166,7 +166,7 @@ const rightNavItems: NavItem[] = [`
`166`	`166`	`class="relative size-10 w-auto rounded-full p-1 focus-within:ring-2 focus-within:ring-primary"`
`167`	`167`	`>`
`168`	`168`	`<Avatar class="size-8 overflow-hidden rounded-full">`
`169`		`- <AvatarImage :src="auth.user.avatar" :alt="auth.user.name" />`
	`169`	`+ <AvatarImage v-if="auth.user.avatar" :src="auth.user.avatar" :alt="auth.user.name" />`
`170`	`170`	`<AvatarFallback class="rounded-lg bg-neutral-200 font-semibold text-black dark:bg-neutral-700 dark:text-white">`
`171`	`171`	`{{ getInitials(auth.user?.name) }}`
`172`	`172`	`</AvatarFallback>`