From 829a71f4ff0d99cf9a8656e7cc56c3c5426ae6e1 Mon Sep 17 00:00:00 2001
From: Martin Dvorak <dvorak@dvorakmortonxd.dev>
Date: Fri, 9 Oct 2026 17:03:59 +0000
Subject: [PATCH] Show the app icon while a deck is generating
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The staged loading screen still rendered the pre-redesign logo — a white
snowflake in a blue rounded square — while every other surface (header,
sidebar, empty states, key gate, install sheet) uses the app icon.

- LoadingState now shows /icons/icon-512.png at size-28 with the same
  gentle wobble animation; 512px keeps the 112px render crisp on hi-DPI
  phones.
- Service worker: freezmo-v17.

Verified: loading-logo suite 12/12 (dark + light: icon visible at
112x112, no old snowflake svg left, heading/stages/cancel intact),
regression 74/74, mobile 51/51, i18n 27/27. Lint + build clean.
---
 components/UploadScreen.tsx | 11 +++++++++--
 public/sw.js                |  2 +-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/components/UploadScreen.tsx b/components/UploadScreen.tsx
index 4154613..38c2d17 100644
--- a/components/UploadScreen.tsx
+++ b/components/UploadScreen.tsx
@@ -772,13 +772,20 @@ function LoadingState({ progress, onCancel }: { progress: GenerateProgress; onCa
 
   return (
     <div className="relative flex min-h-[70dvh] flex-col items-center justify-center gap-6 text-center">
+      {/* The app icon, not the bare snowflake — same logo as the header,
+          sidebar and empty states. */}
       <motion.div
         aria-hidden
         animate={{ rotate: [0, 8, -8, 0], scale: [1, 1.08, 1] }}
         transition={{ duration: 3.2, repeat: Infinity, ease: "easeInOut" }}
-        className="relative grid size-28 place-items-center rounded-[1.75rem] bg-accent-600 text-white shadow-lift"
+        className="relative size-28"
       >
-        <SnowflakeIcon className="size-16" />
+        {/* eslint-disable-next-line @next/next/no-img-element -- static app icon, no optimisation needed */}
+        <img
+          src="/icons/icon-512.png"
+          alt=""
+          className="size-28 rounded-[1.75rem] shadow-lift"
+        />
       </motion.div>
 
       <div className="relative w-full max-w-md space-y-3">
diff --git a/public/sw.js b/public/sw.js
index 8a5b4b0..61ff057 100644
--- a/public/sw.js
+++ b/public/sw.js
@@ -9,7 +9,7 @@
  *
  * Bumping CACHE_VERSION is how a new deploy invalidates old assets.
  */
-const CACHE_VERSION = "freezmo-v16";
+const CACHE_VERSION = "freezmo-v17";
 const SHELL_CACHE = `${CACHE_VERSION}-shell`;
 const ASSET_CACHE = `${CACHE_VERSION}-assets`;