useReducer with useContext results with Typescript error-CodePudding

I'm trying to create a context that holds state and reducer. But it gives me error messages on the return statement and I just don't know what to do:

Operator '<' cannot be applied to types 'boolean' and 'RegExp'.ts(2365)
Unterminated regular expression literal.ts(1161)

import { createContext, FunctionComponent, PropsWithChildren, ReactNode, useReducer } from "react";
import reducer from "./reducer";

// stored data
export type storeType = {
    message: string | null
};

const initialState: storeType = {
    message: null
}

const AppContext = createContext<storeType>(initialState);

const CxtProvider = ({ children }: PropsWithChildren) => {
    const [currentState, dispatch] = useReducer(reducer, initialState);

    return <AppContext.Provider value={{
        currentState,
        dispatch
    }}>{children}</AppContext.Provider>
};

export default CxtProvider;

Anyone knows, what I'm doing wrong? Thanks

EDIT1: Thanks for the idea, I tried spreading the object, but didn't help, there's even more error now.

Compiled with problems:

ERROR in src/utils/context/context.ts
TS1161: Unterminated regular expression literal.

ERROR in src/utils/context/context.ts:19:13
TS2503: Cannot find namespace 'AppContext'.

ERROR in src/utils/context/context.ts:19:33
TS1005: '>' expected.

ERROR in src/utils/context/context.ts:19:33
TS2304: Cannot find name 'value'.

ERROR in src/utils/context/context.ts:19:38
TS1005: ';' expected.

ERROR in src/utils/context/context.ts:20:9
TS1128: Declaration or statement expected.

ERROR in src/utils/context/context.ts:20:12
TS2304: Cannot find name 'currentState'.

ERROR in src/utils/context/context.ts:20:12
TS2695: Left side of comma operator is unused and has no side effects.

ERROR in src/utils/context/context.ts:21:9
TS2304: Cannot find name 'dispatch'.

ERROR in src/utils/context/context.ts:22:6
TS1128: Declaration or statement expected.

ERROR in src/utils/context/context.ts:22:7
TS1128: Declaration or statement expected.

ERROR in src/utils/context/context.ts:22:8
TS1109: Expression expected.

ERROR in src/utils/context/context.ts:22:8
TS2365: Operator '<' cannot be applied to types 'boolean' and 'RegExp'.

ERROR in src/utils/context/context.ts:22:10
TS18004: No value exists in scope for the shorthand property 'children'. Either declare one or provide an initializer.

ERROR in src/utils/context/context.ts:23:1
TS1128: Declaration or statement expected.

CodePudding user response：

You should unwrap the currentState values:

return <AppContext.Provider value={{
          ...currentState,
          dispatch
       }}>{children}</AppContext.Provider>

CodePudding user response：

Finally it solved by diverting the parts into different files: context, reducer, provider. No idea why.

Thanks for ideas

I suppose the problem was somewhere in createContext type didn't have the reducer member