import React, { FC, useMemo } from "react";
import { Box } from "@mantine/core";
import DealCard from "@/app/deals/components/shared/DealCard/DealCard";
import SortableItem from "@/components/dnd/SortableItem";
import { DealSchema } from "@/lib/client";

type Props = {
    deal: DealSchema;
};

const DealContainer: FC<Props> = ({ deal }) => {
    const dealBody = useMemo(() => <DealCard deal={deal} />, [deal]);

    return (
        <Box>
            <SortableItem
                dragHandleStyle={{ cursor: "pointer" }}
                id={deal.id}
                renderItem={() => dealBody}
            />
        </Box>
    );
};

export default DealContainer;
