| | |
| | | const Slice = React.memo(() => { |
| | | return ( |
| | | <div className='flex flex-col gap-y-1'> |
| | | <div className='flex h-5 w-full items-center bg-state-base-hover'> |
| | | <span className='h-5 w-[30px] bg-state-base-hover-alt' /> |
| | | <div className='w-full h-5 bg-state-base-hover flex items-center'> |
| | | <span className='w-[30px] h-5 bg-state-base-hover-alt' /> |
| | | </div> |
| | | <div className='h-5 w-2/3 bg-state-base-hover' /> |
| | | <div className='w-2/3 h-5 bg-state-base-hover' /> |
| | | </div> |
| | | ) |
| | | }) |
| | |
| | | |
| | | const FullDocListSkeleton = () => { |
| | | return ( |
| | | <div className='relative z-10 flex w-full grow flex-col gap-y-3 overflow-y-hidden'> |
| | | <div className='absolute bottom-14 left-0 top-0 z-20 h-full w-full bg-dataset-chunk-list-mask-bg' /> |
| | | {[...Array.from({ length: 15 })].map((_, index) => <Slice key={index} />)} |
| | | <div className='w-full grow flex flex-col gap-y-3 relative z-10 overflow-y-hidden'> |
| | | <div className='absolute top-0 left-0 bottom-14 w-full h-full bg-dataset-chunk-list-mask-bg z-20' /> |
| | | {[...Array(15)].map((_, index) => <Slice key={index} />)} |
| | | </div> |
| | | ) |
| | | } |