Erik Gerega õpimapp

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

function renderPage() {
  document.getElementById("app").innerHTML = `
    <div>
      <h1>Github profile viewer</h1>
      <p>Please enter profile name:</p>
      <input />
      <div class="content">
        <h1 id="name">Name: ${profileName}</h1>
        <p id="id">Id: ${profileId}</p>
        <p id="repos">Public repos: ${profileRepos}</p>
        <p id="profileurl">Link: <a href="${profileLink}" target="_blank">${profileLink}</a></p>
 
      </div>
    </div>
  `;

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

renderPage();

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

async function fetchProfile() {
  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;
    }

    if (rateLimitRemaining === "0") {
      profileName = "API rate limit reached. Try again later.";
      profileId = "";
      profileLink = "";
      profileRepos = "";
    }
  } catch (error) {
    profileName = "Error fetching data";
    profileId = "";
    profileLink = "";
    profileRepos = "";
  }
  renderPage();
}