From d08c0d29c7207adef8ed58a98351b65dca73ab13 Mon Sep 17 00:00:00 2001
From: archipelago <archipelago@localhost>
Date: Sun, 19 Jul 2026 00:29:46 -0400
Subject: [PATCH] fix(ui): ElectrumX sync screen shows the app's icon instead
 of a generic glyph

The pre-UI sync overlay used a hardcoded orange box-glyph SVG; it now renders
the same resolved app icon the loading screen uses (with the shared image-error
fallback), so the wait page reads as ElectrumX at a glance.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 neode-ui/src/views/appSession/AppSessionFrame.vue | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/neode-ui/src/views/appSession/AppSessionFrame.vue b/neode-ui/src/views/appSession/AppSessionFrame.vue
index fcb95d49..883003ac 100644
--- a/neode-ui/src/views/appSession/AppSessionFrame.vue
+++ b/neode-ui/src/views/appSession/AppSessionFrame.vue
@@ -18,10 +18,8 @@
            let the app's own UI load instead of a loader stuck on top (B7). -->
       <div v-if="electrsSync && !electrsSync.stale" class="absolute inset-0 z-10 flex flex-col items-center justify-center">
         <div class="text-center px-8 w-full max-w-md">
-          <div class="w-16 h-16 mx-auto mb-4 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center">
-            <svg class="w-8 h-8 text-orange-300 animate-pulse" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4 7v10a2 2 0 002 2h12a2 2 0 002-2V7M4 7l8 5 8-5M4 7l8-4 8 4" />
-            </svg>
+          <div class="w-16 h-16 mx-auto mb-4 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center overflow-hidden animate-pulse">
+            <img :src="appIcon" :alt="appTitle" class="w-full h-full object-cover" @error="handleImageError" />
           </div>
           <h3 class="text-lg font-semibold text-white mb-2">{{ appTitle }} is syncing</h3>
           <p class="text-white/50 text-sm mb-5">
@@ -119,6 +117,7 @@
 import { nextTick, onBeforeUnmount, ref, watch } from 'vue'
 import type { ElectrsSyncStatus } from '@/composables/useElectrsSync'
 import AppLoadingScreen from '@/components/AppLoadingScreen.vue'
+import { handleImageError } from '@/views/apps/appsConfig'
 
 const props = defineProps<{
   appUrl: string