Below is my variable getting firstname from localStorage:

let = firstname = localStorage.getItem("firstName") ? localStorage.getItem("firstName") : '';

and I am adding above variable below in my iframe:

<IframeWrapper src={`${BASE_URL}`+ formId + `?first_name=${firstname}`} />

Problem is when I deployed this update error says:

WebpackError: ReferenceError: localStorage is not defined

Do I need to define it inside of useEffect or inside of condition typeof window !== "undefined"? I tried to add variable inside useEffect with condition typeof window !== undefined:

useEffect(() => {
    
    if (typeof window !== "undefined") {
      let firstname = localStorage.getItem("firstName") ? localStorage.getItem("firstName") : '';
  
    }
  }, []);

But then it says cannot find name firstname here:

<IframeWrapper src={`${BASE_URL}`+ formId + `?first_name=${firstname}`} />  //here

How I can correctly add first name variable into ?first_name=${firstname}