ExtensionCardSkeleton.tsx29 lines · main

1	import { Switch } from 'ui'
2	import { ShimmeringLoader } from 'ui-patterns/ShimmeringLoader'
3
4	export interface ExtensionCardSkeletonProps {
5	index?: number
6	}
7
8	const ExtensionCardSkeleton = ({ index = 0 }: ExtensionCardSkeletonProps) => {
9	return (
10	<div className="flex border-overlay flex-col overflow-hidden rounded-sm border shadow-xs">
11	<div className="border-overlay bg-surface-100 flex justify-between w-full border-b py-3 px-4">
12	<div className="flex items-center gap-1 max-w-[85%]">
13	<div className="flex items-center space-x-2 truncate">
14	<ShimmeringLoader className="h-5 w-32 m-0 text-foreground" delayIndex={index} />
15	</div>
16	</div>
17
18	<Switch checked={false} disabled={true} />
19	</div>
20	<div className="bg-panel-header-light bg-panel-secondary-light flex h-full flex-col justify-between">
21	<div className="py-3 px-4">
22	<ShimmeringLoader className="h-4 w-48" delayIndex={index} />
23	</div>
24	</div>
25	</div>
26	)
27	}
28
29	export default ExtensionCardSkeleton