Untitled

import type { ReactNode } from 'react';
import { createContext, useContext, useMemo, useState } from 'react';
import type { Job, Stages } from '@components/pages/jobs/types';
import type { components } from '@customTypes/generated';

type jobsContextType = {
	jobs: Job[];
	selectedJobId: string | null;
	setJobs: (Jobs: Job[]) => void;
	setSelectedJobId: (selectedJobId: string | null) => void;
	stage: Stages;
};

export const JobsContext = createContext<jobsContextType | null>(null);

export const JobsProvider = ({
	children,
	fetchedJobs,
	selectedJob: selectedJobFromProps = null,
	stage,
}: {
	children: ReactNode;
	fetchedJobs: Job[];
	selectedJob?: string | null;
	stage: Stages;
}) => {
	const [jobs, setJobs] = useState(fetchedJobs);
	const [selectedJobId, setSelectedJobId] = useState<string | null>(selectedJobFromProps);

	const contextValue = useMemo(
		() => ({
			jobs,
			selectedJobId,
			setJobs,
			setSelectedJobId,
			stage,
		}),
		[jobs, stage, selectedJobId, setJobs, setSelectedJobId],
	);

	return <JobsContext.Provider value={contextValue}>{children}</JobsContext.Provider>;
};

export const useStage = () => {
	const jobsContext = useContext(JobsContext);

	if (!jobsContext) {
		throw new Error('useStage has to be used within <JobsProvider>');
	}

	return jobsContext.stage;
};