'use client';

import { SettingsSidebar, NotificationsForm } from '@/components/settings';

interface NotificationSetting {
  id: string;
  label: string;
  description: string;
  enabled: boolean;
}

export default function NotificationsPage() {
  const handleSave = (data: {
    emailNotifications: NotificationSetting[];
    pushNotifications: NotificationSetting[];
  }) => {
    console.log('Saving agent notification settings:', data);
  };

  return (
    <div className="flex flex-col lg:flex-row gap-6">
      {/* Left Sidebar */}
      <SettingsSidebar basePath="/agent/settings" />

      {/* Main Content */}
      <div className="flex-1">
        {/* Header Card */}
        <div className="border border-[#00293d]/10 rounded-[15px] px-6 py-4 mb-4 bg-white">
          <h1 className="font-fractul font-bold text-[15px] leading-[18px] text-[#00293D]">
            Notifications
          </h1>
        </div>

        <NotificationsForm onSave={handleSave} />
      </div>
    </div>
  );
}
