Function Contributor

client/src/component/Contributors.jsx:230–525

(props)

export default function Contributor(props) {
  const [contributors, setContributors] = useState([]);
  const [openIssues, setOpenIssues] = useState([]);
  const [showIssue, setShowIssue] = useState(true); // Determine which section to show
  const [loading, setLoading] = useState(true);
  const [currentPage, setCurrentPage] = useState(1);
  const [repoStats, setRepoStats] = useState({
    stars: 0,
    forks: 0,
    openIssues: 0,
  });
  const [searchTerm, setSearchTerm] = useState(''); // State for search term

  const itemsPerPage = 9; // Set the number of items per page (for both contributors and issues)

  useEffect(() => {
    const fetchData = async () => {
      try {
        // Fetch contributors
        const contributorsResponse = await fetch("https://api.github.com/repos/Bitbox-Connect/Bitbox/contributors?page=1&per_page=100");

        if (!contributorsResponse.ok) {
          throw new Error("Failed to fetch contributors data");
        }
        const contributorsData = await contributorsResponse.json();
        setContributors(contributorsData);

        // Fetch repo stats
        const repoResponse = await fetch('https://api.github.com/repos/Bitbox-Connect/Bitbox');
        const repoData = await repoResponse.json();
        setRepoStats({
          stars: repoData.stargazers_count,
          forks: repoData.forks_count,
          openIssues: repoData.open_issues_count,
        });

        // Fetch issues
        const issueResponse = await fetch('https://api.github.com/repos/Bitbox-Connect/Bitbox/issues');
        const issueData = await issueResponse.json();
        setOpenIssues(issueData);
      } catch (error) {
        console.error("Error fetching data:", error);
      } finally {
        setLoading(false);
      }
    };

    fetchData();
  }, []);

  // Calculate pagination indices
  const indexOfLastItem = currentPage * itemsPerPage;
  const indexOfFirstItem = indexOfLastItem - itemsPerPage;

  // Filter contributors or issues based on search term
  const filteredContributors = contributors.filter(contributor =>
    contributor.login.toLowerCase().includes(searchTerm.toLowerCase())
  );