The search Input wrotten right

import { memo, useDeferredValue, useState } from "react";

function SearchBox() {
  const [searchInput, setSearchInput] = useState("");
  const deferredQuery = useDeferredValue(searchInput);

  return (
    <div>
      <input
        type="text"
        value={searchInput}
        onChange={(e) => setSearchInput(e.target.value)}
        placeholder="Search..."
      />
      <Results searchInput={deferredQuery} />
    </div>
  );
}

type ResultsProps = {
  searchInput: string;
};
const Results = memo(({ searchInput }: ResultsProps) => {
  return <p>{searchInput}</p>;
});

export default SearchBox;

codesandbox.io