React State Value Undefined When Assign From Location.State

I am parent component that got table, when user click on row, it needs to pass the object to Child component via history.push which is all working fine. I have define an object of same type in child component and trying to assign value which is coming via location. I can clearly see value in object but child component states 'Undefined' not sure what I am missing from puzzle?

Object Definition

 export interface ISearchCriteriaForm{
   startTime: string,
   endTime: string,
   liveTime?: string,
   schedAction_Active: string,
   siteId?: number,
   scheduleId?: number
 }

Parent Component

 const selectedRow = (row: any) => { 

  eziStatusSearchCriteria.siteId = row.siteId;
  history.push({
    pathname: `${url}/${row.siteId}`,
    state: {searchCriteria: eziStatusSearchCriteria}
  });
 };

Child Component

const MyChildComponent = () =>{
   const[eziSearchCriteria, setEziSearchCriteria] = useState<IEziStatusSearchCriteriaForm>();

  useEffect(() =>{
    setSearchCriteria();
  },[]);

   const setSearchCriteria =() =>{
  
    const s1: IEziStatusSearchCriteriaForm = location.state.searchCriteria;  // in debugger, I can see data in s1
     setEziSearchCriteria(s1);
     console.log("data ",eziSearchCriteria);  // this console undefined???? need help here        
    }

Try this now,

const MyChildComponent = () =>{
   const[eziSearchCriteria, setEziSearchCriteria] = useState<IEziStatusSearchCriteriaForm>();

  useEffect(() =>{
    setSearchCriteria();
  },[eziSearchCriteria]); // always give dependeny of the data that is chnaging, so that component re-render when this changes

   const setSearchCriteria =() =>{
  
    const s1: IEziStatusSearchCriteriaForm = location.state.searchCriteria;  // in debugger, I can see data in s1
     setEziSearchCriteria(s1);
     console.log("data ",eziSearchCriteria);  // this console undefined???? need help here        
    }