deps(Algolia): upgrade React InstantSearch

Author: Betree

app/App.jsx

@@ -6,7 +6,7 @@ import { ApolloProvider } from '@apollo/client'
 // Import libs
 import React from 'react'
 import { I18nextProvider } from 'react-i18next'
-import { Configure, Index, InstantSearch } from 'react-instantsearch-dom'
+import { Configure, Index, InstantSearch } from 'react-instantsearch'
 import { Provider as ReduxProvider } from 'react-redux'
 import { polyfill as smoothSrollPolyfill } from 'smoothscroll-polyfill'
 import { ThemeProvider } from 'styled-components'

app/components/Search/IndexSearchEntriesCount.js

@@ -1,7 +1,7 @@
 import { get } from 'lodash'
 import PropTypes from 'prop-types'
 import React from 'react'
-import { connectStateResults, Index } from 'react-instantsearch-dom'
+import { connectStateResults, Index } from 'react-instantsearch'
 
 const SearchResultsCount = connectStateResults(({ searchResults }) => {
   return get(searchResults, 'nbHits', 0)

app/components/Search/SearchBox.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import { withNamespaces } from 'react-i18next'
-import { SearchBox as AlgoliaSearchBox } from 'react-instantsearch-dom'
+import { SearchBox as AlgoliaSearchBox } from 'react-instantsearch'
 import { withRouter } from 'react-router'
 import styled from 'styled-components'
 

app/components/Search/SearchPage.js

@@ -1,7 +1,7 @@
 import { capitalize } from 'lodash'
 import React from 'react'
 import { Trans, withNamespaces } from 'react-i18next'
-import { connectSearchBox, Index, InfiniteHits } from 'react-instantsearch-dom'
+import { Index, InfiniteHits, useSearchBox } from 'react-instantsearch'
 import { Link } from 'react-router-dom'
 import styled from 'styled-components'
 import { Search as SearchIcon } from 'styled-icons/fa-solid'
@@ -173,4 +173,14 @@ const SearchPage = ({ t, refine, match, location }) => {
   )
 }
 
+function connectSearchBox(Component) {
+  const SearchBox = (props) => {
+    const data = useSearchBox(props)
+
+    return <Component {...props} {...data} />
+  }
+
+  return SearchBox
+}
+
 export default withNamespaces('main')(connectSearchBox(SearchPage))