diff --git a/src/App.js b/src/App.js
index 97217534..03534cbf 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,19 +1,10 @@
 import '@styles/react/libs/flatpickr/flatpickr.scss';
 import '@styles/react/libs/tables/react-dataTable-component.scss';
 import './assets/css/custom.css';
-import { MessageModal } from '@src/components/message/MessageModal';
-import { MessageErrorModal } from '@src/components/message/MessageErrorModal';
-import { MessageInfoModal } from '@src/components/message/MessageInfoModal';
+
 // ** Router Import
 import Router from './router';
 if (process.env.NODE_ENV === 'production') console.log = function () {};
-const App = props => (
-  <>
-    {/* <MessageModal />
-    <MessageErrorModal />
-    <MessageInfoModal /> */}
-    <Router />
-  </>
-);
+const App = props => <Router />;
 
 export default App;
diff --git a/src/router/hoc/ResolveRoutes.tsx b/src/router/hoc/ResolveRoutes.tsx
index 4fc3a02a..b2043662 100644
--- a/src/router/hoc/ResolveRoutes.tsx
+++ b/src/router/hoc/ResolveRoutes.tsx
@@ -10,10 +10,6 @@ import LayoutWrapper from '@layouts/components/layout-wrapper';
 import { IRoute } from '../routes/type';
 import { Routes } from '../routes';
 import authenticationCheck from './authenticationCheck';
-import { useSelector } from '@src/redux/store';
-import { MessageInfoModal } from '@src/components/message/MessageInfoModal';
-import { MessageErrorModal } from '@src/components/message/MessageErrorModal';
-import { MessageModal } from '@src/components/message/MessageModal';
 
 export default function ResolveRoutes() {
   const [layout, setLayout] = useLayout();
@@ -56,9 +52,6 @@ export default function ResolveRoutes() {
 
     return (
       <Route path={LayoutPaths} key={index}>
-        <MessageModal />
-        <MessageErrorModal />
-        <MessageInfoModal />
         <LayoutTag
           routerProps={routerProps}
           layout={layout}
diff --git a/src/router/index.tsx b/src/router/index.tsx
index 0c3bad97..e3965e05 100644
--- a/src/router/index.tsx
+++ b/src/router/index.tsx
@@ -7,6 +7,9 @@ import {
 } from 'react-router-dom';
 import BlankLayout from '@layouts/BlankLayout';
 import ResolveRoutes from './hoc/ResolveRoutes';
+import { MessageModal } from '@src/components/message/MessageModal';
+import { MessageErrorModal } from '@src/components/message/MessageErrorModal';
+import { MessageInfoModal } from '@src/components/message/MessageInfoModal';
 
 const NotAuthorized = lazy(() => import('@src/views/NotAuthorized'));
 const Error = lazy(() => import('@src/views/Error'));
@@ -14,6 +17,9 @@ const Error = lazy(() => import('@src/views/Error'));
 export default function Router() {
   return (
     <AppRouter basename={process.env.REACT_APP_BASENAME}>
+      <MessageModal />
+      <MessageErrorModal />
+      <MessageInfoModal />
       <Switch>
         <Route
           exact