PayPal authentication failed due to invalid authentication credentials or a missing Authorization header | Javascript

I am trying to integrate PayPal checkout on my website (HTML, CSS, JS), but the transaction keeps failing! I keep getting the following error when trying to checkout on my page: {"name":"AUTHENTICATION_FAILURE","message":"Authentication failed due to invalid authentication credentials or a missing Authorization header.","links":[{"href":"https://developer.paypal.com/docs/api/overview/#error","rel":"information_link"}]}

Does anyone know why this is so?

Here is my HTML, CSS, JS code

<html>
    <head>
        <title>Donation Pending | Funded</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">

    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

        <script src="https://www.paypal.com/sdk/js?client-id=MY-CLIENT-ID-WAS-HERE&currency=USD"></script>
    </head>
    <center>
        <div id="paypal-button-container"></div>
        <input type="number" id="amount" name="amount" placeholder="Amount">
    </center>

        <div id="paypal-button-container"></div>

            <script>
        const donate = document.getElementById("donate")
        const queryString = window.location.search;
        const donateParams = new URLSearchParams(queryString);
        
        if (donateParams.get('name') && donateParams.get('pp')) {

            paypal.Buttons({

        createOrder: function(data, actions) {
          return actions.order.create({
            purchase_units: [{
              amount: {
                                value: document.getElementById("amount").value,
                            payee: {
                                email_address: donateParams.get('pp')
                                }
              }
            }]
          });
        },

        onApprove: function(data, actions) {
          return actions.order.capture().then(function(orderData) {
                                        console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));
                var transaction = orderData.purchase_units[0].payments.captures[0];
                alert('Transaction '+ transaction.status + ': ' + transaction.id + '\n\nSee console for all available details');
          });
        }
      }).render('#paypal-button-container');
        }else{
            window.location.replace("/")
        }

      

    </script>
</html>

It says "Transaction Completed", but when you visit v2/checkout/orders, it says:

{"name":"AUTHENTICATION_FAILURE","message":"Authentication failed due to invalid authentication credentials or a missing Authorization header.","links":[{"href":"developer.paypal.com/docs/api/overview/…"}]}

I would really appreciate help :)