diff --git a/openmetadata-ui/src/main/resources/ui/src/App.test.js b/openmetadata-ui/src/main/resources/ui/src/App.test.tsx
similarity index 93%
rename from openmetadata-ui/src/main/resources/ui/src/App.test.js
rename to openmetadata-ui/src/main/resources/ui/src/App.test.tsx
index 96ffe5a06eb..8070a5d4e21 100644
--- a/openmetadata-ui/src/main/resources/ui/src/App.test.js
+++ b/openmetadata-ui/src/main/resources/ui/src/App.test.tsx
@@ -22,6 +22,10 @@ jest.mock('./router/AppRouter', () => {
   return jest.fn().mockReturnValue(<p>AppRouter</p>);
 });
 
+jest.mock('./components/app-bar/Appbar', () => {
+  return jest.fn().mockReturnValue(<p>AppBar</p>);
+});
+
 jest.mock('./authentication/auth-provider/AuthProvider', () => {
   return {
     AuthProvider: jest
diff --git a/openmetadata-ui/src/main/resources/ui/src/App.tsx b/openmetadata-ui/src/main/resources/ui/src/App.tsx
index 10ca356b707..ec5a06d7257 100644
--- a/openmetadata-ui/src/main/resources/ui/src/App.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/App.tsx
@@ -29,6 +29,7 @@ import { BrowserRouter as Router } from 'react-router-dom';
 import { ToastContainer } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.min.css';
 import { AuthProvider } from './authentication/auth-provider/AuthProvider';
+import Appbar from './components/app-bar/Appbar';
 import GlobalSearchProvider from './components/GlobalSearchProvider/GlobalSearchProvider';
 import WebSocketProvider from './components/web-scoket/web-scoket.provider';
 import { toastOptions } from './constants/toast.constants';
@@ -57,6 +58,7 @@ const App: FunctionComponent = () => {
             <AuthProvider childComponentType={AppRouter}>
               <WebSocketProvider>
                 <GlobalSearchProvider>
+                  <Appbar />
                   <AppRouter />
                 </GlobalSearchProvider>
               </WebSocketProvider>
diff --git a/openmetadata-ui/src/main/resources/ui/src/authentication/authenticators/OidcAuthenticator.tsx b/openmetadata-ui/src/main/resources/ui/src/authentication/authenticators/OidcAuthenticator.tsx
index 7fc96c032bc..a15e13cc97c 100644
--- a/openmetadata-ui/src/main/resources/ui/src/authentication/authenticators/OidcAuthenticator.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/authentication/authenticators/OidcAuthenticator.tsx
@@ -24,7 +24,6 @@ import React, {
 import { Callback, makeAuthenticator, makeUserManager } from 'react-oidc';
 import { Redirect, Route, Switch } from 'react-router-dom';
 import AppState from '../../AppState';
-import Appbar from '../../components/app-bar/Appbar';
 import Loader from '../../components/Loader/Loader';
 import { oidcTokenKey, ROUTES } from '../../constants/constants';
 import SigninPage from '../../pages/login';
@@ -113,7 +112,6 @@ const OidcAuthenticator = forwardRef<AuthenticatorRef, Props>(
 
     return !loading ? (
       <>
-        <Appbar />
         <Switch>
           <Route exact path={ROUTES.HOME}>
             {!isAuthDisabled && !isAuthenticated && !isSigningIn ? (
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx b/openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx
index 3d5004959c7..3466dfb68b1 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx
@@ -289,6 +289,7 @@ const NavBar = ({
             <Space size={24}>
               <button className="focus:tw-no-underline hover:tw-underline tw-flex-shrink-0 ">
                 <Dropdown
+                  destroyPopupOnHide
                   overlay={
                     <NotificationBox
                       hasMentionNotification={hasMentionNotification}
diff --git a/openmetadata-ui/src/main/resources/ui/src/router/AppRouter.tsx b/openmetadata-ui/src/main/resources/ui/src/router/AppRouter.tsx
index dc7b907501f..9888007d91e 100644
--- a/openmetadata-ui/src/main/resources/ui/src/router/AppRouter.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/router/AppRouter.tsx
@@ -17,7 +17,6 @@ import React, { useEffect, useState } from 'react';
 import { Redirect, Route, Switch } from 'react-router-dom';
 import { useAuthContext } from '../authentication/auth-provider/AuthProvider';
 import { fetchSlackConfig } from '../axiosAPIs/miscAPI';
-import Appbar from '../components/app-bar/Appbar';
 import Loader from '../components/Loader/Loader';
 import SlackChat from '../components/SlackChat/SlackChat';
 import { ROUTES } from '../constants/constants';
@@ -95,7 +94,6 @@ const AppRouter = () => {
         </>
       ) : (
         <>
-          <Appbar />
           {slackChat}
           <Switch>
             <Route exact path={ROUTES.HOME}>