React Use Context. Cannot destructure property 'currentChatbotIn

ghz 6months ago ⋅ 70 views

React Use Context. Cannot destructure property 'currentChatbotInEdit' of 'Object(...)(...)' as it is undefined. How can I fix that?

I try to import the chatbotcontext in order to get access to current chatbot in edit, but something went wrong. Do you have ideas what could be the issue here?

Here is the error message: enter image description here

Here is an excerpt of my chatstate.js:

    // import packages
    import React, { useReducer, useContext } from "react";
    import axios from "axios";
    
    // import local dependencies
    import AuthContext from "../../Context/Auth/authContext";
    import ChatbotContext from "../../Context/Chatbot/chatbotContext";
    import chatReducer from "./chatReducer";
    import ChatContext from "./chatContext";
    import { ADD_INPUT_TO_CHAT, SESSION_ID_CREATED } from "./chatTypes";
    
    const ChatState = props => {
      // get access to auth token
      const authContext = useContext(AuthContext);
      const { token } = authContext;
    
      // get access to current chatbot in edit
      const chatbotContext = useContext(ChatbotContext);
      const { currentChatbotInEdit } = chatbotContext;

And here is an excerpt of my ChatbotState.js:

// import packages
import React, { useReducer, useContext } from 'react';
import axios from 'axios';

// import local dependencies
import AuthContext from '../Auth/authContext';
import ChatbotContext from './chatbotContext';
import chatbotReducer from './chatbotReducer';
import {
  SUCCESSFUL_CHATBOT_FROM_USER_FETCH,
  NEW_QUIZBOT_CREATED
} from './chatbotTypes';

const ChatbotState = props => {
  // 1 - Get access to auth token
  const authContext = useContext(AuthContext);
  const { token } = authContext;

  // 2 - Create initial chatbot state
  const initialChatbotState = {
    userChatbots: [],
    currentChatbotInEdit: null
  };

  // 3 - Get access to the state object and the dispatch function
  const [state, dispatch] = useReducer(chatbotReducer, initialChatbotState);

Answers

I has the same problem . You maybe not add your context provider to the index.js page

Add this, to the index.js page

 <AppContextProvider providerInitState={movie}>
      <App />
    </AppContextProvider>
#javascript