Faq m

.gitignore

@@ -32,7 +32,8 @@ CHANGELOG.md
 # yarn.lock
 
 # Uploads / media
-uploads/
+uploads/*
+!uploads/.gitkeep
 
 # Test coverage
 coverage/

README.md

@@ -1,17 +1,18 @@
-<<<<<<< HEAD
-# Q&A Platform
+# PippaQ — Premium Q&A & FAQ Platform
 
-A semantic query-resolution and FAQ generation platform with a **QP (Quality Point) reputation economy** and **role-based access control**. Built with React, Express, MongoDB, and a custom RAG engine.
+A high-performance, semantic query-resolution and FAQ generation platform with a **QP (Quality Point) reputation economy**, **role-based access control**, and a production-ready **RAG (Retrieval-Augmented Generation) duplicate detection engine**.
+
+Built with React, Express, MongoDB, Qdrant Cloud, and local Sentence Transformers.
 
 ---
 
 ## 🏗️ Architecture
 
-```
+```text
 D:\faq\
-├── client/          React + Vite frontend (Tailwind CSS)
-├── server/          Express.js backend (MongoDB/Mongoose)
-├── rag-engine/      Custom TF-IDF RAG pipeline (no external AI API)
+├── client/          React + Vite frontend (Tailwind CSS + Premium Typography)
+├── server/          Express.js backend (MongoDB/Mongoose + Qdrant Integration)
+├── rag-engine/      Semantic Decision Engine (Sentence Transformer + Qdrant ANN)
 ├── shared/          Shared constants (QP rules, RAG thresholds, roles)
 └── docs/            Project documentation
 ```
@@ -30,21 +31,21 @@ npm run install:all
 
 ```bash
 cp server/.env.example server/.env
-# Edit server/.env — set your MongoDB URI and JWT secret
+# Edit server/.env — set your MongoDB URI, JWT secret, and QDRANT_URL
 ```
 
-### 3. Start MongoDB
+### 3. Start MongoDB & Qdrant
 
-Make sure MongoDB is running locally or update `MONGO_URI` in `server/.env`.
+Ensure your local or cloud MongoDB and Qdrant instances are accessible.
 
 ### 4. Run the app
 
 ```bash
 npm run dev
 ```
 
-- **Client**: http://localhost:3000
-- **Server**: http://localhost:5000
+* **Client**: http://localhost:3000
+* **Server**: http://localhost:5000
 
 ---
 
@@ -80,29 +81,41 @@ npm run dev
 | Question removed | -5 |
 
 ### Thresholds
-- **QP < 50** → Cannot raise questions
-- **QP ≥ 500** → Auto-request Moderator promotion
+* **QP < 50** → Cannot raise questions.
+* **QP ≥ 500** → Auto-request Moderator promotion.
 
 ---
 
-## 🧠 RAG Decision Tree
-
-Questions are evaluated against the FAQ and RTQ vector stores:
-
-```
-User Question → TF-IDF Embed (384-dim) → Compare with FAQ/RTQ vectors
-
-F1: FAQ similarity > 80%   → REJECT + -5 QP (duplicate)
-F2: 50–80% FAQ similarity
-  + R1: RTQ > 60%          → REJECT + -5 QP (similar RTQ exists)
-  + R2: 20–60% RTQ         → REJECT (no penalty)
-  + R3: RTQ ≤ 20%          → ACCEPT → Add to RTQ
-F3: FAQ ≤ 50% similarity
-  + R1: RTQ > 60%          → REJECT (no penalty)
-  + R2/R3: RTQ ≤ 60%       → ACCEPT → Add to RTQ
+## 🧠 RAG Duplicate Detection Engine
+
+Questions are evaluated semantically against the FAQ and RTQ collections stored in Qdrant:
+
+```text
+User Question 
+      │
+      ▼
+Generate Embedding ──► Local Sentence Transformer (all-MiniLM-L6-v2, 384-dim)
+      │
+      ▼
+Qdrant HNSW ANN Search ──► Compare with FAQ/RTQ Collections
+      │
+      ▼
+Apply Decision Tree Rules:
+┌───────────────────────────────┬───────────────────────────────┐
+│ F1: FAQ similarity > 80%      │ REJECT, -5 QP, upvote FAQ     │
+├───────────────────────────────┼───────────────────────────────┤
+│ F2: FAQ similarity 50–80%     │                               │
+│  ├── R1: RTQ > 60%            │ REJECT, -5 QP, upvote FAQ     │
+│  ├── R2: RTQ 20–60%           │ REJECT (no penalty)           │
+│  └── R3: RTQ ≤ 20%            │ ACCEPT → Route to RTQ         │
+├───────────────────────────────┼───────────────────────────────┤
+│ F3: FAQ similarity ≤ 50%      │                               │
+│  ├── R1: RTQ > 60%            │ REJECT (no penalty), upvote RTQ│
+│  └── R2/R3: RTQ ≤ 60%         │ ACCEPT → Route to RTQ         │
+└───────────────────────────────┴───────────────────────────────┘
 ```
 
-> Uses TF-IDF character n-grams (no external AI API required). Swap for OpenAI/sentence-transformers in production.
+> **Performance Optimization:** Includes an **LRU Embedding Cache** (500 entries) and model warmup on server startup to ensure lightning-fast semantic queries under 10ms.
 
 ---
 
@@ -124,23 +137,8 @@ F3: FAQ ≤ 50% similarity
 
 ## 🛠️ Tech Stack
 
-- **Frontend**: React 18, Vite, React Router v6, Axios, Tailwind CSS
-- **Backend**: Express.js, Mongoose, JWT (bcryptjs for passwords)
-- **RAG Engine**: Custom TF-IDF n-gram embedder (384-dim), cosine similarity, in-memory vector DB
-- **Database**: MongoDB (vectors stored in documents — swap for Qdrant/Pinecone in production)
-- **Dev**: `concurrently` to run client + server together
-
----
-
-## 📝 Notes
-
-- OTP is **console-logged** in development. Wire to an email provider (SendGrid, Resend) for production.
-- Vector DB is **in-memory** (vectors stored in MongoDB documents). For production, swap to Qdrant or Pinecone.
-- RESTRICTED users (flagged by seniors) are blocked from asking questions and answering.
-
----
-
-*Maintained with git. Run `git log --oneline` for full history.*
-=======
-# FAQ
->>>>>>> 655d58505ffd99f5232d6f5c4fb351452148d89f
+* **Frontend**: React 18, Vite, React Router v6, Axios, Tailwind CSS + Premium Typography (Playfair Display & Outfit)
+* **Backend**: Express.js, Mongoose, JWT (bcryptjs)
+* **Vector Store**: Qdrant Cloud (HNSW indexes, cosine distance, metadata payload filters)
+* **Embeddings**: Native Node.js `@xenova/transformers` (local WebAssembly ONNX execution of `all-MiniLM-L6-v2`)
+* **Dev Tools**: `concurrently` to run client + server together

client/index.html

@@ -3,8 +3,13 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Q&A Platform</title>
-    <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🐛</text></svg>" />
+    <meta name="description" content="PippaQ — A premium semantic Q&A platform with an intelligent FAQ knowledge base, community-driven answers, and a gamified QP reputation economy." />
+    <meta name="theme-color" content="#4f46e5" />
+    <title>PippaQ — Premium Q&A Platform</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Outfit:wght@100..900&display=swap" rel="stylesheet">
+    <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🎓</text></svg>" />
   </head>
   <body>
     <div id="root"></div>

client/src/App.jsx

@@ -1,26 +1,39 @@
 import { Routes, Route, Navigate, useLocation } from 'react-router-dom';
+import { useState, useEffect } from 'react';
 import { useAuth } from './context/AuthContext';
 import Nav from './components/Nav';
+import ErrorBoundary from './components/ErrorBoundary';
+import { ToastProvider } from './components/Toast';
+import GlobalSearch from './components/GlobalSearch';
 
-// Pages
 import LoginPage from './pages/LoginPage';
 import SignupPage from './pages/SignupPage';
 import FAQPage from './pages/FAQPage';
+import FAQEditPage from './pages/FAQEditPage';
 import RTQPage from './pages/RTQPage';
+import RTQDetailPage from './pages/RTQDetailPage';
 import StudentDashboard from './pages/StudentDashboard';
 import SeniorDashboard from './pages/SeniorDashboard';
 import AddFAQPage from './pages/AddFAQPage';
 import RaiseQuestionPage from './pages/RaiseQuestionPage';
 import ProfilePage from './pages/ProfilePage';
 import UserListPage from './pages/UserListPage';
+import UserProfilePage from './pages/UserProfilePage';
 import TrackQuestionPage from './pages/TrackQuestionPage';
 import WorkingHistoryPage from './pages/WorkingHistoryPage';
 import NotificationsPage from './pages/NotificationsPage';
+import QPHistoryPage from './pages/QPHistoryPage';
+import AboutPage from './pages/AboutPage';
 
 function LoadingScreen() {
   return (
-    <div className="min-h-screen flex items-center justify-center bg-surface">
-      <div className="text-muted">Loading...</div>
+    <div className="min-h-screen flex items-center justify-center bg-mesh">
+      <div className="flex flex-col items-center gap-3">
+        <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-accent to-violet-600 flex items-center justify-center animate-pulse">
+          <span className="text-white font-brand font-bold text-lg">P</span>
+        </div>
+        <div className="text-muted text-sm font-medium">Loading...</div>
+      </div>
     </div>
   );
 }
@@ -42,7 +55,6 @@ function PublicOnly({ children }) {
   return children;
 }
 
-// Dashboard renders correct page based on role
 function DashboardRoute() {
   const { user, loading } = useAuth();
   if (loading) return <LoadingScreen />;
@@ -51,41 +63,70 @@ function DashboardRoute() {
   return <StudentDashboard />;
 }
 
-const PUBLIC_PATHS = ['/login', '/signup'];
 
-export default function App() {
+// Scroll to top on route change
+function ScrollToTop() {
+  const { pathname } = useLocation();
+  useEffect(() => {
+    window.scrollTo(0, 0);
+  }, [pathname]);
+  return null;
+}
+
+function AppLayout() {
   const location = useLocation();
   const { user, refreshUser } = useAuth();
-  const isPublic = PUBLIC_PATHS.includes(location.pathname);
+  const [searchOpen, setSearchOpen] = useState(false);
+
+  useEffect(() => {
+    const onKey = (e) => {
+      if (e.key === '/' && !e.ctrlKey && !e.metaKey && document.activeElement.tagName !== 'INPUT' && document.activeElement.tagName !== 'TEXTAREA') {
+        e.preventDefault();
+        setSearchOpen(true);
+      }
+    };
+    window.addEventListener('keydown', onKey);
+    return () => window.removeEventListener('keydown', onKey);
+  }, []);
 
   return (
     <div className="min-h-screen bg-surface">
-      {user && !isPublic && <Nav refreshUser={refreshUser} />}
-      <Routes>
-        {/* Public */}
-        <Route path="/login"  element={<PublicOnly><LoginPage /></PublicOnly>} />
-        <Route path="/signup" element={<PublicOnly><SignupPage /></PublicOnly>} />
-
-        {/* Dashboard — role-aware */}
-        <Route path="/dashboard" element={<DashboardRoute />} />
-
-        {/* Protected — all authenticated users */}
-        <Route path="/faq"           element={<ProtectedRoute><FAQPage /></ProtectedRoute>} />
-        <Route path="/rtq"           element={<ProtectedRoute><RTQPage /></ProtectedRoute>} />
-        <Route path="/profile"       element={<ProtectedRoute><ProfilePage /></ProtectedRoute>} />
-        <Route path="/users"         element={<ProtectedRoute><UserListPage /></ProtectedRoute>} />
-        <Route path="/track"         element={<ProtectedRoute><TrackQuestionPage /></ProtectedRoute>} />
-        <Route path="/history"       element={<ProtectedRoute><WorkingHistoryPage /></ProtectedRoute>} />
-        <Route path="/notifications" element={<ProtectedRoute><NotificationsPage /></ProtectedRoute>} />
-
-        {/* Role-restricted */}
-        <Route path="/raise-question" element={<ProtectedRoute allowedRoles={['student', 'moderator']}><RaiseQuestionPage /></ProtectedRoute>} />
-        <Route path="/add-faq"        element={<ProtectedRoute allowedRoles={['senior', 'admin']}><AddFAQPage /></ProtectedRoute>} />
-
-        {/* Redirects */}
-        <Route path="/"  element={<Navigate to="/login" replace />} />
-        <Route path="*"  element={<Navigate to="/login" replace />} />
-      </Routes>
+      <ScrollToTop />
+      {user && !['/login', '/signup'].includes(location.pathname) && <Nav refreshUser={refreshUser} />}
+      {searchOpen && <GlobalSearch onClose={() => setSearchOpen(false)} />}
+      <div key={location.pathname} className="page-enter">
+        <Routes>
+          <Route path="/login" element={<PublicOnly><LoginPage /></PublicOnly>} />
+          <Route path="/signup" element={<PublicOnly><SignupPage /></PublicOnly>} />
+          <Route path="/dashboard" element={<DashboardRoute />} />
+          <Route path="/faq" element={<FAQPage />} />
+          <Route path="/about" element={<AboutPage />} />
+          <Route path="/faq/edit/:id" element={<ProtectedRoute allowedRoles={['senior', 'admin']}><FAQEditPage /></ProtectedRoute>} />
+          <Route path="/rtq" element={<ProtectedRoute><RTQPage /></ProtectedRoute>} />
+          <Route path="/rtq/:id" element={<ProtectedRoute><RTQDetailPage /></ProtectedRoute>} />
+          <Route path="/profile" element={<ProtectedRoute><ProfilePage /></ProtectedRoute>} />
+          <Route path="/users" element={<ProtectedRoute><UserListPage /></ProtectedRoute>} />
+          <Route path="/users/:id" element={<ProtectedRoute><UserProfilePage /></ProtectedRoute>} />
+          <Route path="/track" element={<ProtectedRoute allowedRoles={['student', 'moderator']}><TrackQuestionPage /></ProtectedRoute>} />
+          <Route path="/history" element={<ProtectedRoute><WorkingHistoryPage /></ProtectedRoute>} />
+          <Route path="/notifications" element={<ProtectedRoute><NotificationsPage /></ProtectedRoute>} />
+          <Route path="/qp-history" element={<ProtectedRoute><QPHistoryPage /></ProtectedRoute>} />
+          <Route path="/raise-question" element={<ProtectedRoute allowedRoles={['student', 'moderator']}><RaiseQuestionPage /></ProtectedRoute>} />
+          <Route path="/add-faq" element={<ProtectedRoute allowedRoles={['senior', 'admin']}><AddFAQPage /></ProtectedRoute>} />
+          <Route path="/" element={<Navigate to="/faq" replace />} />
+          <Route path="*" element={<Navigate to="/faq" replace />} />
+        </Routes>
+      </div>
     </div>
   );
