import React, { useContext, useEffect } from 'react'; import PropTypes from 'prop-types'; import classnames from 'classnames'; import { highlightSearchedText } from '../../../helpers/utils/settings-search'; import { I18nContext } from '../../../contexts/i18n'; import IconCaretRight from '../../../components/ui/icon/icon-caret-right'; export default function SettingsSearchList({ results, onClickSetting }) { const t = useContext(I18nContext); useEffect(highlightSearchedText, [results]); return (
{results.slice(0, 5).map((result) => { const { image, tab, section, id } = result; return ( Boolean(image || tab || section) && (
onClickSetting(result)} > {tab} {section}
) ); })} {results.length === 0 && (
{t('settingsSearchMatchingNotFound')}
)}
{t('missingSetting')} {t('missingSettingRequest')}
); } SettingsSearchList.propTypes = { results: PropTypes.array, onClickSetting: PropTypes.func, };