import React, { useContext, useEffect, useState } from 'react';
import { useApolloClient } from '@apollo/client';
import { useAuthClient } from '@theorchard/suite-auth';
import { useAppConfig } from '@theorchard/suite-config';
import { useIdentity } from '@theorchard/suite-identity';
import type { AppContext } from '../types';

interface SuiteAppDataContext<T = unknown> {
    appData: T;
    setAppData: (value: T) => void;
}

export const AppDataContext = React.createContext<SuiteAppDataContext>({
    appData: undefined,
    setAppData: () => {
        throw new Error('AppDataContext is not initialized');
    },
});

export function useAppData<T>() {
    return useContext(AppDataContext) as SuiteAppDataContext<T>;
}

export const AppDataProvider = ({
    value,
    children,
}: {
    value: unknown;
    children: React.ReactChild;
}) => {
    const [appData, setAppData] = useState(value);

    useEffect(() => {
        setAppData(value);
    }, [value]);

    return (
        <AppDataContext.Provider value={{ appData, setAppData }}>
            {children}
        </AppDataContext.Provider>
    );
};

export function useAppContext<AppData = unknown>(): AppContext<AppData> {
    const identity = useIdentity();
    const authClient = useAuthClient();
    const graphqlClient = useApolloClient();
    const config = useAppConfig();
    const { appData } = useAppData<AppData>();

    return {
        identity,
        authClient,
        graphqlClient,
        config,
        appData,
    };
}