-}
+}
+
+export default function App() {
+  return (
+    <ErrorBoundary>
+      <ToastProvider>
+        <AppLayout />
+      </ToastProvider>
+    </ErrorBoundary>
+  );
+}

client/src/components/AnswerCard.jsx

@@ -31,10 +31,13 @@ export default function AnswerCard({ answer, onUpvote, showModeratorControls = f
             <p className="text-xs text-muted">
               Answered by <span className="font-medium text-primary">{answer.userId.name}</span>
               {answer.userId?.role === 'moderator' && (
-                <span className="ml-1 text-xs bg-purple-100 text-purple-700 px-1.5 py-0.5 rounded">Moderator</span>
+                <span className="ml-1 text-xs bg-blue-100 text-blue-700 px-1.5 py-0.5 rounded">Moderator</span>
               )}
               {answer.userId?.role === 'senior' && (
-                <span className="ml-1 text-xs bg-blue-100 text-blue-700 px-1.5 py-0.5 rounded">Senior</span>
+                <span className="ml-1 text-xs bg-purple-100 text-purple-700 px-1.5 py-0.5 rounded">Senior</span>
+              )}
+              {answer.userId?.role === 'admin' && (
+                <span className="ml-1 text-xs bg-purple-100 text-purple-700 px-1.5 py-0.5 rounded">Admin</span>
               )}
             </p>
           )}

