From 53dcaebbc3b148c177bb7c43d73cd195ef357181 Mon Sep 17 00:00:00 2001
From: LasseStaus <l.stausgaard@gmail.com>
Date: Thu, 11 Jul 2024 16:52:48 +0200
Subject: [PATCH] Implement fallback for material page. If the specified type
 in the URL does not exist in the data, we will fallback to the type in
 bestRepresentation.

This change is implemented because currently, if an incorrect type is specified, the page will load indefinitely.

DDFFORM-903
---
 src/apps/material/material.tsx | 68 +++++++++++++++++-----------------
 1 file changed, 35 insertions(+), 33 deletions(-)

diff --git a/src/apps/material/material.tsx b/src/apps/material/material.tsx
index 88ab94e004..ef3ee90522 100644
--- a/src/apps/material/material.tsx
+++ b/src/apps/material/material.tsx
@@ -1,43 +1,43 @@
-import React, { useEffect, useState } from "react";
-import VariousIcon from "@danskernesdigitalebibliotek/dpl-design-system/build/icons/collection/Various.svg";
 import CreateIcon from "@danskernesdigitalebibliotek/dpl-design-system/build/icons/collection/Create.svg";
 import Receipt from "@danskernesdigitalebibliotek/dpl-design-system/build/icons/collection/Receipt.svg";
+import VariousIcon from "@danskernesdigitalebibliotek/dpl-design-system/build/icons/collection/Various.svg";
+import React, { useEffect, useState } from "react";
 import { useDeepCompareEffect } from "react-use";
-import { WorkId } from "../../core/utils/types/ids";
+import DisclosureControllable from "../../components/Disclosures/DisclosureControllable";
+import DisclosureSummary from "../../components/Disclosures/DisclosureSummary";
+import DigitalModal from "../../components/material/digital-modal/DigitalModal";
+import InfomediaModal from "../../components/material/infomedia/InfomediaModal";
+import { hasCorrectAccess } from "../../components/material/material-buttons/helper";
 import MaterialDescription from "../../components/material/MaterialDescription";
-import { MaterialReviews } from "../../components/material/MaterialReviews";
-import MaterialMainfestationItem from "../../components/material/MaterialMainfestationItem";
-import { useText } from "../../core/utils/text";
 import MaterialDetailsList from "../../components/material/MaterialDetailsList";
+import MaterialHeader from "../../components/material/MaterialHeader";
+import MaterialMainfestationItem from "../../components/material/MaterialMainfestationItem";
+import { MaterialReviews } from "../../components/material/MaterialReviews";
+import MaterialSkeleton from "../../components/material/MaterialSkeleton";
+import { PeriodicalEdition } from "../../components/material/periodical/helper";
+import { statistics } from "../../core/statistics/statistics";
+import { useStatistics } from "../../core/statistics/useStatistics";
+import { getWorkPid } from "../../core/utils/helpers/general";
 import {
   getUrlQueryParam,
   setQueryParametersInUrl
 } from "../../core/utils/helpers/url";
+import { usePatronData } from "../../core/utils/helpers/usePatronData";
+import { isAnonymous, isBlocked } from "../../core/utils/helpers/user";
+import { useText } from "../../core/utils/text";
+import { Manifestation, Work } from "../../core/utils/types/entities";
+import { WorkId } from "../../core/utils/types/ids";
+import { useGetWork } from "../../core/utils/useGetWork";
 import {
-  getDetailsListData,
-  getInfomediaIds,
   divideManifestationsByMaterialType,
   getBestMaterialTypeForWork,
+  getDetailsListData,
+  getInfomediaIds,
   getManifestationsOrderByTypeAndYear,
   isParallelReservation
 } from "./helper";
-import { Manifestation, Work } from "../../core/utils/types/entities";
-import { PeriodicalEdition } from "../../components/material/periodical/helper";
-import InfomediaModal from "../../components/material/infomedia/InfomediaModal";
-import { useStatistics } from "../../core/statistics/useStatistics";
-import { statistics } from "../../core/statistics/statistics";
-import DisclosureControllable from "../../components/Disclosures/DisclosureControllable";
-import DigitalModal from "../../components/material/digital-modal/DigitalModal";
-import { hasCorrectAccess } from "../../components/material/material-buttons/helper";
-import MaterialHeader from "../../components/material/MaterialHeader";
-import MaterialSkeleton from "../../components/material/MaterialSkeleton";
-import DisclosureSummary from "../../components/Disclosures/DisclosureSummary";
 import MaterialDisclosure from "./MaterialDisclosure";
-import { isAnonymous, isBlocked } from "../../core/utils/helpers/user";
 import ReservationFindOnShelfModals from "./ReservationFindOnShelfModals";
-import { usePatronData } from "../../core/utils/helpers/usePatronData";
-import { useGetWork } from "../../core/utils/useGetWork";
-import { getWorkPid } from "../../core/utils/helpers/general";
 
 export interface MaterialProps {
   wid: WorkId;
@@ -104,25 +104,27 @@ const Material: React.FC<MaterialProps> = ({ wid }) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [data]);
 
-  // This useEffect selects the current manifestation.
   useEffect(() => {
     if (!data?.work) return;
     const { work } = data as { work: Work };
-    const type = getUrlQueryParam("type");
+
+    const urlType = getUrlQueryParam("type");
     const manifestationsByMaterialType = divideManifestationsByMaterialType(
       work.manifestations.all
     );
-    // If there is no type in the url, we select one.
-    if (!type) {
+
+    const urlTypeIsPresentInManifestations =
+      urlType && manifestationsByMaterialType[urlType]?.length > 0;
+
+    if (urlTypeIsPresentInManifestations) {
+      // Use the type from the URL if it's present in the manifestations
+      setSelectedManifestations(manifestationsByMaterialType[urlType]);
+    } else {
+      // Otherwise, fallback to the best material type for the work
       const bestMaterialType = getBestMaterialTypeForWork(work);
       setSelectedManifestations(manifestationsByMaterialType[bestMaterialType]);
-      setQueryParametersInUrl({
-        type: bestMaterialType
-      });
-      return;
+      setQueryParametersInUrl({ type: bestMaterialType });
     }
-    // If there is a type, use it to select a group of manifestations.
-    setSelectedManifestations(manifestationsByMaterialType[type]);
   }, [data]);
 
   if (isLoading || !data?.work || !selectedManifestations) {