|
|
import React, { useEffect } from "react"; |
|
|
import { BrowserRouter, Routes, Route } from "react-router-dom"; |
|
|
import { Navigate } from "react-router-dom"; |
|
|
import { connect } from "react-redux"; |
|
|
import { publicApi, menu } from "./redux/actions"; |
|
|
import Navbar from "./components/Navbar"; |
|
|
import BG from "./components/BG"; |
|
|
import BottomNavigation from "./components/BottomNavigation"; |
|
|
|
|
|
import _ from "lodash"; |
|
|
import Home from "./views/Home"; |
|
|
import Auth from "./views/Auth"; |
|
|
import Products from "./views/Products"; |
|
|
import Product from "./views/Product"; |
|
|
import ShoppingCart from "./views/ShoppingCart"; |
|
|
import DeliveryForm from "./views/DeliveryForm"; |
|
|
import Videos from "./views/Videos"; |
|
|
import Video from "./views/Video"; |
|
|
import VideoDisplay from "./views/VideoDisplay"; |
|
|
import AR from "./views/AR"; |
|
|
import QR from "./views/QR"; |
|
|
import NotFound from "./views/404"; |
|
|
import Orders from "./views/Orders"; |
|
|
import Order from "./views/Order"; |
|
|
import Activation from "./views/Activation"; |
|
|
import Faq from "./views/Faq"; |
|
|
import Contact from "./views/Contact"; |
|
|
import Dashboard from "./views/Dashboard"; |
|
|
import FooterDesign1 from "./components/Footer"; |
|
|
import Blogs from "./views/Blogs"; |
|
|
import Blog from "./views/Blog"; |
|
|
import About from "./views/About"; |
|
|
import Dialog from "./components/Dialog"; |
|
|
import Address from "./views/Address"; |
|
|
import Favorites from "./views/Favorites"; |
|
|
import Addresses from "./views/Dashboard/layouts/Mobile/ProfileAddress"; |
|
|
|
|
|
function Router({ isDark, isMobile, headerOptions, dialog, menu, setMenu }) { |
|
|
useEffect(() => { |
|
|
window.addEventListener("scroll", () => {}); |
|
|
}, []); |
|
|
|
|
|
const prevDefault = (e) => { |
|
|
setMenu(); |
|
|
e.stopPropagation(); |
|
|
}; |
|
|
|
|
|
return ( |
|
|
<div className={`${isDark ? "dark" : ""}`}> |
|
|
<div |
|
|
className={_.join( |
|
|
[ |
|
|
"min-h-screen min-w-screen rtl overflow-x-hidden lg:py-0", |
|
|
isDark ? "" : "bg-white", |
|
|
headerOptions?.shown ? "pt-16" : "pt-0", |
|
|
], |
|
|
" " |
|
|
)} |
|
|
> |
|
|
{menu && ( |
|
|
<div |
|
|
className="h-full w-screen fixed top-0 left-0 bg-opacity-0" |
|
|
onClick={(e) => prevDefault(e)} |
|
|
style={{ zIndex: 60 }} |
|
|
></div> |
|
|
)} |
|
|
{dialog.open && <Dialog />} |
|
|
<BrowserRouter> |
|
|
{headerOptions?.shown && <Navbar headerOptions={headerOptions} />} |
|
|
|
|
|
{isMobile && ( |
|
|
<> |
|
|
<BG /> |
|
|
<BottomNavigation /> |
|
|
</> |
|
|
)} |
|
|
<Routes> |
|
|
<Route |
|
|
path="/" |
|
|
exact |
|
|
element={ |
|
|
<Home |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
back: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route path="/login" exact element={<Auth page="login" />} /> |
|
|
<Route |
|
|
path="/signup" |
|
|
exact |
|
|
element={ |
|
|
<Auth |
|
|
page="signup" |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
back: false, |
|
|
shown: isMobile ? true : false, |
|
|
menu: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
{/* <Route path="/profile" exact element={<Auth page="profile" />} /> */} |
|
|
<Route |
|
|
path="/products" |
|
|
exact |
|
|
element={ |
|
|
<Products headerOptions={{ shown: isMobile ? false : true }} /> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/products/:id" |
|
|
exact |
|
|
element={ |
|
|
<Product |
|
|
headerOptions={{ |
|
|
shown: true, |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
title: false, |
|
|
back: true, |
|
|
menu: false, |
|
|
bookmark: "productId", |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/cart" |
|
|
exact |
|
|
element={ |
|
|
<ShoppingCart |
|
|
headerOptions={{ |
|
|
shown: true, |
|
|
title: isMobile && "سبد خرید", |
|
|
back: isMobile && true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/cart/delivery-form" |
|
|
exact |
|
|
element={ |
|
|
<DeliveryForm |
|
|
headerOptions={{ |
|
|
shown: true, |
|
|
title: "سبد خرید", |
|
|
back: true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/videos" |
|
|
exact |
|
|
element={ |
|
|
isMobile ? ( |
|
|
<Videos |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
back: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
}} |
|
|
/> |
|
|
) : ( |
|
|
<Navigate replace to="/products" /> |
|
|
) |
|
|
} |
|
|
></Route> |
|
|
<Route |
|
|
path="/videos/:id" |
|
|
exact |
|
|
element={ |
|
|
<Video |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: false, |
|
|
back: true, |
|
|
shown: true, |
|
|
menu: true, |
|
|
bookmark: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/videos/:id/display" |
|
|
exact |
|
|
element={ |
|
|
<VideoDisplay |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: false, |
|
|
back: true, |
|
|
shown: true, |
|
|
menu: true, |
|
|
bookmark: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/scan" |
|
|
exact |
|
|
element={ |
|
|
<QR |
|
|
headerOptions={{ |
|
|
shown: "false", |
|
|
}} |
|
|
page="scan" |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/scan/:id" |
|
|
exact |
|
|
element={ |
|
|
<QR |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: false, |
|
|
back: true, |
|
|
shown: true, |
|
|
menu: true, |
|
|
bookmark: false, |
|
|
}} |
|
|
page="content" |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/Orders" |
|
|
exact |
|
|
element={ |
|
|
<Orders |
|
|
headerOptions={{ |
|
|
shown: true, |
|
|
title: "سفارشات من", |
|
|
back: true, |
|
|
logo: false, |
|
|
menu: false, |
|
|
hamburgerMenu: false, |
|
|
bookmark: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/orders/order" |
|
|
exact |
|
|
element={ |
|
|
<Order |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: false, |
|
|
qr: true, |
|
|
title: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/activation" |
|
|
exact |
|
|
element={ |
|
|
<Activation |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/faq" |
|
|
exact |
|
|
element={ |
|
|
<Faq |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/contact-us" |
|
|
exact |
|
|
element={ |
|
|
<Contact |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/about-us" |
|
|
exact |
|
|
element={ |
|
|
<About |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/dashboard" |
|
|
exact |
|
|
element={ |
|
|
<Dashboard |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/editProfile" |
|
|
exact |
|
|
element={ |
|
|
<Address |
|
|
profilePage={true} |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: "مشخصات کاربری", |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/editAddress/:id" |
|
|
exact |
|
|
element={ |
|
|
<Address |
|
|
editPage={true} |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: "ویرایش آدرس", |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/createAddress" |
|
|
exact |
|
|
element={ |
|
|
<Address |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: "آدرس جدید", |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/favorites" |
|
|
exact |
|
|
element={ |
|
|
<Favorites |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: "علاقهمندیها", |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/addresses" |
|
|
exact |
|
|
element={ |
|
|
<Addresses |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: "آدرس ها", |
|
|
shown: true, |
|
|
menu: false, |
|
|
back: true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/ar" |
|
|
exact |
|
|
element={ |
|
|
<AR |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
back: false, |
|
|
shown: true, |
|
|
menu: false, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/blogs" |
|
|
exact |
|
|
element={ |
|
|
<Blogs |
|
|
// headerOptions={{ |
|
|
// logo: true, |
|
|
// hamburgerMenu: true, |
|
|
// qr: true, |
|
|
// title: false, |
|
|
// back: false, |
|
|
// shown: true, |
|
|
// menu: false, |
|
|
// }} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="/blogs/:id" |
|
|
exact |
|
|
element={ |
|
|
<Blog |
|
|
headerOptions={{ |
|
|
logo: false, |
|
|
hamburgerMenu: false, |
|
|
qr: false, |
|
|
title: false, |
|
|
back: true, |
|
|
shown: true, |
|
|
menu: false, |
|
|
bookmark: "contentId", |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
<Route |
|
|
path="*" |
|
|
exact |
|
|
element={ |
|
|
<NotFound |
|
|
headerOptions={{ |
|
|
logo: true, |
|
|
hamburgerMenu: true, |
|
|
qr: true, |
|
|
title: false, |
|
|
back: false, |
|
|
shown: true, |
|
|
menu: true, |
|
|
}} |
|
|
/> |
|
|
} |
|
|
/> |
|
|
</Routes> |
|
|
{!isMobile && <FooterDesign1 hasHeader />} |
|
|
</BrowserRouter> |
|
|
</div> |
|
|
</div> |
|
|
); |
|
|
} |
|
|
|
|
|
const mapStateToProps = (state) => ({ |
|
|
isDark: state.publicApi.isDark, |
|
|
isMobile: state.publicApi.isMobile, |
|
|
isLogin: state.user.status, |
|
|
headerOptions: state.publicApi.headerOptions, |
|
|
dialog: state.dialog.dialog, |
|
|
menu: state.menu.open, |
|
|
}); |
|
|
|
|
|
const mapDispatchToProps = { |
|
|
setDesktopContentTransform: publicApi.setDesktopContentTransform, |
|
|
setMenu: menu.set, |
|
|
}; |
|
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(Router);
|
|
|
|
