Algolia's searchBox is stuck and is not accepting new values

Viewed 13

I'm trying to type new values ​​after instantiating Algolia's SearchBox, but it doesn't change the input value at all. I've recreated the NextJs boilerplate and implemented it 5 times, but the value never changes. What could it be?

In short: when I type something in the input, the value just doesn't update

problem

Github:

https://github.com/Arthur-Maskalenkas/bug-report

sandbox:

https://codesandbox.io/p/github/Arthur-Maskalenkas/bug-report/csb-zf1foq/draft/happy-smoke?file=%2FREADME.md

my currently index.tsx is

import type { NextPage } from 'next'

import algoliasearch from 'algoliasearch/lite';
import {
  InstantSearch,
  SearchBox,
  Pagination,
  Configure,
} from 'react-instantsearch-dom';

const Home: NextPage = () => {
  const searchClient = algoliasearch(
    'B1G2GM9NG0',
    'aadef574be1f9252bb48d4ea09b5cfe5'
  );

  return (
    <div className="ais-InstantSearch">
      <h1>React InstantSearch e-commerce demos</h1>
      <InstantSearch searchClient={searchClient} indexName="demo_ecommerce">
        <Configure hitsPerPage={8}/>
        <div className="search-panel">
          <div className="search-panel__filters">

          </div>

          <div className="search-panel__results">
            <SearchBox
              className="searchbox"
              translations={{
                placeholder: ''
              }}
            />

            <div className="pagination">
              <Pagination/>
            </div>
          </div>
        </div>
      </InstantSearch>
    </div>
  )
}


export default Home

my package

    {
  "name": "teste2",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "algoliasearch": "^4.14.2",
    "next": "12.3.1",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-instantsearch-dom": "^6.33.0"
  },
  "devDependencies": {
    "@types/node": "18.7.20",
    "@types/react": "18.0.21",
    "@types/react-dom": "18.0.6",
    "@types/react-instantsearch-dom": "^6.12.3",
    "eslint": "8.24.0",
    "eslint-config-next": "12.3.1",
    "typescript": "4.8.3"
  }
}
1 Answers

As of version 4 Algolia no longer works.

Related