client/src/components/Avatar.jsx

@@ -0,0 +1,43 @@
+import { useMemo } from 'react';
+
+const ROLE_COLORS = {
+  student:   'bg-slate-500',
+  moderator: 'bg-blue-600',
+  senior:    'bg-purple-600',
+  admin:     'bg-violet-600',
+};
+
+const ROLE_GRADIENTS = {
+  student:   'from-slate-400 to-slate-600',
+  moderator: 'from-blue-500 to-blue-700',
+  senior:    'from-purple-500 to-violet-600',
+  admin:     'from-violet-500 to-purple-700',
+};
+
+const SIZE_CLASSES = {
+  xs:  'avatar-xs',
+  sm:  'avatar-sm',
+  md:  'avatar-md',
+  lg:  'avatar-lg',
+  xl:  'avatar-xl',
+};
+
+export default function Avatar({ name, role, size = 'md', className = '', gradient = false }) {
+  const initial = useMemo(() => {
+    if (!name) return '?';
+    return name.charAt(0).toUpperCase();
+  }, [name]);
+
+  const bgClass = gradient
+    ? `bg-gradient-to-br ${ROLE_GRADIENTS[role] || ROLE_GRADIENTS.student}`
+    : ROLE_COLORS[role] || ROLE_COLORS.student;
+
+  return (
+    <div
+      className={`${SIZE_CLASSES[size] || SIZE_CLASSES.md} ${bgClass} ${className}`}
+      title={name || 'User'}
+    >
+      {initial}
+    </div>
+  );
+}