import { FC, useMemo } from "react";
import { Title, TitleProps } from "@mantine/core";
import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";

type Props = TitleProps;

const DealServicesTotalLabel: FC<Props> = ({ order = 3, ...props }) => {
    const { dealServicesList } = useFulfillmentBaseContext();
    const total = useMemo(
        () =>
            dealServicesList.dealServices.reduce(
                (acc, item) => acc + item.price * item.quantity,
                0
            ),
        [dealServicesList.dealServices]
    );

    return (
        <Title
            style={{ textAlign: "end" }}
            order={order}
            {...props}>
            Итог: {total.toLocaleString("ru")}₽
        </Title>
    );
};

export default DealServicesTotalLabel;
