From e19dbc24ff099c7ef02d2b09615d7415233b6b65 Mon Sep 17 00:00:00 2001 From: Russom Woldezghi Date: Tue, 11 Feb 2020 13:30:00 -0500 Subject: [PATCH 1/2] addressing browser console errors for componentWillReceiveProps --- src/components/range-facet/index.js | 2 +- src/components/text-search/no-autocomplete.js | 2 +- src/components/text-search/search-as-you-type.js | 10 +++++----- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/components/range-facet/index.js b/src/components/range-facet/index.js index 6b458f0..c8ed64c 100644 --- a/src/components/range-facet/index.js +++ b/src/components/range-facet/index.js @@ -44,7 +44,7 @@ class FederatedRangeFacet extends React.Component { } // See: https://reactjs.org/docs/react-component.html#the-component-lifecycle - componentWillReceiveProps(nextProps) { + componentDidUpdate(nextProps) { // Clear component inputs when rangeFacet value transitions from populated->empty. if (this.props.value.length && !nextProps.value.length) { this.setState({ diff --git a/src/components/text-search/no-autocomplete.js b/src/components/text-search/no-autocomplete.js index d10e502..3b44a40 100644 --- a/src/components/text-search/no-autocomplete.js +++ b/src/components/text-search/no-autocomplete.js @@ -19,7 +19,7 @@ class FederatedTextSearchNoAutocomplete extends React.Component { this.handleSubmit = this.handleSubmit.bind(this); } - componentWillReceiveProps(nextProps) { + componentDidUpdate(nextProps) { this.setState({ value: nextProps.value, }); diff --git a/src/components/text-search/search-as-you-type.js b/src/components/text-search/search-as-you-type.js index 4e47830..566484b 100644 --- a/src/components/text-search/search-as-you-type.js +++ b/src/components/text-search/search-as-you-type.js @@ -31,7 +31,7 @@ class FederatedTextSearchAsYouType extends React.Component { this.shouldRenderSuggestions = this.shouldRenderSuggestions.bind(this); } - componentWillReceiveProps(nextProps) { + UNSAFE_componentWillReceiveProps(nextProps) { this.setState({ value: nextProps.suggestQuery && nextProps.suggestQuery.value ? nextProps.suggestQuery.value @@ -342,14 +342,14 @@ FederatedTextSearchAsYouType.propTypes = { queryField: PropTypes.string, suggestionRows: PropTypes.number, numChars: PropTypes.number, - result: { + result: PropTypes.shape({ titleText: PropTypes.string, showDirectionsText: PropTypes.bool, - }, - term: { + }), + term: PropTypes.shape({ titleText: PropTypes.string, showDirectionsText: PropTypes.bool, - }, + }), }), PropTypes.bool, ]).isRequired, From f095e5e4c6e105edab62eb932aff15469b93a9cb Mon Sep 17 00:00:00 2001 From: Russom Woldezghi Date: Fri, 14 Feb 2020 12:50:40 -0500 Subject: [PATCH 2/2] Adds patch to prefix UNSAFE_ to componentWillReceiveProps lifecycles --- patches/react-autosuggest+9.4.3.patch | 41 +++++++++++++++++++++++++++ patches/react-dates+21.8.0.patch | 13 +++++++++ 2 files changed, 54 insertions(+) create mode 100644 patches/react-autosuggest+9.4.3.patch create mode 100644 patches/react-dates+21.8.0.patch diff --git a/patches/react-autosuggest+9.4.3.patch b/patches/react-autosuggest+9.4.3.patch new file mode 100644 index 0000000..baac6c5 --- /dev/null +++ b/patches/react-autosuggest+9.4.3.patch @@ -0,0 +1,41 @@ +diff --git a/node_modules/react-autosuggest/dist/Autosuggest.js b/node_modules/react-autosuggest/dist/Autosuggest.js +index eaac8a7..8f21e5b 100644 +--- a/node_modules/react-autosuggest/dist/Autosuggest.js ++++ b/node_modules/react-autosuggest/dist/Autosuggest.js +@@ -88,8 +88,8 @@ var Autosuggest = function (_Component) { + this.suggestionsContainer = this.autowhatever.itemsContainer; + } + }, { +- key: 'componentWillReceiveProps', +- value: function componentWillReceiveProps(nextProps) { ++ key: 'UNSAFE_componentWillReceiveProps', ++ value: function UNSAFE_componentWillReceiveProps(nextProps) { + if ((0, _arrays2.default)(nextProps.suggestions, this.props.suggestions)) { + if (nextProps.highlightFirstSuggestion && nextProps.suggestions.length > 0 && this.justPressedUpDown === false && this.justMouseEntered === false) { + this.highlightFirstSuggestion(); +diff --git a/node_modules/react-autosuggest/dist/standalone/autosuggest.js b/node_modules/react-autosuggest/dist/standalone/autosuggest.js +index 02f7a55..8a74b2e 100644 +--- a/node_modules/react-autosuggest/dist/standalone/autosuggest.js ++++ b/node_modules/react-autosuggest/dist/standalone/autosuggest.js +@@ -152,8 +152,8 @@ return /******/ (function(modules) { // webpackBootstrap + this.suggestionsContainer = this.autowhatever.itemsContainer; + } + }, { +- key: 'componentWillReceiveProps', +- value: function componentWillReceiveProps(nextProps) { ++ key: 'UNSAFE_componentWillReceiveProps', ++ value: function UNSAFE_componentWillReceiveProps(nextProps) { + if ((0, _arrays2.default)(nextProps.suggestions, this.props.suggestions)) { + if (nextProps.highlightFirstSuggestion && nextProps.suggestions.length > 0 && this.justPressedUpDown === false && this.justMouseEntered === false) { + this.highlightFirstSuggestion(); +@@ -2281,8 +2281,8 @@ return /******/ (function(modules) { // webpackBootstrap + this.ensureHighlightedItemIsVisible(); + } + }, { +- key: 'componentWillReceiveProps', +- value: function componentWillReceiveProps(nextProps) { ++ key: 'UNSAFE_componentWillReceiveProps', ++ value: function UNSAFE_componentWillReceiveProps(nextProps) { + if (nextProps.items !== this.props.items) { + this.setSectionsItems(nextProps); + } diff --git a/patches/react-dates+21.8.0.patch b/patches/react-dates+21.8.0.patch new file mode 100644 index 0000000..615efe9 --- /dev/null +++ b/patches/react-dates+21.8.0.patch @@ -0,0 +1,13 @@ +diff --git a/node_modules/react-dates/lib/components/DateInput.js b/node_modules/react-dates/lib/components/DateInput.js +index 2723010..5641060 100644 +--- a/node_modules/react-dates/lib/components/DateInput.js ++++ b/node_modules/react-dates/lib/components/DateInput.js +@@ -129,7 +129,7 @@ function (_ref) { + }); + }; + +- _proto.componentWillReceiveProps = function componentWillReceiveProps(nextProps) { ++ _proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) { + var dateString = this.state.dateString; + + if (dateString && nextProps.displayValue) {