diff --git a/frontend/web/components/pages/EnvironmentSettingsPage.js b/frontend/web/components/pages/EnvironmentSettingsPage.js
index 58926e2dddfc..2ecb2f3a011d 100644
--- a/frontend/web/components/pages/EnvironmentSettingsPage.js
+++ b/frontend/web/components/pages/EnvironmentSettingsPage.js
@@ -45,6 +45,11 @@ const EnvironmentSettingsPage = class extends Component {
 
   componentDidMount = () => {
     API.trackPage(Constants.pages.ENVIRONMENT_SETTINGS)
+    this.getEnvironment()
+    this.props.getWebhooks()
+  }
+
+  getEnvironment = () => {
     const env = ProjectStore.getEnvs().find(
       (v) => v.api_key === this.props.match.params.environmentId,
     )
@@ -69,8 +74,6 @@ const EnvironmentSettingsPage = class extends Component {
         this.setState({ roles: matchingItems })
       })
     })
-
-    this.props.getWebhooks()
   }
 
   onSave = () => {
@@ -83,6 +86,12 @@ const EnvironmentSettingsPage = class extends Component {
     ) {
       AppActions.getProject(this.props.match.params.projectId)
     }
+    if (
+      this.props.match.params.environmentId !==
+      prevProps.match.params.environmentId
+    ) {
+      this.getEnvironment()
+    }
   }
 
   onRemove = () => {
@@ -236,8 +245,10 @@ const EnvironmentSettingsPage = class extends Component {
               api_key: this.props.match.params.environmentId,
             })
             if (
-              env &&
-              typeof this.state.minimum_change_request_approvals === 'undefined'
+              (env &&
+                typeof this.state.minimum_change_request_approvals ===
+                  'undefined') ||
+              this.state.env?.api_key !== this.props.match.params.environmentId
             ) {
               setTimeout(() => {
                 this.setState({