MetaMask – Resolving RPC Error: Execution Reverted in Simple NFT Minting DApp

I'm building a simple NFT minting Dapp for fundraising. I first deployed contracts on Polygon testnet and then on Ethereum testnet goerli. While integrating, my front-end with my smart contracts using Ethers.js, I'm getting the same errors. Did my research and also tried some solutions available but still got the same errors.

Here is the full repo: https://github.com/DevABDee/WagmiPakistan
You can use live-Server to run the application, I'm using simple HTML

My hardhat.config.js:

require("@nomicfoundation/hardhat-toolbox");
require("dotenv").config({ path: ".env" });

POLYGON_TESTNET_URL = process.env.POLYGON_TESTNET_URL;
GOERLI_TESTNET_URL = process.env.GOERLI_TESTNET_URL;
PRIVATE_KEY = process.env.PRIVATE_KEY;
ETHERSCAN_API_KEY = process.env.ETHERSCAN_API_KEY;

module.exports = {
  solidity: {
    version: "0.8.7",
    settings: {
      optimizer: {
        enabled: true,
        runs: 200,
      },
    },
  },
  networks: {
    matic: {
      url: POLYGON_TESTNET_URL,
      accounts: [PRIVATE_KEY],
      gas: 2100000,
      gasPrice: 8000000000
    },
    goerli: {
      url: GOERLI_TESTNET_URL,
      accounts: [PRIVATE_KEY],
      gas: 2100000,
      gasPrice: 8000000000
    }
  },
  etherscan: {
    apiKey: ETHERSCAN_API_KEY
  }
};

Index.js:

import { ethers } from "https://cdn-cors.ethers.io/lib/ethers-5.5.4.esm.min.js";
import {contractAddress, contractAbi} from  "./constants.js";

const mintBronze = document.getElementById('MintBronze');
const mintSteel = document.getElementById('MintSteel');
const mintGold = document.getElementById('MintGold');
const mintDiamond = document.getElementById('MintDiamond');
const mintPlatinum = document.getElementById('MintPlatinum');

mintBronze.onclick = MintBronze;
mintSteel.onclick = MintSteel;
mintGold.onclick = MintGold;
mintDiamond.onclick = MintDiamond;
mintPlatinum.onclick = MintPlatinum;

async function connect() {

    if (typeof window.ethereum !== 'undifined') {
        await window.ethereum.request({ method: "eth_requestAccounts" })
        console.log("Connected");
    } else {
        console.log("Get A Metamask Wallet");
    }

}

connect();

let provider = new ethers.providers.Web3Provider(window.ethereum)
let signer = provider.getSigner();
let wagmiPakistanContract = new ethers.Contract(contractAddress, contractAbi, signer)


async function MintBronze() {
    const mintBronze = wagmiPakistanContract.mintBronze();
    const Bronze = await mintBronze;
    console.log(`${Bronze} Minted`);
}
async function MintSteel() {
    const mintSteel = wagmiPakistanContract.mintSteel();
    const Steel = await mintSteel;
    console.log(`${Steel} Minted`);
}
async function MintGold() {
    const mintGold = wagmiPakistanContract.mintGold();
    const Gold = await mintGold;
    console.log(`${Gold} Minted`);
}
async function MintDiamond() {
    const mintDiamond = wagmiPakistanContract.mintDiamond();
    const Diamond = await mintDiamond;
    console.log(`${Diamond} Minted`);
}
async function MintPlatinum() {
    const mintPlatinum = wagmiPakistanContract.mintPlatinum();
    const Platinum = await mintPlatinum;
    console.log(`${Platinum} Minted`);
}

Pls help me out.
Thanks