@@ -13,7 +19,7 @@ const CommunitySection = () => {
-
500+
+{}+
Expert Contributors
diff --git a/frontend/edu-connect/src/app/_partials/FeaturedCourses.tsx b/frontend/edu-connect/src/app/_partials/FeaturedCourses.tsx
index c9985e1..b3d5b93 100644
--- a/frontend/edu-connect/src/app/_partials/FeaturedCourses.tsx
+++ b/frontend/edu-connect/src/app/_partials/FeaturedCourses.tsx
@@ -1,7 +1,11 @@
import React from 'react';
import CourseCard from '@/components/elements/CourseCard';
+import useSWR from 'swr';
+import { APP_BASE_URL } from '@/utils/constants';
+import { defaultFetcher } from '@/helpers/fetch.helper';
const FeaturedCourses = () => {
+ const { data : CourseList } = useSWR(APP_BASE_URL + '' , defaultFetcher)
const courses = [
{
id: 1,
@@ -71,6 +75,7 @@ const FeaturedCourses = () => {
return (
+
diff --git a/frontend/edu-connect/src/app/auth/login/_partials/LoginForm.tsx b/frontend/edu-connect/src/app/auth/login/_partials/LoginForm.tsx
index ab761ef..16a4ea8 100644
--- a/frontend/edu-connect/src/app/auth/login/_partials/LoginForm.tsx
+++ b/frontend/edu-connect/src/app/auth/login/_partials/LoginForm.tsx
@@ -1,12 +1,85 @@
-import { useState } from 'react';
+import { FormEvent, useContext, useEffect, useState } from 'react';
import { Card, CardHeader, CardTitle, CardDescription, CardContent } from "@/components/ui/card";
import { Label } from "@/components/ui/label";
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button";
import { EyeIcon, EyeOffIcon } from 'lucide-react';
+import Link from 'next/link';
+import { routes } from '@/lib/routes';
+import { useToast } from '@/hooks/use-toast';
+import { AuthContext } from '@/helpers/context/AuthProvider';
+import { setEduConnectAccessToken } from '@/helpers/token.helper';
+import { useRouter } from 'next/navigation';
export default function LoginForm() {
+ const router = useRouter()
const [showPassword, setShowPassword] = useState(false);
+ const [loading ,setLoading] = useState(false)
+ const [inputValues , setInputValues] = useState>({});
+ const [error , setError] = useState>({});
+
+
+ const { fetchUser , user } = useContext(AuthContext);
+ const { toast } = useToast()
+
+ const handleFormSubmit = async (e : FormEvent) :Promise => {
+ e.preventDefault();
+
+ setLoading(false)
+ const formData = new FormData(e.currentTarget)
+ Object.entries(inputValues).forEach(([key, value]) => {
+ formData.append(key, value);
+ });
+
+ try{
+ const res = await fetch(`${process.env.NEXT_PUBLIC_EDU_CONNECT_HOST}/api/session/create` , {
+ method : 'POST' ,
+ body : formData
+ })
+
+ const data : any = await res.json();
+
+ if(res.status == 200){
+ toast({
+ title : 'Sucessfully logged in !',
+ description : `${data?.message}`,
+ variant : 'success'
+ })
+
+ setInputValues({})
+ fetchUser(data?.session_key)
+ setEduConnectAccessToken(data?.session_key)
+ router.push(routes.INDEX_PAGE)
+ }else{
+ setError(data?.error)
+ toast({
+ title : 'Error logging in !',
+ description : `${data?.message}`,
+ variant : 'success'
+ })
+ }
+ }catch(e : any){
+ toast({
+ title : 'Error logging in !',
+ description : `${error?.message}`,
+ variant : 'success'
+ })
+ }finally{
+ setLoading(false)
+ }
+
+ }
+
+ useEffect(() => {
+ setError({})
+ setInputValues({})
+ },[])
+
+ useEffect(() => {
+ if(user){
+ router.push(routes.INDEX_PAGE)
+ }
+ },[router])
return (
(false)
+ // Centralized state for all form inputs
+ const [inputValues, setInputValues] = useState({
+ profile_picture: user?.profile_picture,
+ firstName: user?.firstName,
+ lastName: user?.lastName,
+ username: user?.username,
+ dob: user?.dob,
+ bio: user?.bio,
+ });
+ const [error , setError] = useState>({})
+
+ // Handle input changes for text, date, and textarea fields
+ const handleInputChange = (field: string, value: string) => {
+ setInputValues((prev) => ({
+ ...prev,
+ [field]: value,
+ }));
+ };
+
+ // Function to handle profile picture upload
+ const handleUploadPicture = async(event: React.ChangeEvent) : Promise => {
+ const file = event.target.files?.[0];
+ if (file) {
+ const reader = new FileReader();
+ reader.onload = () => {
+ setInputValues((prev) => ({
+ ...prev,
+ profile_picture: reader.result as string,
+ }));
+ };
+ const formData = new FormData();
+ formData.append('profile_picture' , file !)
+ try{
+ const res = await fetch(APP_BASE_URL + '/api/profile/update-profile-picture' , {
+ headers : fetchHeader(),
+ method : 'PATCH',
+ body : formData
+ })
+ const data = await res.json()
+ if(res.status == 200){
+ toast({
+ title : 'Sucessfully updated profile picture',
+ description : `${data?.message}`,
+ variant : 'success'
+ })
+ fetchUser(getEduConnectAccessToken() !)
+ }else{
+ toast({
+ title : 'Error updatingprofile image',
+ description : `${data?.message}`,
+ variant : 'destructive'
+ })
+ }
+ }catch(error:any){
+ toast({
+ title : 'Error updatingprofile image',
+ description : `${error?.message}`,
+ variant : 'destructive'
+ })
+ }
+ reader.readAsDataURL(file);
+ }
+ };
+
+ // Function to handle the Save Changes button click
+ const handleSaveChanges = async() :Promise => {
+
+ setLoading(true);
+ setError({});
+
+ const formData = new FormData();
+
+ Object.entries(inputValues).forEach(([key, value] : [key : string , value : any]) => {
+ if(key == 'profile_picture'){
+ if(value instanceof File){
+ formData.append(key, value);
+ }
+ }else{
+ formData.append(key, value);
+ }
+ });
+
+ try{
+ const res = await fetch(APP_BASE_URL + '/api/profile/me' , {
+ headers : fetchHeader(),
+ body : formData,
+ method : 'PUT'
+ })
+ const data = await res.json()
+ if(res.status == 200){
+ toast({
+ title : 'Sucessfully Updated profile',
+ description : `${data?.message}`,
+ variant : 'success'
+ })
+ fetchUser(getEduConnectAccessToken() !)
+ }else{
+ toast({
+ title : 'Sucessfully Updated profile',
+ description : `${data?.message}`,
+ variant : 'success'
+ })
+ }
+ }catch(e : any){
+ toast({
+ title : 'Sucessfully Updated profile',
+ description : `${error?.message}`,
+ variant : 'success'
+ })
+ }finally{
+ setLoading(false)
+ }
+ };
+
+ useEffect(() => {
+ setInputValues(
+ {
+ profile_picture: user?.profile_picture,
+ firstName: user?.firstName,
+ lastName: user?.lastName,
+ username: user?.username,
+ dob: user?.dob?.split('T')?.at(0),
+ bio: user?.bio,
+ }
+ )
+ },[user])
+
+ return (
-
- Profile
-
+
+ Profile
+
-
{/* Profile Picture */}
- {/* Email */}
{/* Name */}
@@ -42,42 +205,68 @@ const UserTabContent = () => {
-
-
-
{/* Bio */}
Featured Courses
diff --git a/frontend/edu-connect/src/app/_partials/HeroSection.tsx b/frontend/edu-connect/src/app/_partials/HeroSection.tsx index d4d2d24..6888b7e 100644 --- a/frontend/edu-connect/src/app/_partials/HeroSection.tsx +++ b/frontend/edu-connect/src/app/_partials/HeroSection.tsx @@ -1,7 +1,11 @@ import LearnWithUS from '@/assets/img/learn-with-us.jpg' +import { defaultFetcher } from '@/helpers/fetch.helper'; +import { APP_BASE_URL } from '@/utils/constants'; import Image from 'next/image'; +import useSWR from "swr" const HeroSection: React.FC = () => { + const {data : TotalUserCount } = useSWR(APP_BASE_URL + '/api/user/count' , defaultFetcher) return (
@@ -36,7 +40,7 @@ const HeroSection: React.FC = () => {
/>
-
10,000+
+{}+
Active Learners
@@ -18,7 +91,7 @@ export default function LoginForm() {
-
diff --git a/frontend/edu-connect/src/app/courses/show/[id]/_partials/CourseGenerateQuestions.tsx b/frontend/edu-connect/src/app/courses/show/[id]/_partials/CourseGenerateQuestions.tsx
new file mode 100644
index 0000000..cd86274
--- /dev/null
+++ b/frontend/edu-connect/src/app/courses/show/[id]/_partials/CourseGenerateQuestions.tsx
@@ -0,0 +1,195 @@
+import React, { useState } from 'react';
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Button } from "@/components/ui/button";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
+import { Label } from "@/components/ui/label";
+import { ScrollArea } from "@/components/ui/scroll-area";
+import { Separator } from "@/components/ui/separator";
+import { Check, X } from "lucide-react";
+
+const QuizGenerator = () => {
+ // Submitted questions history
+ const [submittedQuestions] = useState([
+ {
+ id: 1,
+ question: "What is React's Virtual DOM?",
+ options: [
+ "A complete DOM copy",
+ "A lightweight copy of the DOM",
+ "A browser feature",
+ "A routing system"
+ ],
+ selectedOption: 0, // User selected
+ correctOption: 1, // Correct answer
+ },
+ {
+ id: 2,
+ question: "What hook manages side effects?",
+ options: [
+ "useState",
+ "useReducer",
+ "useEffect",
+ "useContext"
+ ],
+ selectedOption: 2,
+ correctOption: 2,
+ },
+ ]);
+
+ // Unsubmitted questions
+ const [pendingQuestions, setPendingQuestions] = useState([
+ {
+ id: 1,
+ question: "Which of these is a state management library?",
+ options: ["Redux", "Axios", "Lodash", "Moment"],
+ selectedOption: null
+ },
+ {
+ id: 2,
+ question: "What does CSS stand for?",
+ options: [
+ "Computer Style Sheets",
+ "Cascading Style Sheets",
+ "Creative Style Sheets",
+ "Colorful Style Sheets"
+ ],
+ selectedOption: null
+ },
+ ]);
+
+ const [currentQuestionIndex, setCurrentQuestionIndex] = useState(0);
+
+ const handleOptionSelect = (value) => {
+ const updatedQuestions = [...pendingQuestions];
+ updatedQuestions[currentQuestionIndex].selectedOption = parseInt(value);
+ setPendingQuestions(updatedQuestions);
+ };
+
+ const generateQuiz = () => {
+ // Reset selections and shuffle pending questions
+ const shuffledQuestions = [...pendingQuestions].map(q => ({
+ ...q,
+ selectedOption: null
+ }));
+ setPendingQuestions(shuffledQuestions);
+ setCurrentQuestionIndex(0);
+ };
+
+ const handleNext = () => {
+ if (currentQuestionIndex < pendingQuestions.length - 1) {
+ setCurrentQuestionIndex(prev => prev + 1);
+ }
+ };
+
+ const handlePrevious = () => {
+ if (currentQuestionIndex > 0) {
+ setCurrentQuestionIndex(prev => prev - 1);
+ }
+ };
+
+ return (
+
+ {/* Submitted Questions History */}
+
+ );
+};
+
+export default QuizGenerator;
\ No newline at end of file
diff --git a/frontend/edu-connect/src/app/courses/show/[id]/_partials/CourseMedia.tsx b/frontend/edu-connect/src/app/courses/show/[id]/_partials/CourseMedia.tsx
index 4272a22..f30e86c 100644
--- a/frontend/edu-connect/src/app/courses/show/[id]/_partials/CourseMedia.tsx
+++ b/frontend/edu-connect/src/app/courses/show/[id]/_partials/CourseMedia.tsx
@@ -4,34 +4,36 @@ import { CourseData } from "@/helpers/apiSchema/course.schema"
import PDFFlipBook from "./CoursePDFHolder"
import CustomPDFViewer from "./TryPDF"
import DiscussionSection from "@/components/elements/DiscussionForm"
+import QuizGenerator from "./CourseGenerateQuestions"
const CourseMedia : React.FC<{courseData : CourseData}> = ({courseData}) => {
return(
+
+
+ Quiz History
+
+
+
+ {submittedQuestions.map((q, index) => (
+
+
+
+
+ {/* Pending Questions Interface */}
+
+
+
+ ))}
+
+
+ {index < submittedQuestions.length - 1 && {q.question}
+
+ {q.options.map((option, i) => (
+
+
+ {option}
+ {i === q.correctOption && (
+
+ ))}
+
+
+
+ {pendingQuestions.length > 0 ? (
+
+
+
+ Question {currentQuestionIndex + 1} of {pendingQuestions.length}
+
+
+
+
+
+ ) : (
+
+
+ No pending questions available
+
+
+ )}
+
+
+
+ {pendingQuestions[currentQuestionIndex].options.map((option, i) => (
+
+
+
+ + {pendingQuestions[currentQuestionIndex].question} +
+ +
+
+ ))}
+
+
+
+
-
)
}
diff --git a/frontend/edu-connect/src/app/user/profile/_partials/UserTabContent.tsx b/frontend/edu-connect/src/app/user/profile/_partials/UserTabContent.tsx
index 7c98285..46a442c 100644
--- a/frontend/edu-connect/src/app/user/profile/_partials/UserTabContent.tsx
+++ b/frontend/edu-connect/src/app/user/profile/_partials/UserTabContent.tsx
@@ -1,40 +1,203 @@
-import { Button } from "@/components/ui/button"
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
-import { Input } from "@/components/ui/input"
-import { Textarea } from "@/components/ui/textarea"
+import { useContext, useEffect, useState } from "react";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { AuthContext } from "@/helpers/context/AuthProvider";
+import { APP_BASE_URL } from "@/utils/constants";
+import { fetchHeader } from "@/helpers/fetch.helper";
+import { useToast } from "@/hooks/use-toast";
+import { getEduConnectAccessToken } from "@/helpers/token.helper";
+import { Loader } from "lucide-react";
const UserTabContent = () => {
- return(
+
+ const { user , fetchUser } = useContext(AuthContext);
+ const { toast } = useToast();
+ const [loading , setLoading] = useState
- {/* Main Content */}
-
+
-
-
-
-
-
+ Course Content
-
+ {/* Main Content */}
+
+
+
+
+
+
+
- {/* Sidebar */}
- Course Content
+
-
-
-
-
+ {/* Sidebar */}
+
- Discussions
-
+
+
+
+
+
+
-
- Discussions
+- Manage your personal information and profile settings. -
-+ Manage your personal information and profile settings. +
+
- No image
+ {inputValues.profile_picture ? (
+ 
+ ) : (
+ No image
+ )}
+
+
+
+
-
-
+ handleInputChange("firstName", e.target.value)}
+ />
-
+ handleInputChange("lastName", e.target.value)}
+ />
-
+ handleInputChange("username", e.target.value)}
+ error={error?.username}
+ />
- This is your public display name. You can only change this once every 30 days. + This is your public display name. You can only change this once + every 30 days.
- handleInputChange("dob", e.target.value)}
+ error={error?.dob}
/>
-