GenericLayout.js
1.98 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
import { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { loadUser } from "../../../redux/actions/userActions";
import { getVendorDetails } from "../../../redux/actions/vendorActions";
import { GenericHeader } from "./GenericHeader";
import { GenericSidebar } from "./GenericSidebar";
import { getActivitiesForAdmin } from "../../../redux/actions/activityAction";
import { useRouter } from "next/router";
import { ToastContainer } from "react-toastify";
export const GenericLayout = ({ children }) => {
const dispatch = useDispatch();
const router = useRouter();
const [isRoute, setIsRoute] = useState("");
useEffect(() => {
const adminUri = router.pathname.includes("admin");
const vendorUri = router.pathname.includes("vendor");
setIsRoute(adminUri ? "admin" : vendorUri ? "vendor" : "");
console.log("isRoute:", isRoute);
}, [router.pathname]);
useEffect(() => {
dispatch(loadUser());
dispatch(getVendorDetails());
// dispatch(getActivitiesForAdmin({}));
}, []);
const { vendorDetails } = useSelector(state => state.vendorDetails);
const { loadedUser } = useSelector(state => state.loadedUser);
return (
<div
style={{
height: "100vh",
width: "100vw"
}}
>
<GenericHeader
venderBusiness={vendorDetails?.attributes?.businessName}
venderEmail={vendorDetails?.attributes?.email}
businessLogo={vendorDetails?.attributes?.brandLogo?.data?.attributes?.url}
adminName={loadedUser?.username}
adminEmail={loadedUser?.email}
isRoute={isRoute}
/>
<div
className="w-100 d-flex"
style={{
height: "calc(100vh - 80px)"
}}
>
<GenericSidebar isRoute={isRoute} />
<ToastContainer position="bottom-right" />
<div
style={{
width: "85%",
overflowY: "auto"
}}
>
{children}
</div>
</div>
</div>
);
};