ToastContainer on application root

src/components/App.js

@@ -1,5 +1,6 @@
 import React, { useEffect } from "react";
 import { HashRouter, Route, Switch, Redirect } from "react-router-dom";
+import ToastContainer from "./toast/ToastContainer";
 
 // components
 import Layout from "./Layout/Layout";
@@ -34,6 +35,7 @@ export default function App() {
         <PublicRoute path="/login" component={Login} />
         <Route component={Error} />
       </Switch>
+      <ToastContainer />
     </HashRouter>
   );
 

src/pages/notifications/Notifications.js

@@ -1,7 +1,6 @@
 import React, { useState } from "react";
 import { Grid } from "@material-ui/core";
 import { toast } from "react-toastify";
-import ToastContainer from "../../components/toast/ToastContainer";
 import SyntaxHighlighter from "react-syntax-highlighter";
 import { docco } from "react-syntax-highlighter/dist/esm/styles/hljs";
 import classnames from "classnames";
@@ -36,7 +35,6 @@ export default function NotificationsPage(props) {
     <>
       <PageTitle title="Notifications" />
       <Grid container spacing={4}>
-        <ToastContainer />
         <Grid item xs={12}>
           <Widget disableWidgetMenu>
             <Grid container item xs={12}>