From 79fe70cfc2e764b6f0a262fc13bc4ceabb14b97d Mon Sep 17 00:00:00 2001
From: KhooLy <73142442+KhooLy@users.noreply.github.com>
Date: Mon, 13 Jul 2026 21:29:15 +0300
Subject: [PATCH] Keep the shared shell mounted across all mobile navigation,
 add Discover skeleton
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The shared shell was only mounted while on Home/Search/Discover/
Calendar; navigating to any other native screen (Detail, Sources,
Player, Settings, AddonStore) disposed it entirely, so returning to
any of those four tabs remounted from scratch — fresh stores, fresh
StateFlow defaults (isLoading=true, empty items), and a real re-fetch,
even though the underlying HomeViewModel data was already cached. That
produced the "blank calendar/grid when coming back from another page"
symptom.

FluxaAppHost (mobile) is now always composed as a background layer
behind AppRoutesHost's native AnimatedContent, which only draws on top
(opaque) when the active screen isn't one of those four. The shell
itself is never disposed by navigating elsewhere, so its stores keep
their last-known state and returning to a tab is instant.

Also replaced Discover's full-screen blocking spinner on first load
with a skeleton grid (18 placeholder cards) so the filter row stays
visible and the transition to real results doesn't hide the whole
screen behind a spinner.
---
 .../com/fluxa/app/ui/routes/AppRoutesHost.kt  |  6 ++++-
 .../shared/feature/discover/DiscoverScreen.kt | 26 ++++++++++++++++---
 2 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/app/src/main/java/com/fluxa/app/ui/routes/AppRoutesHost.kt b/app/src/main/java/com/fluxa/app/ui/routes/AppRoutesHost.kt
index 2a5cead..630403f 100644
--- a/app/src/main/java/com/fluxa/app/ui/routes/AppRoutesHost.kt
+++ b/app/src/main/java/com/fluxa/app/ui/routes/AppRoutesHost.kt
@@ -15,6 +15,7 @@ import androidx.compose.animation.scaleOut
 import androidx.compose.animation.slideInHorizontally
 import androidx.compose.animation.slideOutHorizontally
 import androidx.compose.animation.togetherWith
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.WindowInsetsSides
 import androidx.compose.foundation.layout.fillMaxSize
@@ -125,7 +126,7 @@ internal fun AppRoutesHost(
         null
     }
 
-    if (mobileSharedDestination != null) {
+    if (deviceType == DeviceType.Mobile) {
         com.fluxa.app.shared.FluxaAppHost(
             platformServices = androidFluxaPlatformServices!!,
             language = activeProfile?.language,
@@ -136,6 +137,9 @@ internal fun AppRoutesHost(
                 .fillMaxSize()
                 .windowInsetsPadding(WindowInsets.safeDrawing.only(WindowInsetsSides.Top + WindowInsetsSides.Horizontal))
         )
+    }
+
+    if (mobileSharedDestination != null) {
         return
     }
 
diff --git a/shared/src/commonMain/kotlin/com/fluxa/app/shared/feature/discover/DiscoverScreen.kt b/shared/src/commonMain/kotlin/com/fluxa/app/shared/feature/discover/DiscoverScreen.kt
index ea96286..1c49a8d 100644
--- a/shared/src/commonMain/kotlin/com/fluxa/app/shared/feature/discover/DiscoverScreen.kt
+++ b/shared/src/commonMain/kotlin/com/fluxa/app/shared/feature/discover/DiscoverScreen.kt
@@ -7,6 +7,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
@@ -95,10 +96,7 @@ fun DiscoverScreen(
                 onFiltersChanged = onFiltersChanged
             )
             when {
-                state.isLoading && state.results.isEmpty() -> Box(
-                    modifier = Modifier.weight(1f).fillMaxWidth(),
-                    contentAlignment = Alignment.Center
-                ) { CircularProgressIndicator(color = Color.White) }
+                state.isLoading && state.results.isEmpty() -> DiscoverSkeletonGrid(modifier = Modifier.weight(1f))
                 state.results.isEmpty() -> Box(
                     modifier = Modifier.weight(1f).fillMaxWidth(),
                     contentAlignment = Alignment.Center
@@ -119,6 +117,26 @@ fun DiscoverScreen(
     }
 }
 
+@Composable
+private fun DiscoverSkeletonGrid(modifier: Modifier = Modifier) {
+    LazyVerticalGrid(
+        columns = GridCells.Fixed(3),
+        modifier = modifier.fillMaxWidth(),
+        contentPadding = PaddingValues(bottom = 20.dp),
+        horizontalArrangement = Arrangement.spacedBy(12.dp),
+        verticalArrangement = Arrangement.spacedBy(16.dp)
+    ) {
+        items(18, key = { it }) {
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .aspectRatio(2f / 3f)
+                    .background(FluxaColors.surfaceCard, RoundedCornerShape(10.dp))
+            )
+        }
+    }
+}
+
 @Composable
 private fun DiscoverFilters(
     filters: DiscoverFiltersUiModel,