From 32e0e99c681303fae5f1afe613c2cd5ad9e7478f Mon Sep 17 00:00:00 2001
From: Jashanpreetkaur <ecojas1212@gmail.com>
Date: Fri, 19 Jun 2026 13:35:27 +0530
Subject: [PATCH] feat:add subject search functionality

---
 app/components/subjects.tsx | 28 +++++++++++++++++++++++++++-
 refactor_reading_time.js    |  1 +
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/app/components/subjects.tsx b/app/components/subjects.tsx
index 588c63a..d1df90a 100644
--- a/app/components/subjects.tsx
+++ b/app/components/subjects.tsx
@@ -1,5 +1,6 @@
 "use client";
 import Link from "next/link";
+import { useState } from "react";
 
 const subjects = {
   "Semester-1": [
@@ -132,6 +133,7 @@ const subjectCodes: Record<string, string> = {
 const available = ["ep", "c", "em1", "em2", "oops", "dsc", "coa", "os", "ml", "dops", "cd", "cle", "ec", "dbms", "bme", "cns", "vlsi", "mb"];
 
 export default function SubjectsSection() {
+  const [searchTerm, setSearchTerm] = useState("");
   return (
     <section id="subjects" className="px-6 pb-12 md:pt-12 text-center scroll-mt-20">
       <h2
@@ -146,17 +148,31 @@ export default function SubjectsSection() {
       >
         Explore Subjects divided Semester-wise for your convenience.
       </p>
+     <div className="px-6 mb-8">
+  <input
+    type="text"
+    placeholder="Search subjects..."
+    value={searchTerm}
+    onChange={(e) => setSearchTerm(e.target.value)}
+    className="w-full max-w-xl p-3 border-2 border-[#d2b48c] rounded-lg text-black text-lg"
+  />
+</div> 
       <div
         className="space-y-10 px-6 py-6 text-3xl flex flex-col"
         style={{ fontFamily: "'Rockwell', 'Serif', serif" }}
       >
         {Object.entries(subjects).map(([semester, list]) => {
+  const filteredList = list.filter((subj) =>
+    subj.toLowerCase().includes(searchTerm.toLowerCase())
+  );
+
+  if (filteredList.length === 0) return null;
           const semCode = semester.toLowerCase().replace("semester-", "sem");
           return (
             <div key={semester}>
               <h3 className="text-3xl flex mb-4">{semester}</h3>
               <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
-                {list.map((subj) => {
+              {filteredList.map((subj) =>   {
                   const code = subjectCodes[subj];
                   const href = `/${semCode}/${code}/ch0`;
                   const isAvailable = available.includes(code);
@@ -190,6 +206,16 @@ export default function SubjectsSection() {
         })}
       </div>
 
+{Object.values(subjects)
+  .flat()
+  .filter((subj) =>
+    subj.toLowerCase().includes(searchTerm.toLowerCase())
+  ).length === 0 &&
+  searchTerm && (
+    <p className="text-xl mt-6 text-center">
+      No subjects found.
+    </p>
+)}
     </section>
   );
 }
diff --git a/refactor_reading_time.js b/refactor_reading_time.js
index 8a835ff..ffb2091 100644
--- a/refactor_reading_time.js
+++ b/refactor_reading_time.js
@@ -43,4 +43,5 @@ pageFiles.forEach(file => {
         console.log('Updated:', file);
     }
   }
+  
 });