using EphemeralStore and listeners to discard overlays

app/screens/snack_bar/index.tsx

@@ -14,6 +14,7 @@ import {BOTTOM_TAB_HEIGHT, TABLET_SIDEBAR_WIDTH} from '@constants/view';
 import {useTheme} from '@context/theme';
 import {useIsTablet} from '@hooks/device';
 import {dismissOverlay} from '@screens/navigation';
+import EphemeralStore from '@store/ephemeral_store';
 import {makeStyleSheetFromTheme} from '@utils/theme';
 import {typography} from '@utils/typography';
 
@@ -140,6 +141,7 @@ const SnackBar = ({barType, componentId, onUndoPress, sourceScreen}: SnackBarPro
 
     useEffect(() => {
         setShowToast(true);
+        EphemeralStore.addNavigationOverlay(componentId);
         const t = setTimeout(() => {
             setShowToast(false);
         }, 3000);

app/store/ephemeral_store.ts

@@ -1,6 +1,8 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
+import {dismissOverlay} from '@screens/navigation';
+
 class EphemeralStore {
     allNavigationComponentIds: string[] = [];
     navigationComponentIdStack: string[] = [];
@@ -9,6 +11,7 @@ class EphemeralStore {
     visibleTab = 'Home';
     creatingChannel = false;
     creatingDMorGMTeammates: string[] = [];
+    overlays: string[] = [];
 
     addNavigationComponentId = (componentId: string) => {
         this.addToNavigationComponentIdStack(componentId);
@@ -34,6 +37,10 @@ class EphemeralStore {
         this.navigationModalStack.unshift(componentId);
     };
 
+    addNavigationOverlay = (componentId: string) => {
+        this.overlays.unshift(componentId);
+    };
+
     clearNavigationComponents = () => {
         this.navigationComponentIdStack = [];
         this.navigationModalStack = [];
@@ -44,6 +51,10 @@ class EphemeralStore {
         this.navigationModalStack = [];
     };
 
+    clearNavigationOverlays = () => {
+        this.overlays = [];
+    };
+
     getAllNavigationComponents = () => this.allNavigationComponentIds;
 
     getNavigationTopComponentId = () => {
@@ -77,6 +88,17 @@ class EphemeralStore {
         }
     };
 
+    removeNavigationOverlays = () => {
+        const hasOverlays = this.overlays.length;
+
+        if (hasOverlays) {
+            this.overlays.forEach((o) => {
+                dismissOverlay(o);
+            });
+            this.clearNavigationOverlays();
+        }
+    };
+
     setVisibleTap = (tab: string) => {
         this.visibleTab = tab;
     };

app/utils/snack_bar/index.ts

@@ -9,6 +9,7 @@ type ShowSnackBarArgs = {
     onPress?: () => void;
     sourceScreen?: typeof Screens[keyof typeof Screens];
 };
+
 export const showSnackBar = (passProps: ShowSnackBarArgs) => {
     const screen = Screens.SNACK_BAR;
     showOverlay(screen, passProps);

index.ts

@@ -98,6 +98,8 @@ function componentDidAppearListener({componentId, passProps}: ComponentDidAppear
     if (!(passProps as any)?.overlay) {
         EphemeralStore.addNavigationComponentId(componentId);
     }
+
+    EphemeralStore.removeNavigationOverlays();
 }
 
 function componentDidDisappearListener({componentId}: ComponentDidDisappearEvent) {
@@ -112,4 +114,6 @@ function componentDidDisappearListener({componentId}: ComponentDidDisappearEvent
             DeviceEventEmitter.emit(Events.TAB_BAR_VISIBLE, true);
         }
     }
+
+    EphemeralStore.removeNavigationOverlays();
 }