Merge branch 'main' into series-links

package.json

@@ -10,7 +10,6 @@
     "@mui/x-date-pickers": "^7.23.1",
     "@reduxjs/toolkit": "^2.5.0",
     "@types/dompurify": "^3.2.0",
-    "@types/react-router-dom": "^5.3.3",
     "array-move": "^4.0.0",
     "axios": "^1.7.9",
     "bourbon": "^7.3.0",
@@ -34,7 +33,7 @@
     "react-i18next": "^15.4.0",
     "react-icons": "^5.3.0",
     "react-redux": "^9.2.0",
-    "react-router-dom": "^6.27.0",
+    "react-router": "^7.1.1",
     "react-select": "^5.8.0",
     "redux": "^5.0.1",
     "redux-persist": "^6.0.0",

src/App.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { HashRouter, Navigate, Route, Routes } from "react-router-dom";
+import { HashRouter, Navigate, Route, Routes } from "react-router";
 import "./App.scss";
 import Events from "./components/events/Events";
 import Recordings from "./components/recordings/Recordings";

src/components/About.tsx

@@ -4,7 +4,7 @@ import NavBar from "./NavBar";
 import Footer from "./Footer";
 import MainNav from "./shared/MainNav";
 import { useTranslation } from "react-i18next";
-import { Link, useLocation } from "react-router-dom";
+import { Link, useLocation } from "react-router";
 import cn from "classnames";
 import axios from 'axios';
 import i18n from "../i18n/i18n";

src/components/Footer.tsx

@@ -4,7 +4,7 @@ import {
 	getUserInformation,
 } from "../selectors/userInfoSelectors";
 import { useAppSelector } from "../store";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 import { useTranslation } from "react-i18next";
 import { Tooltip } from "./shared/Tooltip";
 

src/components/Header.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 import i18n from "../i18n/i18n";
 import languages from "../i18n/languages";
 import opencastLogo from "../img/opencast-white.svg?url";

src/components/configuration/Themes.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import MainNav from "../shared/MainNav";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 import cn from "classnames";
 import TableFilters from "../shared/TableFilters";
 import Table from "../shared/Table";

src/components/events/Events.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import cn from "classnames";
-import { Link, useLocation } from "react-router-dom";
+import { Link, useLocation } from "react-router";
 import TableFilters from "../shared/TableFilters";
 import MainNav from "../shared/MainNav";
 import Stats from "../shared/Stats";

src/components/events/Series.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import MainNav from "../shared/MainNav";
 import { useTranslation } from "react-i18next";
 import cn from "classnames";
-import { Link, useLocation } from "react-router-dom";
+import { Link, useLocation } from "react-router";
 import TableFilters from "../shared/TableFilters";
 import Table from "../shared/Table";
 import Notifications from "../shared/Notifications";

src/components/events/partials/SeriesDetailsAction.tsx

@@ -3,7 +3,7 @@ import { t } from "i18next";
 import { getUserInformation } from "../../../selectors/userInfoSelectors";
 import { useAppSelector } from "../../../store";
 import { hasAccess } from "../../../utils/utils";
