refactor: move feed api to the app router

src/app/api/feed/route.ts

@@ -1,11 +1,8 @@
-import type { NextApiRequest, NextApiResponse } from "next";
 import { fetchFeedData } from "@/lib/feed.ts";
+import { type NextRequest, NextResponse } from "next/server";
 
-export default async function handler(
-  req: NextApiRequest,
-  res: NextApiResponse,
-) {
-  const { filter, page = "0" } = req.query as any as {
+export async function GET(req: NextRequest) {
+  const { filter, page = "0" } = req.nextUrl.searchParams as any as {
     filter: "latest" | "day" | "week" | "month";
     page: string;
   };
@@ -29,10 +26,8 @@ export default async function handler(
     // Fetch data using the fetchFeedData function
     const dataResponse = await fetchFeedData(queryParams);
 
-    // Send the response back
-    res.status(200).json(dataResponse);
+    return NextResponse.json(dataResponse);
   } catch (error) {
-    // Handle any errors
-    res.status(500).json({ error: "Internal Server Error" });
+    return NextResponse.json({ error: "Internal Server Error" });
   }
 }

src/components/Feed.tsx

@@ -5,7 +5,7 @@ import * as ScrollArea from "@radix-ui/react-scroll-area";
 import { useState, useEffect } from "react";
 import { Article } from "../lib/prisma.ts";
 import useSWR from "swr";
-import { ApiResponse, fetchFeedData } from "../lib/feed.ts";
+import { ApiResponse } from "../lib/feed.ts";
 
 const fetcher = (url: string) => fetch(url).then((r) => r.json());
 
@@ -39,7 +39,9 @@ const Feed = ({
       revalidateOnReconnect: false,
       shouldRetryOnError: false,
       fallbackData:
-        currentPage === 0 ? { data: initialData, current: 0, next: 5 } : undefined, // Use initialData only for the first page
+        currentPage === 0
+          ? { data: initialData, current: 0, next: 5 }
+          : undefined, // Use initialData only for the first page
     },
   );