+5

src/webapp/app/(dashboard)/url/loading.tsx

View file Reviewed

··· 1 1 + import SembleContainerSkeleton from '@/features/semble/containers/sembleContainer/Skeleton.SembleContainer'; 2 2 + 3 3 + export default function Loading() { 4 4 + return <SembleContainerSkeleton />; 5 5 + }

+1 -1

src/webapp/features/semble/components/urlAddedBySummary/Skeleton.UrlAddedBySummary.tsx

View file Reviewed

··· 1 1 import { Avatar, Group, Skeleton } from '@mantine/core'; 2 2 3 3 - export default async function UrlAddedBySummarySkeleton() { 3 3 + export default function UrlAddedBySummarySkeleton() { 4 4 return ( 5 5 <Group gap={'xs'}> 6 6 <Avatar src={null} />

+37

src/webapp/features/semble/containers/sembleContainer/Skeleton.SembleContainer.tsx

View file Reviewed

··· 1 1 + import { Image, Container, Stack, Box } from '@mantine/core'; 2 2 + import BG from '@/assets/semble-header-bg.webp'; 3 3 + import SembleHeaderSkeleton from '../../components/SembleHeader/Skeleton.SembleHeader'; 4 4 + 5 5 + export default function SembleContainerSkeleton() { 6 6 + return ( 7 7 + <Container p={0} fluid> 8 8 + <Box style={{ position: 'relative', width: '100%' }}> 9 9 + <Image 10 10 + src={BG.src} 11 11 + alt="bg" 12 12 + fit="cover" 13 13 + w="100%" 14 14 + h={{ base: 100, md: 120 }} 15 15 + /> 16 16 + 17 17 + {/* White gradient overlay */} 18 18 + <Box 19 19 + style={{ 20 20 + position: 'absolute', 21 21 + bottom: 0, 22 22 + left: 0, 23 23 + width: '100%', 24 24 + height: '60%', // fade height 25 25 + background: 'linear-gradient(to top, white, transparent)', 26 26 + pointerEvents: 'none', 27 27 + }} 28 28 + /> 29 29 + </Box> 30 30 + <Container px={'xs'} pb={'xs'} size={'xl'}> 31 31 + <Stack gap={'xl'}> 32 32 + <SembleHeaderSkeleton /> 33 33 + </Stack> 34 34 + </Container> 35 35 + </Container> 36 36 + ); 37 37 + }