fixed ToastContainer

src/layouts/AppLayout.jsx

@@ -5,11 +5,16 @@ import useUser from "@/lib/app/hooks/useUser";
 import Head from "next/head";
 import NextNProgress from "nextjs-progressbar";
 import {useEffect} from "react";
+import {ToastContainer} from "react-toastify";
+import useDirection from "@/lib/app/hooks/useDirection";
+import "react-toastify/dist/ReactToastify.css";
 
 function AppLayout({children, isBot}) {
     const {languageIsReady} = useLanguage();
     const {setLoadingPage} = useLoading();
     const {userChangedLanguage, token, isAuth} = useUser();
+    const {directionApp} = useDirection();
+
     useEffect(() => {
         if (languageIsReady) {
             if (token) {
@@ -91,6 +96,7 @@ function AppLayout({children, isBot}) {
                 color={theme.palette.secondary.dark}
                 options={{showSpinner: false}}
             />
+            {directionApp === "rtl" ? <ToastContainer rtl/> : <ToastContainer ltr/>}
             {children}
         </>
     );

src/layouts/dashboardLayouts/index.jsx

@@ -4,14 +4,10 @@ import Header from "./header";
 import Sidebar from "./sidebar";
 import {Toolbar} from "@mui/material";
 import BreadCrumbs from "./breadcrumbs";
-import {ToastContainer} from "react-toastify";
-import "react-toastify/dist/ReactToastify.css";
-import useDirection from "@/lib/app/hooks/useDirection";
 
 const drawerWidth = 240;
 
 const DashboardLayouts = (props) => {
-    const {directionApp} = useDirection();
     const {window} = props;
     const [mobileOpen, setMobileOpen] = useState(false);
     const container =
@@ -42,7 +38,6 @@ const DashboardLayouts = (props) => {
                     {props.children}
                 </FullPageLayout>
             </FullPageLayout>
-            {directionApp === "rtl" ? <ToastContainer rtl/> : <ToastContainer ltr/>}
         </FullPageLayout>
     );
 };

src/pages/login-expert.jsx

@@ -1,16 +1,11 @@
 import LoginComponent from "@/components/login-expert";
 import WithoutAuthMiddleware from "@/middlewares/WithoutAuth";
 import {parse} from "next-useragent";
-import "react-toastify/dist/ReactToastify.css";
-import {ToastContainer} from "react-toastify";
-import useDirection from "@/lib/app/hooks/useDirection";
 
 export default function Login() {
-    const {directionApp} = useDirection();
     return (
         <WithoutAuthMiddleware>
             <LoginComponent/>
-            {directionApp === "rtl" ? <ToastContainer rtl/> : <ToastContainer ltr/>}
         </WithoutAuthMiddleware>
     );
 }