'use client';

import React, { createContext, useContext, useState } from 'react';

type SidebarType = 'cart' | 'wishlist' | null;

interface SidebarContextType {
  isSidebarOpen: boolean;
  sidebarType: SidebarType;
  openSidebar: (type: SidebarType) => void;
  closeSidebar: () => void;
}

const SidebarContext = createContext<SidebarContextType | undefined>(undefined);

export function SidebarProvider({ children }: { children: React.ReactNode }) {
  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
  const [sidebarType, setSidebarType] = useState<SidebarType>(null);

  const openSidebar = (type: SidebarType) => {
    setSidebarType(type);
    setIsSidebarOpen(true);
    document.body.style.overflow = 'hidden';
  };

  const closeSidebar = () => {
    setIsSidebarOpen(false);
    setSidebarType(null);
    document.body.style.overflow = 'unset';
  };

  return (
    <SidebarContext.Provider
      value={{
        isSidebarOpen,
        sidebarType,
        openSidebar,
        closeSidebar,
      }}
    >
      {children}
    </SidebarContext.Provider>
  );
}

export function useSidebar() {
  const context = useContext(SidebarContext);
  if (context === undefined) {
    throw new Error('useSidebar must be used within a SidebarProvider');
  }
  return context;
}