TypeError при использовании хуков React - useReducer

I попытался использовать перехватчики реакции (useReducer). у меня ошибка

TypeError: Object(...) is not a function

Здесь я прикрепил свой код и также приложил снимок экрана с ошибкой.

import React, { useReducer } from 'react';

function appReducer(state, action){
    switch(action.type){
        case 'add':
            return [
                ...state,
                {
                    id:Date.now(),
                    text:'',
                    completed:false
                }
            ]
        break;
        default:
        break;
    }
}

export default function myCom(){
    const [state, dispatch] = useReducer(appReducer, []);
    return (
        <div className = "App">
            <h5>React ToDo</h5>
            <button onClick = {() => dispatch({type:'add'})}>New Todo</button>
            {
                state.map(item =>(
                    <div key = {item.id}>{item.id}</div>
                ))
            }
        </div>
    );
}]

Как исправить эту ошибку.