0211bea186
- Backend Node.js/Express con PostgreSQL - Frontend React 19 con Vite - Docker Compose para orquestacion - Documentacion completa en README.md - Scripts SQL para base de datos - Configuracion de ejemplo (.env.example)
54 lines
1.5 KiB
JavaScript
54 lines
1.5 KiB
JavaScript
// Sidebar.jsx
|
|
import { useNavigate } from "react-router-dom";
|
|
import { menuConfig } from "../constants/menuConfig";
|
|
|
|
const Sidebar = () => {
|
|
const navigate = useNavigate();
|
|
|
|
return (
|
|
<aside className="sidebar">
|
|
<nav>
|
|
{Object.entries(menuConfig).map(([key, section]) => (
|
|
<button
|
|
key={key}
|
|
className="sidebar-link"
|
|
onClick={() => navigate(section.basePath)}
|
|
>
|
|
{section.label}
|
|
</button>
|
|
))}
|
|
</nav>
|
|
</aside>
|
|
);
|
|
};
|
|
|
|
export default Sidebar;
|
|
|
|
// import React, { useState } from "react";
|
|
// import { NavLink } from "react-router-dom";
|
|
// import "./..styles/Sidebar.css";
|
|
|
|
// export default function Sidebar() {
|
|
// const [collapsed, setCollapsed] = useState(false);
|
|
|
|
// return (
|
|
// <div className={`sidebar ${collapsed ? "collapsed" : ""}`}>
|
|
// <div className="sidebar-header">
|
|
// <button className="toggle-btn" onClick={() => setCollapsed(!collapsed)}>
|
|
// ☰
|
|
// </button>
|
|
// {!collapsed && <span className="title">Dashboard</span>}
|
|
// </div>
|
|
|
|
// <nav className="sidebar-nav">
|
|
// <NavLink to="/app/dashboard">Dashboards</NavLink>
|
|
// <NavLink to="/app/expenses-to-approve">Expenses to be approved</NavLink>
|
|
// <NavLink to="/app/expenses">Expenses</NavLink>
|
|
// <NavLink to="/app/inventory">Inventory</NavLink>
|
|
// <NavLink to="/app/payroll">Payroll</NavLink>
|
|
// <NavLink to="/app/hotel">Hotel</NavLink>
|
|
// </nav>
|
|
// </div>
|
|
// );
|
|
// }
|