- {/* Logo & Navigation */}
-
-
-
-
-
-
- {/* User Profile & Notifications */}
-
-
-
-
-
-
- JH
-
+interface NavbarProps {
+ userType: "mentor" | "student"; // Determines dashboard type
+ userName: string; // User's name
+}
+
+const Navbar: React.FC
= ({ userType, userName }) => {
+ const [isStudentPopupOpen, setIsStudentPopupOpen] = useState(false);
+ const [isLogoutPopupOpen, setIsLogoutPopupOpen] = useState(false);
+ const logoutPopupRef = useRef(null);
+
+ const openStudentPopup = () => setIsStudentPopupOpen(true);
+ const closeStudentPopup = () => setIsStudentPopupOpen(false);
+ const toggleLogoutPopup = () => setIsLogoutPopupOpen((prev) => !prev);
+
+ const handleLogout = () => {
+ // Clear authentication data
+ localStorage.removeItem("authToken");
+ sessionStorage.removeItem("authToken");
+ document.cookie = "authToken=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
+
+ // Redirect to login page
+ window.location.href = "/login";
+ };
+
+ // Close logout popup when clicking outside
+ useEffect(() => {
+ const handleClickOutside = (event: MouseEvent) => {
+ if (
+ logoutPopupRef.current &&
+ event.target instanceof Node &&
+ !logoutPopupRef.current.contains(event.target)
+ ) {
+ setIsLogoutPopupOpen(false);
+ }
+ };
+
+ document.addEventListener("mousedown", handleClickOutside);
+ return () => {
+ document.removeEventListener("mousedown", handleClickOutside);
+ };
+ }, []);
+
+ return (
+
+ {/* Logo & Navigation */}
+
+
+ {/* Show navigation only for mentors */}
+ {userType === "mentor" && (
+
+ )}
+
+
+ {/* User Profile & Notifications */}
+
+
+
+
+
{userName}
+
+ {userType === "mentor" ? "Senior Mentor" : "Student"}
+
+
+
+
+ {userName.charAt(0)}
+
+ {/* Logout Popup */}
+ {isLogoutPopupOpen && (
+
+
+
+
Are you sure you want to logout?
+
+
+
+
+
+ )}
+
+
+ {/* Conditionally render the StudentDetailsPopup */}
+ {isStudentPopupOpen &&
}
-
- );
+ );
};
export default Navbar;
diff --git a/server/src/components/recentReviews.tsx b/server/src/components/recentReviews.tsx
new file mode 100644
index 0000000..14d3186
--- /dev/null
+++ b/server/src/components/recentReviews.tsx
@@ -0,0 +1,178 @@
+import React, { useMemo, useState, useRef, useEffect } from "react";
+import { ExternalLink, StickyNoteIcon, Search, CirclePlus, FilterIcon, ArrowDownUpIcon } from "lucide-react";
+import { Input } from "@/components/ui/input";
+
+type Review = {
+ id: number;
+ status: "approved" | "rejected" | "pending";
+ message: string;
+ date: string;
+};
+
+const mockReviews: Review[] = [
+ { id: 1, status: "approved", message: "Made minor updates and improvements.", date: "03/13/2025" },
+ { id: 2, status: "rejected", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+ { id: 3, status: "approved", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+ { id: 4, status: "pending", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+ { id: 5, status: "rejected", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+ { id: 6, status: "pending", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+ { id: 7, status: "approved", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+ { id: 8, status: "rejected", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+ { id: 9, status: "rejected", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+ { id: 10, status: "pending", message: "Designed wireframe to enhance the system’s UI/UX.", date: "03/12/2025" },
+];
+
+interface RecentReviewsProps {
+ onAddNewActivity: () => void;
+ onUpdateActivity: () => void;
+}
+
+const RecentReviews: React.FC
= ({ onAddNewActivity, onUpdateActivity }) => {
+ const [filter, setFilter] = useState<"all" | "approved" | "rejected" | "pending">("all");
+ const [searchQuery, setSearchQuery] = useState("");
+ const [isOpen, setIsOpen] = useState(false);
+ const menuRef = useRef(null);
+
+
+ // Close flyout when clicking outside
+ useEffect(() => {
+ const handleClickOutside = (event: MouseEvent) => {
+ if (menuRef.current && !menuRef.current.contains(event.target as Node)) {
+ setIsOpen(false);
+ }
+ };
+
+ document.addEventListener("mousedown", handleClickOutside);
+ return () => {
+ document.removeEventListener("mousedown", handleClickOutside);
+ };
+ }, []);
+
+ // Memoize filtered submissions to prevent re-renders
+ const filteredSubmissions = useMemo(
+ () =>
+ mockReviews.filter(
+ (sub) =>
+ (filter === "all" || sub.status === filter) &&
+ (sub.message.toLowerCase().includes(searchQuery.toLowerCase()) ||
+ sub.date.toLowerCase().includes(searchQuery.toLowerCase()))
+ ),
+ [filter, searchQuery]
+ );
+
+ const filteredReviews = filter === "all" ? mockReviews : mockReviews.filter((r) => r.status === filter);
+
+ return (
+
+
+
+
+
All Recent Reviews
+
+
+
+
+ {/* Search Input */}
+
+
+ setSearchQuery(e.target.value)}
+ />
+
+
+
+
+
+ {/* Filter Buttons */}
+
+
+
+
+
+
+
+
+ {isOpen && (
+
+
+
+
+
+ )}
+
+
+
+
+
+
+
+ {filteredReviews.length > 0 ? (
+ filteredReviews.map((review) => (
+
+
+ {review.status === "approved" ? (
+
✔
+ ) : review.status === "rejected" ? (
+
❌
+ ) :
⏳}
+
{review.message}
+
+
{review.date}
+
+
+ ))
+ ) : (
+
No records found
+ )}
+
+
+ {/* Navbar */}
+
+
+ {/* Main Content */}
+
+ {/* Left Section */}
+
+
+
+
+
+ {/* Right Section */}
+
+
+
+ {/* Footer */}
+
+
+ {/* Modals */}
+
+
+
");
+ };
+
+ const handleSendMessage = async () => {
+ if (aiInput.trim() === "") return;
+
+ if (editingIndex !== null) {
+ const newMessages = [...messages];
+ newMessages[editingIndex] = aiInput;
+ if (newMessages[editingIndex + 1]) {
+ newMessages.splice(editingIndex + 1, 1);
+ }
+ setMessages(newMessages);
+ setEditingIndex(null);
+ await handleAISuggestion();
+ } else {
+ setMessages((prev) => [...prev, aiInput]);
+ await handleAISuggestion();
+ }
+ setAiInput("");
+ };
+
+ const handleKeyPress = (e: React.KeyboardEvent) => {
+ if (e.key === "Enter") {
+ e.preventDefault();
+ handleSendMessage();
+ }
+ };
+
+ const handleUseThis = (message: string) => {
+ setDescription(message);
+ };
+
+ const handleRegenerate = async (index: number) => {
+ try {
+ const userMessage = messages[index - 1];
+ const res = await fetch("/api/generateAiResponse", {
+ method: "POST",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify({ userInput: userMessage }),
+ });
+
+ const data = await res.json();
+ if (data.aiResponse) {
+ const newMessages = [...messages];
+ newMessages[index] = data.aiResponse;
+ setMessages(newMessages);
+ }
+ } catch (error) {
+ console.error("Error regenerating response:", error);
+ }
+ };
+
+ const handleEditMessage = (index: number) => {
+ setAiInput(messages[index - 1]);
+ setEditingIndex(index - 1);
+ };
+
+ return (
+
+
+ {/* Main Form Section */}
+
+
+ {/* Close Button */}
+
+
+
+ {/* Added gray background container */}
+
+
+
+
+
+ setTitle(e.target.value)}
+ placeholder="Enter activity title"
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* Submit, cancel Buttons */}
+
+
+
+
+
+ {/* AI Trigger Button */}
+
+
+ {/* AI Flyout Menu */}
+ {showAISection && (
+
+
+
+
+
+ 🤖 AI Description Assistant
+
+
+
+ {messages.map((msg, index) => (
+
+ {index % 2 === 0 &&
}
+
+
+ {msg}
+ {index % 2 === 0 && index !== 0 && ( // Added index !== 0 condition
+
+
+ {/* Use this */}
+
+
+
+
+ Use this message
+
+
+ {/* Regenerate */}
+
+
+
+
+ Regenerate
+
+
+ {/* Edit */}
+
+
+
+
+ Edit message
+
+
+ {index % 2 !== 0 &&
}
+
+ ))}
+
+
+
+
+ setAiInput(e.target.value)}
+ onKeyDown={handleKeyPress}
+ placeholder="Describe your activity..."
+ className="pr-10" // Add right padding to prevent text underlap
+ />
+
+
+
+
+
+ )}
+