feat: Added year and semester fields in frontend (TODO Backend), fixed course grid

Devansh-bit · Devansh-bit · commit 0ba0ea57250c · 2025-10-16T12:13:17.000+05:30
diff --git a/backend/.sqlx/query-a52a088f49659fd7129d0cef2fd2b7f981f5641a15933072432cbd1d5069b84f.json b/backend/.sqlx/query-a52a088f49659fd7129d0cef2fd2b7f981f5641a15933072432cbd1d5069b84f.json
diff --git a/backend/src/api/handlers/auth.rs b/backend/src/api/handlers/auth.rs
@@ -102,8 +102,7 @@ pub async fn google_auth_callback(
 
     let token_data =
         decode::<GoogleClaims>(&payload.token, decoding_key, &validation).map_err(|e| {
-            tracing::error!("Token validation error: {}", e);
-            crate::api::errors::AuthError::InvalidToken("Token validation failed".to_string())
+            crate::api::errors::AuthError::InvalidToken(format!("Token validation failed: {}", e))
         })?;
 
     let claims = token_data.claims;
diff --git a/backend/src/db/handlers/notes.rs b/backend/src/db/handlers/notes.rs
@@ -155,6 +155,7 @@ pub async fn search_notes_by_query(
         LEFT JOIN
             votes user_vote ON n.id = user_vote.note_id AND user_vote.user_id = $2
         WHERE course_name ILIKE $1 OR course_code ILIKE $1
+        ORDER BY COALESCE(upvote_counts.count, 0) DESC, n.created_at DESC
         "#,
         search_term,
         current_user_id.as_ref()
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/package.json b/frontend/package.json
@@ -33,6 +33,6 @@
     "tailwindcss": "^3.4.4",
     "typescript": "~5.8.3",
     "typescript-eslint": "^8.39.1",
-    "vite": "^7.1.2"
+    "vite": "^7.1.10"
   }
 }
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -61,13 +61,13 @@ const AppContent: React.FC = () => {
             <AuthProvider onSignIn={loadNotes}>
                 <Header onNoteUploaded={handleNoteUploaded} />
 
-                <main className="flex-1 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
-                    <div className="mb-8">
+                <main className="flex-1 w-full px-6 sm:px-8 lg:px-12 xl:px-16 py-8">
+                    <div className="mb-8 max-w-3xl mx-auto">
                         <SearchBar searchQuery={searchQuery} onSearchChange={handleSearchChange} />
                     </div>
 
                     {error && (
-                        <div className="mb-6 p-4 bg-red-900 border border-red-700 rounded-lg text-red-300">
+                        <div className="mb-6 p-4 bg-red-900 border border-red-700 rounded-lg text-red-300 max-w-3xl mx-auto">
                             {error}
                         </div>
                     )}
@@ -91,4 +91,4 @@ const App: React.FC = () => {
     return <AppContent />;
 };
 
-export default App;
+export default App;
diff --git a/frontend/src/components/CourseCard.tsx b/frontend/src/components/CourseCard.tsx
@@ -1,11 +1,11 @@
 // components/CourseCard.tsx
-import React, { useState } from 'react';
-import { Download, ThumbsUp, ThumbsDown, Edit, FileText } from 'lucide-react';
-import { useSignInFlow } from '../hooks/useSignInFlow';
+import React, {useState} from 'react';
+import {Download, Edit, FileText, ThumbsUp} from 'lucide-react';
+import {useSignInFlow} from '../hooks/useSignInFlow';
 import SignInModal from './SignInModal';
-import type { CourseCardProps, VoteType } from '../types';
-import { notesApi } from '../api/notesApi';
-import { useAuth } from '../contexts/AuthContext';
+import type {CourseCardProps, VoteType} from '../types';
+import {notesApi} from '../api/notesApi';
+import {useAuth} from '../contexts/AuthContext';
 
 const CourseCard: React.FC<CourseCardProps> = ({ note }) => {
     const { isAuthenticated, user } = useAuth();
@@ -27,7 +27,7 @@ const CourseCard: React.FC<CourseCardProps> = ({ note }) => {
         convertVoteToString(note.user_vote)
     );
     const [upvoteCount, setUpvoteCount] = useState(note.upvotes || 0);
-    const [downvoteCount, setDownvoteCount] = useState(note.downvotes || 0);
+    // const [downvoteCount, setDownvoteCount] = useState(note.downvotes || 0);
     const [downloadCount, setDownloadCount] = useState(note.downloads || 0);
     const [isVoting, setIsVoting] = useState(false);
     const [imageError, setImageError] = useState(false);
@@ -61,37 +61,36 @@ const CourseCard: React.FC<CourseCardProps> = ({ note }) => {
         return { visibleTags, remainingCount };
     };
 
-    const handleVote = async (voteType: 'upvote' | 'downvote') => {
+    const handleVote = async (voteType: 'upvote') => {
         if (isVoting) return;
 
         requireAuth(voteType, async () => {
             setIsVoting(true);
             const previousVote = userVote;
-            const previousUpvoteCount = upvoteCount;
-            const previousDownvoteCount = downvoteCount;
+            // const previousDownvoteCount = downvoteCount;
 
             try {
-                let actualVoteType: VoteType = userVote === voteType ? 'remove' : voteType;
+                const actualVoteType: VoteType = userVote === voteType ? 'remove' : voteType;
 
                 if (actualVoteType === 'remove') {
                     setUserVote(null);
                     if (previousVote === 'upvote') setUpvoteCount(prev => Math.max(0, prev - 1));
-                    else if (previousVote === 'downvote') setDownvoteCount(prev => Math.max(0, prev - 1));
+                    // else if (previousVote === 'downvote') setDownvoteCount(prev => Math.max(0, prev - 1));
                 } else if (actualVoteType === 'upvote') {
                     setUserVote('upvote');
                     setUpvoteCount(prev => prev + 1);
-                    if (previousVote === 'downvote') setDownvoteCount(prev => Math.max(0, prev - 1));
+                    // if (previousVote === 'downvote') setDownvoteCount(prev => Math.max(0, prev - 1));
                 } else if (actualVoteType === 'downvote') {
                     setUserVote('downvote');
-                    setDownvoteCount(prev => prev + 1);
+                    // setDownvoteCount(prev => prev + 1);
                     if (previousVote === 'upvote') setUpvoteCount(prev => Math.max(0, prev - 1));
                 }
 
                 await notesApi.voteOnNote(note.id, actualVoteType);
             } catch (error) {
                 setUserVote(previousVote);
-                setUpvoteCount(previousUpvoteCount);
-                setDownvoteCount(previousDownvoteCount);
+                setUpvoteCount(upvoteCount);
+                // setDownvoteCount(previousDownvoteCount);
                 console.error('Vote failed:', error);
                 alert('Failed to vote. Please try again.');
             } finally {
@@ -182,7 +181,7 @@ const CourseCard: React.FC<CourseCardProps> = ({ note }) => {
                             <span className="text-gray-600 text-xs italic">No tags provided</span>
                         )}
                     </div>
-                    <div className="mb-4 h-5">
+                    <div className="mb-3 h-5">
                         {note.professor_names && note.professor_names.length > 0 ? (
                             <p className="text-sm text-text-muted flex items-center">
                                 <span className="text-gray-600 mr-1">Prof:</span>
@@ -196,6 +195,11 @@ const CourseCard: React.FC<CourseCardProps> = ({ note }) => {
                             </p>
                         )}
                     </div>
+                    <div className="mb-4">
+                        <p className="text-xs text-gray-500">
+                            By: <span className="text-text-muted">{note.uploader_user.full_name}</span>
+                        </p>
+                    </div>
                     <div className="flex items-center justify-between pt-3 border-t border-border">
                         <div className="flex items-center space-x-4">
                             <button
@@ -245,4 +249,4 @@ const CourseCard: React.FC<CourseCardProps> = ({ note }) => {
     );
 };
 
-export default CourseCard;
+export default CourseCard;
diff --git a/frontend/src/components/CourseGrid.tsx b/frontend/src/components/CourseGrid.tsx
@@ -14,13 +14,12 @@ const CourseGrid: React.FC<CourseGridProps> = ({ notes }) => {
 
     return (
         <div className="w-full max-w-full">
-            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 w-full">
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6 w-full">
                 {notes.map((note) => (
                     <CourseCard key={note.id} note={note} />
                 ))}
             </div>
         </div>
     );
 };
-
 export default CourseGrid;
diff --git a/frontend/src/components/UploadModal.tsx b/frontend/src/components/UploadModal.tsx
@@ -13,6 +13,8 @@ interface UploadModalProps {
 interface FormData {
   courseName: string;
   courseCode: string;
+  year: string;
+  semester: 'Autumn' | 'Spring';
   description: string;
   professorNames: string;
   tags: string;
@@ -23,6 +25,8 @@ const UploadModal: React.FC<UploadModalProps> = ({ isOpen, onClose, onSuccess })
   const [formData, setFormData] = useState<FormData>({
     courseName: '',
     courseCode: '',
+    year: new Date().getFullYear().toString(),
+    semester: 'Autumn',
     description: '',
     professorNames: '',
     tags: '',
@@ -92,6 +96,8 @@ const UploadModal: React.FC<UploadModalProps> = ({ isOpen, onClose, onSuccess })
       const uploadFormData = new FormData();
       uploadFormData.append('course_name', formData.courseName.trim());
       uploadFormData.append('course_code', formData.courseCode.trim());
+      uploadFormData.append('year', formData.year);
+      uploadFormData.append('semester', formData.semester);
       if (formData.description.trim()) uploadFormData.append('description', formData.description.trim());
       if (formData.professorNames.trim()) uploadFormData.append('professor_names', formData.professorNames.trim());
       if (formData.tags.trim()) uploadFormData.append('tags', formData.tags.trim());
@@ -100,7 +106,16 @@ const UploadModal: React.FC<UploadModalProps> = ({ isOpen, onClose, onSuccess })
       const newNote = await notesApi.uploadNote(uploadFormData);
       onSuccess(newNote);
       onClose();
-      setFormData({ courseName: '', courseCode: '', description: '', professorNames: '', tags: '', file: null });
+      setFormData({
+        courseName: '',
+        courseCode: '',
+        year: new Date().getFullYear().toString(),
+        semester: 'Autumn',
+        description: '',
+        professorNames: '',
+        tags: '',
+        file: null
+      });
     } catch (err) {
       setError(err instanceof Error ? err.message : 'Upload failed. Please try again.');
     } finally {
@@ -109,7 +124,16 @@ const UploadModal: React.FC<UploadModalProps> = ({ isOpen, onClose, onSuccess })
   };
 
   const resetAndClose = () => {
-    setFormData({ courseName: '', courseCode: '', description: '', professorNames: '', tags: '', file: null });
+    setFormData({
+      courseName: '',
+      courseCode: '',
+      year: new Date().getFullYear().toString(),
+      semester: 'Autumn',
+      description: '',
+      professorNames: '',
+      tags: '',
+      file: null
+    });
     setError(null);
     onClose();
   };
@@ -158,6 +182,50 @@ const UploadModal: React.FC<UploadModalProps> = ({ isOpen, onClose, onSuccess })
               />
             </div>
 
+            <div className="grid grid-cols-2 gap-4">
+              <div>
+                <label className="block text-sm font-medium text-text-muted mb-2">Year *</label>
+                <select
+                    value={formData.year}
+                    onChange={(e) => handleInputChange('year', e.target.value)}
+                    className="w-full px-3 py-2 border border-border bg-surface rounded-lg focus:ring-2 focus:ring-primary focus:border-transparent"
+                    required
+                >
+                  {Array.from({ length: 50 }, (_, i) => new Date().getFullYear() - i).map(year => (
+                      <option key={year} value={year}>{year}</option>
+                  ))}
+                </select>
+              </div>
+
+              <div>
+                <label className="block text-sm font-medium text-text-muted mb-2">Semester *</label>
+                <div className="flex space-x-4 mt-2">
+                  <label className="flex items-center space-x-2 cursor-pointer">
+                    <input
+                        type="radio"
+                        name="semester"
+                        value="Autumn"
+                        checked={formData.semester === 'Autumn'}
+                        onChange={(e) => handleInputChange('semester', e.target.value)}
+                        className="w-4 h-4 text-primary focus:ring-2 focus:ring-primary"
+                    />
+                    <span className="text-text-base">Autumn</span>
+                  </label>
+                  <label className="flex items-center space-x-2 cursor-pointer">
+                    <input
+                        type="radio"
+                        name="semester"
+                        value="Spring"
+                        checked={formData.semester === 'Spring'}
+                        onChange={(e) => handleInputChange('semester', e.target.value)}
+                        className="w-4 h-4 text-primary focus:ring-2 focus:ring-primary"
+                    />
+                    <span className="text-text-base">Spring</span>
+                  </label>
+                </div>
+              </div>
+            </div>
+
             <div>
               <label className="block text-sm font-medium text-text-muted mb-2">Description</label>
               <textarea
@@ -249,4 +317,4 @@ const UploadModal: React.FC<UploadModalProps> = ({ isOpen, onClose, onSuccess })
   );
 };
 
-export default UploadModal;
+export default UploadModal;
diff --git a/frontend/src/types.ts b/frontend/src/types.ts

Original file line number	Diff line number	Diff line change
`@@ -33,6 +33,6 @@`
`33`	`33`	`"tailwindcss": "^3.4.4",`
`34`	`34`	`"typescript": "~5.8.3",`
`35`	`35`	`"typescript-eslint": "^8.39.1",`
`36`		`- "vite": "^7.1.2"`
	`36`	`+ "vite": "^7.1.10"`
`37`	`37`	`}`
`38`	`38`	`}`