From 50533d7eee225ae876258f0b33f2b691976e3653 Mon Sep 17 00:00:00 2001
From: pdelfan <pdelfan@gmail.com>
Date: Fri, 22 May 2026 01:23:12 -0700
Subject: [PATCH] feat: more accurate collections nav list skeleton

---
 .../navigation/navbar/Skeleton.Navbar.tsx           | 13 +++++--------
 .../Skeleton.CollectionsNavList.tsx                 |  6 +++---
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/src/webapp/components/navigation/navbar/Skeleton.Navbar.tsx b/src/webapp/components/navigation/navbar/Skeleton.Navbar.tsx
index 582b099c..9bfa9885 100644
--- a/src/webapp/components/navigation/navbar/Skeleton.Navbar.tsx
+++ b/src/webapp/components/navigation/navbar/Skeleton.Navbar.tsx
@@ -16,6 +16,7 @@ import {
 
 import SembleLogo from '@/assets/semble-logo.svg';
 import NavbarToggle from '../NavbarToggle';
+import CollectionsNavListSkeleton from '@/features/collections/components/collectionsNavList/Skeleton.CollectionsNavList';
 
 export default function NavbarSkeleton() {
   return (
@@ -35,7 +36,7 @@ export default function NavbarSkeleton() {
       </Group>
 
       <AppShellSection grow component={ScrollArea}>
-        <Stack mt={'xl'}>
+        <Stack gap={'md'} mt={'xl'}>
           {/* Profile Menu Skeleton */}
           <Group gap="sm" m={5} wrap="nowrap">
             <Skeleton h={38} w={38} />
@@ -43,21 +44,17 @@ export default function NavbarSkeleton() {
           </Group>
 
           {/* Nav Items Skeleton */}
-          <Stack gap={5} mt="xs">
+          <Stack gap={5}>
             {[...Array(6)].map((_, i) => (
               <Skeleton key={i} height={40} radius="md" />
             ))}
           </Stack>
         </Stack>
 
-        <Divider my={'sm'} />
+        <Divider mb={'sm'} mt={'18'} />
 
         {/* Collections List Skeleton */}
-        <Stack gap={5}>
-          {[...Array(3)].map((_, i) => (
-            <Skeleton key={i} height={36} radius="md" />
-          ))}
-        </Stack>
+        <CollectionsNavListSkeleton />
       </AppShellSection>
 
       <AppShellSection>
diff --git a/src/webapp/features/collections/components/collectionsNavList/Skeleton.CollectionsNavList.tsx b/src/webapp/features/collections/components/collectionsNavList/Skeleton.CollectionsNavList.tsx
index c9976118..14c467f2 100644
--- a/src/webapp/features/collections/components/collectionsNavList/Skeleton.CollectionsNavList.tsx
+++ b/src/webapp/features/collections/components/collectionsNavList/Skeleton.CollectionsNavList.tsx
@@ -4,13 +4,13 @@ export default function CollectionsNavListSkeleton() {
   return (
     <Stack gap={'xs'}>
       <Group justify="space-between">
-        <Text fw={600} c={'gray'}>
+        <Text fw={600} fz={'sm'} c={'gray'}>
           Collections
         </Text>
 
         <Group gap={'xs'}>
-          <Skeleton radius={'xl'} h={26} w={73} />
-          <Skeleton radius={'xl'} h={26} w={26} />
+          <Skeleton radius={'xl'} h={30} w={73} />
+          <Skeleton radius={'xl'} h={30} w={26} />
         </Group>
       </Group>
 
-- 
2.51.2