created PapersCarousel template component

Author: advikgupta

src/app/api/papers/route.ts

@@ -29,7 +29,7 @@ export async function GET(req: NextRequest) {
     if (papers.length === 0) {
       return NextResponse.json(
         { message: "No papers found for the specified subject" },
-        { status: 404 },
+        { status: 200 },
       );
     }
 

src/app/api/user-papers/route.ts

@@ -15,19 +15,27 @@ export async function POST(req: Request) {
       subject: { $in: subjects },
     });
 
-    let transformedPapers = usersPapers.map((paper) => ({
-      subject: paper.subject,
-      slots: [paper.slot],
-    }));
+    const transformedPapers = usersPapers.reduce((acc, paper) => {
+      const existing = acc.find((item) => item.subject === paper.subject);
 
-    // check duplicates
-    transformedPapers = Array.from(
-      new Map(transformedPapers.map((item) => [item.subject, item])).values(),
-    );
+      if (existing) {
+        existing.slots.push(paper.slot);
+      } else {
+        acc.push({ subject: paper.subject, slots: [paper.slot] });
+      }
+
+      return acc;
+    }, []);
 
-    console.log("usersPapers", usersPapers);
+    // check duplicates
+    const seenSubjects = new Set();
+    const uniquePapers = transformedPapers.filter((paper) => {
+      if (seenSubjects.has(paper.subject)) return false;
+      seenSubjects.add(paper.subject);
+      return true;
+    });
 
-    return NextResponse.json(transformedPapers, {
+    return NextResponse.json(uniquePapers, {
       status: 200,
     });
   } catch (error) {

src/components/UsersPapers.tsx renamed to src/components/PapersCarousel.tsx

@@ -15,7 +15,11 @@ import {
 import Autoplay from "embla-carousel-autoplay";
 import { chunkArray } from "@/util/utils";
 
-function UsersPapers() {
+function PapersCarousel({
+  carouselType,
+}: {
+  carouselType: "users" | "default";
+}) {
   const [displayPapers, setDisplayPapers] = useState<IUpcomingPaper[]>([]);
   const [isLoading, setIsLoading] = useState(true);
   const [chunkSize, setChunkSize] = useState<number>(4);
@@ -53,10 +57,19 @@ function UsersPapers() {
   useEffect(() => {
     async function fetchPapers() {
       try {
-        const storedSubjects = JSON.parse(localStorage.getItem("userSubjects"));
         setIsLoading(true);
-        const response = await axios.post("/api/user-papers", storedSubjects);
-        setDisplayPapers(response.data);
+        if (carouselType === "users") {
+          const storedSubjects = JSON.parse(
+            localStorage.getItem("userSubjects"),
+          );
+          const response = await axios.post("/api/user-papers", storedSubjects);
+          setDisplayPapers(response.data);
+        } else {
+          const response = await axios.get<IUpcomingPaper[]>(
+            "/api/upcoming-papers",
+          );
+          setDisplayPapers(response.data);
+        }
       } catch (error) {
         console.error("Failed to fetch papers:", error);
       } finally {
@@ -76,7 +89,7 @@ function UsersPapers() {
   return (
     <div className="px-4">
       <p className="my-8 text-center font-play text-lg font-semibold">
-        Users Papers
+        {carouselType === "users" ? "Your Papers" : "Upcoming Papers"}
       </p>
 
       <div className="">
@@ -117,4 +130,4 @@ function UsersPapers() {
   );
 }
 
-export default UsersPapers;
+export default PapersCarousel;

src/components/Searchbar/searchbar-child.tsx

@@ -25,9 +25,17 @@ function SearchBarChild({
       const response = await axios.get("/api/papers", {
         params: { subject: subjectName },
       });
-      return response.data.papers.length; // Assuming the API returns an array of papers
+
+      if (
+        response.data.message === "No papers found for the specified subject"
+      ) {
+        return 0;
+      }
+
+      return response.data.papers.length;
     } catch (error) {
-      return 0; // Return 0 if there's no papers found or an error occurs
+      console.error("Error fetching paper quantity:", error);
+      return "request-error";
     }
   };
 
@@ -44,7 +52,16 @@ function SearchBarChild({
         .map((item) => item.item)
         .slice(0, 10);
 
-      setSuggestions(filteredSuggestions);
+      const suggestionsWithCount = await Promise.all(
+        filteredSuggestions.map(async (suggestion) => {
+          const count = await fetchPaperQuantityByName(suggestion);
+          return count !== "request-error"
+            ? `${suggestion} (${count})`
+            : suggestion;
+        }),
+      );
+
+      setSuggestions(suggestionsWithCount);
     } else {
       setSuggestions([]);
     }

src/components/StoredPapers.tsx

@@ -1,7 +1,6 @@
 import React from "react";
 import SearchBar from "../Searchbar/searchbar";
-import StoredPapers from "../StoredPapers";
-import UsersPapers from "../UsersPapers";
+import PapersCarousel from "../PapersCarousel";
 
 const Hero = () => {
   return (
@@ -12,8 +11,8 @@ const Hero = () => {
       <div className="px-6">
         <SearchBar />
       </div>
-      <UsersPapers />
-      <StoredPapers />
+      <PapersCarousel carouselType="users" />
+      <PapersCarousel carouselType="default" />
       {/* <div className="hidden lg:flex flex-col items-center whitespace-nowrap text-center">
         <h1 className="font-play text-md">Learn More</h1>
         <Link