import {Input} from "@chakra-ui/react";
import React from "react";
import {CustomSearchType} from "../intefaces/interfaces";

function FilterInput(props: CustomSearchType) {
    const {records, filterCols, value, placeholder, onChange} = props;
    const filterSearch = (e: any) => {
        let val = e.target.value;
        if (val.trim() === "") {
            onChange(records)
            return;
        }
        let result: any = [];
        for (let i = 0; i < records.length; i++) {
            let record = records[i];
            for (let j = 0; j < filterCols.length; j++) {
                let col = filterCols[j];
                if (record[col] && record[col].toString().toLowerCase().includes(val.toLowerCase())) {
                    result.push(record);
                    break;
                }
            }
        }
        onChange(result)
    }
    return (
        <Input
            onChange={filterSearch}
            mb="26px"
            placeholder={placeholder}
            _placeholder={{
                color: "black",
                fontFamily: "MaisonBold",
                fontSize: "14px",
                letterSpacing: "0.5px",
                lineHeight: "16px",
            }}
        />
    )
}

export default FilterInput;