diff --git a/conda/js/src/components/CacheInput.jsx b/conda/js/src/components/CacheInput.jsx
index a0f216a78109fa977550d0487bb37fa5a7f2572d..5d17462437d58f3dafdd5a654a57b946e0173695 100644
--- a/conda/js/src/components/CacheInput.jsx
+++ b/conda/js/src/components/CacheInput.jsx
@@ -87,12 +87,14 @@ class CacheInput extends React.Component<Props, State>{
 		this.updateValidity(this.state.cache);
 	}
 
-	// if the parent's model changes, reset input
-	componentWillReceiveProps (nextProps: any) {
-		this.setState({
-			cache: (nextProps.value),
-		});
-		this.clearTimer();
+	// if the parent's model (the props) changes, reset input
+	componentDidUpdate = (prevProps: Props) => {
+		if(this.props.value !== prevProps.value){
+			this.setState({
+				cache: (this.props.value),
+			});
+			this.clearTimer();
+		}
 	}
 
 	// gets the validity info of an input string given a curr val
diff --git a/conda/js/src/components/NewEntityModal.jsx b/conda/js/src/components/NewEntityModal.jsx
index ab9cd7e7893606bf5320a0de1790601cc6f58d3c..a1ce167aa3ef55f369f86e0ba216a9b46f57747b 100644
--- a/conda/js/src/components/NewEntityModal.jsx
+++ b/conda/js/src/components/NewEntityModal.jsx
@@ -85,11 +85,13 @@ export class NewEntityModal extends React.Component<Props, State> {
 		numSegs: nameSegmentsForEntity(this.props.entity),
 	}
 
-	componentWillReceiveProps = (newProps: Props) => {
-		this.setState({
-			nameSegs: getStartNameSegs(newProps.copyObj, newProps.data.map(d => d.name), newProps.entity, newProps.nameOrVersion),
-			numSegs: nameSegmentsForEntity(newProps.entity),
-		});
+	componentDidUpdate = (prevProps: Props) => {
+		if(this.props !== prevProps){
+			this.setState({
+				nameSegs: getStartNameSegs(this.props.copyObj, this.props.data.map(d => d.name), this.props.entity, this.props.nameOrVersion),
+				numSegs: nameSegmentsForEntity(this.props.entity),
+			});
+		}
 	}
 
 	titleStr = () => `New ${ this.props.entity }: "${ this.getNameString() }"`;
diff --git a/conda/js/src/components/SearchBar.jsx b/conda/js/src/components/SearchBar.jsx
index 38b11e739a07e106ff1cfe855e54610ecb4a866b..dc8e433f6de014c192f670d80c8b17eecb18f7f7 100644
--- a/conda/js/src/components/SearchBar.jsx
+++ b/conda/js/src/components/SearchBar.jsx
@@ -54,8 +54,10 @@ class SearchBar extends React.PureComponent<Props, State> {
 		this.updateFuseInstance();
 	}
 
-	componentWillReceiveProps = (nextProps: Props) => {
-		this.updateFuseInstance(nextProps.data);
+	componentDidUpdate = (prevProps: Props) => {
+		if(this.props.data !== prevProps.data){
+			this.updateFuseInstance(this.props.data);
+		}
 	}
 
 	updateFuseInstance = (data: BeatObject[] = this.props.data) => {
diff --git a/conda/js/src/components/algorithm/AlgorithmEditor.jsx b/conda/js/src/components/algorithm/AlgorithmEditor.jsx
index 4b7832063be6901946065e46ed0336993178fcae..17f5cf7255ba6dab0524361cb8127aeeca79f231 100644
--- a/conda/js/src/components/algorithm/AlgorithmEditor.jsx
+++ b/conda/js/src/components/algorithm/AlgorithmEditor.jsx
@@ -82,10 +82,12 @@ export class AlgorithmEditor extends React.Component<Props, State> {
 	}
 
 	// if the data changes behind the scenes, update the editor with these changes
-	UNSAFE_componentWillReceiveProps (nextProps: Props) {
-		this.setState({
-			validity: this.getValidity(nextProps.data, nextProps.algorithms),
-		});
+	componentDidUpdate = (prevProps: Props) => {
+		if(this.props !== prevProps){
+			this.setState({
+				validity: this.getValidity(this.props.data, this.props.algorithms),
+			});
+		}
 	}
 
 	// get the result types (analyzer result types are restricted to a subset of all available types)
diff --git a/conda/js/src/components/toolchain/InsertObjectModal.jsx b/conda/js/src/components/toolchain/InsertObjectModal.jsx
index 0c08497a83411d0503719f0b1813ae0adaee5fbe..f0ae1cd46fb94306ffe7abe79f810982c59b2b1c 100644
--- a/conda/js/src/components/toolchain/InsertObjectModal.jsx
+++ b/conda/js/src/components/toolchain/InsertObjectModal.jsx
@@ -87,8 +87,10 @@ class InsertObjectModal extends React.PureComponent<Props, State> {
 		this.updateFuseInstance();
 	}
 
-	componentWillReceiveProps = (nextProps: Props) => {
-		this.updateFuseInstance(nextProps[this.state.searchFilter]);
+	componentDidUpdate = (prevProps: Props) => {
+		if(this.props[this.state.searchFilter] !== prevProps[this.state.searchFilter]){
+			this.updateFuseInstance(this.props[this.state.searchFilter]);
+		}
 	}
 
 	updateFuseInstance = (data: any[] = this.props[this.state.searchFilter]) => {
diff --git a/conda/js/src/components/toolchain/RenameGroupModal.jsx b/conda/js/src/components/toolchain/RenameGroupModal.jsx
index dd0c26d2a4dba184ab61a26246876b606261de17..bdee3cf31e6e739b1265423f97cceb8752995cfd 100644
--- a/conda/js/src/components/toolchain/RenameGroupModal.jsx
+++ b/conda/js/src/components/toolchain/RenameGroupModal.jsx
@@ -34,8 +34,10 @@ class RenameGroupModal extends React.PureComponent<Props, State> {
 		newName: this.props.currentName,
 	}
 
-	componentWillReceiveProps = (nextProps: Props) => {
-		this.setState({ newName: nextProps.currentName });
+	componentDidUpdate = (prevProps: Props) => {
+		if(this.props.currentName !== prevProps.currentName){
+			this.setState({ newName: this.props.currentName });
+		}
 	}
 
 	validateFunc = (str: string) => {
diff --git a/conda/js/src/components/toolchain/ToolchainEditor.jsx b/conda/js/src/components/toolchain/ToolchainEditor.jsx
index 3c313e87d0e2e69a87100cc1cb03ac5f5e8b27e9..e6c8b87f67436be5c8b83a177a2ef5db2f8f59e8 100644
--- a/conda/js/src/components/toolchain/ToolchainEditor.jsx
+++ b/conda/js/src/components/toolchain/ToolchainEditor.jsx
@@ -134,15 +134,6 @@ export class ToolchainEditor extends React.PureComponent<Props, State> {
 		},
 	}
 
-	// if the toolchain was updated, reset specific state fields
-	UNSAFE_componentWillReceiveProps = (nextProps: Props) => {
-		/*
-		this.setState({
-			history: generateNewHistory(this.state),
-		});
-		*/
-	}
-
 	// helper to set the contents (this.props.data.contents) object
 	setContents = (newContents: any) => {
 		this.setState((prevState, props) => ({