From e1b68c18483ab4274476a275d4a65bdb84ffb888 Mon Sep 17 00:00:00 2001 From: Adam Antal Date: Tue, 9 Apr 2024 15:47:15 +0200 Subject: [PATCH] Show a loading reserve button on material page until all data is loaded --- .../physical/MaterialButtonsPhysical.tsx | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/src/components/material/material-buttons/physical/MaterialButtonsPhysical.tsx b/src/components/material/material-buttons/physical/MaterialButtonsPhysical.tsx index c713d7c426..e9fe48bb89 100644 --- a/src/components/material/material-buttons/physical/MaterialButtonsPhysical.tsx +++ b/src/components/material/material-buttons/physical/MaterialButtonsPhysical.tsx @@ -13,6 +13,8 @@ import MaterialButtonLoading from "../generic/MaterialButtonLoading"; import MaterialButtonDisabled from "../generic/MaterialButtonDisabled"; import { useText } from "../../../../core/utils/text"; import { usePatronData } from "../../../../core/utils/helpers/usePatronData"; +import useGetAvailability from "../../../../core/utils/useGetAvailability"; +import { useConfig } from "../../../../core/utils/config"; export interface MaterialButtonsPhysicalProps { manifestations: Manifestation[]; @@ -26,14 +28,23 @@ const MaterialButtonsPhysical: React.FC = ({ dataCy = "material-buttons-physical" }) => { const t = useText(); + const config = useConfig(); const faustIds = getAllFaustIds(manifestations); + // We extract loading of Availability here, as it isn't possible within + // UseReservableManifestations. React query uses cached version of the data + // so we can determine if the request inside UseReservableManifestations is + // loading this way. + const { isLoading: isLoadingAvailability } = useGetAvailability({ + faustIds, + config + }); const { reservableManifestations } = UseReservableManifestations({ manifestations }); const { data: userData, isLoading } = usePatronData(); const isUserBlocked = !!(userData?.patron && isBlocked(userData?.patron)); - if (isLoading) { + if (isLoading || isLoadingAvailability) { return ; }