saving changes. The lift to v15 seems to be temporarily stable. eslin…

…t v9 seems to be working as well, and deprecated packages have either been replaced with similar compatible modules or rewritten to work with the new versions.

frontend/.prettierrc

@@ -16,7 +16,8 @@
       "options": {
         "singleQuote": false
       }
-    },  {
+    },
+    {
       "files": "*.html",
       "options": {
         "printWidth": 120

frontend/app/(hub)/dashboard/page.tsx

@@ -247,7 +247,13 @@ export default function DashboardPage() {
                           </Box>
                         </AccordionSummary>
                         <AccordionDetails>
-                          <Box>
+                          <Box
+                            aria-label={
+                              changelog.changeTimestamp
+                                ? `Details of change at index ${index}. The changelog timestamp is ${changelog.changeTimestamp}`
+                                : 'No change details present.'
+                            }
+                          >
                             <Typography level={'body-md'}>Updating:</Typography>
                             <Stack direction={'row'}>
                               <Card>

frontend/app/(login)/login/page.tsx

@@ -1,7 +1,7 @@
 'use client';
 import React, { useEffect, useState } from 'react';
 import { useSession } from 'next-auth/react';
-import { animated, useTransition } from '@react-spring/web';
+import { motion, AnimatePresence } from 'framer-motion';
 import styles from '@/styles/styles.module.css';
 import Box from '@mui/joy/Box';
 import UnauthenticatedSidebar from '@/components/unauthenticatedsidebar';
@@ -12,38 +12,30 @@ const slides = ['background-1.jpg', 'background-2.jpg', 'background-3.jpg', 'bac
 export default function LoginPage() {
   const { data: _session, status } = useSession();
   const [index, setIndex] = useState(0);
-  const transitions = useTransition(index, {
-    key: index,
-    from: { opacity: 0 },
-    enter: { opacity: 0.5 },
-    leave: { opacity: 0 },
-    config: { duration: 5000 },
-    onRest: (_a, _b, item) => {
-      if (index === item) {
-        setIndex(state => (state + 1) % slides.length);
-      }
-    },
-    exitBeforeEnter: true
-  });
 
-  // feedback received -- endless loop will consume too many resources and needs to be removed. Single loop through all slides should suffice.
   useEffect(() => {
-    setInterval(() => setIndex(state => (state + 1) % slides.length), 5000);
-  }, []);
+    const timer = setTimeout(() => {
+      setIndex(prevIndex => (prevIndex + 1) % slides.length);
+    }, 5000);
+
+    return () => clearTimeout(timer); // Cleanup on unmount
+  }, [index]);
 
   if (status === 'unauthenticated') {
     return (
-      <Box sx={{ display: 'flex', minHeight: '100vh', minWidth: '100vh' }}>
-        {transitions((style, i) => (
-          <animated.div
+      <Box sx={{ display: 'flex', minHeight: '100vh', minWidth: '100vh', position: 'relative' }}>
+        <AnimatePresence mode="wait">
+          <motion.div
+            key={slides[index]}
             className={styles.bg}
-            style={{
-              ...style,
-              backgroundImage: `url(${slides[i]})`
-            }}
-            data-testid={`${slides[i]}`}
+            style={{ backgroundImage: `url(${slides[index]})` }}
+            data-testid={`${slides[index]}`}
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 0.5 }}
+            exit={{ opacity: 0 }}
+            transition={{ duration: 1.5 }}
           />
-        ))}
+        </AnimatePresence>
         <UnauthenticatedSidebar />
       </Box>
     );

frontend/app/api/batchedupload/[schema]/[[...slugs]]/route.ts

@@ -4,7 +4,11 @@ import { FailedMeasurementsRDS } from '@/config/sqlrdsdefinitions/core';
 import connectionmanager from '@/config/connectionmanager';
 import { format } from 'mysql2/promise';
 
-export async function POST(request: NextRequest, { params }: { params: { schema: string; slugs?: string[] } }) {
+export async function POST(
+  request: NextRequest,
+  props: { params: Promise<{ schema: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   let errorRows: FailedMeasurementsRDS[] = await request.json();
   const schema = params.schema;
   const slugs = params.slugs;

frontend/app/api/catalog/[firstName]/[lastName]/route.ts

@@ -2,7 +2,11 @@ import { NextRequest, NextResponse } from 'next/server';
 import { HTTPResponses } from '@/config/macros';
 import ConnectionManager from '@/config/connectionmanager';
 
-export async function GET(_request: NextRequest, { params }: { params: { firstName: string; lastName: string } }) {
+export async function GET(
+  _request: NextRequest,
+  props: { params: Promise<{ firstName: string; lastName: string }> }
+) {
+  const params = await props.params;
   const { firstName, lastName } = params;
   if (!firstName || !lastName) throw new Error('no first or last name provided!');
 

frontend/app/api/changelog/overview/[changelogType]/[[...options]]/route.ts

@@ -3,7 +3,11 @@ import { HTTPResponses } from '@/config/macros';
 import MapperFactory from '@/config/datamapper';
 import ConnectionManager from '@/config/connectionmanager';
 
-export async function GET(request: NextRequest, { params }: { params: { changelogType: string; options?: string[] } }) {
+export async function GET(
+  request: NextRequest,
+  props: { params: Promise<{ changelogType: string; options?: string[] }> }
+) {
+  const params = await props.params;
   const schema = request.nextUrl.searchParams.get('schema');
   if (!schema) throw new Error('schema not found');
   if (!params.changelogType) throw new Error('changelogType not provided');

frontend/app/api/cmprevalidation/[dataType]/[[...slugs]]/route.ts

@@ -4,7 +4,11 @@ import ConnectionManager from '@/config/connectionmanager';
 
 // datatype: table name
 // expecting 1) schema 2) plotID 3) plotCensusNumber
-export async function GET(_request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function GET(
+  _request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   if (!params.slugs || !params.dataType) throw new Error('missing slugs');
   const [schema, plotID, plotCensusNumber] = params.slugs;
   if (

frontend/app/api/fetchall/[[...slugs]]/route.ts

@@ -45,7 +45,8 @@ const buildQuery = (schema: string, fetchType: string, plotID?: string, plotCens
 };
 
 // ordering: PCQ
-export async function GET(request: NextRequest, { params }: { params: { slugs?: string[] } }) {
+export async function GET(request: NextRequest, props: { params: Promise<{ slugs?: string[] }> }) {
+  const params = await props.params;
   const schema = request.nextUrl.searchParams.get('schema');
   if (!schema || schema === 'undefined') {
     throw new Error('Schema selection was not provided to API endpoint');

frontend/app/api/fixeddata/[dataType]/[[...slugs]]/route.ts

@@ -10,12 +10,11 @@ import { getUpdatedValues } from '@/config/utils'; // slugs SHOULD CONTAIN AT MI
 // slugs SHOULD CONTAIN AT MINIMUM: schema, page, pageSize, plotID, plotCensusNumber, (optional) quadratID, (optional) speciesID
 export async function GET(
   request: NextRequest,
-  {
-    params
-  }: {
-    params: { dataType: string; slugs?: string[] };
+  props: {
+    params: Promise<{ dataType: string; slugs?: string[] }>;
   }
 ): Promise<NextResponse<{ output: any[]; deprecated?: any[]; totalCount: number; finishedQuery: string }>> {
+  const params = await props.params;
   if (!params.slugs || params.slugs.length < 5) throw new Error('slugs not received.');
   const [schema, pageParam, pageSizeParam, plotIDParam, plotCensusNumberParam, speciesIDParam] = params.slugs;
   if (!schema || schema === 'undefined' || !pageParam || pageParam === 'undefined' || !pageSizeParam || pageSizeParam === 'undefined')
@@ -137,7 +136,11 @@ export async function GET(
 }
 
 // required dynamic parameters: dataType (fixed),[ schema, gridID value] -> slugs
-export async function POST(request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function POST(
+  request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   if (!params.slugs) throw new Error('slugs not provided');
   const [schema, gridID, _plotIDParam, censusIDParam] = params.slugs;
   if (!schema || !gridID) throw new Error('no schema or gridID provided');
@@ -201,7 +204,11 @@ export async function POST(request: NextRequest, { params }: { params: { dataTyp
 }
 
 // slugs: schema, gridID
-export async function PATCH(request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function PATCH(
+  request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   if (!params.slugs) throw new Error('slugs not provided');
   const [schema, gridID] = params.slugs;
   if (!schema || !gridID) throw new Error('no schema or gridID provided');
@@ -338,7 +345,11 @@ export async function PATCH(request: NextRequest, { params }: { params: { dataTy
 
 // slugs: schema, gridID
 // body: full data row, only need first item from it this time though
-export async function DELETE(request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function DELETE(
+  request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   if (!params.slugs) throw new Error('slugs not provided');
   const [schema, gridID] = params.slugs;
   if (!schema || !gridID) throw new Error('no schema or gridID provided');

frontend/app/api/fixeddatafilter/[dataType]/[[...slugs]]/route.ts

@@ -16,12 +16,11 @@ interface ExtendedGridFilterModel extends GridFilterModel {
 
 export async function POST(
   request: NextRequest,
-  {
-    params
-  }: {
-    params: { dataType: string; slugs?: string[] };
+  props: {
+    params: Promise<{ dataType: string; slugs?: string[] }>;
   }
 ) {
+  const params = await props.params;
   // trying to ensure that system correctly retains edit/add functionality -- not necessarily needed currently but better safe than sorry
   const body = await request.json();
   if (body.newRow) {
@@ -374,7 +373,11 @@ export async function POST(
 }
 
 // slugs: schema, gridID
-export async function PATCH(request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function PATCH(
+  request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   if (!params.slugs) throw new Error('slugs not provided');
   const [schema, gridID] = params.slugs;
   if (!schema || !gridID) throw new Error('no schema or gridID provided');
@@ -434,7 +437,11 @@ export async function PATCH(request: NextRequest, { params }: { params: { dataTy
 
 // slugs: schema, gridID
 // body: full data row, only need first item from it this time though
-export async function DELETE(request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function DELETE(
+  request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   if (!params.slugs) throw new Error('slugs not provided');
   const [schema, gridID] = params.slugs;
   if (!schema || !gridID) throw new Error('no schema or gridID provided');

frontend/app/api/formdownload/[dataType]/[[...slugs]]/route.ts

@@ -34,7 +34,11 @@ const buildSearchStub = (columns: string[], quickFilter: string[], alias?: strin
     .join(' OR ');
 };
 
-export async function GET(_request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function GET(
+  _request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   const { dataType, slugs } = params;
   if (!dataType || !slugs) throw new Error('data type or slugs not provided');
   const [schema, plotIDParam, censusIDParam, filterModelParam] = slugs;

frontend/app/api/formvalidation/[dataType]/[[...slugs]]/route.ts

@@ -7,7 +7,11 @@ import ConnectionManager from '@/config/connectionmanager';
 // slugs: schema, columnName, value ONLY
 // needs to match dynamic format established by other slug routes!
 // refit to match entire rows, using dataType convention to determine what columns need testing?
-export async function GET(request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function GET(
+  request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   // simple dynamic validation to confirm table input values:
   if (!params.slugs || params.slugs.length !== 3) throw new Error('slugs missing -- formvalidation');
   if (!params.dataType || params.dataType === 'undefined') throw new Error('no schema provided');

frontend/app/api/postvalidationbyquery/[schema]/[plotID]/[censusID]/[queryID]/route.ts

@@ -3,7 +3,11 @@ import { HTTPResponses } from '@/config/macros';
 import moment from 'moment';
 import ConnectionManager from '@/config/connectionmanager';
 
-export async function GET(_request: NextRequest, { params }: { params: { schema: string; plotID: string; censusID: string; queryID: string } }) {
+export async function GET(
+  _request: NextRequest,
+  props: { params: Promise<{ schema: string; plotID: string; censusID: string; queryID: string }> }
+) {
+  const params = await props.params;
   const { schema } = params;
   const plotID = parseInt(params.plotID);
   const censusID = parseInt(params.censusID);

frontend/app/api/refreshviews/[view]/[schema]/route.ts

@@ -2,7 +2,11 @@ import { HTTPResponses } from '@/config/macros';
 import { NextRequest, NextResponse } from 'next/server';
 import ConnectionManager from '@/config/connectionmanager';
 
-export async function POST(_request: NextRequest, { params }: { params: { view: string; schema: string } }) {
+export async function POST(
+  _request: NextRequest,
+  props: { params: Promise<{ view: string; schema: string }> }
+) {
+  const params = await props.params;
   if (!params.schema || params.schema === 'undefined' || !params.view || params.view === 'undefined' || !params) throw new Error('schema not provided');
   const { view, schema } = params;
   const connectionManager = ConnectionManager.getInstance();

frontend/app/api/rollover/[dataType]/[[...slugs]]/route.ts

@@ -9,7 +9,11 @@ import ConnectionManager from '@/config/connectionmanager';
  * @param params - The route parameters, including the `dataType` (either 'quadrats' or 'personnel') and the `slugs` (an array containing the schema, plotID, sourceCensusID, and newCensusID).
  * @returns A NextResponse with a success message or an error message, along with the appropriate HTTP status code.
  */
-export async function POST(request: NextRequest, { params }: { params: { dataType: string; slugs?: string[] } }) {
+export async function POST(
+  request: NextRequest,
+  props: { params: Promise<{ dataType: string; slugs?: string[] }> }
+) {
+  const params = await props.params;
   if (!params.slugs) throw new Error('slugs not provided');
   const [schema, plotID, sourceCensusID, newCensusID] = params.slugs;
   if (!schema || !plotID || !sourceCensusID || !newCensusID) throw new Error('no schema or plotID or censusID provided');

frontend/app/api/specieslimits/[plotID]/[plotCensusNumber]/route.ts

@@ -4,7 +4,11 @@ import { HTTPResponses } from '@/config/macros';
 import ConnectionManager from '@/config/connectionmanager';
 
 // pulls everything
-export async function GET(request: NextRequest, { params }: { params: { plotID: string; plotCensusNumber: string } }) {
+export async function GET(
+  request: NextRequest,
+  props: { params: Promise<{ plotID: string; plotCensusNumber: string }> }
+) {
+  const params = await props.params;
   const schema = request.nextUrl.searchParams.get('schema');
   if (!schema) throw new Error('Schema not provided');
   if (isNaN(parseInt(params.plotID)) || isNaN(parseInt(params.plotCensusNumber))) throw new Error('required slugs were not provided');

frontend/app/api/structure/[schema]/route.ts

@@ -1,7 +1,8 @@
 import { NextRequest } from 'next/server';
 import ConnectionManager from '@/config/connectionmanager';
 
-export async function GET(_request: NextRequest, { params }: { params: { schema: string } }) {
+export async function GET(_request: NextRequest, props: { params: Promise<{ schema: string }> }) {
+  const params = await props.params;
   const schema = params.schema;
   if (!schema) throw new Error('no schema variable provided!');
   const query = `SELECT table_name, column_name 

frontend/app/api/validations/procedures/[validationType]/route.ts

@@ -2,7 +2,11 @@ import { NextRequest, NextResponse } from 'next/server';
 import { runValidation } from '@/components/processors/processorhelperfunctions';
 import { HTTPResponses } from '@/config/macros';
 
-export async function POST(request: NextRequest, { params }: { params: { validationType: string } }) {
+export async function POST(
+  request: NextRequest,
+  props: { params: Promise<{ validationType: string }> }
+) {
+  const params = await props.params;
   try {
     if (!params.validationType) throw new Error('validationProcedureName not provided');
     const body = await request.json();