From f103e4c815234fd5f451fe66e29bc17f0b20cadb Mon Sep 17 00:00:00 2001 From: hmhealey Date: Thu, 3 Dec 2015 15:13:25 -0500 Subject: Changed SuggestionBox to clear its suggestions on losing focus --- .../suggestion/search_suggestion_list.jsx | 2 +- web/react/components/suggestion/suggestion_box.jsx | 32 ++-------------------- .../components/suggestion/suggestion_list.jsx | 5 ++-- web/react/dispatcher/event_helpers.jsx | 7 +++++ web/react/stores/suggestion_store.jsx | 5 ++++ web/react/utils/constants.jsx | 1 + 6 files changed, 19 insertions(+), 33 deletions(-) (limited to 'web/react') diff --git a/web/react/components/suggestion/search_suggestion_list.jsx b/web/react/components/suggestion/search_suggestion_list.jsx index 542d28ddd..3378a33a0 100644 --- a/web/react/components/suggestion/search_suggestion_list.jsx +++ b/web/react/components/suggestion/search_suggestion_list.jsx @@ -35,7 +35,7 @@ export default class SearchSuggestionList extends SuggestionList { } render() { - if (this.state.items.length === 0 || !this.props.show) { + if (this.state.items.length === 0) { return null; } diff --git a/web/react/components/suggestion/suggestion_box.jsx b/web/react/components/suggestion/suggestion_box.jsx index 4ca461e82..4cfb38f8e 100644 --- a/web/react/components/suggestion/suggestion_box.jsx +++ b/web/react/components/suggestion/suggestion_box.jsx @@ -13,7 +13,6 @@ export default class SuggestionBox extends React.Component { super(props); this.handleDocumentClick = this.handleDocumentClick.bind(this); - this.handleFocus = this.handleFocus.bind(this); this.handleChange = this.handleChange.bind(this); this.handleCompleteWord = this.handleCompleteWord.bind(this); @@ -21,10 +20,6 @@ export default class SuggestionBox extends React.Component { this.handlePretextChanged = this.handlePretextChanged.bind(this); this.suggestionId = Utils.generateId(); - - this.state = { - focused: false - }; } componentDidMount() { @@ -49,27 +44,11 @@ export default class SuggestionBox extends React.Component { } handleDocumentClick(e) { - if (!this.state.focused) { - return; - } - const container = $(ReactDOM.findDOMNode(this)); if (!(container.is(e.target) || container.has(e.target).length > 0)) { // we can't just use blur for this because it fires and hides the children before // their click handlers can be called - this.setState({ - focused: false - }); - } - } - - handleFocus() { - this.setState({ - focused: true - }); - - if (this.props.onFocus) { - this.props.onFocus(); + EventHelpers.emitClearSuggestions(this.suggestionId); } } @@ -134,7 +113,6 @@ export default class SuggestionBox extends React.Component { render() { const newProps = Object.assign({}, this.props, { - onFocus: this.handleFocus, onChange: this.handleChange, onKeyDown: this.handleKeyDown }); @@ -162,10 +140,7 @@ export default class SuggestionBox extends React.Component { return (
{textbox} - +
); } @@ -184,6 +159,5 @@ SuggestionBox.propTypes = { // explicitly name any input event handlers we override and need to manually call onChange: React.PropTypes.func, - onKeyDown: React.PropTypes.func, - onFocus: React.PropTypes.func + onKeyDown: React.PropTypes.func }; diff --git a/web/react/components/suggestion/suggestion_list.jsx b/web/react/components/suggestion/suggestion_list.jsx index 87021fd94..e3ccd0f08 100644 --- a/web/react/components/suggestion/suggestion_list.jsx +++ b/web/react/components/suggestion/suggestion_list.jsx @@ -82,7 +82,7 @@ export default class SuggestionList extends React.Component { } render() { - if (this.state.items.length === 0 || !this.props.show) { + if (this.state.items.length === 0) { return null; } @@ -121,6 +121,5 @@ export default class SuggestionList extends React.Component { } SuggestionList.propTypes = { - suggestionId: React.PropTypes.string.isRequired, - show: React.PropTypes.bool.isRequired + suggestionId: React.PropTypes.string.isRequired }; diff --git a/web/react/dispatcher/event_helpers.jsx b/web/react/dispatcher/event_helpers.jsx index f792c610f..3deddd754 100644 --- a/web/react/dispatcher/event_helpers.jsx +++ b/web/react/dispatcher/event_helpers.jsx @@ -141,3 +141,10 @@ export function emitCompleteWordSuggestion(suggestionId, term = '') { term }); } + +export function emitClearSuggestions(suggestionId) { + AppDispatcher.handleViewAction({ + type: Constants.ActionTypes.SUGGESTION_CLEAR_SUGGESTIONS, + id: suggestionId + }); +} diff --git a/web/react/stores/suggestion_store.jsx b/web/react/stores/suggestion_store.jsx index 182f5810f..2250ec234 100644 --- a/web/react/stores/suggestion_store.jsx +++ b/web/react/stores/suggestion_store.jsx @@ -244,6 +244,11 @@ class SuggestionStore extends EventEmitter { this.emitSuggestionsChanged(id); } break; + case ActionTypes.SUGGESTION_CLEAR_SUGGESTIONS: + this.clearSuggestions(id); + this.clearSelection(id); + this.emitSuggestionsChanged(id); + break; case ActionTypes.SUGGESTION_SELECT_NEXT: this.selectNext(id); this.emitSuggestionsChanged(id); diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx index 8164095b9..b641e966b 100644 --- a/web/react/utils/constants.jsx +++ b/web/react/utils/constants.jsx @@ -55,6 +55,7 @@ export default { SUGGESTION_PRETEXT_CHANGED: null, SUGGESTION_RECEIVED_SUGGESTIONS: null, + SUGGESTION_CLEAR_SUGGESTIONS: null, SUGGESTION_COMPLETE_WORD: null, SUGGESTION_SELECT_NEXT: null, SUGGESTION_SELECT_PREVIOUS: null -- cgit v1.2.3-1-g7c22