Merge branch 'main' into feat/1580-list-favorite-activity-in-consep

docker-compose.yml

@@ -59,7 +59,7 @@ services:
 
   frontend:
     container_name: frontend
-    image: node:18-bullseye-slim
+    image: node:20-bullseye-slim
     ports: ["3000:3000"]
     entrypoint: sh -c "npm i --no-update-notifier && npm run start"
     user: root

frontend/package.json

@@ -34,7 +34,7 @@
     "react-beforeunload": "^2.6.0",
     "react-dom": "^18.2.0",
     "react-hash-string": "^1.0.0",
-    "react-router-dom": "^7.0.0",
+    "react-router": "^7.1.1",
     "react-test-renderer": "^18.2.0",
     "react-toastify": "^11.0.0",
     "sass": "^1.77.7",

frontend/src/App.tsx

@@ -1,7 +1,7 @@
 import React, { useContext, useEffect } from 'react';
 import {
   createBrowserRouter, RouteObject, RouterProvider
-} from 'react-router-dom';
+} from 'react-router';
 import { Amplify } from 'aws-amplify';
 import { ClassPrefix } from '@carbon/react';
 import { ToastContainer } from 'react-toastify';

frontend/src/__test__/components/ApplicantInformationForm.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { fireEvent, render, screen } from '@testing-library/react';
 import ApplicantInformationForm from '../../components/ApplicantInformationForm/index';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 
 describe('Test the Form Progress component', () => {

frontend/src/__test__/components/BCHeader.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { render } from '@testing-library/react';
 import renderer from 'react-test-renderer';
 import BCHeader from '../../components/BCHeader';

frontend/src/__test__/components/CollectionStep.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, fireEvent, waitFor, screen } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import SeedlotRegistrarionForm from '../../views/Seedlot/SeedlotRegistrationForm';
 import makeServer from '../../mock-server/server';

frontend/src/__test__/components/ExtractionAndStorageStep.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, fireEvent, waitFor, screen } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import SeedlotRegistrarionForm from '../../views/Seedlot/SeedlotRegistrationForm';
 import makeServer from '../../mock-server/server';

frontend/src/__test__/components/FavouriteCard.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { fireEvent, render, screen } from '@testing-library/react';
 import FavouriteCard from '../../components/Card/FavouriteCard';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';

