'use client';

import React, { createContext, useContext, useState, ReactNode } from 'react';
import { innerCardTypes } from '@/types';

// 1️⃣ Context tipi
interface CarDetailContextType {
  detail: innerCardTypes | null;
  setDetail: React.Dispatch<React.SetStateAction<innerCardTypes | null>>;
}

// 2️⃣ Default context qiymatini yaratamiz
const CarDetailContext = createContext<CarDetailContextType | undefined>(undefined);

// 3️⃣ Provider komponent
export const CarDetailProvider = ({ children }: { children: ReactNode }) => {
  const [detail, setDetail] = useState<innerCardTypes | null>(null);

  return (
    <CarDetailContext.Provider value={{ detail, setDetail }}>
      {children}
    </CarDetailContext.Provider>
  );
};

// 4️⃣ Custom hook (Context’ni qulay ishlatish uchun)
export const useCarDetail = () => {
  const context = useContext(CarDetailContext);
  if (!context) {
    throw new Error('useCarDetail must be used within a CarDetailProvider');
  }
  return context;
};