Hook-Nest/src/layouts/Header.js
2025-10-04 15:42:58 +05:30

39 lines
1.4 KiB
JavaScript

'use client';
import NavList from "./NavList";
import { Bell, User } from 'lucide-react';
export default function Header() {
const list_items = [
{ id: 1, name: "Dashboard", routeLink: "/" },
{ id: 2, name: "Brokers", routeLink: "/Brokers" },
{ id: 3, name: "Scan & Tracks", routeLink: "/Scan_Tracks" },
{ id: 4, name: "Positions", routeLink: "/Positions" },
{ id: 5, name: "AI Strategy Builder", routeLink: "/AIStrategyBuilder" },
];
return (
<div className="bg-gray-100 rounded-[2rem] mx-2 mt-2">
<div className="flex justify-between items-center px-6 py-3">
<div className="flex items-center gap-2">
<div className="w-10 h-10 bg-gradient-to-br from-blue-500 to-teal-500 rounded-lg flex items-center justify-center">
<span className="text-white font-bold text-lg">H</span>
</div>
<span className="font-semibold text-xl text-gray-800">HookNest</span>
</div>
<NavList list_items={list_items} />
<div className="flex items-center gap-4">
<button className="p-2 hover:bg-gray-200 rounded-lg transition-colors">
<Bell size={20} className="text-gray-600" />
</button>
<button className="p-2 hover:bg-gray-200 rounded-full transition-colors">
<User size={20} className="text-gray-600" />
</button>
</div>
</div>
</div>
);
}