fix(webui): preserve event artwork fallbacks

webui/src/app.css

@@ -2590,6 +2590,7 @@
   }
 
   .event-kind-icon {
+    position: relative;
     display: grid;
     width: 2.35rem;
     height: 2.35rem;
@@ -2599,6 +2600,7 @@
     background: var(--color-panel-raised);
     color: var(--color-signal);
     font-size: 0.85rem;
+    overflow: hidden;
   }
 
   .event-kind-icon[data-severity="error"] {
@@ -2610,6 +2612,8 @@
   }
 
   .event-kind-icon img {
+    position: absolute;
+    inset: 0;
     width: 100%;
     height: 100%;
     border-radius: inherit;

webui/src/lib/components/EventLogView.svelte

@@ -17,6 +17,7 @@
     mergeActivity,
     outcomeClass,
   } from "$lib/activity";
+  import MediaArtwork from "$lib/components/MediaArtwork.svelte";
   import ProviderMark from "$lib/components/ProviderMark.svelte";
   import SearchField from "$lib/components/SearchField.svelte";
   import { formatDuration } from "$lib/playlists";
@@ -253,7 +254,10 @@
         >
           <summary>
             <span class="event-kind-icon" data-severity={severityState} aria-hidden="true">
-              {#if first.artworkUrl}<img src={first.artworkUrl} alt="" loading="lazy" />{:else}{activityIcon(first.kind)}{/if}
+              <span>{activityIcon(first.kind)}</span>
+              {#if first.artworkUrl}
+                <img src={first.artworkUrl} alt="" loading="lazy" onerror={(event) => event.currentTarget.remove()} />
+              {/if}
             </span>
             <span class="event-summary-copy">
               <span>
@@ -288,11 +292,7 @@
               {@const link = activityLink(item)}
               {@const details = technical(item)}
               <article class="event-child">
-                <span class="media-art event-art">
-                  {#if item.artworkUrl}<img src={item.artworkUrl} alt="" loading="lazy" />{:else}
-                    <span aria-hidden="true">{activityIcon(item.kind)}</span>
-                  {/if}
-                </span>
+                <MediaArtwork class="event-art" url={item.artworkUrl} fallback={activityIcon(item.kind)} />
                 <div class="event-child-copy">
                   <header>
                     <strong>{humanize(item.label)}</strong>

webui/tests/parity.e2e.ts

@@ -766,7 +766,8 @@ test("Event log groups matching work and preserves actionable history", async ({
   await page.goto("#/activity");
 
   await expect(page.getByText("Matched 3 tracks across 2 playlists")).toBeVisible();
-  await expect(page.locator(".event-log-group summary .event-kind-icon img")).toHaveCount(1);
+  await expect(page.locator(".event-log-group summary .event-kind-icon img")).toHaveCount(0);
+  await expect(page.locator(".event-log-group summary .event-kind-icon")).toContainText("↔");
   await expect.poll(() => page.evaluate(() =>
     document.documentElement.scrollWidth <= document.documentElement.clientWidth)).toBe(true);
   await page.getByLabel("Search").fill("missing event");
@@ -778,6 +779,7 @@ test("Event log groups matching work and preserves actionable history", async ({
   const group = page.locator(".event-log-group").first();
   await group.locator(":scope > summary").focus();
   await page.keyboard.press("Enter");
+  await expect(group.locator(".event-child .event-art > span").first()).toBeVisible();
   const technical = page.getByText("Technical details").first();
   await expect(technical).toBeVisible();
   await expect(page.getByText("Title Similarity").first()).toBeHidden();