diff --git a/next.config.mjs b/next.config.mjs index 9872469..5ebb000 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -2,7 +2,7 @@ const nextConfig = { output: "export", images: { - domains: ["avatars.githubusercontent.com"], + unoptimized: true, }, }; diff --git a/public/data/ArnabChatterjee20k.json b/public/data/ArnabChatterjee20k.json new file mode 100644 index 0000000..a6638d8 --- /dev/null +++ b/public/data/ArnabChatterjee20k.json @@ -0,0 +1,17 @@ +[ + { + "title": "PickPalette", + "description": "Discover endless color possibilities with PickPalette – effortlessly generate palettes from images, explore diverse schemes, and soon, manage them on a dynamic dashboard. Elevate your design process with our upcoming AI suggestions and visualization tools. New updates - Personalised Dashboard,Live preview based on color algorithms", + "liveUrl": "https://www.producthunt.com/products/pickpalette", + "repoUrl": "https://github.com/ArnabChatterjee20k/PickPalette-PaletteFromImage", + "techStack": [ + "REACT", + "SUPABASE", + "PINECONE", + "DENO", + "PLAYWRIGHT", + "MONGODB", + "EXPRESS" + ] + } +] diff --git a/public/data/ChromeGaming.json b/public/data/ChromeGaming.json new file mode 100644 index 0000000..6ec4462 --- /dev/null +++ b/public/data/ChromeGaming.json @@ -0,0 +1,9 @@ +[ + { + "title": "Spaceship Escort", + "description": "Spaceship Escort is a game where players protect spacecraft from threats in space. Players control escort ships, defend against attacks, and complete missions involving navigation, combat, and strategic decisions.", + "liveUrl": "https://chromegaming.github.io/Spaceship-escort/", + "repoUrl": "https://github.com/ChromeGaming/Spaceship-escort", + "techStack": ["Css", "html", "jquery", "bootstrap", "javascript"] + } +] diff --git a/public/data/Innovateninjas.json b/public/data/Innovateninjas.json new file mode 100644 index 0000000..aab635a --- /dev/null +++ b/public/data/Innovateninjas.json @@ -0,0 +1,9 @@ +[ + { + "title": "Paws", + "description": "Paws, is driven by a deep concern for animal welfare. Witnessing the challenges faced by animals worldwide, we were inspired to create a platform that enables users to report injured animals and connect them with the necessary assistance. It is a fast web-app that allows compassionate people to report stray injured animals to nearby NGOs and Animal Hospitals.", + "liveUrl": "https://pawss.vercel.app/", + "repoUrl": "https://github.com/Innovateninjas/Paws-frontend", + "techStack": ["ReactJS", "Javascript", "Firebase", "TailwindCSS"] + } +] diff --git a/public/data/Saurav-Pant.json b/public/data/Saurav-Pant.json new file mode 100644 index 0000000..45dd624 --- /dev/null +++ b/public/data/Saurav-Pant.json @@ -0,0 +1,10 @@ +[ + { + "title": "First Issue", + "description": "First-Issue is an open-source platform designed specifically for beginners looking to contribute to open-source projects.", + "liveUrl": "https://firstissuedev.vercel.app", + "repoUrl": "https://github.com/ronisarkarexe/First-Issue", + "techStack": ["React", "Node.js"] + } + ] + \ No newline at end of file diff --git a/public/data/TailoredUI.json b/public/data/TailoredUI.json new file mode 100644 index 0000000..4e8af33 --- /dev/null +++ b/public/data/TailoredUI.json @@ -0,0 +1,9 @@ +[ + { + "title": "TailoredUI", + "description": "TailoredUI is a powerful tool for real-time customization of UI components, seamlessly integrated with Tailwind CSS. Effortlessly personalize and preview changes, harnessing Tailwind's flexible styling. Explore a rich library of pre-built components, ensure responsive design, and export perfected code for easy integration.", + "liveUrl": "https://dev-tailoredui.netlify.app/", + "repoUrl": "https://github.com/TailoredUI/TailoredUI", + "techStack": ["ReactJS", "Tailwind", "Typescript"] + } +] diff --git a/public/data/Tanay-ErrorCode.json b/public/data/Tanay-ErrorCode.json new file mode 100644 index 0000000..b52e58d --- /dev/null +++ b/public/data/Tanay-ErrorCode.json @@ -0,0 +1,9 @@ +[ + { + "title": "Lupo Skill", + "description": "Lupo Skill stands out as an innovative skill-sharing web application crafted with ReactJS and TypeScript. It offers users a straightforward way to create and participate in knowledge-sharing events. Whether you're leading a workshop, exploring a new skill, or aiming to connect with industry experts, Lupo Skill provides a smooth platform for collaborative learning and networking. Featuring intuitive event creation tools, personalized user profiles, and a lively community vibe, Lupo Skill empowers individuals to share their expertise and delve into meaningful learning journeys.", + "liveUrl": "https://lupo-skill.web.app/", + "repoUrl": "https://github.com/Tanay-ErrorCode/lupo-skill", + "techStack": ["REACT", "FIREBASE", "TYPESCRIPT"] + } +] diff --git a/public/data/VanshKing30.json b/public/data/VanshKing30.json new file mode 100644 index 0000000..873035c --- /dev/null +++ b/public/data/VanshKing30.json @@ -0,0 +1,9 @@ +[ + { + "title": "Foodies Web", + "description": "Foodies, your go-to college dining companion! Designed for seamless campus culinary experiences, Foodies simplifies menu exploration and nutritional insights. Access daily canteen menus, make informed dietary choices with Spoonacular integration, and empower canteen efficiency. Our platform prioritizes user security and simplicity, ensuring effortless student sign-ups and hassle-free canteen management. Stay up-to-date with our Health News section, delivering valuable insights for healthier eating habits. Embrace convenience and culinary enlightenment with Foodies!", + "liveUrl": "https://foodies-web-app.vercel.app/", + "repoUrl": "https://github.com/VanshKing30/FoodiesWeb", + "techStack": ["ReactJS", "Javascript", "NodeJS", "MongoDb", "Express"] + } +] diff --git a/public/data/hasmithagunda123.json b/public/data/hasmithagunda123.json new file mode 100644 index 0000000..93cec6e --- /dev/null +++ b/public/data/hasmithagunda123.json @@ -0,0 +1,9 @@ +[ + { + "title": "Watchful Guardian", + "description": "Watchful Guardian is an innovative surveillance system designed to detect and respond to harassment against women in public spaces. Our state-of-the-art CCTV cameras are strategically placed to monitor streets, parks, and other public areas. Using advanced computer vision and machine learning algorithms, the system identifies suspicious activities in real-time and immediately alerts law enforcement with precise location details, video footage, and situational context.", + "liveUrl": "https://github.com/hasmithagunda123/ALL_INDIA_HACKATHON", + "repoUrl": "https://github.com/hasmithagunda123/ALL_INDIA_HACKATHON", + "techStack": ["PYTHON"] + } +] diff --git a/public/data/juhinagpure.json b/public/data/juhinagpure.json new file mode 100644 index 0000000..3f29bba --- /dev/null +++ b/public/data/juhinagpure.json @@ -0,0 +1,9 @@ +[ + { + "title": "Eduford University", + "description": "Explore the intersection of technology and society. Learn about environmental justice. Take the famous Problem of God course. Our innovative courses inspire and invite you to help solve some of today’s most pressing local, national and global issues.", + "liveUrl": "https://github.com/juhinagpure/Eduford-university", + "repoUrl": "https://github.com/juhinagpure/Eduford-university", + "techStack": ["ReactJS", "Html", "Css"] + } +] diff --git a/public/data/ronisarkarexe.json b/public/data/ronisarkarexe.json new file mode 100644 index 0000000..0489d7e --- /dev/null +++ b/public/data/ronisarkarexe.json @@ -0,0 +1,9 @@ +[ + { + "title": "First Issue", + "description": "First-Issue is an open-source platform designed specifically for beginners looking to contribute to open-source projects.", + "liveUrl": "https://firstissuedev.vercel.app", + "repoUrl": "https://github.com/ronisarkarexe/First-Issue", + "techStack": ["React", "Node.js"] + } +] diff --git a/src/app/page.tsx b/src/app/page.tsx index 9b4ccad..54a9d45 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,10 +1,12 @@ import HeaderComponent from "@/components/header/header.component"; +import HeroComponent from "@/components/hero/hero.component"; import RepositoryComponent from "@/components/repository/repository.component"; export default function Home() { return (
- + {/* */} +
); diff --git a/src/app/repos/page.tsx b/src/app/repos/page.tsx new file mode 100644 index 0000000..e6cb7ec --- /dev/null +++ b/src/app/repos/page.tsx @@ -0,0 +1,12 @@ +import RepoListViewComponent from "@/components/repository/repo.list.component.view"; +import React from "react"; + +const RepoListComponent = () => { + return ( +
+ +
+ ); +}; + +export default RepoListComponent; diff --git a/src/assert/image/DIV_Blue.png b/src/assert/image/DIV_Blue.png new file mode 100644 index 0000000..ffe02b2 Binary files /dev/null and b/src/assert/image/DIV_Blue.png differ diff --git a/src/assert/image/DIV_Center.png b/src/assert/image/DIV_Center.png new file mode 100644 index 0000000..ab224a0 Binary files /dev/null and b/src/assert/image/DIV_Center.png differ diff --git a/src/assert/image/DIV_Gray.png b/src/assert/image/DIV_Gray.png new file mode 100644 index 0000000..814632e Binary files /dev/null and b/src/assert/image/DIV_Gray.png differ diff --git a/src/components/about_us.tsx b/src/components/about_us.tsx new file mode 100644 index 0000000..6908a1a --- /dev/null +++ b/src/components/about_us.tsx @@ -0,0 +1,31 @@ +import Link from "next/link"; +import React from "react"; + +const AboutUsComponent = () => { + return ( +
+

ABOUT 📝

+
+

+ First-Issue is an + open-source platform designed specifically for beginners looking to + contribute to open-source projects. It is especially tailored for the{" "} + Open-Source{" "} + contributors. First Issue simplifies the process of finding tasks that + align with your skill level and interests, making it easier for you to + get started in the world of{" "} + open-source contributions. +

+
+ {/*

Open Source

*/} +

+ © 2024{" "} + + @firstissue + {" "} +

+
+ ); +}; + +export default AboutUsComponent; diff --git a/src/components/hero/hero.component.tsx b/src/components/hero/hero.component.tsx new file mode 100644 index 0000000..753b6ce --- /dev/null +++ b/src/components/hero/hero.component.tsx @@ -0,0 +1,83 @@ +import React from "react"; +import NextGenerationViewComponent from "./next.generation.view.component"; + +const HeroComponent = () => { + return ( +
+
+
+
+ +
+ +

+ Find your next +
+ Open Source project + + + +

+

+ Describe what you're looking for and let our AI help you + discover the perfect repository. +

+ +
+
+
+
+ +
+ + +
+ +
+
+
+
+
+
+
+
+
+
+ ); +}; + +export default HeroComponent; diff --git a/src/components/hero/next.generation.view.component.tsx b/src/components/hero/next.generation.view.component.tsx new file mode 100644 index 0000000..898153e --- /dev/null +++ b/src/components/hero/next.generation.view.component.tsx @@ -0,0 +1,22 @@ +import React from "react"; + +const NextGenerationViewComponent = () => { + return ( +
+ + N + + + E + + + W + + + Next-Generation of AI Open Source + +
+ ); +}; + +export default NextGenerationViewComponent; diff --git a/src/components/repository/repo.list.component.view.tsx b/src/components/repository/repo.list.component.view.tsx new file mode 100644 index 0000000..8fb625a --- /dev/null +++ b/src/components/repository/repo.list.component.view.tsx @@ -0,0 +1,53 @@ +"use client"; +import React, { useEffect, useState } from "react"; +import Image from "next/image"; +import contributors from "../../contributors.json"; +import { getGitHubUserAvatar } from "./repository.helper"; +import RepositoryListComponent from "./repository-list.component"; + +const RepoListViewComponent = () => { + const [selectedUser, setSelectedUser] = useState("ronisarkarexe.json"); + const [avatarUrl, setAvatarUrl] = useState<{ name: string; url: string }[]>( + [] + ); + useEffect(() => { + const loadAvatars = async () => { + const res = await Promise.all( + contributors.map(async (contributor) => { + const avatarURL = await getGitHubUserAvatar( + contributor.split(".")[0] + ); + return { name: contributor, url: avatarURL }; + }) + ); + setAvatarUrl(res); + }; + loadAvatars(); + }, []); + + return ( +
+
+ {avatarUrl.map((user, index) => ( +
setSelectedUser(user.name)} + > + {user.name} +
+ ))} +
+ +
+ ); +}; + +export default RepoListViewComponent; diff --git a/src/components/repository/repository-list.component.tsx b/src/components/repository/repository-list.component.tsx index 488f77a..c38d4e7 100644 --- a/src/components/repository/repository-list.component.tsx +++ b/src/components/repository/repository-list.component.tsx @@ -1,46 +1,40 @@ "use client"; -import { Repository } from "@/model/repository.model"; import React, { useEffect, useState } from "react"; +import { Repository } from "@/model/repository.model"; import RepositoryViewComponent from "./view/repository-view.component"; -import { getLastCommitDate } from "./repository.helper"; import LoadingPage from "@/app/loading"; +import { fetchUserData } from "@/utils/fetchAllUserData"; -const RepositoryListComponent = () => { +const RepositoryListComponent = ({ selectedUser }: { selectedUser: string }) => { const [repositories, setRepositories] = useState([]); + const [loading, setLoading] = useState(true); + useEffect(() => { const repositoryData = async () => { - const res = await fetch( - "https://first-issue-server.vercel.app/api/v1/repository" - ); - const result = await res.json(); - const repositoriesWithDates = await Promise.all( - result.data.map(async (repo: Repository) => { - const lastCommitDate = new Date( - await getLastCommitDate( - repo.repoUrl, - process.env.NEXT_PUBLIC_GET_AC_TOKEN as string - ) - ); - return { ...repo, lastCommitDate }; - }) - ); - const sortedRepositories = repositoriesWithDates.sort( - (a, b) => b.lastCommitDate.getTime() - a.lastCommitDate.getTime() - ); - setRepositories(sortedRepositories); + setLoading(true); + try { + const result = await fetchUserData(selectedUser); + if (result.length > 0) { + setRepositories(result); + } + } catch (error) { + console.error("Failed to fetch repositories:", error); + } finally { + setLoading(false); + } }; repositoryData(); - }, []); + }, [selectedUser]); - if (repositories.length === 0) { + if (loading) { return ; } return (
{repositories.length ? ( - repositories.map((item) => ( -
+ repositories.map((item, index) => ( +
)) diff --git a/src/components/repository/repository.component.tsx b/src/components/repository/repository.component.tsx index 3c3762c..b0ddbc6 100644 --- a/src/components/repository/repository.component.tsx +++ b/src/components/repository/repository.component.tsx @@ -1,43 +1,14 @@ "use client"; - import React from "react"; -import RepositoryListComponent from "./repository-list.component"; -import Link from "next/link"; +import AboutUsComponent from "../about_us"; +import HeroComponent from "../hero/hero.component"; const RepositoryComponent = () => { return ( -
-
-

ABOUT 📝

-
-

- First-Issue is an - open-source platform designed specifically for beginners looking to - contribute to open-source projects. It is especially tailored for - the Girls-Script-2024{" "} - contributors. First Issue simplifies the process of finding tasks - that align with your skill level and interests, making it easier for - you to get started in the world of{" "} - open-source contributions. -

-
- {/*

Open Source

*/} -

- © 2024{" "} - - @firstissue - {" "} -

-
-
- -
+
+ + +