From d105ca6f469d2babe987e31264524a736ce6a49c Mon Sep 17 00:00:00 2001
From: shawnbusuttil <shawn-buzu@hotmail.co.uk>
Date: Thu, 17 Mar 2022 16:56:07 +0000
Subject: [PATCH] [DDW-1011] prevent news feed from overlapping full screen
 dialogs

---
 .../redeem-itn-rewards/Step1ConfigurationContainer.tsx   | 9 +++++++++
 source/renderer/app/containers/static/AboutDialog.scss   | 3 ++-
 .../app/containers/status/DaedalusDiagnosticsDialog.scss | 3 ++-
 source/renderer/app/stores/AppStore.ts                   | 3 +++
 source/renderer/app/themes/mixins/layers.scss            | 3 ++-
 source/renderer/app/themes/overrides/ModalOverrides.scss | 3 ++-
 6 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/source/renderer/app/containers/staking/dialogs/redeem-itn-rewards/Step1ConfigurationContainer.tsx b/source/renderer/app/containers/staking/dialogs/redeem-itn-rewards/Step1ConfigurationContainer.tsx
index 3a41d7f117..492b7c7382 100644
--- a/source/renderer/app/containers/staking/dialogs/redeem-itn-rewards/Step1ConfigurationContainer.tsx
+++ b/source/renderer/app/containers/staking/dialogs/redeem-itn-rewards/Step1ConfigurationContainer.tsx
@@ -41,6 +41,15 @@ class Step1ConfigurationContainer extends Component<Props> {
     return walletAmount && walletAmount.gte(minRewardsFunds);
   };
 
+  componentDidMount() {
+    const { app } = this.props.stores;
+    const { closeNewsFeed } = this.props.actions.app;
+
+    if (app.newsFeedIsOpen) {
+      closeNewsFeed.trigger();
+    }
+  }
+
   render() {
     const { actions, stores, onBack, onClose } = this.props;
     const { app, staking, wallets } = stores;
diff --git a/source/renderer/app/containers/static/AboutDialog.scss b/source/renderer/app/containers/static/AboutDialog.scss
index cb6e4e5a92..718573194d 100644
--- a/source/renderer/app/containers/static/AboutDialog.scss
+++ b/source/renderer/app/containers/static/AboutDialog.scss
@@ -1,4 +1,5 @@
 @import '../../themes/mixins/overlay-backdrop';
+@import '../../themes/mixins/layers';
 
 .overlay {
   background-color: var(--theme-about-window-background-color);
@@ -9,7 +10,7 @@
   position: fixed;
   right: 0;
   top: 0;
-  z-index: 9999;
+  z-index: $dialog-z-index;
 
   &::-webkit-scrollbar-button {
     height: 21px;
diff --git a/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.scss b/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.scss
index f9ac6c6875..492d9e757f 100644
--- a/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.scss
+++ b/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.scss
@@ -1,4 +1,5 @@
 @import '../../themes/mixins/overlay-backdrop';
+@import '../../themes/mixins/layers';
 
 .overlay {
   bottom: 0;
@@ -7,7 +8,7 @@
   position: fixed;
   right: 0;
   top: 0;
-  z-index: 9999;
+  z-index: $dialog-z-index;
   @include overlay-backrop;
 
   *::-webkit-scrollbar-button {
diff --git a/source/renderer/app/stores/AppStore.ts b/source/renderer/app/stores/AppStore.ts
index 02e68af668..c55152a255 100644
--- a/source/renderer/app/stores/AppStore.ts
+++ b/source/renderer/app/stores/AppStore.ts
@@ -196,6 +196,9 @@ export default class AppStore extends Store {
   };
   @action
   _updateActiveDialog = (currentDialog: ApplicationDialog) => {
+    if (this.newsFeedIsOpen) {
+      this.newsFeedIsOpen = false;
+    }
     if (this.activeDialog !== currentDialog) this.activeDialog = currentDialog;
   };
   @action
diff --git a/source/renderer/app/themes/mixins/layers.scss b/source/renderer/app/themes/mixins/layers.scss
index aca2a6e0bb..8d33339247 100644
--- a/source/renderer/app/themes/mixins/layers.scss
+++ b/source/renderer/app/themes/mixins/layers.scss
@@ -1,4 +1,5 @@
-$dialog-z-index: 10001;
+$backdrop-z-index: 10000;
+$dialog-z-index: 10000;
 $loader-backdrop-z-index: 5;
 $back-to-top-z-index: 5;
 $sticky-header-z-index: 1;
diff --git a/source/renderer/app/themes/overrides/ModalOverrides.scss b/source/renderer/app/themes/overrides/ModalOverrides.scss
index 7c0ab60c38..df00802366 100644
--- a/source/renderer/app/themes/overrides/ModalOverrides.scss
+++ b/source/renderer/app/themes/overrides/ModalOverrides.scss
@@ -1,9 +1,10 @@
 @import '../mixins/overlay-backdrop';
+@import '../mixins/layers.scss';
 
 .overlay {
   @include overlay-backrop;
   overflow: hidden;
-  z-index: 100;
+  z-index: $backdrop-z-index;
 }
 
 .modal {