// components/DashboardHeader.jsx
import React from 'react';
import { LogOut, Wallet, Link } from 'lucide-react';

const DashboardHeader = () => {
  return (
    <div className="w-full bg-white shadow-sm p-4 mb-6">
      <div className="flex justify-between items-center max-w-7xl mx-auto">
        <div className="flex items-center gap-2">
          <h1 className="text-2xl font-bold">Digital Inheritance Dashboard</h1>
          <span className="text-sm text-gray-500">by Muhammad Shaheer</span>
        </div>
        <div className="flex items-center gap-4">
          <button className="flex items-center gap-2 px-4 py-2 text-gray-600 hover:bg-gray-100 rounded-lg">
            <Wallet size={20} />
            Wallets
          </button>
          <button className="flex items-center gap-2 px-4 py-2 text-gray-600 hover:bg-gray-100 rounded-lg">
            <Link size={20} />
            Link Accounts
          </button>
          <button 
            onClick={() => {
              window.location.href = "/"
            }}
            className="flex items-center gap-2 px-4 py-2 text-red-600 hover:bg-red-50 rounded-lg"
          >
            <LogOut size={20} />
            Logout
          </button>
        </div>
      </div>
    </div>
  );
};

export default DashboardHeader;