web3js@latest : Uncaught TypeError: Do not know how to serialize a BigInt

Question

Could you please assist me in resolving an issue with the latest version of web3.js 4.x. I'm attempting to connect with MetaMask using the following code:

export const loadWeb3 = async (dispatch) => {
  console.log(Web3);
  const web3 = new Web3(Web3.givenProvider || 'http://localhost:8545');
  dispatch(actions.web3Loaded(web3));
  return web3;
};

However, I've encountered an error: "Do not know how to serialize a BigInt TypeError: Do not know how to serialize a BigInt." The interesting part is that everything works perfectly when I use a legacy version of web3.js. Any insights or assistance would be greatly appreciated.