Updating dependencies, fixing typos and react render errors

package.json

@@ -12,51 +12,51 @@
     "test:functional": "vitest"
   },
   "dependencies": {
-    "@headlessui/react": "2.2.0",
+    "@headlessui/react": "2.2.4",
     "@heroicons/react": "2.2.0",
-    "@prisma/client": "6.5.0",
+    "@prisma/client": "6.8.2",
     "@tailwindcss/forms": "0.5.10",
-    "@tailwindcss/postcss": "^4.0.17",
+    "@tailwindcss/postcss": "^4.1.7",
     "bitpay-sdk": "6.3.1",
     "dayjs": "1.11.13",
-    "next": "15.2.4",
+    "next": "15.3.2",
     "next-yaml": "1.0.1",
     "react": "19.1.0",
     "react-csv": "2.2.2",
     "react-dom": "19.1.0",
-    "sharp": "0.33.5",
+    "sharp": "0.34.2",
     "uuid": "11.1.0",
     "winston": "3.17.0"
   },
   "devDependencies": {
     "@modyfi/vite-plugin-yaml": "1.1.1",
     "@testing-library/dom": "10.4.0",
     "@testing-library/jest-dom": "6.6.3",
-    "@testing-library/react": "16.2.0",
+    "@testing-library/react": "16.3.0",
     "@types/jest": "29.5.14",
-    "@types/node": "22.13.16",
-    "@types/react": "19.0.12",
+    "@types/node": "22.15.21",
+    "@types/react": "19.1.5",
     "@types/react-csv": "1.1.10",
-    "@types/react-dom": "19.0.4",
+    "@types/react-dom": "19.1.5",
     "@types/uuid": "10.0.0",
-    "@vitejs/plugin-react": "4.3.4",
+    "@vitejs/plugin-react": "4.5.0",
     "autoprefixer": "10.4.21",
-    "eslint": "9.23.0",
-    "eslint-config-next": "15.2.4",
+    "eslint": "9.27.0",
+    "eslint-config-next": "15.3.2",
     "eventsourcemock": "2.0.0",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
     "jest-transform-yaml": "1.1.2",
-    "jsdom": "26.0.0",
-    "node-mocks-http": "1.16.2",
+    "jsdom": "26.1.0",
+    "node-mocks-http": "1.17.2",
     "postcss": "8.5.3",
-    "prisma": "6.5.0",
-    "tailwindcss": "4.0.17",
+    "prisma": "6.8.2",
+    "tailwindcss": "4.1.7",
     "ts-node": "10.9.2",
-    "typescript": "5.8.2",
+    "typescript": "5.8.3",
     "vite-tsconfig-paths": "5.1.4",
-    "vitest": "3.1.1",
-    "vitest-mock-extended": "3.0.1",
+    "vitest": "3.1.4",
+    "vitest-mock-extended": "3.1.0",
     "whatwg-fetch": "3.6.20"
   }
 }

src/app/api/create-invoice/route.tsx

@@ -19,7 +19,7 @@ export async function POST(req: NextRequest) {
   } catch (e) {
     logger.error({
       code: "INVOICE_CREATE_FAIL",
-      message: "Faoled to create invoice",
+      message: "Failed to create invoice",
       context: {
         errorMessage: e instanceof Error ? e.message : "Unknown error.",
         stackTrace: e,

src/app/api/invoices/webhooks/route.ts

@@ -121,7 +121,7 @@ export async function POST(req: NextRequest) {
         message: "Failed to validate IPN",
         context: {
           errorMessage: e.message,
-          stackTeace: e,
+          stackTrace: e,
         },
       });
 

src/components/LedgerReportTable.tsx

@@ -117,7 +117,7 @@ export default function LedgerReportTable({
         </div>
       </div>
       <nav
-        className="-mx-6  mt-6 flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6"
+        className="-mx-6 mt-6 flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6"
         aria-label="Pagination"
       >
         <div className="hidden sm:block">

src/components/LedgerReportTableToolbar.tsx

@@ -1,10 +1,12 @@
 "use client";
 
 import { supportedCurrencies } from "@/utils/currencies";
+const CSVLink = dynamic(() => import("react-csv").then((mod) => mod.CSVLink), { ssr: false });
+
 import { LedgerEntryInterface } from "bitpay-sdk/dist/Model";
+import dynamic from "next/dynamic";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import { ChangeEvent, useCallback } from "react";
-import { CSVLink } from "react-csv";
 
 export default function LedgerReportTableToolbar({
   startDate,
@@ -69,7 +71,7 @@ export default function LedgerReportTableToolbar({
             Start Date
           </label>
           <input
-            className="block w-full shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+            className="block shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
             id="startDate"
             name="startDate"
             type="date"
@@ -85,7 +87,7 @@ export default function LedgerReportTableToolbar({
             End Date
           </label>
           <input
-            className="block w-full shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+            className="block shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
             id="endDate"
             name="endDate"
             type="date"

src/components/Notification.tsx

@@ -19,9 +19,11 @@ export default function Notification({
     ),
   };
 
-  if (!show) {
-    onClose();
-  }
+  useEffect(() => {
+    if (!show) {
+      onClose();
+    }
+  }, [show, onClose]);
 
   useEffect(() => {
     const timer = setTimeout(() => {