import { X } from 'lucide-react';
import BankDetailSidebar from '../bankdetails/page';
import EditTimings from '../editTimings/page';
import { EditProfileModal } from '../editProfile/page';
import { SupportCard } from '../support/page';
import ContactUs from '../contactus/page';
import OrderDetail from '../orderDetails/page';
import DiscountForm from '../discount/page';
import AcoountDeleteSideBar from '../accountDelete/page';
import FAQ from '../FAQ/page';
import EditDineOutTimings from '../editDineoutTimings/page';
const titleMap: Record<string, string> = {
  profile: 'Edit Profile',
  bankDetails: 'Bank account Details',
  timings: 'Vendor delivery Timings',
  dineout: 'Vendor DineOut Timings',
  support: 'Support',
  contact: 'Contact Us',
  orderDetail: 'Order Detail',
  discount: 'Discount',
  accountDelete: 'Delete Account',
  faq: "FAQ",
};
const SidebarModal = ({
  type,
  onClose
}: {
  type: string;
  onClose: () => void;
}) => {
  return (
    <div className="fixed inset-0 z-50 flex justify-end bg-black bg-opacity-50">
      <div className="h-full w-[500px] translate-x-0 transform bg-white p-6 shadow-lg shadow-gray-500/50 transition-transform flex flex-col relative">
        <button className="absolute right-4 top-4" onClick={onClose}>
          <X className="h-5 w-5" />
        </button>

        <h2 className="text-2xl font-semibold text-black mb-4">
          {titleMap[type]}
        </h2>

        <div className="no-scrollbar flex-1 overflow-y-auto pr-1">
          {type === 'profile' && <EditProfileModal />}
          {type === 'bankDetails' && <BankDetailSidebar />}
          {type == 'accountDelete' && <AcoountDeleteSideBar />}
          {type === 'timings' && <EditTimings />}
          {type === 'dineout' && <EditDineOutTimings />}
          {type === 'contact' && <ContactUs />}
          {type === 'support' && <SupportCard />}
          {type === 'orderDetail' && <OrderDetail />}
          {type === 'discount' && <DiscountForm />}
          {type == 'faq' && <FAQ />}
        </div>
      </div>
    </div>
  );
};

export default SidebarModal;