From 162a579384a9313f18aa70efd2b85bd91bd45c09 Mon Sep 17 00:00:00 2001 From: cindyb Date: Tue, 25 Aug 2020 12:52:13 -0400 Subject: [PATCH] #1940 topics --- .../controlbar/FocusSelectorContainer.js | 2 +- .../topic/controlbar/QuerySelector.js | 21 +++++++++++-------- .../topic/controlbar/TopicFilterBar.js | 2 +- .../snapshots/foci/builder/FocalSetForm.js | 2 +- .../foci/builder/FocusBuilderWizard.js | 2 +- .../foci/builder/FocusDescriptionForm.js | 2 +- .../topic/stories/StoryContainer.js | 8 ++++--- .../topic/stories/StoryUpdateContainer.js | 6 +++--- src/components/topic/words/WordContainer.js | 11 +++++----- 9 files changed, 31 insertions(+), 25 deletions(-) diff --git a/src/components/topic/controlbar/FocusSelectorContainer.js b/src/components/topic/controlbar/FocusSelectorContainer.js index e29c82e3f..ad9c06878 100644 --- a/src/components/topic/controlbar/FocusSelectorContainer.js +++ b/src/components/topic/controlbar/FocusSelectorContainer.js @@ -14,7 +14,7 @@ const localMessages = { }; class FocusSelectorContainer extends React.Component { - UNSAFE_componentWillMount() { + componentDidMount() { const { setCustomContent, selectedFocus } = this.props; if (setCustomContent && selectedFocus) { setCustomContent( diff --git a/src/components/topic/controlbar/QuerySelector.js b/src/components/topic/controlbar/QuerySelector.js index 8aa897dbc..2090994a1 100644 --- a/src/components/topic/controlbar/QuerySelector.js +++ b/src/components/topic/controlbar/QuerySelector.js @@ -11,21 +11,24 @@ const localMessages = { }; class QuerySelector extends React.Component { - state = { - focused: false, - value: '', - }; + constructor(props) { + super(props); + this.state = { + focused: false, + value: '', + }; + } - UNSAFE_componentWillMount() { + componentDidMount() { this.setState({ value: this.props.query || '' }); } - UNSAFE_componentWillReceiveProps(nextProps) { - const { query } = this.props; - if (nextProps.query !== query) { + static getDerivedStateFromProps(nextState, prevState) { + if (nextState.query !== prevState.query) { // if filters are open and user deletes chip, gotta remove the query here - this.setState({ value: nextProps.query }); + this.setState({ value: nextState.query }); } + return nextState; } valueHasChanged = () => { diff --git a/src/components/topic/controlbar/TopicFilterBar.js b/src/components/topic/controlbar/TopicFilterBar.js index bf7a20ab5..202667e0f 100644 --- a/src/components/topic/controlbar/TopicFilterBar.js +++ b/src/components/topic/controlbar/TopicFilterBar.js @@ -23,7 +23,7 @@ const localMessages = { }; class TopicFilterBar extends React.Component { - UNSAFE_componentWillMount() { + componentDidMount() { const { setSideBarContent, handleFilterToggle, handleFocusSelected, handleQuerySelected } = this.props; const { formatMessage } = this.props.intl; diff --git a/src/components/topic/snapshots/foci/builder/FocalSetForm.js b/src/components/topic/snapshots/foci/builder/FocalSetForm.js index 67a2a548f..e644ea0ec 100644 --- a/src/components/topic/snapshots/foci/builder/FocalSetForm.js +++ b/src/components/topic/snapshots/foci/builder/FocalSetForm.js @@ -26,7 +26,7 @@ const localMessages = { }; class FocalSetForm extends React.Component { - UNSAFE_componentWillMount() { + componentDidMount() { const { change, focalTechnique } = this.props; const { formatMessage } = this.props.intl; // set smart-looking default set name/description based on the focal technique currently selected diff --git a/src/components/topic/snapshots/foci/builder/FocusBuilderWizard.js b/src/components/topic/snapshots/foci/builder/FocusBuilderWizard.js index 4015f2200..86a1e22bd 100644 --- a/src/components/topic/snapshots/foci/builder/FocusBuilderWizard.js +++ b/src/components/topic/snapshots/foci/builder/FocusBuilderWizard.js @@ -21,7 +21,7 @@ const localMessages = { }; class FocusBuilderWizard extends React.Component { - UNSAFE_componentWillMount = () => { + componentDidMount = () => { const { startStep, goToStep } = this.props; goToStep(startStep || 0); } diff --git a/src/components/topic/snapshots/foci/builder/FocusDescriptionForm.js b/src/components/topic/snapshots/foci/builder/FocusDescriptionForm.js index 12512327c..6e5c6e9ee 100644 --- a/src/components/topic/snapshots/foci/builder/FocusDescriptionForm.js +++ b/src/components/topic/snapshots/foci/builder/FocusDescriptionForm.js @@ -27,7 +27,7 @@ const localMessages = { }; class FocusDescriptionForm extends React.Component { - UNSAFE_componentWillMount() { + componentDidMount() { const { change, focalTechnique, initialValues, keywords } = this.props; const { formatMessage } = this.props.intl; // set smart-looking default focus name/description based on the focal technique currently selected diff --git a/src/components/topic/stories/StoryContainer.js b/src/components/topic/stories/StoryContainer.js index 94754c857..058421699 100644 --- a/src/components/topic/stories/StoryContainer.js +++ b/src/components/topic/stories/StoryContainer.js @@ -57,11 +57,13 @@ class StoryContainer extends React.Component { selectedTab: 0, }; - UNSAFE_componentWillReceiveProps(nextProps) { + static getDerivedStateFromProps(nextState) { + // select the media so we fill the reducer with the previously selected media const { refetchAsyncData } = this.props; - if (nextProps.storiesId !== this.props.storiesId) { - refetchAsyncData(nextProps); + if (nextState.storiesId !== this.props.storiesId) { + refetchAsyncData(nextState); } + return nextState; } render() { diff --git a/src/components/topic/stories/StoryUpdateContainer.js b/src/components/topic/stories/StoryUpdateContainer.js index 1afcb1fcc..c193af6e2 100644 --- a/src/components/topic/stories/StoryUpdateContainer.js +++ b/src/components/topic/stories/StoryUpdateContainer.js @@ -17,10 +17,10 @@ const localMessages = { }; class StoryUpdateContainer extends React.Component { - UNSAFE_componentWillReceiveProps(nextProps) { + static getDerivedStateFromProps(nextState) { const { refetchAsyncData } = this.props; - if (nextProps.storiesId !== this.props.storiesId) { - refetchAsyncData(nextProps); + if (nextState.storiesId !== this.props.storiesId) { + refetchAsyncData(nextState); } } diff --git a/src/components/topic/words/WordContainer.js b/src/components/topic/words/WordContainer.js index 7b4f24623..431dae911 100644 --- a/src/components/topic/words/WordContainer.js +++ b/src/components/topic/words/WordContainer.js @@ -19,16 +19,17 @@ const localMessages = { class WordContainer extends React.Component { /* not an async */ - UNSAFE_componentWillMount() { + componentDidMount() { const { saveParamsToStore } = this.props; saveParamsToStore(this.props, this); } - UNSAFE_componentWillReceiveProps(nextProps) { - if (nextProps.params.word !== this.props.params.word) { - const { saveParamsToStore } = nextProps; - saveParamsToStore(nextProps, this); + static getDerivedStateFromProps(nextState) { + if (nextState.params.word !== this.props.params.word) { + const { saveParamsToStore } = nextState; + saveParamsToStore(nextState, this); } + return nextState; } render() {