import React, { useState } from "react";
import { NavLink } from "react-router-dom";
import { connect } from "react-redux";
//assets
import deactiveHomeIcon from "./bottom-home-deactive.svg";
import deactiveProductsIcon from "./bottom-products-deactive.svg";
import deactiveVideoIcon from "./bottom-video-deactive.svg";
import deactiveProfileIcon from "./bottom-profile-deactive.svg";
import deactiveTestIcon from "./bottom-test-deactive.svg";
import activeHomeIcon from "./bottom-home-active.svg";
import activeTestIcon from "./bottom-test-active.svg";
import activeProfileIcon from "./bottom-profile-active.svg";
import activeProductsIcon from "./bottom-products-active.svg";
import activeVideoIcon from "./bottom-video-active.svg";
export const BottomNavigation = ({ pages, isDark }) => {
const [activeLink, setActiveLink] = useState("/");
const Tab = ({ page }) => {
return (
setActiveLink(page.link)}
>
{page.name}
);
};
return (
<>
>
);
};
const mapStateToProps = (state) => ({
isDark: state.publicApi.isDark,
});
const mapDispatchToProps = {};
export default connect(mapStateToProps, mapDispatchToProps)(BottomNavigation);
BottomNavigation.defaultProps = {
pages: [
{
id: 0,
name: window.t("صفحه اصلی"),
link: "/",
activeIcon: activeHomeIcon,
deactiveIcon: deactiveHomeIcon,
},
{
id: 1,
name: window.t("محصولات"),
link: "/products",
activeIcon: activeProductsIcon,
deactiveIcon: deactiveProductsIcon,
},
{
id: 2,
name: window.t("ویدئو"),
link: "/videos",
activeIcon: activeVideoIcon,
deactiveIcon: deactiveVideoIcon,
},
{
id: 3,
name: window.t("سبد خرید"),
link: "/cart",
activeIcon: activeTestIcon,
deactiveIcon: deactiveTestIcon,
},
{
id: 4,
name: window.t("حساب کاربری"),
link: "/dashboard",
activeIcon: activeProfileIcon,
deactiveIcon: deactiveProfileIcon,
},
],
};