Ошибка после добавления действия в контекстный API в React

Question

Я получаю эту ошибку «Ошибка типа: недопустимая попытка уничтожить не повторяемый экземпляр», и я не уверен, что происходит неправильно. Я использую React и Context API. Вот мой код. Не уверен, что мне не хватает опечатки, так как я уже делал это раньше.

Журнал ошибок

Store.tsx

interface IState {
    episodes: [],
    favourites: []
}

interface IAction {
    type: string,
    payload: any
}

const initialState: IState = {
    episodes: [],
    favourites: []
}


export const Store = React.createContext<IState | any>(initialState)

function reducer(state: IState, action: IAction): IState {
    switch (action.type) {
        case 'FETCH_DATA':
            return {...state, episodes: action.payload }
        default:
            return state
    }
}



export function StoreProvider(props: any): JSX.Element {
    const [state, dispatch] = React.useReducer(reducer, initialState)
    return <Store.Provider value={{state, dispatch}}>{props.children}</Store.Provider>
}

App.tsx

import React, { useEffect } from 'react'
import { Store } from './Store'


export default function App():JSX.Element {
  const [state, dispatch] = React.useContext(Store)

  useEffect(() => {
    state.episodes.length() === 0 && fetchDataAction()
  })

  const fetchDataAction = async () => {
    const URL = 'https://api.tvmaze.com/singlesearch/shows?q=the-office&embed=episodes'
    const data = await fetch(URL)
    const dataJSON = await data.json()
    return dispatch({
      type: 'FETCH_DATA',
      payload: dataJSON._embedded.episodes
    })
  }
  console.log(state)

  return (
    <>
      <h1>Rick and Morty</h1>
      <p>Pick your favourite episode</p>
    </>
  )
}

Index.tsx

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import { StoreProvider } from './Store'


ReactDOM.render(
<StoreProvider>
<App />
</StoreProvider>, document.getElementById('root'));

Любая помощь будет оценена. Спасибо

Answer 1

разобрался, просто надо было изменить const [state, dispatch] = React.useContext(Store) на const {state, dispatch} = React.useContext(Store)