import { DatePickerInput, DatePickerInputProps } from "@mantine/dates";
import { Divider, Stack, Text } from "@mantine/core";
import ClientSelectNew from "../../../../../../components/Selects/ClientSelectNew/ClientSelectNew.tsx";
import { BaseMarketplaceSchema, ClientSchema, TransactionTagSchema, UserSchema } from "../../../../../../client";
import { ObjectSelectProps } from "../../../../../../components/ObjectSelect/ObjectSelect.tsx";
import BaseMarketplaceSelect
    from "../../../../../../components/Selects/BaseMarketplaceSelect/BaseMarketplaceSelect.tsx";
import DealStatusSelect from "../../../../../DealsPage/components/DealStatusSelect/DealStatusSelect.tsx";
import { DealStatusType } from "../../../../../../shared/enums/DealStatus.ts";
import { ProfitTableSegmentedControl } from "../ProfitTableSegmentedControl/ProfitTableSegmentedControl.tsx";
import ManagerSelect from "../../../../../../components/ManagerSelect/ManagerSelect.tsx";
import TransactionTagSelect from "../../../../components/ExpenseTagSelect/TransactionTagSelect.tsx";


type SelectProps<T> = Omit<
    ObjectSelectProps<T>,
    "data" | "getValueFn" | "getLabelFn"
>;

type FiltersProps = {
    datePickerProps?: DatePickerInputProps<"range">;

    clientSelectProps?: Omit<ObjectSelectProps<ClientSchema>, "data">;
    onClientClear?: () => void;

    baseMarketplaceSelectProps?: SelectProps<BaseMarketplaceSchema>;
    onBaseMarketplaceClear?: () => void;

    dealStatusSelectProps?: Omit<ObjectSelectProps<DealStatusType>, "data">;
    onDealStatusClear?: () => void;

    managerSelectProps?: SelectProps<UserSchema | null | undefined>;
    onManagerClear?: () => void;

    expenseTagSelectProps?: SelectProps<TransactionTagSchema | null>;
    onExpenseTagClear?: () => void;

    incomeTagSelectProps?: SelectProps<TransactionTagSchema | null>;
    onIncomeTagClear?: () => void;

    groupTableByProps?: {
        value: string,
        onChange: (value: string) => void,
    };
}

export const Filters = (props: FiltersProps) => {
    const getTransactionTagsSelect = (isIncome: boolean) => {
        const selectProps = isIncome ? props.incomeTagSelectProps : props.expenseTagSelectProps;
        if (!selectProps) return;
        const onClear = isIncome ? props.onIncomeTagClear : props.onExpenseTagClear;
        const label = "Фильтры для " + (isIncome ? "доходов:" : "расходов:");
        return (
            <>
                <Divider />
                <Text>{label}</Text>
                <TransactionTagSelect
                    {...selectProps}
                    onClear={onClear}
                    placeholder={"Выберите тег"}
                    isIncome={isIncome}
                />
            </>
        )
    }

    return (
        <Stack mb={"lg"}>
            <Divider />
            <Text>
                Фильтры для выручки и прибыли:
            </Text>
            {props.datePickerProps &&
                <DatePickerInput
                    {...props.datePickerProps}
                    type="range"
                    placeholder="Выберите даты"
                    maxDate={new Date()}
                    valueFormat={"DD.MM.YYYY"}
                />
            }
            {props.dealStatusSelectProps &&
                <DealStatusSelect
                    {...props.dealStatusSelectProps}
                    onClear={props.onDealStatusClear}
                    clearable
                    placeholder={"Выберите статус"}
                />
            }
            {props.clientSelectProps &&
                <ClientSelectNew
                    {...props.clientSelectProps}
                    onClear={props.onClientClear}
                    clearable
                    searchable
                    placeholder={"Выберите клиента"}
                />
            }
            {props.baseMarketplaceSelectProps &&
                <BaseMarketplaceSelect
                    {...props.baseMarketplaceSelectProps}
                    onClear={props.onBaseMarketplaceClear}
                    clearable
                    placeholder={"Выберите маркетплейс"}
                />
            }
            {props.managerSelectProps &&
                <ManagerSelect
                    {...props.managerSelectProps}
                    onClear={props.onManagerClear}
                    placeholder={"Выберите менеджера"}
                />
            }
            {getTransactionTagsSelect(false)}
            {getTransactionTagsSelect(true)}
            {props.groupTableByProps &&
                <>
                    <Divider />
                    <Text>Группировка таблицы:</Text>
                    <ProfitTableSegmentedControl
                        {...props.groupTableByProps}
                        orientation={"vertical"}
                        size={"md"}
                        w={"100%"}
                    />
                </>
            }
        </Stack>
    );
};