updating to react 19 and nextjs 16 - security patching

Author: thediymaker

app/api/slurm/job/[...id]/route.ts

@@ -3,9 +3,10 @@ import { fetchSlurmData } from "@/lib/slurm-api";
 
 export async function GET(
   req: Request,
-  { params }: { params: { id: string } }
+  { params }: { params: Promise<{ id: string[] }> }
 ) {
-  const { data, error, status } = await fetchSlurmData(`/job/${params.id[0]}`, {
+  const { id } = await params;
+  const { data, error, status } = await fetchSlurmData(`/job/${id[0]}`, {
     revalidate: 0
   });
 

app/api/slurm/job/completed/[...id]/route.ts

@@ -3,9 +3,10 @@ import { fetchSlurmData } from "@/lib/slurm-api";
 
 export async function GET(
   req: Request,
-  { params }: { params: { id: string } }
+  { params }: { params: Promise<{ id: string[] }> }
 ) {
-  const { data, error, status } = await fetchSlurmData(`/job/${params.id[0]}`, {
+  const { id } = await params;
+  const { data, error, status } = await fetchSlurmData(`/job/${id[0]}`, {
     type: 'slurmdb',
     revalidate: 0
   });

app/api/slurm/jobs/node/[...id]/route.ts

@@ -3,9 +3,10 @@ import { fetchSlurmData } from "@/lib/slurm-api";
 
 export async function GET(
   req: Request,
-  { params }: { params: { id: string } }
+  { params }: { params: Promise<{ id: string[] }> }
 ) {
-  const { data, error, status } = await fetchSlurmData(`/jobs?node=${params.id[0]}&state=running`, {
+  const { id } = await params;
+  const { data, error, status } = await fetchSlurmData(`/jobs?node=${id[0]}&state=running`, {
     type: 'slurmdb',
     revalidate: 0
   });

app/api/slurm/jobs/user/[...id]/route.ts

@@ -3,9 +3,10 @@ import { fetchSlurmData } from "@/lib/slurm-api";
 
 export async function GET(
   req: Request,
-  { params }: { params: { id: string } }
+  { params }: { params: Promise<{ id: string[] }> }
 ) {
-  const { data, error, status } = await fetchSlurmData(`/jobs?users=${params.id[0]}&state=running`, {
+  const { id } = await params;
+  const { data, error, status } = await fetchSlurmData(`/jobs?users=${id[0]}&state=running`, {
     type: 'slurmdb'
   });
 

app/api/slurm/nodes/state/[...id]/route.ts

@@ -3,9 +3,10 @@ import { fetchSlurmData } from "@/lib/slurm-api";
 
 export async function GET(
   req: Request,
-  { params }: { params: { id: string } }
+  { params }: { params: Promise<{ id: string[] }> }
 ) {
-  const { data, error, status } = await fetchSlurmData(`/node/${params.id[0]}`, {
+  const { id } = await params;
+  const { data, error, status } = await fetchSlurmData(`/node/${id[0]}`, {
     revalidate: 0
   });
 
@@ -18,16 +19,17 @@ export async function GET(
 
 export async function POST(
   req: Request,
-  { params }: { params: { id: string } }
+  { params }: { params: Promise<{ id: string[] }> }
 ) {
   try {
+    const { id } = await params;
     const body = await req.json();
     const requestBody = {
       state: `${body.state}`,
       reason: `${body.reason}`,
     };
 
-    const { data, error, status } = await fetchSlurmData(`/node/${params.id[0]}`, {
+    const { data, error, status } = await fetchSlurmData(`/node/${id[0]}`, {
       method: 'POST',
       body: requestBody,
       revalidate: 0

app/api/slurm/partitions/[name]/route.ts

@@ -5,9 +5,9 @@ import { fetchSlurmData } from "@/lib/slurm-api";
 
 export async function GET(
   request: Request,
-  { params }: { params: { name: string } }
+  { params }: { params: Promise<{ name: string }> }
 ) {
-  const name = params.name;
+  const { name } = await params;
   const { data, error, status } = await fetchSlurmData(`/partition/${name}`);
 
   if (error) {

app/api/slurm/qos/[name]/route.ts

@@ -5,9 +5,9 @@ import { fetchSlurmData } from "@/lib/slurm-api";
 
 export async function GET(
   request: Request,
-  { params }: { params: { name: string } }
+  { params }: { params: Promise<{ name: string }> }
 ) {
-  const name = params.name;
+  const { name } = await params;
   const { data, error, status } = await fetchSlurmData(`/qos/${name}`, 'slurmdb');
 
   if (error) {

app/api/slurm/reservations/[name]/route.ts

@@ -5,9 +5,9 @@ import { fetchSlurmData } from "@/lib/slurm-api";
 
 export async function GET(
   request: Request,
-  { params }: { params: { name: string } }
+  { params }: { params: Promise<{ name: string }> }
 ) {
-  const name = params.name;
+  const { name } = await params;
   const { data, error, status } = await fetchSlurmData(`/reservation/${name}`);
 
   if (error) {

components/rewind/dashboard-history.tsx

@@ -4,7 +4,7 @@ import { format } from "date-fns";
 import useSWR from "swr";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { NodeCard } from "@/components/nodeCard/node-card";
-import { ThreeCircles } from "react-loader-spinner";
+import { RingLoader } from "react-spinners";
 import { DateTimePicker } from "@/components/date-time";
 
 const fetcher = async (url: string) => {
@@ -68,15 +68,7 @@ const DashboardHistory = () => {
   if (!isMounted) {
     return (
       <div className="flex justify-center items-center w-full h-full">
-        <ThreeCircles
-          visible={true}
-          height="64"
-          width="64"
-          color="white"
-          ariaLabel="three-circles-loading"
-          wrapperStyle={{}}
-          wrapperClass=""
-        />
+        <RingLoader color="white" size={64} />
       </div>
     );
   }

components/theme-provider.tsx

@@ -1,8 +1,7 @@
 "use client";
 
 import * as React from "react";
-import { ThemeProvider as NextThemesProvider } from "next-themes";
-import { type ThemeProviderProps } from "next-themes/dist/types";
+import { ThemeProvider as NextThemesProvider, type ThemeProviderProps } from "next-themes";
 
 export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
   return <NextThemesProvider {...props}>{children}</NextThemesProvider>;