import React from "react";
import DateInput from "./DateInput";
import styles from "../styles/stat.module.css";

interface DateFiltersProps {
  dateStart: string;
  dateEnd: string;
  onChange: (field: "dateStart" | "dateEnd", value: string) => void;
  onApply: () => void;
  onClear: () => void;
}

const DateFilters: React.FC<DateFiltersProps> = ({ dateStart, dateEnd, onChange, onApply, onClear }) => (
    <div className={styles.filters}>
        <DateInput
        label="Дата начала"
        value={dateStart}
        onChange={e => onChange("dateStart", e.target.value)}
        max={dateEnd || undefined}
        />
        <DateInput
        label="Дата окончания" 
        value={dateEnd}
        onChange={e => onChange("dateEnd", e.target.value)}
        min={dateStart || undefined}
        />
        <button className={styles.filterBtn} onClick={onApply}>Применить</button>
        <button className={styles.filterBtn} onClick={onClear}>Очистить фильтр</button>
    </div>
);

export default DateFilters;