You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

430 lines
12 KiB

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 } from "./redux/actions";
import Navbar from "./components/Navbar";
import BG from "./components/BG";
import BottomNavigation from "./components/BottomNavigation";
import _ from "lodash";
3 years ago
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";
3 years ago
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";
3 years ago
import Blogs from "./views/Blogs";
import Blog from "./views/Blog";
3 years ago
import About from "./views/About";
import Dialog from "./components/Dialog";
function Router({ isDark, isMobile, headerOptions, dialog }) {
useEffect(() => {
window.addEventListener("scroll", () => {});
}, []);
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",
],
" "
)}
>
{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: true,
bookmark: true,
}}
/>
}
/>
<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>
3 years ago
<Route
path="/videos/:id"
exact
element={
<Video
headerOptions={{
logo: false,
hamburgerMenu: false,
qr: false,
title: false,
back: true,
shown: true,
menu: true,
bookmark: true,
}}
/>
}
/>
<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,
}}
/>
}
3 years ago
/>
<Route
3 years ago
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 />} />
<Route
path="/ar"
exact
element={
<AR
headerOptions={{
logo: true,
hamburgerMenu: true,
qr: true,
title: false,
back: false,
shown: true,
menu: false,
}}
/>
}
3 years ago
/>
<Route
path="/blogs"
exact
element={
<Blogs
// headerOptions={{
// logo: true,
// hamburgerMenu: true,
// qr: true,
// title: false,
// back: false,
// shown: true,
// menu: false,
// }}
3 years ago
/>
}
/>
<Route
path="/blogs/:id"
exact
element={
<Blog
// headerOptions={{
// logo: true,
// hamburgerMenu: true,
// qr: true,
// title: false,
// back: false,
// shown: true,
// menu: false,
// }}
/>
}
/>
<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,
});
const mapDispatchToProps = {
setDesktopContentTransform: publicApi.setDesktopContentTransform,
};
export default connect(mapStateToProps, mapDispatchToProps)(Router);