import { Home as HomeIcon, BookOpen } from 'lucide-react';
import BreadCrumb from '../../components/BreadCrumb';
import './Ledger.scss';
import LedgerSection from '../../components/LedgerSection';

export default function LedgerHome({ user }) {

  // Customer Data (From Screenshot)
  const customers = [
    {
      id: 1,
      name: 'Deepa',
      phone: '98755 43210',
      avatar: 'D',
      balance: 800,
      type: 'credit',
      lastTransaction: 'Payment received',
      lastDate: 'Today, 2:30 PM',
      color: 'from-green-400 to-green-500',
      bgColor: 'bg-green-50',
      textColor: 'text-green-600',
      history: [
        { id: 1, date: '02 Dec 2025', type: 'credit', amount: 500, note: 'Invoice payment', method: 'UPI' },
        { id: 2, date: '28 Nov 2025', type: 'debit', amount: 300, note: 'Product purchase', method: 'Cash' },
        { id: 3, date: '25 Nov 2025', type: 'credit', amount: 600, note: 'Service payment', method: 'Bank Transfer' },
        { id: 4, date: '20 Nov 2025', type: 'debit', amount: 200, note: 'Advance given', method: 'UPI' },
        { id: 5, date: '15 Nov 2025', type: 'credit', amount: 1000, note: 'Full settlement', method: 'Cash' }
      ]
    },
    {
      id: 2,
      name: 'Rakesh',
      phone: '98765 12345',
      avatar: 'R',
      balance: 500,
      type: 'debit',
      lastTransaction: 'Outstanding payment',
      lastDate: 'Yesterday, 5:00 PM',
      color: 'from-red-400 to-red-500',
      bgColor: 'bg-red-50',
      textColor: 'text-red-600',
      history: [
        { id: 1, date: '01 Dec 2025', type: 'debit', amount: 500, note: 'Product delivered', method: 'Pending' },
        { id: 2, date: '25 Nov 2025', type: 'credit', amount: 1000, note: 'Payment received', method: 'UPI' },
        { id: 3, date: '20 Nov 2025', type: 'debit', amount: 800, note: 'Supplies ordered', method: 'Cash' }
      ]
    },
    {
      id: 3,
      name: 'Sunil',
      phone: '98755 67890',
      avatar: 'S',
      balance: 1200,
      type: 'debit',
      lastTransaction: 'Bought supplies',
      lastDate: '2 days ago',
      color: 'from-orange-400 to-orange-500',
      bgColor: 'bg-orange-50',
      textColor: 'text-orange-600',
      history: [
        { id: 1, date: '30 Nov 2025', type: 'debit', amount: 1200, note: 'Bought supplies', method: 'Pending' },
        { id: 2, date: '22 Nov 2025', type: 'credit', amount: 500, note: 'Payment received', method: 'Cash' }
      ]
    },
    {
      id: 4,
      name: 'Priya',
      phone: '98755 11111',
      avatar: 'P',
      balance: 2500,
      type: 'credit',
      lastTransaction: 'Invoice paid',
      lastDate: '3 days ago',
      color: 'from-blue-400 to-blue-500',
      bgColor: 'bg-blue-50',
      textColor: 'text-blue-600',
      history: [
        { id: 1, date: '29 Nov 2025', type: 'credit', amount: 2500, note: 'Invoice paid', method: 'Bank Transfer' },
        { id: 2, date: '15 Nov 2025', type: 'debit', amount: 1000, note: 'Purchase order', method: 'UPI' }
      ]
    },
    {
      id: 5,
      name: 'Karthik',
      phone: '98755 22222',
      avatar: 'K',
      balance: 1500,
      type: 'credit',
      lastTransaction: 'Payment sent',
      lastDate: '4 days ago',
      color: 'from-purple-400 to-purple-500',
      bgColor: 'bg-purple-50',
      textColor: 'text-purple-600',
      history: [
        { id: 1, date: '28 Nov 2025', type: 'credit', amount: 1500, note: 'Payment sent', method: 'Cash' },
        { id: 2, date: '10 Nov 2025', type: 'debit', amount: 500, note: 'Advance payment', method: 'UPI' }
      ]
    },
    {
      id: 6,
      name: 'Anjali',
      phone: '98755 33333',
      avatar: 'A',
      balance: 350,
      type: 'debit',
      lastTransaction: 'Pending payment',
      lastDate: '5 days ago',
      color: 'from-pink-400 to-pink-500',
      bgColor: 'bg-pink-50',
      textColor: 'text-pink-600',
      history: [
        { id: 1, date: '27 Nov 2025', type: 'debit', amount: 350, note: 'Pending payment', method: 'Pending' }
      ]
    },
  ];

  // Supplier Data
  const suppliers = [
    {
      id: 1,
      name: 'ABC Materials',
      phone: '98700 11111',
      avatar: 'AM',
      balance: 15000,
      type: 'debit',
      lastTransaction: 'Material purchased',
      lastDate: 'Today, 10:00 AM',
      color: 'from-red-400 to-red-500',
      bgColor: 'bg-red-50',
      textColor: 'text-red-600',
      history: [
        { id: 1, date: '02 Dec 2025', type: 'debit', amount: 15000, note: 'Material purchased', method: 'Pending' },
        { id: 2, date: '20 Nov 2025', type: 'credit', amount: 10000, note: 'Payment made', method: 'Bank Transfer' }
      ]
    },
    {
      id: 2,
      name: 'Tech Supplies Co',
      phone: '98700 22222',
      avatar: 'TS',
      balance: 8500,
      type: 'debit',
      lastTransaction: 'Equipment bought',
      lastDate: 'Yesterday, 3:00 PM',
      color: 'from-orange-400 to-orange-500',
      bgColor: 'bg-orange-50',
      textColor: 'text-orange-600'
    },
    {
      id: 3,
      name: 'Global Traders',
      phone: '98700 33333',
      avatar: 'GT',
      balance: 22000,
      type: 'debit',
      lastTransaction: 'Bulk order',
      lastDate: '2 days ago',
      color: 'from-rose-400 to-rose-500',
      bgColor: 'bg-rose-50',
      textColor: 'text-rose-600'
    },
    {
      id: 4,
      name: 'Prime Wholesale',
      phone: '98700 44444',
      avatar: 'PW',
      balance: 5000,
      type: 'credit',
      lastTransaction: 'Return credit',
      lastDate: '3 days ago',
      color: 'from-blue-400 to-blue-500',
      bgColor: 'bg-blue-50',
      textColor: 'text-blue-600'
    },
    {
      id: 5,
      name: 'Metro Suppliers',
      phone: '98700 55555',
      avatar: 'MS',
      balance: 12000,
      type: 'debit',
      lastTransaction: 'Monthly payment',
      lastDate: '4 days ago',
      color: 'from-purple-400 to-purple-500',
      bgColor: 'bg-purple-50',
      textColor: 'text-purple-600'
    },
  ];

  const breadcrumbItems = [
    { icon: <HomeIcon />, label: 'Home', path: '/dashboard', active: false },
    { icon: <BookOpen />, label: 'My Ledger', path: '/ledger', active: true },
    // { icon: activeTab === 'customers' ? <UsersIcon /> : <Package />, label: activeTab === 'customers' ? 'Customers' : 'Suppliers', active: true }
  ];

  return (
    <div className="khata-home-web">
      <div className='relative'>
        <BreadCrumb items={breadcrumbItems} showUser={true} />
      </div>

      <LedgerSection customers={customers} suppliers={suppliers} />
    </div>
  );
}
