import { useMemo } from "react";
import { MRT_ColumnDef } from "mantine-react-table";
import { CardStatusHistorySchema } from "../../../../../../client";
import { Spoiler, Text } from "@mantine/core";

export const useDealStatusChangeTableColumns = () => {
    return useMemo<MRT_ColumnDef<CardStatusHistorySchema>[]>(
        () => [
            {
                accessorKey: "changedAt",
                header: "Дата",
                accessorFn: row =>
                    new Date(row.changedAt).toLocaleString("ru-RU"),
            },
            {
                header: "Пользователь",
                accessorFn: row =>
                    `${row.user.firstName} ${row.user.secondName}`,
            },
            {
                accessorKey: "fromStatus.name",
                header: "Из статуса",
            },
            {
                accessorKey: "toStatus.name",
                header: "В статус",
            },
            {
                accessorKey: "comment",
                header: "Комментарий",
                Cell: ({ row }) => (
                    <Spoiler
                        maxHeight={80}
                        showLabel={"Показать весь"}
                        hideLabel={"Скрыть"}>
                        <Text
                            style={{
                                wordWrap: "break-word",
                                wordBreak: "break-all",
                                whiteSpace: "normal",
                            }}
                            span>
                            {row.original.comment}
                            <br />
                        </Text>
                    </Spoiler>
                ),
            },
        ],
        []
    );
};
