import { FC } from "react";
import { Stack, Text } from "@mantine/core";
import DealCard from "@/app/deals/components/shared/DealCard/DealCard";
import GroupWithDealsSchema from "@/types/GroupWithDealsSchema";
import styles from "./DealsGroup.module.css";

type Props = {
    group: GroupWithDealsSchema;
};

const DealsGroup: FC<Props> = ({ group }) => {
    return (
        <Stack
            className={styles["group-container"]}
            gap={"xs"}
            bdrs={"lg"}
            p={"xs"}>
            <Text mx={"xs"}>{group.name}</Text>
            {group.items.map(deal => (
                <DealCard
                    deal={deal}
                    isInGroup
                    key={deal.id}
                />
            ))}
        </Stack>
    );
};

export default DealsGroup;