return value from helper function not changed yet

• value return from helper function give me default one even after change fired every time
• the prblem when i try access value from helper function not changed yet and console.log inside helper function updated except line of return always not changed return network;

// zustand store method
  appInit: async () => {
    var network = await appInitialize();
    console.log(" network ", network); //  default value even after change fired
    set((state) => {
      state.network = network;   //  default value even after change fired
    });
  },
--------------------------------------------------
//  my helper function
export const appInitialize = async () => {
  var network: null | string = 'default value';
  const { ethereum } = window;
  try {
    if (!ethereum) return alert("please install metamask wallet plugin");
    await ethereum?.on("chainChanged", (chainId: any) => {
console.log('network changed ') // event detected
      console.log("chainId ", chainId); //// value is sync and always print new value after change 100%
      network = chainId; // set the value
      console.log("network ", network); // value is sync and always print new value after change 100%
    });
    return network; // (THE PROBLEM HERE NOT CHANGED YET )
  } catch (err) {
    alert("somethign want wrong in wallet connection");
  }
};

// in page.tsx client component

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