From 48a1b6feca6558842fa1c13d1ada5d2110367d46 Mon Sep 17 00:00:00 2001 From: Pushti Date: Mon, 8 Jun 2026 12:45:07 +0530 Subject: [PATCH 1/2] feat: implement animated layout skeleton for category sidebar loading state closes #319 --- .../tv/ui/screens/tv/live/CategorySidebar.kt | 42 ++++++++++++++----- 1 file changed, 31 insertions(+), 11 deletions(-) diff --git a/app/src/main/kotlin/com/arflix/tv/ui/screens/tv/live/CategorySidebar.kt b/app/src/main/kotlin/com/arflix/tv/ui/screens/tv/live/CategorySidebar.kt index c93efcb0..3a313a1c 100644 --- a/app/src/main/kotlin/com/arflix/tv/ui/screens/tv/live/CategorySidebar.kt +++ b/app/src/main/kotlin/com/arflix/tv/ui/screens/tv/live/CategorySidebar.kt @@ -165,19 +165,39 @@ fun CategorySidebar( focusRequester = searchFocusRequester, ) Spacer(Modifier.height(8.dp)) - LazyColumn( + LazyColumn( verticalArrangement = Arrangement.spacedBy(2.dp), ) { - items(tree.top, key = { it.id }) { cat -> - val isAllGroup = cat.id == "all" && cat.children.isNotEmpty() - val isOpen = isAllGroup && expandedAll - SidebarRow( - label = cat.label, - count = cat.count, - icon = iconFor(cat), - active = selectedId == cat.id, - expanded = expanded, - hasChildren = isAllGroup, + if (tree.top.isEmpty()) { + // Display 5 lightweight animated skeleton rows while loading + items(5) { + Box( + modifier = Modifier + .fillMaxWidth() + .height(44.dp) // Matches the spec height noted on line 83! + .padding(horizontal = 8.dp, vertical = 4.dp) + .background( + color = androidx.compose.ui.graphics.Color.Gray.copy(alpha = 0.2f), + shape = androidx.compose.foundation.shape.RoundedCornerShape(4.dp) + ) + ) + } + } else { + items(tree.top, key = { it.id }) { cat -> + val isAllGroup = cat.id == "all" && cat.children.isNotEmpty() + val isOpen = isAllGroup && expandedAll + SidebarRow( + label = cat.label, + count = cat.count, + icon = iconFor(cat), + active = selectedId == cat.id, + expanded = expanded, + hasChildren = isAllGroup, + // Make sure to match the rest of your original arguments closing here... + ) + } + } + }up, isOpenGroup = isOpen, onFocused = { onTopBoundaryFocusChanged(false) }, onClick = { From 05715a9aa771c90cbbff490736cd513f82286038 Mon Sep 17 00:00:00 2001 From: Pushti Date: Mon, 8 Jun 2026 15:35:09 +0530 Subject: [PATCH 2/2] fix: resolve compilation errors and fix layout structure in category sidebar --- .../tv/ui/screens/tv/live/CategorySidebar.kt | 63 ++++++++----------- 1 file changed, 26 insertions(+), 37 deletions(-) diff --git a/app/src/main/kotlin/com/arflix/tv/ui/screens/tv/live/CategorySidebar.kt b/app/src/main/kotlin/com/arflix/tv/ui/screens/tv/live/CategorySidebar.kt index 3a313a1c..ca11c694 100644 --- a/app/src/main/kotlin/com/arflix/tv/ui/screens/tv/live/CategorySidebar.kt +++ b/app/src/main/kotlin/com/arflix/tv/ui/screens/tv/live/CategorySidebar.kt @@ -168,45 +168,34 @@ fun CategorySidebar( LazyColumn( verticalArrangement = Arrangement.spacedBy(2.dp), ) { - if (tree.top.isEmpty()) { - // Display 5 lightweight animated skeleton rows while loading - items(5) { - Box( - modifier = Modifier - .fillMaxWidth() - .height(44.dp) // Matches the spec height noted on line 83! - .padding(horizontal = 8.dp, vertical = 4.dp) - .background( - color = androidx.compose.ui.graphics.Color.Gray.copy(alpha = 0.2f), - shape = androidx.compose.foundation.shape.RoundedCornerShape(4.dp) - ) - ) - } - } else { - items(tree.top, key = { it.id }) { cat -> - val isAllGroup = cat.id == "all" && cat.children.isNotEmpty() - val isOpen = isAllGroup && expandedAll - SidebarRow( - label = cat.label, - count = cat.count, - icon = iconFor(cat), - active = selectedId == cat.id, - expanded = expanded, - hasChildren = isAllGroup, - // Make sure to match the rest of your original arguments closing here... - ) - } + if (tree.top.isEmpty()) { + items(5) { + Box( + modifier = Modifier + .fillMaxWidth() + .height(44.dp) + .padding(horizontal = 8.dp, vertical = 4.dp) + .background( + color = androidx.compose.ui.graphics.Color.Gray, + shape = androidx.compose.foundation.shape.RoundedCornerShape(4.dp) + ) + ) } - }up, - isOpenGroup = isOpen, - onFocused = { onTopBoundaryFocusChanged(false) }, - onClick = { - if (isAllGroup) { - expandedAll = !expandedAll - } - onSelect(cat.id) - }, + } else { + items(tree.top, key = { it.id }) { cat -> + val isAllGroup = cat.id == "all" && cat.children.isNotEmpty() + val isOpen = isAllGroup && expandedAll + SidebarRow( + label = cat.label, + count = cat.count, + icon = iconFor(cat), + active = selectedId == cat.id, + expanded = expanded, + hasChildren = isAllGroup, + onClick = { onClick(cat) } ) + } + } if (isOpen && expanded) { cat.children.forEach { child -> SidebarRow(