Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Google's Free Certifications Fetch API Implemented | To Fetch Google's Free Certifications & Courses #275

Merged
merged 8 commits into from
Oct 28, 2024
Merged
Show file tree
Hide file tree
Changes from 7 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions PROJECT_STRUCTURE.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,9 @@
├── postcss.config.mjs
├── public/
│ ├── Logo.svg
│ ├── Mentor 1.jpeg
│ ├── Mentor 2.jpeg
│ ├── Mentor 3.png
│ ├── Newsletter.png
│ ├── avatar.png
│ ├── avatar1.png
Expand Down Expand Up @@ -90,11 +93,18 @@
│ │ │ ├── SingleEvent/
│ │ │ │ └── [id]/
│ │ │ │ └── page.jsx
│ │ │ ├── Stories-Achievements/
│ │ │ │ ├── achievements.js
│ │ │ │ ├── mentors.js
│ │ │ │ └── page.jsx
│ │ │ ├── Subscribe/
│ │ │ │ └── page.jsx
│ │ │ ├── TeamsGallery/
│ │ │ │ ├── Teams.js
│ │ │ │ └── page.jsx
│ │ │ ├── TechToolkits/
│ │ │ │ ├── page.jsx
│ │ │ │ └── techStacks.js
│ │ │ ├── TermsAndConditions/
│ │ │ │ └── page.jsx
│ │ │ ├── api/
Expand Down Expand Up @@ -182,6 +192,8 @@
│ │ ├── Hackathon.js
│ │ ├── Projects.js
│ │ ├── cpp-content.js
│ │ ├── dsa-content.js
│ │ ├── dsa-track-content.js
│ │ └── utils.js
│ └── public/
│ └── GDSC-RCIIT Logo.png
Expand Down
119 changes: 119 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

12 changes: 12 additions & 0 deletions repo_structure.txt
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@
├── postcss.config.mjs
├── public/
│ ├── Logo.svg
│ ├── Mentor 1.jpeg
│ ├── Mentor 2.jpeg
│ ├── Mentor 3.png
│ ├── Newsletter.png
│ ├── avatar.png
│ ├── avatar1.png
Expand Down Expand Up @@ -86,11 +89,18 @@
│ │ │ ├── SingleEvent/
│ │ │ │ └── [id]/
│ │ │ │ └── page.jsx
│ │ │ ├── Stories-Achievements/
│ │ │ │ ├── achievements.js
│ │ │ │ ├── mentors.js
│ │ │ │ └── page.jsx
│ │ │ ├── Subscribe/
│ │ │ │ └── page.jsx
│ │ │ ├── TeamsGallery/
│ │ │ │ ├── Teams.js
│ │ │ │ └── page.jsx
│ │ │ ├── TechToolkits/
│ │ │ │ ├── page.jsx
│ │ │ │ └── techStacks.js
│ │ │ ├── TermsAndConditions/
│ │ │ │ └── page.jsx
│ │ │ ├── api/
Expand Down Expand Up @@ -178,6 +188,8 @@
│ │ ├── Hackathon.js
│ │ ├── Projects.js
│ │ ├── cpp-content.js
│ │ ├── dsa-content.js
│ │ ├── dsa-track-content.js
│ │ └── utils.js
│ └── public/
│ └── GDSC-RCIIT Logo.png
Expand Down
77 changes: 77 additions & 0 deletions src/app/(pages)/Chapters/page.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
"use client";
import { useEffect, useState } from 'react';
import { toast } from 'react-toastify';

const ChapterTabs = () => {
const [data, setData] = useState([]);
const [activeTab, setActiveTab] = useState(null);
const [loadingToastId, setLoadingToastId] = useState(null);

useEffect(() => {
const fetchData = async () => {
const id = toast.loading('Loading data...');
setLoadingToastId(id);

try {
const response = await fetch('/api/chapters', {
method: 'GET',
});
if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}

const result = await response.json();
setData(result);
setActiveTab(result[0]?.id || null);
toast.update(id, { render: 'Data loaded successfully!', type: 'success', isLoading: false, autoClose: 3000 });
} catch (error) {
console.error('Error fetching data:', error);
toast.update(id, { render: `Error fetching data: ${error.message}`, type: 'error', isLoading: false, autoClose: 3000 });
}
};

fetchData();
}, []);

return (
<div className="container mx-auto p-6">
<h1 className="m-2 text-5xl text-center font-extrabold bg-gradient-to-r from-blue-500 to-purple-500 text-transparent bg-clip-text">
GDSC Chapters
</h1>
<p className="text-center text-gray-500 mb-4">Global chapters</p>

<div className="flex justify-center space-x-4 border-b mb-6">
{data.map((region) => (
<button
key={region.id}
onClick={() => setActiveTab(region.id)}
className={`px-4 py-2 text-lg font-semibold transition-colors duration-300 rounded-md ${activeTab === region.id ? 'bg-blue-500 text-white' : 'text-blue-500 hover:bg-blue-100'}`}
>
{region.title}
</button>
))}
</div>

<div className="border rounded-lg p-4 bg-white shadow-lg">
<h2 className="text-2xl font-semibold text-center mb-4">Explore by region</h2>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
{data
.find((region) => region.id === activeTab)
?.chapters.map((chapter, index) => (
<div key={index} className="flex flex-col items-center border rounded-lg p-4 bg-gray-50 shadow-md hover:shadow-xl transition-shadow duration-300">
<h3 className="font-semibold text-gray-800 text-lg mb-2">{chapter.title}</h3>
<p className="text-gray-600">{chapter.country}</p>
{/* <div className="flex items-center justify-between w-full">
{chapter.flag && (
<img src={chapter.flag} alt={`${chapter.country} flag`} className="w-10 h-6 rounded-md" />
)}
</div> */}
</div>
))}
</div>
</div>
</div>
);
};

export default ChapterTabs;
Loading