main.js

document.addEventListener("DOMContentLoaded", () => {
  const username = "luau";
  const repoNames = [
    "UniversalSynSaveInstance",
    "Executor-API-Docs",
    "Dex",
    "SomeHub",
  ];
  const projectsContainer = document.getElementById("projects");
  const cacheKey = "githubRepos";
  const cacheExpiry = 60 * 60 * 1000; // 1 hour

  let cachedData = null;
  const now = Date.now();

  function displayProjects(repos) {
    repos.forEach((data) => {
      const project = document.createElement("div");
      project.classList.add("project");

      project.innerHTML = `
        <img src="img/logo.png" alt="${data.name}">
        <h3>${data.name}</h3>
        <p>${data.description || "No Description"}</p>
        <a href="${data.html_url}" target="_blank">View on GitHub</a>
      `;

      projectsContainer.appendChild(project);
    });
  }

  try {
    cachedData = JSON.parse(localStorage.getItem(cacheKey) || "{}");

    if (cachedData.timestamp && now - cachedData.timestamp < cacheExpiry) {
      console.log("Using cache")
      displayProjects(cachedData.repos);
      return;
    }
  } catch (e) {
    if (e.name === "SecurityError") {
      console.warn("LocalStorage access is blocked. Proceeding without cache.");
    } else {
      console.error("Unexpected error:", e);
    }
  }

  const promises = repoNames.map((repo) =>
    fetch(`https://api.github.com/repos/${username}/${repo}`).then((response) =>
      response.json()
    )
  );

  Promise.all(promises)
    .then((repos) => {
      displayProjects(repos);

      try {
        localStorage.setItem(
          cacheKey,
          JSON.stringify({ timestamp: now, repos })
        );
      } catch (e) {
        if (e.name === "SecurityError") {
          console.warn(
            "Unable to save data to localStorage due to security restrictions."
          );
        }
      }
    })
    .catch((error) => console.error("Error fetching repository data:", error));
});