object is not iterable (cannot read property Symbol(Symbol.iterator))

I wanted to get search bar value as a global variable and I used context, but I got this error .Do you have any solution ?

import './SearchInput.css';
import Search from '../../../assets/Images/icon/search-normal.svg';
import {Navigate} from 'react-router';
import { React , useRef ,useState } from "react";
import { useAppContext } from "../../../Context/SearchContext/SearchContext";

const SearchInput =(props)=>{

const [fireNavigate , setFireNavigate]= useState(false);
const inputRef = useRef(null);
const [globalState, dispatch] = useAppContext();

const inputChangeHandler = (e) => {
  dispatch({
    type: "CHANGE_LANGUAGE",
    payload: {
      [e.target.name]: e.target.value
    }
  });
};

const handleKeyDown = (event) => {
   
    if (event.key === 'Enter'){
        setFireNavigate(true)

    }
   
}

const handleClick =()=>{
    setFireNavigate(true)
    
}


return(
    <div className="search-input-container">
        <input className="search-input" ref={inputRef} onChange={inputChangeHandler}
        value={globalState.language} type='text' onKeyDown={handleKeyDown} 
    placeholder={props.placeholder} />
        <button className="search-icon" onClick={handleClick}>
          <img src={Search} width='100%' height='100%' alt='search icon' />
        </button>
       {fireNavigate ? <Navigate to='/search' /> : null}
    </div>
)

}

export default SearchInput;