"use client"

import { createContext, useContext, useState, useCallback } from "react"
import type { JobCardStatus } from "./job-card.schema"
import { JobCardResponseData } from "@garage/api"
 
 
const JobCardContext = createContext<JobCardResponseData | null>(null)

export function JobCardProvider({
    jobCard,
    children,
}: {
    jobCard: JobCardResponseData
    children: React.ReactNode
}) {
    const [status, setStatusState] = useState<JobCardStatus>(jobCard.status as JobCardStatus)

    const setStatus = useCallback((newStatus: JobCardStatus) => {
        setStatusState(newStatus)
    }, [])

    return (
        <JobCardContext.Provider value={{  ...jobCard, status, setStatus } as JobCardResponseData}>
            {children}
        </JobCardContext.Provider>
    )
}

export function useJobCard() {
    return useContext(JobCardContext)
}
