fix: make search working

This commit is contained in:
Valeriy
2019-05-05 21:12:18 +03:00
committed by mrugesh
parent ecfc6c23a6
commit 3552fd392a
8 changed files with 124 additions and 193 deletions

193
client/package-lock.json generated
View File

@@ -1686,12 +1686,12 @@
"integrity": "sha512-aUjdRFISbuFOl0EIZc+9e4FfZp0bDZgAdOOf30bJmw8VM9v84SHyVyxDfbWxpGYbdZD/9XoKxfHVNmxPkhwyGw=="
},
"algoliasearch": {
"version": "3.30.0",
"resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-3.30.0.tgz",
"integrity": "sha512-FuinyPgNn0MeAHm9pan6rLgY6driY3mcTo4AWNBMY1MUReeA5PQA8apV/3SNXqA5bbsuvMvmA0ZrVzrOmEeQTA==",
"version": "3.32.1",
"resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-3.32.1.tgz",
"integrity": "sha512-NaaHMboU9tKwrU3aim7LlzSDqKb+1TGaC+Lx3NOttSnuMHbPpaf+7LtJL4KlosbRWEwqb9t5wSYMVDrPTH2dNA==",
"requires": {
"agentkeepalive": "^2.2.0",
"debug": "^2.6.8",
"debug": "^2.6.9",
"envify": "^4.0.0",
"es6-promise": "^4.1.0",
"events": "^1.1.0",
@@ -1723,14 +1723,13 @@
}
},
"algoliasearch-helper": {
"version": "2.26.1",
"resolved": "https://registry.npmjs.org/algoliasearch-helper/-/algoliasearch-helper-2.26.1.tgz",
"integrity": "sha512-fQBZZXC3rac4wadRj5wA/gxy88Twb+GQF3n8foew8SAsqe9Q59PFq1y3j08pr6eNSRYkZJV7qMpe7ox5D27KOw==",
"version": "2.27.0",
"resolved": "https://registry.npmjs.org/algoliasearch-helper/-/algoliasearch-helper-2.27.0.tgz",
"integrity": "sha512-ly815eMqpoLbb5zMMzzWyg3GcdSG5gEDE+jR/DLAPFTyYJW1XKpeWCenflqvUVl3akN9R/ctGF2vao2da6pBDA==",
"requires": {
"events": "^1.1.1",
"lodash": "^4.17.5",
"qs": "^6.5.1",
"util": "^0.10.3"
"qs": "^6.5.1"
}
},
"alphanum-sort": {
@@ -5674,9 +5673,9 @@
}
},
"es6-promise": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.4.tgz",
"integrity": "sha512-/NdNZVJg+uZgtm9eS3O6lrOLYmQag2DjdEXuPaHlZ6RuVqgqaVZfgYCepEIKsLqwdQArOPtC3XzRLqGGfT8KQQ=="
"version": "4.2.6",
"resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.6.tgz",
"integrity": "sha512-aRVgGdnmW2OiySVPUC9e6m+plolMAJKjZnQlCwNSuK5yQ0JN61DZSO1X1Ufd1foqWRAlig0rhduTCHe7sVtK5Q=="
},
"es6-promisify": {
"version": "6.0.1",
@@ -6829,14 +6828,6 @@
"debug": "^3.1.0"
}
},
"for-each": {
"version": "0.3.3",
"resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
"integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==",
"requires": {
"is-callable": "^1.1.3"
}
},
"for-in": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
@@ -11052,11 +11043,6 @@
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
"integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
},
"is-function": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-function/-/is-function-1.0.1.tgz",
"integrity": "sha1-Es+5i2W1fdPRk6MSH19uL0N2ArU="
},
"is-generator-fn": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-generator-fn/-/is-generator-fn-1.0.0.tgz",
@@ -14477,15 +14463,6 @@
}
}
},
"parse-headers": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/parse-headers/-/parse-headers-2.0.1.tgz",
"integrity": "sha1-aug6eqJanZtwCswoaYzR8e1+lTY=",
"requires": {
"for-each": "^0.3.2",
"trim": "0.0.1"
}
},
"parse-json": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
@@ -15588,9 +15565,9 @@
"integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc="
},
"qs": {
"version": "6.5.1",
"resolved": "https://registry.npmjs.org/qs/-/qs-6.5.1.tgz",
"integrity": "sha512-eRzhrN1WSINYCDCbrz796z37LOe3m5tmW7RQf6oBntukAG1nmovJvhnwHHRMAfeoItc1m2Hk02WER2aQ/iqs+A=="
"version": "6.7.0",
"resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz",
"integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ=="
},
"query-string": {
"version": "6.4.2",
@@ -15998,27 +15975,6 @@
"resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-3.0.0.tgz",
"integrity": "sha512-XzgvowFrwDo6TWcpJ/WTiarb9UI6lhA4PMzS7n1joK3sHfBBBOQHUc0U4u57D6DWO9vHv6lVSWx2Q/Ymfyv4hw=="
},
"react-freecodecamp-search": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/react-freecodecamp-search/-/react-freecodecamp-search-2.0.2.tgz",
"integrity": "sha1-L94Q9aRLGqFeamuPky1kNesoTzI=",
"requires": {
"query-string": "^6.0.0",
"react-instantsearch": "^5.0.1",
"rxjs": "^5.5.7",
"xhr": "^2.4.1"
},
"dependencies": {
"rxjs": {
"version": "5.5.12",
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-5.5.12.tgz",
"integrity": "sha512-xx2itnL5sBbqeeiVgNPVuQQ1nC8Jp2WfNJhXWHmElW9YmrpS9UVnNzhP3EH3HFqexO5Tlp8GhYY+WEcqcVMvGw==",
"requires": {
"symbol-observable": "1.0.1"
}
}
}
},
"react-ga": {
"version": "2.5.7",
"resolved": "https://registry.npmjs.org/react-ga/-/react-ga-2.5.7.tgz",
@@ -16089,57 +16045,36 @@
}
}
},
"react-instantsearch": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/react-instantsearch/-/react-instantsearch-5.4.0.tgz",
"integrity": "sha512-FiOWhelRYpmpWpByGzXAqYxUF5dOa72Jqtfa6cY0BiTh98NBhVl8qXsfg1nmMNssWafzrqR/Dqfru6hLuUSqKg==",
"react-instantsearch-core": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/react-instantsearch-core/-/react-instantsearch-core-5.5.0.tgz",
"integrity": "sha512-HtI4YczsAfW6aZgINaYM/De5sZHotzoLhTsCp+FsOELnDx8/SiQY6+fUrBS7tPIRAf/25ljbQmY7Giddtci2YQ==",
"requires": {
"@babel/runtime": "^7.1.2",
"react-instantsearch-core": "^5.4.0",
"react-instantsearch-dom": "^5.4.0",
"react-instantsearch-native": "^5.4.0"
"algoliasearch-helper": "^2.26.0",
"lodash": "^4.17.4",
"prop-types": "^15.5.10"
},
"dependencies": {
"@babel/runtime": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
"integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
"version": "7.4.4",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.4.4.tgz",
"integrity": "sha512-w0+uT71b6Yi7i5SE0co4NioIpSYS6lLiXvCzWzGSKvpK5vdQtCbICHMj+gbAKAOtxiV6HsVh/MBdaF9EQ6faSg==",
"requires": {
"regenerator-runtime": "^0.12.0"
}
},
"react-instantsearch-core": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/react-instantsearch-core/-/react-instantsearch-core-5.4.0.tgz",
"integrity": "sha512-nAY3ElSfYITNKLClcdxuB9/XAQN5Gwsfd0WPWym12IrTUE74gHg3gM7EolKAWV1Qx2Cdw7vdNgQqcgD4SH/2lA==",
"requires": {
"@babel/runtime": "^7.1.2",
"algoliasearch-helper": "^2.26.0",
"lodash": "^4.17.4",
"prop-types": "^15.5.10"
}
},
"react-instantsearch-native": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/react-instantsearch-native/-/react-instantsearch-native-5.4.0.tgz",
"integrity": "sha512-2H4C88S8a2utLPKWLLe/97bZQycJAv0iY7VxhaxG0HHed8pRNM2PKvI1ltYQekfgtFDCo0H7+SzNBY5X6b3Slw==",
"requires": {
"@babel/runtime": "^7.1.2",
"algoliasearch": "^3.27.1",
"react-instantsearch-core": "^5.4.0"
"regenerator-runtime": "^0.13.2"
}
},
"regenerator-runtime": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
"version": "0.13.2",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.2.tgz",
"integrity": "sha512-S/TQAZJO+D3m9xeN1WTI8dLKBBiRgXBlTJvbWjCThHWZj9EvHK70Ff50/tYj2J/fvBY6JtFVwRuazHN2E7M9BA=="
}
}
},
"react-instantsearch-dom": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/react-instantsearch-dom/-/react-instantsearch-dom-5.4.0.tgz",
"integrity": "sha512-FzbbIzF7BxpTfsXYFeX1rvJN1pv/VnokVE6ih42JncUABB/ESvi21sh6L33QWp68RjFIisdCr7ONu6Q5FUhjCw==",
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/react-instantsearch-dom/-/react-instantsearch-dom-5.5.0.tgz",
"integrity": "sha512-92LJAbIekB6Ktb8w0n28X+S1QcKXTfg6Fks2kP+XvD455JkpuW/e2on93B5FATgrQePqHHR1rZdbYqIRhEcj8g==",
"requires": {
"@babel/runtime": "^7.1.2",
"algoliasearch": "^3.27.1",
@@ -16147,32 +16082,21 @@
"classnames": "^2.2.5",
"lodash": "^4.17.4",
"prop-types": "^15.5.10",
"react-instantsearch-core": "^5.4.0"
"react-instantsearch-core": "^5.5.0"
},
"dependencies": {
"@babel/runtime": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
"integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
"version": "7.4.4",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.4.4.tgz",
"integrity": "sha512-w0+uT71b6Yi7i5SE0co4NioIpSYS6lLiXvCzWzGSKvpK5vdQtCbICHMj+gbAKAOtxiV6HsVh/MBdaF9EQ6faSg==",
"requires": {
"regenerator-runtime": "^0.12.0"
}
},
"react-instantsearch-core": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/react-instantsearch-core/-/react-instantsearch-core-5.4.0.tgz",
"integrity": "sha512-nAY3ElSfYITNKLClcdxuB9/XAQN5Gwsfd0WPWym12IrTUE74gHg3gM7EolKAWV1Qx2Cdw7vdNgQqcgD4SH/2lA==",
"requires": {
"@babel/runtime": "^7.1.2",
"algoliasearch-helper": "^2.26.0",
"lodash": "^4.17.4",
"prop-types": "^15.5.10"
"regenerator-runtime": "^0.13.2"
}
},
"regenerator-runtime": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
"version": "0.13.2",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.2.tgz",
"integrity": "sha512-S/TQAZJO+D3m9xeN1WTI8dLKBBiRgXBlTJvbWjCThHWZj9EvHK70Ff50/tYj2J/fvBY6JtFVwRuazHN2E7M9BA=="
}
}
},
@@ -16593,11 +16517,18 @@
}
},
"reduce": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/reduce/-/reduce-1.0.1.tgz",
"integrity": "sha1-FPouX/H8VgcDoCDLtfuqtpFWWAQ=",
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/reduce/-/reduce-1.0.2.tgz",
"integrity": "sha512-xX7Fxke/oHO5IfZSk77lvPa/7bjMh9BuCk4OOoX5XTXrM7s0Z+MkPfSDfz0q7r91BhhGSs8gii/VEN/7zhCPpQ==",
"requires": {
"object-keys": "~1.0.0"
"object-keys": "^1.1.0"
},
"dependencies": {
"object-keys": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
"integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA=="
}
}
},
"reduce-reducers": {
@@ -18357,11 +18288,6 @@
}
}
},
"symbol-observable": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.0.1.tgz",
"integrity": "sha1-g0D8RwLDEi310iKI+IKD9RPT/dQ="
},
"symbol-tree": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.2.tgz",
@@ -19551,14 +19477,6 @@
"resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
"integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ=="
},
"util": {
"version": "0.10.4",
"resolved": "https://registry.npmjs.org/util/-/util-0.10.4.tgz",
"integrity": "sha512-0Pm9hTQ3se5ll1XihRic3FDIku70C+iHUdT/W926rSgHV5QgXsYbKZN8MSC3tJtSkhuROzvsQjAaFENRXr+19A==",
"requires": {
"inherits": "2.0.3"
}
},
"util-deprecate": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -20598,17 +20516,6 @@
"resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
"integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
},
"xhr": {
"version": "2.5.0",
"resolved": "https://registry.npmjs.org/xhr/-/xhr-2.5.0.tgz",
"integrity": "sha512-4nlO/14t3BNUZRXIXfXe+3N6w3s1KoxcJUUURctd64BLRe67E4gRwp4PjywtDY72fXpZ1y6Ch0VZQRY/gMPzzQ==",
"requires": {
"global": "~4.3.0",
"is-function": "^1.0.1",
"parse-headers": "^2.0.0",
"xtend": "^4.0.0"
}
},
"xml-name-validator": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-3.0.0.tgz",

