Problem with react-instantsearch

The Hits are not rendering on screen and the searchbox is disabled (not taking input).

import algoliasearch from "algoliasearch/lite";
import React from "react";
import {
  InstantSearch,
  Hits,
  SearchBox,
  Highlight,
} from "react-instantsearch-dom";
import PropTypes from "prop-types";
import "./Search.css";

const searchClient = algoliasearch(
  process.env.REACT_APP_ALGOLIA_APP_ID,
  process.env.REACT_APP_ALGOLIA_SEARCH_ONLY_API_KEY
);
function Search() {
  return (
    <div className="search">
      <InstantSearch indexName="products" searchClient={searchClient}>
        <SearchBox className="search__bar" />
        <Hits hitComponent={Hit} />
      </InstantSearch>
    </div>
  );
}

function Hit(props) {
  return (
    <div className="search__product">
      <img
        src={props.hit.image}
        className="product__image"
        alt={props.hit.name}
      />
      <div className="search__desc">
        <Highlight attribute="name" hit={props.hit} />
        <br />
        <br />
        <strong className="hit-price">₹{props.hit.price}.00</strong>
      </div>
    </div>
  );
}

Hit.propTypes = {
  hit: PropTypes.object.isRequired,
};

export default Search;

Hi there,

That certainly looks reasonable. Any errors logged to the console? Could you place your app into a Codesandbox to help identify the issue?