import React from "react";
import Head from "next/head";
import Image from "next/image";
import ProjectCard from "../ProjectCard";
import styles from "./GitGallery.module.sass";

export function GitGallery(props) {
  var links = [];

  props.publicGiteaRepos.forEach((repo) => {
    links.push(
      <ProjectCard
        classNames={styles.card_gitea}
        url={repo.html_url}
        fullName={repo.full_name}
        name={repo.name}
        description={repo.description}
        avatarUrl={repo.avatar_url}
        key={repo.full_name}
      />
    );
  });

  // props.publicGithubRepos.forEach((repo) => {
  //   links.push(
  //     <ProjectCard
  //       classNames={styles.card_github}
  //       url={repo.html_url}
  //       fullName={repo.full_name}
  //       name={repo.name}
  //       description={repo.description}
  //       avatarUrl={repo.avatar_url}
  //     />
  //   );
  // });

  return (
    <div className={styles.cardContainer}>
      <h2>These are my public repositories:</h2>
      {links}
    </div>
  );
}