review-data/src/components/home/data-session.tsx

39 lines
1.1 KiB
TypeScript

/* eslint-disable @typescript-eslint/no-explicit-any */
import { Box } from "lucide-react";
import { Empty, EmptyHeader, EmptyMedia, EmptyTitle } from "../ui/empty";
import Item from "./item";
import SKUListSidebar from "./sku-list-sidebar";
export interface IDataSessionProps {
data: any;
}
export default function DataSession({ data }: IDataSessionProps) {
return (
<>
<div className="col-span-8 display flex flex-col gap-10">
{data?.data?.length > 0 &&
(data.data || []).map((item: ItemType, index: number) => {
return <Item key={item?.sku || index} data={item} />;
})}
{data?.data?.length <= 0 && (
<Empty>
<EmptyHeader>
<EmptyMedia variant="icon">
<Box />
</EmptyMedia>
<EmptyTitle>No Products</EmptyTitle>
</EmptyHeader>
</Empty>
)}
</div>
<div className="col-span-4 -my-2 border-l">
<div className="sticky z-50 top-0">
<SKUListSidebar data={data?.data} />
</div>
</div>
</>
);
}