feat: integrate React Query for improved data fetching and state management across banking and transactions components

app/api/banking/accounts/route.ts

@@ -1,8 +1,39 @@
-import { NextResponse } from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 import { accountService } from "@/services/account.service";
+import { bankingService } from "@/services/banking.service";
 import { requireAuth } from "@/lib/auth-utils";
 import type { Account } from "@/lib/types";
 
+export async function GET(request: NextRequest) {
+  const authError = await requireAuth();
+  if (authError) return authError;
+
+  try {
+    const { searchParams } = new URL(request.url);
+    const withStats = searchParams.get("withStats") === "true";
+
+    if (withStats) {
+      const accountsWithStats = await bankingService.getAccountsWithStats();
+      return NextResponse.json(accountsWithStats, {
+        headers: {
+          "Cache-Control": "public, s-maxage=60, stale-while-revalidate=120",
+        },
+      });
+    }
+
+    return NextResponse.json(
+      { error: "Invalid request" },
+      { status: 400 },
+    );
+  } catch (error) {
+    console.error("Error fetching accounts:", error);
+    return NextResponse.json(
+      { error: "Failed to fetch accounts" },
+      { status: 500 },
+    );
+  }
+}
+
 export async function POST(request: Request) {
   const authError = await requireAuth();
   if (authError) return authError;

app/api/banking/categories/route.ts

@@ -1,8 +1,39 @@
-import { NextResponse } from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 import { categoryService } from "@/services/category.service";
+import { bankingService } from "@/services/banking.service";
 import { requireAuth } from "@/lib/auth-utils";
 import type { Category } from "@/lib/types";
 
+export async function GET(request: NextRequest) {
+  const authError = await requireAuth();
+  if (authError) return authError;
+
+  try {
+    const { searchParams } = new URL(request.url);
+    const statsOnly = searchParams.get("statsOnly") === "true";
+
+    if (statsOnly) {
+      const stats = await bankingService.getCategoryStats();
+      return NextResponse.json(stats, {
+        headers: {
+          "Cache-Control": "public, s-maxage=60, stale-while-revalidate=120",
+        },
+      });
+    }
+
+    return NextResponse.json(
+      { error: "Invalid request" },
+      { status: 400 },
+    );
+  } catch (error) {
+    console.error("Error fetching category stats:", error);
+    return NextResponse.json(
+      { error: "Failed to fetch category stats" },
+      { status: 500 },
+    );
+  }
+}
+
 export async function POST(request: Request) {
   const authError = await requireAuth();
   if (authError) return authError;

app/api/banking/route.ts

@@ -1,14 +1,30 @@
-import { NextResponse } from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 import { bankingService } from "@/services/banking.service";
 import { requireAuth } from "@/lib/auth-utils";
 
-export async function GET() {
+export async function GET(request: NextRequest) {
   const authError = await requireAuth();
   if (authError) return authError;
 
   try {
+    const { searchParams } = new URL(request.url);
+    const metadataOnly = searchParams.get("metadataOnly") === "true";
+
+    if (metadataOnly) {
+      const metadata = await bankingService.getMetadata();
+      return NextResponse.json(metadata, {
+        headers: {
+          "Cache-Control": "public, s-maxage=300, stale-while-revalidate=600",
+        },
+      });
+    }
+
     const data = await bankingService.getAllData();
-    return NextResponse.json(data);
+    return NextResponse.json(data, {
+      headers: {
+        "Cache-Control": "public, s-maxage=60, stale-while-revalidate=120",
+      },
+    });
   } catch (error) {
     console.error("Error fetching banking data:", error);
     return NextResponse.json(

app/api/banking/transactions/route.ts

@@ -1,8 +1,73 @@
-import { NextResponse } from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 import { transactionService } from "@/services/transaction.service";
+import { bankingService } from "@/services/banking.service";
 import { requireAuth } from "@/lib/auth-utils";
 import type { Transaction } from "@/lib/types";
 
+export async function GET(request: NextRequest) {
+  const authError = await requireAuth();
+  if (authError) return authError;
+
+  try {
+    const { searchParams } = new URL(request.url);
+
+    // Parse pagination params
+    const limit = parseInt(searchParams.get("limit") || "50", 10);
+    const offset = parseInt(searchParams.get("offset") || "0", 10);
+
+    // Parse filter params
+    const startDate = searchParams.get("startDate") || undefined;
+    const endDate = searchParams.get("endDate") || undefined;
+    const accountIds = searchParams.get("accountIds")
+      ? searchParams.get("accountIds")!.split(",")
+      : undefined;
+    const categoryIds = searchParams.get("categoryIds")
+      ? searchParams.get("categoryIds")!.split(",")
+      : undefined;
+    const includeUncategorized =
+      searchParams.get("includeUncategorized") === "true";
+    const search = searchParams.get("search") || undefined;
+    const isReconciledParam = searchParams.get("isReconciled");
+    const isReconciled =
+      isReconciledParam === "true"
+        ? true
+        : isReconciledParam === "false"
+          ? false
+          : "all";
+    const sortField =
+      (searchParams.get("sortField") as "date" | "amount" | "description") ||
+      "date";
+    const sortOrder =
+      (searchParams.get("sortOrder") as "asc" | "desc") || "desc";
+
+    const result = await bankingService.getTransactionsPaginated({
+      limit,
+      offset,
+      startDate,
+      endDate,
+      accountIds,
+      categoryIds,
+      includeUncategorized,
+      search,
+      isReconciled,
+      sortField,
+      sortOrder,
+    });
+
+    return NextResponse.json(result, {
+      headers: {
+        "Cache-Control": "public, s-maxage=60, stale-while-revalidate=120",
+      },
+    });
+  } catch (error) {
+    console.error("Error fetching transactions:", error);
+    return NextResponse.json(
+      { error: "Failed to fetch transactions" },
+      { status: 500 },
+    );
+  }
+}
+
 export async function POST(request: Request) {
   const authError = await requireAuth();
   if (authError) return authError;