import type { Dispatch, FC } from 'react';
import React, { createContext, useContext, useReducer } from 'react';
import type {
    CrossAccountOsrConflictValidationMatch,
    PotentialAudioInfringementValidationMatch,
    TrackFieldValidationExtra,
} from 'src/types';

export interface ModalState {
    data: {
        potentialAudioInfringementMatches: PotentialAudioInfringementValidationMatch[];
        crossAccountOSRConflictMatches: CrossAccountOsrConflictValidationMatch[];
        trackMetadata: TrackFieldValidationExtra;
    } | null;
}

interface Props {
    children: React.ReactNode;
}

const initialState: ModalState = {
    data: null,
};

const stateReducer = (state: ModalState, action: ModalState): ModalState => {
    return action;
};

const AudioInfringementModalContext = createContext<{
    state: ModalState;
    dispatch: Dispatch<ModalState>;
}>({
    state: initialState,
    dispatch: () => null,
});

const AudioInfringementModalProvider: FC<Props> = ({ children }) => {
    const [state, dispatch] = useReducer(stateReducer, initialState);

    return (
        <AudioInfringementModalContext.Provider value={{ state, dispatch }}>
            {children}
        </AudioInfringementModalContext.Provider>
    );
};

const useAudioInfringementModalContext = () =>
    useContext(AudioInfringementModalContext);

export { AudioInfringementModalProvider, useAudioInfringementModalContext };
