GenericLayout.js
2.02 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
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";
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}
adminName={loadedUser?.username}
adminEmail={loadedUser?.email}
isRoute={isRoute}
/>
<div
className="w-100 d-flex"
style={{
height: 'calc(100vh - 80px)',
}}
>
<GenericSidebar isRoute={isRoute} />
<div style={{
width: '85%',
overflowY: 'auto'
}}>
{children}
</div>
</div>
</div>
)
}