diff --git a/jsconfig.json b/jsconfig.json index b8d6842..a4ae2ae 100644 --- a/jsconfig.json +++ b/jsconfig.json @@ -1,7 +1,8 @@ { "compilerOptions": { + "jsx": "react", "paths": { "@/*": ["./src/*"] } } -} +} \ No newline at end of file diff --git a/src/app/contributors/page.jsx b/src/app/contributors/page.jsx new file mode 100644 index 0000000..9164218 --- /dev/null +++ b/src/app/contributors/page.jsx @@ -0,0 +1,215 @@ +"use client"; + +import React, { useEffect, useState } from "react"; +import { motion } from "framer-motion"; + +const ContributorCard = ({ login, avatar_url, html_url, contributions, type }) => ( + +
+ {login} +

{login}

+

{type}

+
+ {contributions} contributions +
+
+
+ + + + + + View Profile + + + + +
+ +); + +const StatCard = ({ label, value, icon }) => ( + +
{icon}
+
+

{value}

+

{label}

+
+ +); + +export default function Contributor() { + const [contributors, setContributors] = useState([]); + const [repoStats, setRepoStats] = useState({}); + const [loading, setLoading] = useState(true); + const [email, setEmail] = useState(""); + + useEffect(() => { + const fetchData = async () => { + try { + const contributorsResponse = await fetch( + "https://api.github.com/repos/TenzDelek/DearDiary/contributors" + ); + const contributorsData = await contributorsResponse.json(); + setContributors(contributorsData); + + const repoResponse = await fetch( + "https://api.github.com/repos/TenzDelek/DearDiary" + ); + const repoData = await repoResponse.json(); + setRepoStats({ + stars: repoData.stargazers_count, + forks: repoData.forks_count, + openIssues: repoData.open_issues_count, + }); + } catch (error) { + console.error("Error fetching data:", error); + } finally { + setLoading(false); + } + }; + + fetchData(); + }, []); + + const handleSubmit = (e) => { + e.preventDefault(); + console.log("Submitted email:", email); + setEmail(""); + }; + + return ( +
+ {/* Hero Section */} +
+
+
+ + Our Amazing Contributors + + + Shaping the future of DearDiary, one commit at a time + + + + Become a Contributor + + +
+
+ + {/* Stats Section */} +
+
+

+ Project Statistics +

+
+ + + } + /> + sum + contributor.contributions, 0)} + icon={ + + } + /> + + + } + /> + + + } + /> +
+
+
+ + {/* Contributor List */} +
+
+

Meet Our Contributors

+ {loading ? ( +

Loading contributors...

+ ) : ( +
+ {contributors.map((contributor) => ( + + ))} +
+ )} +
+
+ + {/* Subscription Form */} +
+
+

Stay Updated

+
+ setEmail(e.target.value)} + className="w-full px-4 py-3 rounded-md bg-white text-black focus:outline-none border border-gray-300" + required + /> + +
+
+
+
+ ); +} \ No newline at end of file diff --git a/src/components/Navbar.js b/src/components/Navbar.js index c479cd1..de40f2f 100644 --- a/src/components/Navbar.js +++ b/src/components/Navbar.js @@ -9,7 +9,8 @@ const items = [ { link: "/daily-quote", name: "Daily Quote" }, { link: "/about", name: "About" }, { link: "/guestbook", name: "Guestbook" }, - { link: "/diary", name: "Diary" } + { link: "/diary", name: "Diary" }, + { link: "/contrubutors", name: "Our contributors" }, ] export default function Navbar() {