"use client";

import "./SearchForm.scss";
import Image from "next/image";
import search from "./icons/search.svg";

interface ISearchFormProps
  extends React.InputHTMLAttributes<HTMLInputElement> {
  handleSubmit: (e: React.MouseEvent<HTMLFormElement>) => void;
}

const SearchForm: React.FC<ISearchFormProps> = ({
  handleSubmit,
  name,
  placeholder,
  value,
  onChange,
}: ISearchFormProps) => {
  return (
    <form onSubmit={handleSubmit} className="search-form">
      <div className="search-form__input">
        <Image src={search} alt="Search Icon" />
        <input
          onChange={onChange}
          value={value}
          placeholder={placeholder}
          name={name}
          type="text"
        />
      </div>
      <button type="submit">Поиск</button>
    </form>
  );
};

export default SearchForm;
