getWeb.js is not returning anything

Question

here is my getWeb.js

import Web3 from "web3";

const getWeb3 = () =>
  new Promise((resolve, reject) => {
    // Wait for loading completion to avoid race conditions with web3 injection timing.
    window.addEventListener("load", async () => {
      
      // Modern dapp browsers...
      if (window.ethereum) {
        const web3 = new Web3(window.ethereum);
        try {
          // Request account access if needed
          await window.ethereum.enable();
          // Accounts now exposed
          resolve(web3);
        } catch (error) {
          reject(error);
        }
      }
      // Legacy dapp browsers...
      else if (window.web3) {
        // Use Mist/MetaMask's provider.
        const web3 = window.web3;
        console.log("Injected web3 detected.");
        resolve(web3);
      }
      // Fallback to localhost; use dev console port by default...
      else {
        const provider = new Web3.providers.HttpProvider(
          "http://127.0.0.1:7545"
        );
        const web3 = new Web3(provider);
        console.log("No web3 instance injected, using Local web3.");
        resolve(web3);
      }
    });
  });

export default getWeb3;

when it in my App.js

useEffect(() => {


        const fetch = async() =>{
          try {
            const web3 = await getWeb3();
            await loadWeb3Contract(web3); // contract interective point
          } catch(error){
            console.log(error);
          } 
        }
        fetch();
}, [])

It is not returning anything. I cross checked by putting console.log before and after const web3 = await getWeb.js I am not getting anything in my console log. The code worked fine when I was using rinkeby test net, but when I switched to Goerli test net, it stopped responding. I changed the truffle config, and everything is fine. truffle compile and migrate. The only issue is that I can't get web3 from the getWeb.js file.