import { FormControlLabel } from "@mui/material";
import { FC } from "react";

import { IColumnFilterValue } from "shared/model/types";

import { applyFilter } from "../../lib";
import { IProps } from "../../model";

import Styled from "./BooleanInput.style";

export const BooleanInput: FC<Props> = ({ setValue, value }) => {
	function onClick(newValue: IColumnFilterValue) {
		setValue(newValue);
		applyFilter(newValue);
	}

	return (
		<Styled.FormGroup>
			<FormControlLabel
				control={
					<Styled.Checkbox
						checked={!value[1] && !value[2]}
						onClick={() => onClick({ 1: "", 2: "" })}
						size="small"
					/>
				}
				label={"All"}
			/>
			<FormControlLabel
				control={
					<Styled.Checkbox
						checked={Boolean(value[1])}
						onClick={() => onClick({ 1: "true", 2: "" })}
						size="small"
					/>
				}
				label={"Yes"}
			/>
			<FormControlLabel
				control={
					<Styled.Checkbox
						checked={Boolean(value[2])}
						onClick={() => onClick({ 1: "", 2: "true" })}
						size="small"
					/>
				}
				label={"No"}
			/>
		</Styled.FormGroup>
	);
};

type Props = Omit<IProps, "label">;