diff --git a/ui/component/tagsSearch/index.js b/ui/component/tagsSearch/index.js index a5eefcc86..c280b852a 100644 --- a/ui/component/tagsSearch/index.js +++ b/ui/component/tagsSearch/index.js @@ -4,9 +4,9 @@ import { doToggleTagFollowDesktop, doAddTag, doDeleteTag } from 'redux/actions/t import { selectUser } from 'redux/selectors/user'; import DiscoveryFirstRun from './view'; -const select = state => ({ - unfollowedTags: selectUnfollowedTags(state), - followedTags: selectFollowedTags(state), +const select = (state, props) => ({ + unfollowedTags: props.unfollowedTags || selectUnfollowedTags(state), + followedTags: props.followedTags || selectFollowedTags(state), user: selectUser(state), }); diff --git a/ui/component/tagsSearch/view.jsx b/ui/component/tagsSearch/view.jsx index 2f3a02478..a903cf567 100644 --- a/ui/component/tagsSearch/view.jsx +++ b/ui/component/tagsSearch/view.jsx @@ -14,11 +14,14 @@ type Props = { doToggleTagFollowDesktop: (string) => void, doAddTag: (string) => void, onSelect?: (Tag) => void, + hideSuggestions?: boolean, suggestMature?: boolean, disableAutoFocus?: boolean, onRemove: (Tag) => void, placeholder?: string, label?: string, + labelAddNew?: string, + labelSuggestions?: string, disabled?: boolean, limitSelect?: number, limitShow?: number, @@ -44,10 +47,13 @@ export default function TagsSearch(props: Props) { doAddTag, onSelect, onRemove, + hideSuggestions, suggestMature, disableAutoFocus, placeholder, label, + labelAddNew, + labelSuggestions, disabled, limitSelect = TAG_FOLLOW_MAX, limitShow = 5, @@ -189,31 +195,33 @@ export default function TagsSearch(props: Props) { type="text" value={newTag} disabled={disabled} - label={__('Add Tags')} + label={labelAddNew || __('Add Tags')} /> - <section> - <label>{newTag.length ? __('Matching') : __('Known Tags')}</label> - <ul className="tags"> - {Boolean(newTag.length) && !suggestedTags.includes(newTag) && ( - <Tag - disabled={newTag !== 'mature' && maxed} - key={`entered${newTag}`} - name={newTag} - type="add" - onClick={newTag.includes('') ? (e) => handleSubmit(e) : (e) => handleTagClick(newTag)} - /> - )} - {suggestedTags.map((tag) => ( - <Tag - disabled={tag !== 'mature' && maxed} - key={`suggested${tag}`} - name={tag} - type="add" - onClick={() => handleTagClick(tag)} - /> - ))} - </ul> - </section> + {!hideSuggestions && ( + <section> + <label>{labelSuggestions || (newTag.length ? __('Matching') : __('Known Tags'))}</label> + <ul className="tags"> + {Boolean(newTag.length) && !suggestedTags.includes(newTag) && ( + <Tag + disabled={newTag !== 'mature' && maxed} + key={`entered${newTag}`} + name={newTag} + type="add" + onClick={newTag.includes('') ? (e) => handleSubmit(e) : (e) => handleTagClick(newTag)} + /> + )} + {suggestedTags.map((tag) => ( + <Tag + disabled={tag !== 'mature' && maxed} + key={`suggested${tag}`} + name={tag} + type="add" + onClick={() => handleTagClick(tag)} + /> + ))} + </ul> + </section> + )} </fieldset-section> {experimentalFeature && onSelect && ( // onSelect ensures this does not appear on TagFollow