Hooked training content to backend, did refactors to training components and record.tsx

src/pages/api/training/[id].ts

@@ -0,0 +1,44 @@
+import { sessionOptions } from "@/lib/session";
+import {app} from "@/firebase";
+import { collection, doc, getDoc, getDocs, getFirestore, query } from "firebase/firestore";
+import { withIronSessionApiRoute } from "iron-session/next";
+import { NextApiRequest, NextApiResponse } from "next";
+
+const db = getFirestore(app);
+
+export default withIronSessionApiRoute(handler, sessionOptions);
+
+async function handler(req: NextApiRequest, res: NextApiResponse) {
+    if (!req.session.user) {
+        res.status(401).json({ ok: false });
+        return;
+    }
+
+    if (req.method === "GET") return get(req, res);
+}
+
+
+async function get(req: NextApiRequest, res: NextApiResponse) {
+    try {
+        const { id } = req.query;
+
+      if (typeof id !== 'string') {
+        return res.status(400).json({ message: 'Invalid ID' });
+      }
+
+      const docRef = doc(db, "training", id);
+      const docSnap = await getDoc(docRef);
+
+      if (docSnap.exists()) {
+        res.status(200).json({
+          id: docSnap.id,
+          ...docSnap.data(),
+        });
+      } else {
+        res.status(404).json({ message: 'Document not found' });
+      }
+    } catch (error) {
+        console.error('Error fetching data:', error);
+        res.status(500).json({ message: 'An unexpected error occurred' });
+    }
+}

src/pages/api/training/index.ts

@@ -1,7 +1,7 @@
 import { sessionOptions } from "@/lib/session";
 import axios from "axios";
-import {app} from "@/firebase";
-import { collection, getDocs, getFirestore, query } from "firebase/firestore";
+import { app } from "@/firebase";
+import { collection, doc, getDoc, getDocs, getFirestore, query } from "firebase/firestore";
 import { withIronSessionApiRoute } from "iron-session/next";
 import { NextApiRequest, NextApiResponse } from "next";
 
@@ -35,16 +35,17 @@ async function post(req: NextApiRequest, res: NextApiResponse) {
 async function get(req: NextApiRequest, res: NextApiResponse) {
     try {
         const q = query(collection(db, "training"));
-
         const snapshot = await getDocs(q);
 
         res.status(200).json(
             snapshot.docs.map((doc) => ({
                 id: doc.id,
                 ...doc.data(),
-            })),
+            }))
         );
     } catch (error) {
+        console.error('Error fetching data:', error);
         res.status(500).json({ message: 'An unexpected error occurred' });
     }
 }
+

src/pages/api/training/walkthrough/index.ts

@@ -0,0 +1,44 @@
+import { sessionOptions } from "@/lib/session";
+import { app } from "@/firebase";
+import { collection, doc, documentId, getDoc, getDocs, getFirestore, query, where } from "firebase/firestore";
+import { withIronSessionApiRoute } from "iron-session/next";
+import { NextApiRequest, NextApiResponse } from "next";
+
+const db = getFirestore(app);
+
+export default withIronSessionApiRoute(handler, sessionOptions);
+
+async function handler(req: NextApiRequest, res: NextApiResponse) {
+    if (!req.session.user) {
+        res.status(401).json({ ok: false });
+        return;
+    }
+    if (req.method === "GET") return get(req, res);
+}
+
+
+async function get(req: NextApiRequest, res: NextApiResponse) {
+    try {
+        const { ids } = req.query;
+
+        if (!ids || !Array.isArray(ids)) {
+            return res.status(400).json({ message: 'Invalid or missing ids!' });
+        }
+
+        const walkthroughCollection = collection(db, 'walkthrough');
+
+        const q = query(walkthroughCollection, where(documentId(), 'in', ids));
+
+        const querySnapshot = await getDocs(q);
+
+        const documents = querySnapshot.docs.map(doc => ({
+            id: doc.id,
+            ...doc.data()
+        }));
+
+        res.status(200).json(documents);
+    } catch (error) {
+        console.error('Error fetching data:', error);
+        res.status(500).json({ message: 'An unexpected error occurred' });
+    }
+}