-import { useSearchParams } from "react-router-dom";
+import { useSearchParams } from "react-router";
 
 export const SeriesDetailsAction = ({ id }: {
 	id: string,

src/components/events/partials/SeriesTitleCell.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { useTranslation } from "react-i18next";
 import { loadEventsIntoTable } from "../../../thunks/tableThunks";
 import { setSpecificEventFilter } from "../../../slices/tableFilterSlice";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 import { useAppDispatch } from "../../../store";
 import { Tooltip } from "../../shared/Tooltip";
 import { Series } from "../../../slices/seriesSlice";

src/components/events/partials/modals/EventDetails.tsx

@@ -26,6 +26,7 @@ import {
 	getModalWorkflowTabHierarchy,
 	getModalPage,
 	getEventDetailsTobiraDataError,
+	getEventDetailsTobiraStatus,
 } from "../../../../selectors/eventDetailsSelectors";
 import { getUserInformation } from "../../../../selectors/userInfoSelectors";
 import EventDetailsStatisticsTab from "../ModalTabsAndPages/EventDetailsStatisticsTab";
@@ -84,6 +85,7 @@ const EventDetails = ({
 		dispatch(fetchSchedulingInfo(eventId)).then();
 		dispatch(fetchEventStatistics(eventId)).then();
 		dispatch(fetchAssetUploadOptions()).then();
+		dispatch(fetchEventDetailsTobira(eventId));
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, []);
 
@@ -98,6 +100,7 @@ const EventDetails = ({
 	const hasStatistics = useAppSelector(state => getHasStatistics(state));
 	const isLoadingStatistics = useAppSelector(state => isFetchingStatistics(state));
 	const captureAgents = useAppSelector(state => getRecordings(state));
+	const tobiraStatus = useAppSelector(state => getEventDetailsTobiraStatus(state));
 	const tobiraError = useAppSelector(state => getEventDetailsTobiraDataError(state));
 
 	const tabs = [
@@ -164,7 +167,7 @@ const EventDetails = ({
 			accessRole: "ROLE_UI_EVENTS_DETAILS_COMMENTS_VIEW",
 			name: "tobira",
 			page: EventDetailsPage.Tobira,
-			hidden: tobiraError?.message?.includes("503"),
+			hidden: tobiraStatus === "failed" && tobiraError?.message?.includes("503"),
 		},
 		{
 			tabNameTranslation: "EVENTS.EVENTS.DETAILS.TABS.STATISTICS",
@@ -178,9 +181,6 @@ const EventDetails = ({
 
 	const openTab = (tabNr: EventDetailsPage) => {
 		dispatch(removeNotificationWizardForm());
-		if (tabNr === EventDetailsPage.Tobira) {
-			dispatch(fetchEventDetailsTobira(eventId));
-		}
 		dispatch(openModalTab(tabNr, "entry", "entry"))
 	};
 

src/components/events/partials/modals/SeriesDetails.tsx

@@ -8,6 +8,7 @@ import {
 	getSeriesDetailsTheme,
 	getSeriesDetailsThemeNames,
 	getSeriesDetailsTobiraDataError,
+	getSeriesDetailsTobiraStatus,
 	hasStatistics as seriesHasStatistics,
 } from "../../../../selectors/seriesDetailsSelectors";
 import { getOrgProperties, getUserInformation } from "../../../../selectors/userInfoSelectors";
@@ -20,6 +21,7 @@ import DetailsMetadataTab from "../ModalTabsAndPages/DetailsMetadataTab";
 import DetailsExtendedMetadataTab from "../ModalTabsAndPages/DetailsExtendedMetadataTab";
 import { useAppDispatch, useAppSelector } from "../../../../store";
 import {
+	fetchSeriesDetailsTobira,
 	fetchSeriesStatistics,
 	setTobiraTabHierarchy,
 	updateExtendedSeriesMetadata,
@@ -48,10 +50,12 @@ const SeriesDetails = ({
 	const theme = useAppSelector(state => getSeriesDetailsTheme(state));
 	const themeNames = useAppSelector(state => getSeriesDetailsThemeNames(state));
 	const hasStatistics = useAppSelector(state => seriesHasStatistics(state));
+	const tobiraStatus = useAppSelector(state => getSeriesDetailsTobiraStatus(state));
 	const tobiraError = useAppSelector(state => getSeriesDetailsTobiraDataError(state));
 
 	useEffect(() => {
 		dispatch(fetchSeriesStatistics(seriesId));
+		dispatch(fetchSeriesDetailsTobira(seriesId));
 		dispatch(setTobiraTabHierarchy("main"));
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, []);
@@ -90,7 +94,7 @@ const SeriesDetails = ({
 			tabNameTranslation: "EVENTS.SERIES.DETAILS.TABS.TOBIRA",
 			accessRole: "ROLE_UI_SERIES_DETAILS_TOBIRA_VIEW",
 			name: "tobira",
-			hidden: tobiraError?.message?.includes("503"),
+			hidden: tobiraStatus === "failed" && tobiraError?.message?.includes("503"),
 		},
 		{
 			tabNameTranslation: "EVENTS.SERIES.DETAILS.TABS.STATISTICS",

src/components/events/partials/modals/ShowSeriesDetailsModal.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 import SeriesDetailsModal from "./SeriesDetailsModal";
 import { useAppDispatch, useAppSelector } from "../../../../store";
 import { fetchSeriesDetailsMetadata, fetchSeriesDetailsAcls, fetchSeriesDetailsFeeds, fetchSeriesDetailsTheme, fetchSeriesDetailsThemeNames, fetchSeriesDetailsTobira } from "../../../../slices/seriesDetailsSlice";
-import { useSearchParams } from "react-router-dom";
+import { useSearchParams } from "react-router";
 import { getSeriesDetailsMetadata } from "../../../../selectors/seriesDetailsSelectors";
 
 export const ShowSeriesDetailsModal = () => {