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, }, ], };