From 8f6a9c4a48a9459fcf34dcedddd9c17552526744 Mon Sep 17 00:00:00 2001 From: chark1es Date: Mon, 17 Feb 2025 02:17:55 -0800 Subject: [PATCH] fetch directly from server for files --- .../dashboard/Officer_EventManagement.astro | 139 +++++++++++------- .../Officer_EventManagement/FilePreview.tsx | 2 - 2 files changed, 83 insertions(+), 58 deletions(-) diff --git a/src/components/dashboard/Officer_EventManagement.astro b/src/components/dashboard/Officer_EventManagement.astro index ec284f1..01972d8 100644 --- a/src/components/dashboard/Officer_EventManagement.astro +++ b/src/components/dashboard/Officer_EventManagement.astro @@ -1943,7 +1943,7 @@ const currentPage = eventResponse.page; } // Update the openDetailsModal function to use the universal preview - window.openDetailsModal = function ( + window.openDetailsModal = async function ( event: Event, activeTab: string = "files" ) { @@ -1956,72 +1956,71 @@ const currentPage = eventResponse.page; if (!modal || !filesContent || !attendeesContent || !tabs) return; - // Show modal - modal.showModal(); + try { + // Fetch fresh event data + const freshEvent = await get.getOne("events", event.id); - // Update files list - if (event.files && event.files.length > 0) { - filesContent.innerHTML = ` -
- ${updateFilePreviewButtons(event.files, event.id)} -
- `; - } else { - filesContent.innerHTML = ` -
-

No files attached to this event

-
- `; - } + // Show modal + modal.showModal(); - // Update Attendees component props initially - const attendeesComponent = - attendeesContent.querySelector("astro-island"); - if (attendeesComponent) { - const component = - attendeesComponent.querySelector("[data-astro-cid]"); - if (component) { - component.setAttribute("eventId", event.id); - component.setAttribute( - "attendees", - JSON.stringify(event.attendees || []) - ); - } - } - - // Show the requested tab - const targetTab = Array.from(tabs).find( - (tab) => (tab as HTMLElement).dataset.tab === activeTab - ); - if (targetTab) { - tabs.forEach((t) => t.classList.remove("tab-active")); - targetTab.classList.add("tab-active"); - - if (activeTab === "files") { - filesContent.classList.remove("hidden"); - attendeesContent.classList.add("hidden"); + // Update files list with fresh data + if (freshEvent.files && freshEvent.files.length > 0) { + filesContent.innerHTML = ` +
+ ${updateFilePreviewButtons(freshEvent.files, freshEvent.id)} +
+ `; } else { - filesContent.classList.add("hidden"); - attendeesContent.classList.remove("hidden"); + filesContent.innerHTML = ` +
+

No files attached to this event

+
+ `; } - } - // Add tab functionality - tabs.forEach((tab) => { - tab.addEventListener("click", () => { - const tabName = (tab as HTMLElement).dataset.tab; + // Update Attendees component props with fresh data + const attendeesComponent = + attendeesContent.querySelector("astro-island"); + if (attendeesComponent) { + const component = + attendeesComponent.querySelector("[data-astro-cid]"); + if (component) { + component.setAttribute("eventId", freshEvent.id); + component.setAttribute( + "attendees", + JSON.stringify(freshEvent.attendees || []) + ); + } + } + + // Show the requested tab + const targetTab = Array.from(tabs).find( + (tab) => (tab as HTMLElement).dataset.tab === activeTab + ); + if (targetTab) { tabs.forEach((t) => t.classList.remove("tab-active")); - tab.classList.add("tab-active"); + targetTab.classList.add("tab-active"); - if (tabName === "files") { + if (activeTab === "files") { filesContent.classList.remove("hidden"); attendeesContent.classList.add("hidden"); } else { filesContent.classList.add("hidden"); attendeesContent.classList.remove("hidden"); } - }); - }); + } + } catch (error) { + console.error("Failed to fetch fresh event data:", error); + // Show error message in modal + filesContent.innerHTML = ` +
+ + + + Failed to load event data. Please try again. +
+ `; + } }; // Add file input change handler to show selected files @@ -2196,7 +2195,7 @@ const currentPage = eventResponse.page; }; // Update the showFilePreview function for officer section - window.showFilePreviewOfficer = function (file: { + window.showFilePreviewOfficer = async function (file: { url: string; name: string; }) { @@ -2204,7 +2203,35 @@ const currentPage = eventResponse.page; console.error("Invalid file data provided"); return; } - window.previewFileOfficer(file.url, file.name); + + try { + // Extract event ID from the URL + const urlParts = file.url.split("/"); + const eventId = urlParts[urlParts.length - 2]; // Event ID is second to last in the URL + + // Fetch fresh event data to ensure we have the latest file information + const freshEvent = await get.getOne("events", eventId); + + // Verify the file still exists in the event + if (!freshEvent.files.includes(file.name)) { + throw new Error("File no longer exists in the event"); + } + + // Get fresh URL from FileManager to ensure we have the latest + const freshUrl = fileManager.getFileUrl( + "events", + eventId, + file.name + ); + + // Show the preview with fresh URL + window.previewFileOfficer(freshUrl, file.name); + } catch (error) { + console.error("Failed to fetch fresh file data:", error); + alert( + "Failed to load file preview. The file may have been deleted or modified." + ); + } }; // Make helper functions available globally diff --git a/src/components/dashboard/Officer_EventManagement/FilePreview.tsx b/src/components/dashboard/Officer_EventManagement/FilePreview.tsx index ad75499..abfbc76 100644 --- a/src/components/dashboard/Officer_EventManagement/FilePreview.tsx +++ b/src/components/dashboard/Officer_EventManagement/FilePreview.tsx @@ -1,5 +1,3 @@ -'use client'; - import React, { useEffect, useState, useCallback, useMemo } from 'react'; import hljs from 'highlight.js'; import 'highlight.js/styles/github-dark.css';