import { createContext, useEffect, useReducer } from "react"
import {useLocation} from 'react-router-dom'

const data ={
    device:'',
    layouts:{
        currentPage:'',
        pageIndex:1
    },
    theme:{
        color:'light'
    }
}
export const AppContext = createContext<{data:typeof data,dispatch:any}>({
    data:data,
    dispatch:()=>null
})

interface Actions {
    type: string
    payload: any
}
const AppReducer = (state:typeof data,action:Actions)=>{
    const {type,payload} = action
    // switch(type){
    //     case
    // }
    return state
}

export const AppProvider = (props: any)=>{
    const [state,dispatch] = useReducer(AppReducer,data)
    const location = useLocation()
    useEffect(()=>{
        console.log('changed,1111');
        
    },[location])
    return(
        <AppContext.Provider value={{data:state,dispatch}}>
            {props.children}
        </AppContext.Provider>
    )
}