score:3

i solved the problem by adding

    switch (action.type) {
        case 'set_name':
            return { ...state, playername: action.payload }

in my reducer, and in home.js changed the state key i had in there to payload. not 100% sure if it having the same name was effecting anything, but its much less confusing naming it payload.

    const handleclick = () => {
        if (!isstringempty(playernameentry.current.value)) {
            dispatch({ type: 'set_name', payload: playernameentry.current.value });

score:3

wrap the whole app with appcontext.provider passing with state and dispatch, like below

<appcontext.provider value={{ state, dispatch }}>
  <div classname="app">
    <compo />
  </div>
</appcontext.provider>

Related Query

More Query from same tag