frontend/src/__test__/components/FormProgress.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { render, screen } from '@testing-library/react';
 import FormProgress from '../../components/FormProgress/index';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 
 describe('Test the Form Progress component', () => {
   it('should render correctly', () => {

frontend/src/__test__/components/InterimStep.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, fireEvent, waitFor, screen } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import SeedlotRegistrarionForm from '../../views/Seedlot/SeedlotRegistrationForm';
 import makeServer from '../../mock-server/server';

frontend/src/__test__/components/OrchardStep.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, fireEvent, waitFor, screen } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import SeedlotRegistrarionForm from '../../views/Seedlot/SeedlotRegistrationForm';
 import makeServer from '../../mock-server/server';

frontend/src/__test__/components/OwnershipStep.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, fireEvent, waitFor, screen } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import SeedlotRegistrarionForm from '../../views/Seedlot/SeedlotRegistrationForm';
 import makeServer from '../../mock-server/server';

frontend/src/__test__/components/RecentActivities.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import RecentActivities from '../../components/RecentActivities';
 import makeServer from '../../mock-server/server';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';

frontend/src/__test__/components/SeedlotActivities.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import SeedlotActivities from '../../components/SeedlotActivities';
 
 describe('Seedlot Activities component', () => {

frontend/src/__test__/components/SeedlotActivityHistory.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { fireEvent, render, screen } from '@testing-library/react';
 import SeedlotActivityHistory from '../../components/SeedlotActivityHistory/index';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 
 describe('Test the Form Progress component', () => {
   it('should render correctly', () => {
@@ -23,7 +23,7 @@ describe('Test the Form Progress component', () => {
       </BrowserRouter>
     );
 
-  
+
     const dropdownElement = screen.getAllByRole('combobox');
     fireEvent.click(dropdownElement[0]);
     expect(screen.getByText('Own activity')).toBeInTheDocument();

frontend/src/__test__/components/SeedlotRegistrationProgress.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { fireEvent, render, screen } from '@testing-library/react';
 import SeedlotRegistrationProgress from '../../components/SeedlotRegistrationProgress/index';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 
 describe('Test the Form Progress component', () => {
   it('should render correctly', () => {

frontend/src/__test__/components/SeedlotTable.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { render, screen } from '@testing-library/react';
 import SeedlotTable from '../../components/SeedlotTable';
 import MySeedlotsItems from '../../mock-server/fixtures/MySeedlotsItems';

frontend/src/__test__/views/CreateAClass.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { render, screen } from '@testing-library/react';
 import CreateAClass from '../../views/Seedlot/CreateAClass/index';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import makeServer from '../../mock-server/server';
 

frontend/src/__test__/views/Landing.test.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable no-undef */
 import React from 'react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { render } from '@testing-library/react';
 import renderer from 'react-test-renderer';
 import Landing from '../../views/Landing';

frontend/src/components/BCHeader/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { Link, useLocation, useNavigate } from 'react-router-dom';
+import { Link, useLocation, useNavigate } from 'react-router';
 
 import {
   HeaderContainer,

frontend/src/components/Breadcrumbs/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import {
   Breadcrumb,
   BreadcrumbItem,

frontend/src/components/Card/FavouriteCard/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import { Tile, OverflowMenu, OverflowMenuItem } from '@carbon/react';
 import * as Icons from '@carbon/icons-react';

frontend/src/components/Card/SmallCard/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import * as Icons from '@carbon/icons-react';
 import * as Pictograms from '@carbon/pictograms-react';
 import { Tile } from '@carbon/react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import './styles.scss';
 

frontend/src/components/Card/StandardCard/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import { Tile, IconButton } from '@carbon/react';
 import * as Icons from '@carbon/icons-react';

frontend/src/components/InfoSection/index.tsx

@@ -1,13 +1,12 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 import InfoDisplayObj from '../../types/InfoDisplayObj';
 import InfoSectionRow from './InfoSectionRow';
-import JsxChildren from '../../types/JsxChildren';
 
 import './styles.scss';
 
 interface InfoSectionProps {
   infoItems: Array<InfoDisplayObj>;
-  children?: JsxChildren;
+  children?: ReactNode;
 }
 
 /**

frontend/src/components/OrganizationSelection/index.tsx

@@ -6,7 +6,7 @@ import {
 } from '@carbon/react';
 import { ArrowRight } from '@carbon/icons-react';
 import { useQueries, useQueryClient } from '@tanstack/react-query';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import AuthContext from '../../contexts/AuthContext';
 import { getForestClientByNumberOrAcronym } from '../../api-service/forestClientsAPI';

frontend/src/components/RecentActivities/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import { useQuery } from '@tanstack/react-query';
 
 import {

frontend/src/components/ScrollToTop/index.tsx

@@ -1,5 +1,5 @@
 import { useEffect } from 'react';
-import { useLocation } from 'react-router-dom';
+import { useLocation } from 'react-router';
 
 interface ScrollToTopProps {
   enabled?: boolean

frontend/src/components/SeedlotNavigator/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import {
   Button, TextInput, Column

frontend/src/components/SeedlotRegistrationSteps/ParentTreeStep/constants.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 import { Button } from '@carbon/react';
 import {
   HeaderObj, RowItem, NotifCtrlType, GeneticWorthDictType,

frontend/src/components/SeedlotRegistrationSteps/ParentTreeStep/index.tsx

@@ -2,7 +2,7 @@ import React, {
   useState, useEffect, useRef, useContext
 } from 'react';
 import { AxiosError, AxiosResponse } from 'axios';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 import { useMutation, useQuery } from '@tanstack/react-query';
 import {
   Tabs, TabList, Tab, FlexGrid, Row, Column,

frontend/src/components/SeedlotTable/index.tsx

@@ -1,5 +1,5 @@
 import React, { useContext, useEffect, useState } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import { DataTableSkeleton, Pagination } from '@carbon/react';
 import { useQuery } from '@tanstack/react-query';

frontend/src/layout/PrivateLayout/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Outlet, Link } from 'react-router-dom';
+import { Outlet, Link } from 'react-router';
 
 import { Content, ActionableNotification } from '@carbon/react';
 import { useQueries } from '@tanstack/react-query';

frontend/src/routes/ProtectedRoute/index.tsx

@@ -1,5 +1,5 @@
 import React, { useContext } from 'react';
-import { Navigate, Outlet } from 'react-router-dom';
+import { Navigate, Outlet } from 'react-router';
 import AuthContext from '../../contexts/AuthContext';
 import ROUTES from '../constants';
 

frontend/src/routes/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Navigate, RouteObject } from 'react-router-dom';
+import { Navigate, RouteObject } from 'react-router';
 
 import ROUTES from './constants';
 import { getStoredPath } from '../utils/PathUtils';

frontend/src/views/ErrorViews/FourOhFour/index.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import {
   FlexGrid, Row, Column,
   Button

frontend/src/views/ErrorViews/FourOhThree/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import {
   FlexGrid, Row, Column,
   Button

frontend/src/views/Landing/index.tsx

@@ -1,5 +1,5 @@
 import React, { useContext } from 'react';
-import { Link, useSearchParams } from 'react-router-dom';
+import { Link, useSearchParams } from 'react-router';
 
 import {
   Button, Grid,

frontend/src/views/Seedlot/ContextContainerClassA/index.tsx

@@ -3,7 +3,7 @@ import React, {
 } from 'react';
 import {
   useNavigate, useParams, useSearchParams, useLocation
-} from 'react-router-dom';
+} from 'react-router';
 import {
   useMutation, useQuery
 } from '@tanstack/react-query';

frontend/src/views/Seedlot/CreateAClass/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import {
   ActionableNotification,
   Button,

frontend/src/views/Seedlot/EditAClassApplication/Form.tsx

@@ -11,7 +11,7 @@ import { Save } from '@carbon/icons-react';
 import { useMutation, useQuery } from '@tanstack/react-query';
 import { AxiosError } from 'axios';
 import { toast } from 'react-toastify';
-import { useNavigate, useParams } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router';
 
 import AuthContext from '../../../contexts/AuthContext';
 import { getSeedlotById, patchSeedlotApplicationInfo } from '../../../api-service/seedlotAPI';

frontend/src/views/Seedlot/MySeedlots/index.tsx

@@ -1,5 +1,5 @@
 import React, { useContext } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import {
   Row,

frontend/src/views/Seedlot/ReviewSeedlots/index.tsx

@@ -1,5 +1,5 @@
 import React, { useContext, useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import {
   Row,

frontend/src/views/Seedlot/SeedlotCreatedFeedback/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useNavigate, useSearchParams } from 'react-router-dom';
+import { useNavigate, useSearchParams } from 'react-router';
 import {
   FlexGrid,
   Column,

frontend/src/views/Seedlot/SeedlotDashboard/RecentSeedlots/index.tsx

@@ -1,5 +1,5 @@
 import React, { useContext } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import { Row, Column, IconButton } from '@carbon/react';
 import { ArrowRight } from '@carbon/icons-react';

frontend/src/views/Seedlot/SeedlotDetails/ApplicantInformation/index.tsx

@@ -5,7 +5,7 @@ import {
   Column, TextInput, TextInputSkeleton
 } from '@carbon/react';
 import { Edit } from '@carbon/icons-react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import { SeedlotApplicantType } from '../../../../types/SeedlotType';
 import { addParamToPath } from '../../../../utils/PathUtils';

frontend/src/views/Seedlot/SeedlotDetails/FormProgress/index.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import { AxiosError } from 'axios';
 import { useQuery } from '@tanstack/react-query';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import {
   Button, ProgressIndicatorSkeleton, Row, Column

frontend/src/views/Seedlot/SeedlotDetails/TscReviewSection/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Button } from '@carbon/react';
 import { SearchLocate } from '@carbon/icons-react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 import ROUTES from '../../../../routes/constants';
 import DetailSection from '../../../../components/DetailSection';