From 9b7c321602f91ea568f5742674ba798be26bfd65 Mon Sep 17 00:00:00 2001
From: Adam Soltys <adam@coinos.io>
Date: Sat, 9 Nov 2024 23:33:36 -0800
Subject: fix avatars

---
 src/components/AppHeader.svelte | 19 ++++++++++---------
 src/components/Avatar.svelte    |  8 +-------
 2 files changed, 11 insertions(+), 16 deletions(-)

(limited to 'src/components')

diff --git a/src/components/AppHeader.svelte b/src/components/AppHeader.svelte
index fef2f0f4..1431bb6f 100644
--- a/src/components/AppHeader.svelte
+++ b/src/components/AppHeader.svelte
@@ -1,5 +1,5 @@
 <script>
-  import { run } from 'svelte/legacy';
+  import { run } from "svelte/legacy";
 
   import { banner, theme, newPayment } from "$lib/store";
   import { goto } from "$app/navigation";
@@ -11,18 +11,17 @@
   let { user, subject = $bindable() } = $props();
 
   let w = $state();
-  run(() => {
-    if (!subject) subject = user;
-  });
+  $effect(() => (subject ||= user));
 
-  let bg =
-    $derived($banner?.id && $banner.id === subject.id
+  let bg = $derived(
+    $banner?.id && $banner.id === subject.id
       ? `url(${$banner.src})`
       : subject?.banner
         ? subject.banner.includes(":")
           ? `url(${subject.banner})`
           : `url(/api/public/${subject.banner}.webp)`
-        : undefined);
+        : undefined,
+  );
 
   const links = [
     {
@@ -47,7 +46,8 @@
   let opacity = $derived((href) =>
     $page.url.pathname === href
       ? "opacity-100"
-      : "opacity-90 hover:opacity-none");
+      : "opacity-90 hover:opacity-none",
+  );
 </script>
 
 <svelte:window bind:innerWidth={w} />
@@ -62,7 +62,8 @@
         {#each links as { href, icon, flip }}
           <a {href} data-sveltekit-preload-code="eager">
             <button class="btn-menu {opacity(href)}">
-              <iconify-icon {icon} width={w > 640 ? 32 : 24} {flip}></iconify-icon>
+              <iconify-icon {icon} width={w > 640 ? 32 : 24} {flip}
+              ></iconify-icon>
             </button>
           </a>
         {/each}
diff --git a/src/components/Avatar.svelte b/src/components/Avatar.svelte
index 04f346b1..467b825e 100644
--- a/src/components/Avatar.svelte
+++ b/src/components/Avatar.svelte
@@ -24,12 +24,7 @@
     `${base}/punks/` + punk(user.pubkey || user.id || "aa"),
   );
   let tmp = $derived($avatar?.id && $avatar.id === user.id && $avatar.src);
-  let src;
-  run(() => {
-    src = tmp || profile || fallback;
-  });
-
-  let handle = () => (src = fallback);
+  let src = $derived(tmp || profile || fallback);
 </script>
 
 {#snippet body()}
@@ -40,7 +35,6 @@
       {src}
       class="w-full h-full object-cover object-center overflow-hidden"
       alt={user.username}
-      onerror={handle}
     />
   </div>
 {/snippet}
-- 
cgit v1.2.3