H7: Github API päring

let givenProfile = "";
let profileName = "";
let profileID = "";
let profileLink = "";
let profileRepos = "";

function renderPage() {
  document.getElementById("app").innerHTML = `
    <div>
      <h1>GitHub konto vaade</h1>
      <p>Palun sisesta konto nimi:</p>
      <input type="text" placeholder="Sisesta github kasutajanimi" />

      <div class="content">
        <div id="mini">
          ${
            profileName && profileName !== "-"
              ? `<p>ID: ${profileID}</p>
                 <p>Profiil: ${profileName}</p>
                 <a href="${profileLink}" target="_blank">${profileLink}</a>
                 <p>Repos: ${profileRepos}</p>`
              : ""
          }
        </div>
      </div>
    </div>
  `;

  const input = document.querySelector("input");
  input.addEventListener("change", (e) => {
    updateValue(e);
  });
}

function updateValue(e) {
  givenProfile = e.target.value.trim();
  fetchProfile();
}

async function fetchProfile() {
  if (!givenProfile) {
    profileName = "";
    profileID = "";
    profileLink = "";
    profileRepos = "";
    renderPage();
    return;
  }

  try {
    const response = await fetch(
      `https://api.github.com/users/${givenProfile}`
    );
    const rateLimitRemaining = response.headers.get("X-RateLimit-Remaining");
    if (!response.ok) {
      profileName = "User not found";
      profileID = "";
      profileLink = "";
      profileRepos = "";
    } else {
      const data = await response.json();
      profileName = data.login || "—";
      profileID = data.id || "—";
      profileLink = data.html_url || "—";
      profileRepos = data.public_repos || 0;
    }

    renderPage();
  } catch (error) {
    profileName = "Error";
    profileID = "—";
    profileLink = "—";
    profileRepos = "—";
    renderPage();
  }
}

renderPage();