Solved issue ProjectX-VJTI#10 : Achievement Page with sections

package.json

@@ -20,9 +20,10 @@
     "react-dom": "^18.2.0",
     "react-icon-cloud": "^1.1.3",
     "react-icons": "^5.2.1",
-    "react-router-dom": "^6.23.0",
+    "react-router-dom": "^6.28.2",
     "react-spring": "^9.7.3",
     "react-three-fiber": "^6.0.13",
+    "react-toastify": "^11.0.3",
     "simple-icons": "^5.24.0",
     "stats.js": "^0.17.0",
     "three": "^0.165.0",

src/App.jsx

@@ -14,15 +14,19 @@ import UpcomingProjects from './Components/UpcomingProjects';
 import VerticalTimeline from './Components/Timeline';
 import Carousel from './Components/Carousel';
 import Hero from './Components/Hero';
-import Footer from "./Components/Footer"
+import Footer from "./Components/Footer";
+import AdminApproval from './Components/AdminApproval';
+import { AchievementProvider } from './Components/AchievementContext';
+import { ToastContainer } from 'react-toastify'; // Import ToastContainer
+import 'react-toastify/dist/ReactToastify.css';
 
 
 const Homepage = () => {
   return (
     <div>
       <Hero />
        {/* Text Section between Hero and Carousel */}
-      <div className="text-center py-8 px-4 md:px-12 bg-opacity-10 text-white">
+      <div className="text-center py-8 px-4 md:px-12 bg-opacity-10 text-white ">
         <h2 className="text-4xl font-semibold mb-4">Welcome to Project X</h2>
         <p className="text-xl">
           We are an exclusive club at Veermata Jijabai Technological Institute, Mumbai. We provide a collaborative environment for students to learn, grow, and build projects together under mentorship. Explore our achievements, past projects, and upcoming events!
@@ -42,21 +46,27 @@ const Homepage = () => {
 function App() {
   return (
     <div className='bgC'>
+        <AchievementProvider>
     <Router>
       <Navigation />
       <Routes>
         <Route path="/" element={<Homepage />} />
         <Route path="/events" element={<Events />} />
         <Route path="/projects" element={<Projects />} />
         <Route path="/achievements" element={<Achievements />} />
+        <Route path="/admin" element={<AdminApproval />} />
         <Route path="/past-projects" element={<PastProjects />} />
         <Route path="/upcoming-projects" element={<UpcomingProjects />} />
+
+
         {/* <Route path="/time" element={<VerticalTimeline />} /> */}
 
         {/* <Route path="/" element={<OrderManagement />} /> */}
       </Routes>
       <Footer />
+      <ToastContainer /> 
     </Router>
+    </AchievementProvider>
     <div>
     </div>
     </div>

src/Components/AchievementContext.jsx

@@ -0,0 +1,89 @@
+import React, { createContext, useState } from 'react';
+
+export const AchievementContext = createContext();
+
+export const AchievementProvider = ({ children }) => {
+  const [submittedAchievements, setSubmittedAchievements] = useState([]);
+  const [approvedAchievements, setApprovedAchievements] = useState([
+    {
+      name: 'Kshitij Shah',
+      category: 'GSOC',
+      image: 'https://i.ibb.co/jJyjcvZ/Kshitij-Shah-photoaidcom-cropped.png',
+      achievementDetails: 'Sugarlabs',
+      link: 'https://github.com/kshitijdshah99/Pippy_Activity',
+    },
+    {
+      name: 'Vedant Mehra',
+      category: 'GSOC',
+      image: 'https://i.ibb.co/Z6fgX5F/IMG-20231110-003535-01-01-photoaidcom-cropped.png',
+      achievementDetails: 'CERN',
+      link: 'https://hepsoftwarefoundation.org/gsoc/blogs/2024/blog_SOFIE_VedantMehra.html',
+    },
+    {
+      name: 'Mayank Palan',
+      category: 'GSOC',
+      image: 'https://i.ibb.co/Sm9FtJ2/1714656497995-photoaidcom-cropped.png',
+      achievementDetails: 'Red Hen Lab',
+      link: 'https://medium.com/@mayankpalan066/gsoc24-with-red-hen-lab-modeling-wayfinding-cfb0131b71d1',
+    },
+    {
+      name: 'Sharan Poojari',
+      category: 'GSOC',
+      image: 'https://i.ibb.co/C640S72/Scanned-20240502-1627-1-page-0001-photoaidcom-cropped.png',
+      achievementDetails: 'NumFOCUS',
+      link: 'https://github.com/aiidateam/aiida-explorer/blob/gsoc/gsoc/README.md',
+    },
+    {
+      name: 'Warren Jacinto',
+      category: 'GSOC',
+      image: 'https://i.ibb.co/T4D9vMh/IMG-20240502-172654-photoaidcom-cropped.png',
+      achievementDetails: 'Open Astronomy',
+      link: 'https://deadspheroid.github.io/my-blog/',
+    },
+    {
+      name: 'Tvisha Vedant',
+      category: 'GSOC',
+      image: 'https://i.ibb.co/t3vy9D9/IMG-20240502-WA0043-2-photoaidcom-cropped.png',
+      achievementDetails: 'INCF',
+      link: 'https://tvilight4.github.io/MyBlog/',
+    },
+    {
+      name: 'Raya Chakravarthy',
+      category: 'GSOC',
+      image: 'https://i.ibb.co/9WSz3ss/photo-photoaidcom-cropped.png',
+      achievementDetails: 'INCF',
+      link: 'https://raya679.github.io/gsoc/',
+    },
+  ]);
+
+  const submitAchievement = (achievement) => {
+    setSubmittedAchievements((prev) => [...prev, achievement]);
+  };
+
+  const approveAchievement = (achievement) => {
+    setApprovedAchievements((prev) => [...prev, achievement]); // Add to approvedAchievements
+    setSubmittedAchievements((prev) =>
+      prev.filter((item) => item !== achievement) // Remove from submittedAchievements
+    );
+  };
+
+  const rejectAchievement = (achievement) => {
+    setSubmittedAchievements((prev) =>
+      prev.filter((item) => item !== achievement) // Remove from submittedAchievements
+    );
+  };
+
+  return (
+    <AchievementContext.Provider
+      value={{
+        submittedAchievements,
+        approvedAchievements,
+        submitAchievement,
+        approveAchievement,
+        rejectAchievement,
+      }}
+    >
+      {children}
+    </AchievementContext.Provider>
+  );
+};