Merge branch 'pbdsce:main' into main

app/(default)/achievements/page.tsx

@@ -1,11 +1,76 @@
-export const metadata = {
-    title: 'Achievements',
-    description: 'Achievements page',
+"use client";
+
+import { useEffect, useState } from "react";
+
+interface Achiever {
+  imageUrl: string;
+  Email: string;
+  Name: string;
+  Batch: number;
+  Portfolio: string;
+  Internship: string;
+  CompanyPosition: string;
+  Stipend: number;
+  achievements: string[];
+}
+
+function AchievementCard({ achiever }: { achiever: Achiever }) {
+  return (
+    <div className="bg-[hsla(0,0%,100%,.079)] rounded-xl shadow-lg overflow-hidden w-[330px]">
+      <div className="overflow-hidden">
+        <img
+          src={achiever.imageUrl}
+          alt={`${achiever.Name}'s profile`}
+          className="w-full h-[270px] object-cover object-center"
+        />
+      </div>
+      <div className="p-4">
+        <h3 className="text-center text-2xl font-semibold mb-2 capitalize-first-letter">
+          {achiever.Name}
+        </h3>
+        <ul className="list-disc list-outside pl-5">
+          {achiever.achievements.map((achievement, index) => (
+            <li key={index} className="text-gray-600 text-lg mb-2">
+              {achievement}
+            </li>
+          ))}
+        </ul>
+      </div>
+    </div>
+  );
 }
 
-    export default function Achievements() {
-    return (
-        <>
-        </>
-    )
-}
+export default function AchievementsPage() {
+  const [achievers, setAchievers] = useState<Achiever[]>([]);
+
+  useEffect(() => {
+    async function fetchAchievers() {
+      try {
+        const response = await fetch("/api/achievements");
+        const data = await response.json();
+        setAchievers(data);
+      } catch (error) {
+        console.error("Error fetching achievements:", error);
+      }
+    }
+
+    fetchAchievers();
+  }, []);
+
+  return (
+    <div className="container w-full mx-auto pt-32">
+      <h1 className="text-center text-4xl font-bold mb-28">Achievements</h1>
+      <div className="grid grid-cols-1 2gl:grid-cols-2 3gl:grid-cols-3 gap-x-5 gap-y-5 max-w-[1030px] mx-auto justify-items-center">
+        {[...Array(3)].map((_, colIndex) => (
+          <div key={colIndex} className="flex flex-col gap-y-5">
+            {achievers
+              .filter((_, index) => index % 3 === colIndex)
+              .map((achiever) => (
+                <AchievementCard key={achiever.Email} achiever={achiever} />
+              ))}
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}

app/(default)/api/achievements/route.ts

@@ -0,0 +1,125 @@
+import { db, storage } from "@/Firebase";
+import {
+  collection,
+  addDoc,
+  getDocs,
+  query,
+  where,
+  DocumentData,
+  DocumentSnapshot,
+} from "firebase/firestore";
+import { ref, uploadBytes, getDownloadURL } from "firebase/storage";
+import { NextResponse } from "next/server";
+
+export async function POST(request: Request) {
+  try {
+    const formData = await request.formData();
+
+    // Extract data from the form
+    const name = formData.get("Name") as string;
+    const email = formData.get("Email address") as string;
+    const batch = formData.get("Batch") as string;
+    const portfolio = formData.get("Portfolio/Github") as string;
+    const internship = formData.get(
+      "Doing internship or have done in past?"
+    ) as string;
+    const companyPosition = formData.get("Company and Position") as string;
+    const stipend = formData.get("Stipend") as string;
+    const achievements = formData.getAll("achievements") as string[];
+
+    // Check if a person with the same name already exists
+    const existingMembersQuery = query(
+      collection(db, "achievements"),
+      where("Name", "==", name)
+    );
+    const querySnapshot = await getDocs(existingMembersQuery);
+
+    if (!querySnapshot.empty) {
+      return NextResponse.json(
+        { error: `A member with the name ${name} already exists.` },
+        { status: 400 }
+      );
+    }
+
+    // Handle image upload
+    const imageFile = formData.get("image") as File;
+    if (!imageFile) {
+      return NextResponse.json(
+        { error: "Image file is required" },
+        { status: 400 }
+      );
+    }
+
+    const storageRef = ref(storage, `images/${imageFile.name}`);
+    await uploadBytes(storageRef, imageFile);
+    const imageUrl = await getDownloadURL(storageRef);
+
+    // Save data to Firestore without Timestamp
+    const docRef = await addDoc(collection(db, "achievements"), {
+      Name: name,
+      Email: email,
+      Batch: batch,
+      Portfolio: portfolio,
+      Internship: internship,
+      CompanyPosition: companyPosition,
+      Stipend: stipend,
+      achievements: achievements,
+      imageUrl: imageUrl,
+    });
+
+    return NextResponse.json({
+      message: "Data saved successfully",
+      id: docRef.id,
+      imageUrl: imageUrl,
+    });
+  } catch (error) {
+    if (error instanceof Error) {
+      console.error("Error details:", error.message);
+      return NextResponse.json(
+        { error: "An error occurred", details: error.message },
+        { status: 500 }
+      );
+    } else {
+      console.error("Unknown error:", error);
+      return NextResponse.json(
+        { error: "An unknown error occurred" },
+        { status: 500 }
+      );
+    }
+  }
+}
+
+export async function GET() {
+  try {
+    // Fetch all documents from the "achievements" collection
+    const querySnapshot = await getDocs(collection(db, "achievements"));
+
+    // Map through the documents and extract the data
+    const members = querySnapshot.docs.map(
+      (doc: DocumentSnapshot<DocumentData>) => ({
+        id: doc.id,
+        ...doc.data(),
+      })
+    );
+
+    // Return the members data
+    return NextResponse.json(members);
+  } catch (error) {
+    if (error instanceof Error) {
+      console.error("Error fetching members:", error.message);
+      return NextResponse.json(
+        {
+          error: "An error occurred while fetching members",
+          details: error.message,
+        },
+        { status: 500 }
+      );
+    } else {
+      console.error("Unknown error:", error);
+      return NextResponse.json(
+        { error: "An unknown error occurred while fetching members" },
+        { status: 500 }
+      );
+    }
+  }
+}