import Head from './layout/head/Head.tsx';
import Body from './layout/body/Body.tsx';
import Foot from './layout/foot/Foot.tsx';
import {
    GlobalContext,
    GlobalData,
    GlobalDataAction,
    GlobalDataActionType,
    GlobalDispatchContext
} from "./context/GlobalContext.ts";
import {Reducer, useReducer} from "react";

const App: React.FC = () => {
    const globalDataReducer = (state: GlobalData, action: GlobalDataAction) => {
        if (action.type == GlobalDataActionType.REFRESH_SELF) {
            if(action.user) {
                state.user.balance = action.user.balance;
                state.user.nickname = action.user.nickname;
                state.user.username = action.user.username;
                state.user.hasUserInfo = action.user.hasUserInfo;
            }
        }
        return {
            ...state
        }
    }
    const [globalData, dispatch] = useReducer<Reducer<GlobalData, GlobalDataAction>>(globalDataReducer, {
        user: {
            balance: '0',
            username: '',
            nickname: '',
            hasUserInfo: false
        }
    });

    return (
        <>
            <GlobalContext.Provider value={globalData}>
                <GlobalDispatchContext.Provider value={dispatch}>
                    <Head/>
                    <Body/>
                    <Foot/>
                </GlobalDispatchContext.Provider>
            </GlobalContext.Provider>
        </>
    );
};

export default App;