Spaces:
Running
Running
| import { NavLink } from "react-router-dom"; | |
| import { | |
| IcHome, IcDownload, IcImage, IcVideo, IcScissors, IcShuffle, IcMic, | |
| IcBook, IcHelp, IcLock, IcHistory, IcStar, IcText, | |
| } from "./Icons"; | |
| const item = (to, Icon, label) => ( | |
| <NavLink to={to} end className={({ isActive }) => "nav-item" + (isActive ? " active" : "")}> | |
| <Icon /> <span>{label}</span> | |
| </NavLink> | |
| ); | |
| export default function Sidebar() { | |
| return ( | |
| <aside className="sidebar"> | |
| <div className="logo"> | |
| <img src="/logo.png" alt="TNT Group" /> | |
| </div> | |
| <div className="nav-group"> | |
| <div className="label">Tổng quan</div> | |
| {item("/", IcHome, "Trang chủ")} | |
| </div> | |
| <div className="nav-group"> | |
| <div className="label">Tạo ảnh / video</div> | |
| {item("/down-list", IcDownload, "Down list video")} | |
| {item("/listing-anh", IcImage, "Listing ảnh")} | |
| {/* Ẩn tạm "Listing ảnh Free" — bật lại thì bỏ comment dòng dưới */} | |
| {/* {item("/listing-free", IcStar, "Listing ảnh Free")} */} | |
| {item("/tao-video", IcVideo, "Tạo video")} | |
| </div> | |
| <div className="nav-group"> | |
| <div className="label">Xử lý video</div> | |
| {item("/cut", IcScissors, "Cut video")} | |
| {item("/xao", IcShuffle, "Xào video")} | |
| {item("/dub", IcMic, "Dịch / đổi giọng")} | |
| {item("/chen-chu", IcText, "Chèn chữ vào video")} | |
| {item("/lich-su", IcHistory, "Lịch sử cá nhân")} | |
| </div> | |
| <div className="nav-group"> | |
| <div className="label">Quản trị</div> | |
| {item("/quan-tri", IcLock, "Người dùng")} | |
| </div> | |
| <div className="nav-spacer" /> | |
| <div className="nav-divider" /> | |
| {item("/huong-dan", IcBook, "Hướng dẫn")} | |
| {item("/ho-tro", IcHelp, "Hỗ trợ")} | |
| </aside> | |
| ); | |
| } | |