Merge branch 'main' into update

Author: Ishita06-ai

client/src/App.jsx

@@ -5,7 +5,6 @@ import { AuthProvider, useAuth } from "./context/AuthContext";
 import ProtectedRoutes from "./routes/ProtectedRoutes";
 import PublicRoutes from "./routes/PublicRoutes";
 import ThemeApplier from "./theme/ThemeApplier";
-import Mainpage from "./pages/Mainpage";
 
 function AppRoutes() {
   const { user } = useAuth();

client/src/components/Navbar.jsx

@@ -86,58 +86,14 @@ function Navbar({ showBack }) {
       .then((d) => Array.isArray(d) && setNotifs(d));
 
     const socket = getSocket(user.id);
-    socket.on("new-course", (notif) => {
-      setNotifs((prev) => [
-        {
-          id: notif.id || Date.now(),
-          message: notif.message,
-          createdAt: notif.createdAt,
-          read: false,
-        },
-        ...prev,
-      ]);
-    });
-    socket.on("live-class-scheduled", (data) => {
-      setNotifs((prev) => [
-        {
-          id: `lc_${Date.now()}`,
-          message: `📹 Live class scheduled: "${data.title}"`,
-          createdAt: new Date().toISOString(),
-          read: false,
-        },
-        ...prev,
-      ]);
-    });
-    socket.on("live-class-status", (data) => {
-      if (data.status === "live") {
-        setNotifs((prev) => [
-          {
-            id: `lcs_${Date.now()}`,
-            message: `🔴 A live class just started!`,
-            createdAt: new Date().toISOString(),
-            read: false,
-          },
-          ...prev,
-        ]);
-      }
-    });
-    socket.on("student-enrolled", (data) => {
-      setNotifs((prev) => [
-        {
-          id: `enroll_${Date.now()}`,
-          message: data.message || "A student enrolled in your course",
-          createdAt: new Date().toISOString(),
-          read: false,
-        },
-        ...prev,
-      ]);
+
+    // Single unified listener — backend persists to DB before emitting
+    socket.on("notification:new", (notif) => {
+      setNotifs((prev) => [{ ...notif, read: false }, ...prev]);
     });
 
     return () => {
-      socket.off("new-course");
-      socket.off("live-class-scheduled");
-      socket.off("live-class-status");
-      socket.off("student-enrolled");
+      socket.off("notification:new");
     };
   }, [user?.id, isAuthenticated]);
 

client/src/pages/About.jsx

@@ -1,4 +1,5 @@
 import { useContext } from "react";
+import { Link } from "react-router-dom";
 import { ThemeContext } from "../context/ThemeContext";
 import Navbar from "../components/Navbar";
 import Footer from "../components/Footer";
@@ -107,6 +108,25 @@ function About() {
             </div>
           </div>
 
+          {/* Tech Architecture CTA */}
+          <div className="rounded-2xl border border-[var(--border)]/40 bg-[var(--card)] p-8 mb-12 flex flex-col sm:flex-row items-center justify-between gap-6">
+            <div>
+              <h2 className="text-xl font-bold text-[var(--text)] mb-1">
+                How it's built
+              </h2>
+              <p className="text-sm text-[var(--muted)]">
+                Explore the full backend architecture — Express 5, MongoDB,
+                Socket.IO, Claude AI, and Cloudinary — layer by layer.
+              </p>
+            </div>
+            <Link
+              to="/about/architecture"
+              className="shrink-0 px-6 py-3 rounded-xl font-semibold text-sm bg-[var(--accent)] text-white hover:opacity-90 transition-opacity"
+            >
+              View Tech Architecture →
+            </Link>
+          </div>
+
           {/* Values */}
           <h2 className="text-2xl font-bold text-[var(--text)] mb-6 text-center">
             What we stand for