import { Skeleton } from '@astryxdesign/core'
import { SectionCard } from '@overdeck/deck-ui'
import type { JSX } from 'react'

export function DeckPageSkeleton(): JSX.Element {
  return (
    <div className="flex flex-col gap-3.5" data-deck-page-skeleton>
      <SectionCard title="Loading">
        <div className="flex flex-col gap-3">
          <Skeleton width="40%" height={14} />
          <Skeleton height={96} />
          <Skeleton height={96} />
        </div>
      </SectionCard>
    </div>
  )
}