<li className={`${style["nav-link"]} ${style["collapse"]} ${productCollapse ? style["nav-active"] : ''}`}>
        <ShippingBoxV2 strokeWidth={2} size={36} className={`${style["icon"]} ${style["nav-icon"]}`} />
        <span className={style["nav-name"]}>Ürün</span>
        <ChevronDown strokeWidth={2} size={36} className={`${style["collapse-link"]}`} />
        <ul className={`${style["collapse-menu"]} ${style["show-collapse"]}`}>
            <NavLink  to="/product" className={({ isActive }) => isActive ? `${style["collapse-sublink-active"]} ${style["collapse-sublink"]}` : `${style["collapse-sublink"]}`}>
                         <span>Genel İşlemler</span>
            </NavLink>
            <NavLink to="/product/list" className={({ isActive }) => isActive ? `${style["collapse-sublink-active"]} ${style["collapse-sublink"]}` : `${style["collapse-sublink"]}`}>
                         <span>Ürün Listesi</span>
            </NavLink>
            <NavLink to="/product/batch" className={({ isActive }) => isActive ? `${style["collapse-sublink-active"]} ${style["collapse-sublink"]}` : `${style["collapse-sublink"]}`}>
                <span>Toplu Güncelleme</span>
            </NavLink>
            <NavLink to="/definitions" className={({ isActive }) => isActive ? `${style["collapse-sublink-active"]} ${style["collapse-sublink"]}` : `${style["collapse-sublink"]}`}>
                <span>Tanımlamalar</span>
            </NavLink>
        </ul>
    </li>