View File

@@ -15,6 +15,7 @@
"@fortawesome/react-fontawesome": "^0.1.4",
"@freecodecamp/react-bootstrap": "^0.32.3",
"@reach/router": "^1.2.1",
"algoliasearch": "^3.32.1",
"axios": "^0.18.0",
"browser-cookies": "^1.2.0",
"chai": "^4.2.0",
@@ -43,7 +44,7 @@
"react": "^16.8.6",
"react-calendar-heatmap": "^1.8.0",
"react-dom": "^16.8.6",
"react-freecodecamp-search": "^2.0.2",
"react-instantsearch-dom": "^5.5.0",
"react-ga": "^2.5.7",
"react-helmet": "^5.2.0",
"react-monaco-editor": "^0.25.1",

View File

@@ -44,6 +44,10 @@ class WithInstantSearch extends Component {
if (pathname !== prevPathname || isDropdownEnabled !== enableDropdown) {
toggleSearchDropdown(enableDropdown);
}
const { query, updateSearchQuery } = this.props;
if (query && pathname !== prevPathname && enableDropdown) {
updateSearchQuery('');
}
}
getSearchEnableDropdown = () => !this.props.pathname.startsWith('/search');

View File

@@ -48,7 +48,6 @@ export const reducer = handleActions(
indexName: payload
}),
[types.updateSearchQuery]: (state, { payload }) => {
console.log('query payload', payload);
return {
...state,
query: payload

View File

@@ -10,7 +10,8 @@ import {
isSearchDropdownEnabledSelector,
isSearchBarFocusedSelector,
toggleSearchDropdown,
toggleSearchFocused
toggleSearchFocused,
updateSearchQuery
} from '../redux';
import SearchHits from './SearchHits';
@@ -21,7 +22,8 @@ const propTypes = {
isDropdownEnabled: PropTypes.bool,
isSearchFocused: PropTypes.bool,
toggleSearchDropdown: PropTypes.func.isRequired,
toggleSearchFocused: PropTypes.func.isRequired
toggleSearchFocused: PropTypes.func.isRequired,
updateSearchQuery: PropTypes.func.isRequired
};
const mapStateToProps = createSelector(
@@ -34,7 +36,10 @@ const mapStateToProps = createSelector(
);
const mapDispatchToProps = dispatch =>
bindActionCreators({ toggleSearchDropdown, toggleSearchFocused }, dispatch);
bindActionCreators(
{ toggleSearchDropdown, toggleSearchFocused, updateSearchQuery },
dispatch
);
const placeholder = 'Search 8,000+ lessons, articles, and videos';
@@ -42,10 +47,10 @@ class SearchBar extends Component {
constructor(props) {
super(props);
this.state = {
dropdownOverride: true
};
this.searchBarRef = React.createRef();
this.handleChange = this.handleChange.bind(this);
this.handlePageClick = this.handlePageClick.bind(this);
this.handleSearch = this.handleSearch.bind(this);
}
componentDidMount() {
@@ -59,19 +64,29 @@ class SearchBar extends Component {
document.removeEventListener('click', this.handlePageClick);
}
handlePageClick = e => {
handleChange() {
const { isSearchFocused, toggleSearchFocused } = this.props;
if (!isSearchFocused) {
toggleSearchFocused(true);
}
}
handlePageClick(e) {
const { toggleSearchFocused } = this.props;
const isSearchFocusedClick = this.searchBarRef.current.contains(e.target);
return toggleSearchFocused(isSearchFocusedClick);
};
}
handleSearch = e => {
handleSearch(e, query) {
e.preventDefault();
const { toggleSearchDropdown } = this.props;
const { toggleSearchDropdown, updateSearchQuery } = this.props;
// disable the search dropdown
toggleSearchDropdown(false);
if (query) {
updateSearchQuery(query);
}
return navigate('/search');
};
}
render() {
const { isDropdownEnabled, isSearchFocused } = this.props;
@@ -86,6 +101,7 @@ class SearchBar extends Component {
Search
</label>
<SearchBox
onChange={this.handleChange}
onSubmit={this.handleSearch}
showLoadingIndicator={true}
translations={{ placeholder }}

View File

@@ -1,47 +1,46 @@
import React from 'react';
import {
connectStateResults,
connectAutoComplete
} from 'react-instantsearch-dom';
import { connectStateResults, connectHits } from 'react-instantsearch-dom';
import isEmpty from 'lodash/isEmpty';
import Suggestion from './SearchSuggestion';
const CustomHits = connectAutoComplete(
({ hits, currentRefinement, handleSubmit }) => {
const defaultHit = [
{
objectID: `default-hit-${currentRefinement}`,
_highlightResult: {
query: {
value:
'Search for "<ais-highlight-0000000000>' +
currentRefinement +
'</ais-highlight-0000000000>"'
}
const CustomHits = connectHits(({ hits, currentRefinement, handleSubmit }) => {
const defaultHit = [
{
objectID: `default-hit-${currentRefinement}`,
query: currentRefinement,
_highlightResult: {
query: {
value:
'Search for "<ais-highlight-0000000000>' +
currentRefinement +
'</ais-highlight-0000000000>"'
}
}
];
return (
<div className='ais-Hits'>
<ul className='ais-Hits-list'>
{defaultHit.concat(hits).map(hit => (
<li
className='ais-Hits-item'
data-fccobjectid={hit.objectID}
key={hit.objectID}
>
<Suggestion handleSubmit={handleSubmit} hit={hit} />
</li>
))}
</ul>
</div>
);
}
);
}
];
return (
<div className='ais-Hits'>
<ul className='ais-Hits-list'>
{defaultHit.concat(hits).map(hit => (
<li
className='ais-Hits-item'
data-fccobjectid={hit.objectID}
key={hit.objectID}
>
<Suggestion handleSubmit={handleSubmit} hit={hit} />
</li>
))}
</ul>
</div>
);
});
const SearchHits = connectStateResults(({ handleSubmit, searchState }) => {
return isEmpty(searchState) || !searchState.query ? null : (
<CustomHits handleSubmit={handleSubmit} />
<CustomHits
currentRefinement={searchState.query}
handleSubmit={handleSubmit}
/>
);
});

View File

@@ -5,7 +5,11 @@ import { isEmpty } from 'lodash';
const Suggestion = ({ handleSubmit, hit }) => {
return isEmpty(hit) || isEmpty(hit.objectID) ? null : (
<div className='fcc_suggestion_item' onClickCapture={handleSubmit}>
<a
className='fcc_suggestion_item'
href='/search'
onClick={e => handleSubmit(e, hit.query)}
>
<span className='hit-name'>
{hit.objectID.includes('default-hit-') ? (
<Highlight attribute='query' hit={hit} tagName='strong' />
@@ -13,7 +17,7 @@ const Suggestion = ({ handleSubmit, hit }) => {
<Highlight attribute='query' hit={hit} />
)}
</span>
</div>
</a>
);
};

View File

@@ -57,6 +57,7 @@
justify-content: center;
}
.fcc_suggestion_item {
display: block;
padding: 1rem;
color: #333;
}