Dashtic Admin & Dashboard template Layout Structure

---

Folder Structure

import React from 'react'
import { Switcher } from '../Components/Switcher/Switcher';
import { Header } from '../Components/Header/Header';
import Sidebar from '../Components/Sidebar/Sidebar';
import { Footer } from '../Components/Footer/Footer';
import { Outlet } from 'react-router-dom';
import TabToTop from '../Components/TabToTap/TabToTap';
import { Provider } from 'react-redux'
import store from '../../Redux/Store/store';

function App() {

document.querySelector("body").classList.remove("page-style1", "error-page")
document.querySelector("body").classList.add("main-body", "app","sidebar-mini", "light-mode", "ltr");

const headersearch =()=>{
document.querySelector("body").classList.remove("search-show");

if(document.querySelector(".search-result")){
document.querySelector(".search-result").classList.add("d-none")
}

document.querySelector(".demo_changer").classList.remove("active");
document.querySelector(".demo_changer").style.right = "-270px";
}

  return (
    <div className="horizontalMenucontainer">
    <Switcher />
        <div className="page">
            <div className="page-main open">
    <Header />
    <Sidebar />
       <div className="app-content main-content" onClick={()=>headersearch()}>
            <div className="side-app">
               <div className="container-fluid main-container" >
                   <Provider store={store}>
                   <Outlet />
                   </Provider>
               </div>
            </div>
        </div>
    </div>
    <Footer />

    </div>
    <TabToTop/>
    </div>
  )
}

export default App