How to correctly encodeURIComponent?

Question

In my work I need to use encodeURIComponent, but it's not in the correct structure, and the access to the endpoint doesn't work correctly.

In the images below you can see the differences between the structures of header of the current application, where theencoded is being done correctly. And my code, where the encoded is not being done correctly. I created a function to do this, but it's not working. Can you tell me what I'm doing wrong?

Here's my code I put into codesandbox.io

  const BASE_URL = "";

  function encodeHeaders(headers) {
    let encodedHeaders = "";

    for (const key in headers) {
      encodedHeaders += encodeURIComponent(key + ": " + headers[key]) + "%0A";
    }

    return encodedHeaders;
  }

  const headers = {
    Connection: "close",
    "Content-Type": "application/json",
    "X-EES-AUTH-CLIENT-ID": "o75j23m4c2m3e411sb7z",
    "X-EES-AUTH-HASH":
      "e782225331d2839774aac84eab2762a9c8059cfc7433af8f178138ab426fbfbf",
    accept: "application/json"
  };

  const requestData = {
    code: "ee",
    branch: "119",
    till: "7",
    serial: "912347",
    url: "https://resources.sandbox",
    method: "GET",
    header: encodeHeaders(headers)
  };

  /**
   * Example of how I am using the application in a real test
   */
  function getTestService() {
    return axios
      .post(BASE_URL, requestData, {
        headers: {
          "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8"
        }
      })
      .then((response) => {
        return response.data;
      });
  }

Here's what I get vs what I expect:

What I get (before and after encoded)

header: Connection%3A%20close%0AContent-Type%3A%20application%2Fjson%0AX-EES-AUTH-CLIENT-ID%3A%20o75j23m4c2m3e411sb7z%0AX-EES-AUTH-HASH%3A%20e782225331d2839774aac84eab2762a9c8059cfc7433af8f178138ab426fbfbf%0Aaccept%3A%20application%2Fjson%0A

Connection%253A%2520close%250AContent-Type%253A%2520application%252Fjson%250AX-EES-AUTH-CLIENT-ID%253A%2520o75j23m4c2m3e411sb7z%250AX-EES-AUTH-HASH%253A%2520e782225331d2839774aac84eab2762a9c8059cfc7433af8f178138ab426fbfbf%250Aaccept%253A%2520application%252Fjson%250A

What I expect (before and after encoded)

header: Connection: close
Content-Type: application/json
X-EES-AUTH-CLIENT-ID: o75j23m4c2m3e411sb7z
X-EES-AUTH-HASH: e782225331d2839774aac84eab2762a9c8059cfc7433af8f178138ab426fbfbf
accept: application/json

Connection%3A+close%0AContent-Type%3A+application%2Fjson%0AX-EES-AUTH-CLIENT-ID%3A+o75j23m4c2m3e411sb7z%0AX-EES-AUTH-HASH%3A+e782225331d2839774aac84eab2762a9c8059cfc7433af8f178138ab426fbfbf%0Aaccept%3A+application%2Fjson

It is possible to notice the difference between the structures of each of the headers. Before and after encoded.