Webmaster/ieeeucsd-org
3
1
Fork 0
Code Issues 11 Pull requests Projects Releases Packages Wiki Activity Actions

update imports

Browse source
This commit is contained in:
chark1es 2025-02-16 16:53:02 -08:00
parent a8fb9e02e5
commit ccd2490164
8 changed files with 152 additions and 98 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

236
src/components/dashboard/Officer_EventManagement.astro
View file

@ -1,7 +1,7 @@
--- ---
import { Icon } from "astro-icon/components"; import { Icon } from "astro-icon/components";
import { Get } from "../pocketbase/Get"; import { Get } from "../../scripts/pocketbase/Get";
import { Authentication } from "../pocketbase/Authentication"; import { Authentication } from "../../scripts/pocketbase/Authentication";
import EventEditor from "./Officer_EventManagement/EventEditor"; import EventEditor from "./Officer_EventManagement/EventEditor";
import FilePreview from "./Officer_EventManagement/FilePreview"; import FilePreview from "./Officer_EventManagement/FilePreview";
import Attendees from "./Officer_EventManagement/Attendees"; import Attendees from "./Officer_EventManagement/Attendees";
@ -649,7 +649,7 @@ const currentPage = eventResponse.page;
</div> </div>
<div id="attendeesContent" class="space-y-4 hidden"> <div id="attendeesContent" class="space-y-4 hidden">
<Attendees client:load eventId="" attendees={[]} /> <Attendees client:load />
</div> </div>
</div> </div>
<form method="dialog" class="modal-backdrop"> <form method="dialog" class="modal-backdrop">
@ -694,9 +694,22 @@ const currentPage = eventResponse.page;
<div class="modal-box max-w-4xl"> <div class="modal-box max-w-4xl">
<div class="flex justify-between items-center mb-4"> <div class="flex justify-between items-center mb-4">
<h3 class="font-bold text-lg" id="attendeesModalTitle"></h3> <h3 class="font-bold text-lg" id="attendeesModalTitle"></h3>
<button class="btn btn-circle btn-ghost" onclick="attendeesModal.close()"> <button
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> class="btn btn-circle btn-ghost"
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path> onclick="attendeesModal.close()"
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M6 18L18 6M6 6l12 12"></path>
</svg> </svg>
</button> </button>
</div> </div>
@ -1782,7 +1795,7 @@ const currentPage = eventResponse.page;
// Update the showFilePreview function // Update the showFilePreview function
window.showFilePreview = function (file: { url: string; name: string }) { window.showFilePreview = function (file: { url: string; name: string }) {
console.log('showFilePreview called with:', file); console.log("showFilePreview called with:", file);
window.previewFile(file.url, file.name); window.previewFile(file.url, file.name);
}; };
@ -1814,46 +1827,54 @@ const currentPage = eventResponse.page;
// Universal file preview function // Universal file preview function
window.previewFile = function (url: string, filename: string) { window.previewFile = function (url: string, filename: string) {
console.log('previewFile called with:', { url, filename }); console.log("previewFile called with:", { url, filename });
const modal = document.getElementById("filePreviewModal") as HTMLDialogElement; const modal = document.getElementById(
const filePreview = document.getElementById("officerFilePreview") as any; "filePreviewModal"
) as HTMLDialogElement;
const filePreview = document.getElementById(
"officerFilePreview"
) as any;
const previewFileName = document.getElementById("previewFileName"); const previewFileName = document.getElementById("previewFileName");
if (filePreview && modal && previewFileName) { if (filePreview && modal && previewFileName) {
console.log('Found all required elements'); console.log("Found all required elements");
// Update the filename display // Update the filename display
previewFileName.textContent = filename; previewFileName.textContent = filename;
// Show the modal // Show the modal
modal.showModal(); modal.showModal();
// Update the preview component // Update the preview component
console.log('Dispatching updateFilePreview event'); console.log("Dispatching updateFilePreview event");
const event = new CustomEvent("updateFilePreview", { const event = new CustomEvent("updateFilePreview", {
detail: { url, filename } detail: { url, filename },
}); });
filePreview.dispatchEvent(event); filePreview.dispatchEvent(event);
} else { } else {
console.error('Missing required elements:', { console.error("Missing required elements:", {
modal: !!modal, modal: !!modal,
filePreview: !!filePreview, filePreview: !!filePreview,
previewFileName: !!previewFileName previewFileName: !!previewFileName,
}); });
} }
}; };
// Close file preview // Close file preview
window.closeFilePreview = function () { window.closeFilePreview = function () {
console.log('closeFilePreview called'); console.log("closeFilePreview called");
const modal = document.getElementById("filePreviewModal") as HTMLDialogElement; const modal = document.getElementById(
const filePreview = document.getElementById("officerFilePreview") as any; "filePreviewModal"
) as HTMLDialogElement;
const filePreview = document.getElementById(
"officerFilePreview"
) as any;
const previewFileName = document.getElementById("previewFileName"); const previewFileName = document.getElementById("previewFileName");
if (modal && filePreview && previewFileName) { if (modal && filePreview && previewFileName) {
console.log('Resetting preview and closing modal'); console.log("Resetting preview and closing modal");
// Reset the preview // Reset the preview
const event = new CustomEvent("updateFilePreview", { const event = new CustomEvent("updateFilePreview", {
detail: { url: "", filename: "" } detail: { url: "", filename: "" },
}); });
filePreview.dispatchEvent(event); filePreview.dispatchEvent(event);
previewFileName.textContent = ""; previewFileName.textContent = "";
@ -1863,15 +1884,17 @@ const currentPage = eventResponse.page;
// Close event details modal // Close event details modal
window.closeEventDetailsModal = function () { window.closeEventDetailsModal = function () {
const modal = document.getElementById("eventDetailsModal") as HTMLDialogElement; const modal = document.getElementById(
"eventDetailsModal"
) as HTMLDialogElement;
const filesContent = document.getElementById("filesContent"); const filesContent = document.getElementById("filesContent");
const attendeesContent = document.getElementById("attendeesContent"); const attendeesContent = document.getElementById("attendeesContent");
if (modal) { if (modal) {
// Reset tab states // Reset tab states
if (filesContent && attendeesContent) { if (filesContent && attendeesContent) {
filesContent.classList.remove('hidden'); filesContent.classList.remove("hidden");
attendeesContent.classList.add('hidden'); attendeesContent.classList.add("hidden");
} }
// Close the modal // Close the modal
@ -1882,11 +1905,17 @@ const currentPage = eventResponse.page;
// Update all file preview buttons to use the universal preview // Update all file preview buttons to use the universal preview
function updateFilePreviewButtons(files: string[], eventId: string) { function updateFilePreviewButtons(files: string[], eventId: string) {
return files return files
.map( .map((filename) => {
(filename) => { const fileUrl = fileManager.getFileUrl(
const fileUrl = fileManager.getFileUrl("events", eventId, filename); "events",
const previewData = JSON.stringify({ url: fileUrl, name: filename }).replace(/'/g, "\\'"); eventId,
return ` filename
);
const previewData = JSON.stringify({
url: fileUrl,
name: filename,
}).replace(/'/g, "\\'");
return `
<div class="flex items-center justify-between p-2 bg-base-200 rounded-lg${filesToDelete.has(filename) ? " opacity-50" : ""}" data-filename="${filename}"> <div class="flex items-center justify-between p-2 bg-base-200 rounded-lg${filesToDelete.has(filename) ? " opacity-50" : ""}" data-filename="${filename}">
<div class="flex items-center gap-2 flex-1 min-w-0"> <div class="flex items-center gap-2 flex-1 min-w-0">
<span class="truncate">${filename}</span> <span class="truncate">${filename}</span>
@ -1912,17 +1941,21 @@ const currentPage = eventResponse.page;
</div> </div>
</div> </div>
`; `;
} })
)
.join(""); .join("");
} }
// Update the openDetailsModal function to use the universal preview // Update the openDetailsModal function to use the universal preview
window.openDetailsModal = function (event: Event, activeTab: string = 'files') { window.openDetailsModal = function (
const modal = document.getElementById("eventDetailsModal") as HTMLDialogElement; event: Event,
activeTab: string = "files"
) {
const modal = document.getElementById(
"eventDetailsModal"
) as HTMLDialogElement;
const filesContent = document.getElementById("filesContent"); const filesContent = document.getElementById("filesContent");
const attendeesContent = document.getElementById("attendeesContent"); const attendeesContent = document.getElementById("attendeesContent");
const tabs = document.querySelectorAll('.tabs .tab'); const tabs = document.querySelectorAll(".tabs .tab");
if (!modal || !filesContent || !attendeesContent || !tabs) return; if (!modal || !filesContent || !attendeesContent || !tabs) return;
@ -1945,43 +1978,50 @@ const currentPage = eventResponse.page;
} }
// Update Attendees component props initially // Update Attendees component props initially
const attendeesComponent = attendeesContent.querySelector('astro-island'); const attendeesComponent =
attendeesContent.querySelector("astro-island");
if (attendeesComponent) { if (attendeesComponent) {
const component = attendeesComponent.querySelector('[data-astro-cid]'); const component =
attendeesComponent.querySelector("[data-astro-cid]");
if (component) { if (component) {
component.setAttribute('eventId', event.id); component.setAttribute("eventId", event.id);
component.setAttribute('attendees', JSON.stringify(event.attendees || [])); component.setAttribute(
"attendees",
JSON.stringify(event.attendees || [])
);
} }
} }
// Show the requested tab // Show the requested tab
const targetTab = Array.from(tabs).find(tab => (tab as HTMLElement).dataset.tab === activeTab); const targetTab = Array.from(tabs).find(
(tab) => (tab as HTMLElement).dataset.tab === activeTab
);
if (targetTab) { if (targetTab) {
tabs.forEach(t => t.classList.remove('tab-active')); tabs.forEach((t) => t.classList.remove("tab-active"));
targetTab.classList.add('tab-active'); targetTab.classList.add("tab-active");
if (activeTab === 'files') { if (activeTab === "files") {
filesContent.classList.remove('hidden'); filesContent.classList.remove("hidden");
attendeesContent.classList.add('hidden'); attendeesContent.classList.add("hidden");
} else { } else {
filesContent.classList.add('hidden'); filesContent.classList.add("hidden");
attendeesContent.classList.remove('hidden'); attendeesContent.classList.remove("hidden");
} }
} }
// Add tab functionality // Add tab functionality
tabs.forEach(tab => { tabs.forEach((tab) => {
tab.addEventListener('click', () => { tab.addEventListener("click", () => {
const tabName = (tab as HTMLElement).dataset.tab; const tabName = (tab as HTMLElement).dataset.tab;
tabs.forEach(t => t.classList.remove('tab-active')); tabs.forEach((t) => t.classList.remove("tab-active"));
tab.classList.add('tab-active'); tab.classList.add("tab-active");
if (tabName === 'files') { if (tabName === "files") {
filesContent.classList.remove('hidden'); filesContent.classList.remove("hidden");
attendeesContent.classList.add('hidden'); attendeesContent.classList.add("hidden");
} else { } else {
filesContent.classList.add('hidden'); filesContent.classList.add("hidden");
attendeesContent.classList.remove('hidden'); attendeesContent.classList.remove("hidden");
} }
}); });
}); });
@ -2330,51 +2370,61 @@ const currentPage = eventResponse.page;
}; };
// Create a custom event for file preview state management // Create a custom event for file preview state management
const FILE_PREVIEW_STATE_CHANGE = 'filePreviewStateChange'; const FILE_PREVIEW_STATE_CHANGE = "filePreviewStateChange";
// Universal file preview function for officer section // Universal file preview function for officer section
window.previewFileOfficer = function (url: string, filename: string) { window.previewFileOfficer = function (url: string, filename: string) {
console.log('previewFileOfficer called with:', { url, filename }); console.log("previewFileOfficer called with:", { url, filename });
const modal = document.getElementById("filePreviewModal") as HTMLDialogElement; const modal = document.getElementById(
"filePreviewModal"
) as HTMLDialogElement;
const previewFileName = document.getElementById("previewFileName"); const previewFileName = document.getElementById("previewFileName");
if (modal && previewFileName) { if (modal && previewFileName) {
console.log('Found all required elements'); console.log("Found all required elements");
// Update the filename display // Update the filename display
previewFileName.textContent = filename; previewFileName.textContent = filename;
// Show the modal // Show the modal
modal.showModal(); modal.showModal();
// Dispatch state change event // Dispatch state change event
console.log('Dispatching state change event'); console.log("Dispatching state change event");
window.dispatchEvent(new CustomEvent(FILE_PREVIEW_STATE_CHANGE, { window.dispatchEvent(
detail: { url, filename } new CustomEvent(FILE_PREVIEW_STATE_CHANGE, {
})); detail: { url, filename },
})
);
} else { } else {
console.error('Missing required elements:', { console.error("Missing required elements:", {
modal: !!modal, modal: !!modal,
previewFileName: !!previewFileName previewFileName: !!previewFileName,
}); });
} }
}; };
// Close file preview for officer section // Close file preview for officer section
window.closeFilePreviewOfficer = function () { window.closeFilePreviewOfficer = function () {
console.log('closeFilePreviewOfficer called'); console.log("closeFilePreviewOfficer called");
const modal = document.getElementById("filePreviewModal") as HTMLDialogElement; const modal = document.getElementById(
"filePreviewModal"
) as HTMLDialogElement;
const previewContent = document.getElementById("previewContent"); const previewContent = document.getElementById("previewContent");
const previewFileName = document.getElementById("previewFileName"); const previewFileName = document.getElementById("previewFileName");
if (modal && previewContent && previewFileName) { if (modal && previewContent && previewFileName) {
console.log('Resetting preview and closing modal'); console.log("Resetting preview and closing modal");
// Reset the preview // Reset the preview
const filePreview = previewContent.querySelector('astro-island') as any; const filePreview = previewContent.querySelector(
"astro-island"
) as any;
if (filePreview) { if (filePreview) {
const component = filePreview.querySelector('[data-astro-cid]') as any; const component = filePreview.querySelector(
"[data-astro-cid]"
) as any;
if (component) { if (component) {
component.setAttribute('url', ''); component.setAttribute("url", "");
component.setAttribute('filename', ''); component.setAttribute("filename", "");
} }
} }
previewFileName.textContent = ""; previewFileName.textContent = "";
@ -2383,26 +2433,28 @@ const currentPage = eventResponse.page;
}; };
// Update the showFilePreview function for officer section // Update the showFilePreview function for officer section
window.showFilePreviewOfficer = function (file: { url: string; name: string }) { window.showFilePreviewOfficer = function (file: {
console.log('showFilePreviewOfficer called with:', file); url: string;
name: string;
}) {
console.log("showFilePreviewOfficer called with:", file);
window.previewFileOfficer(file.url, file.name); window.previewFileOfficer(file.url, file.name);
}; };
// Make helper functions available globally // Make helper functions available globally
window.updateFilePreviewButtons = updateFilePreviewButtons; window.updateFilePreviewButtons = updateFilePreviewButtons;
window.previewFileOfficer = previewFileOfficer;
window.closeFilePreviewOfficer = closeFilePreviewOfficer;
window.showFilePreviewOfficer = showFilePreviewOfficer;
// Add openAttendeesModal function // Add openAttendeesModal function
window.openAttendeesModal = function (event: Event) { window.openAttendeesModal = function (event: Event) {
console.log('Opening attendees modal for event:', event.id); console.log("Opening attendees modal for event:", event.id);
const modal = document.getElementById("attendeesModal") as HTMLDialogElement; const modal = document.getElementById(
"attendeesModal"
) as HTMLDialogElement;
const modalTitle = document.getElementById("attendeesModalTitle"); const modalTitle = document.getElementById("attendeesModalTitle");
if (!modal || !modalTitle) { if (!modal || !modalTitle) {
console.error('Missing required elements'); console.error("Missing required elements");
return; return;
} }
@ -2410,12 +2462,14 @@ const currentPage = eventResponse.page;
modalTitle.textContent = `Attendees - ${event.event_name}`; modalTitle.textContent = `Attendees - ${event.event_name}`;
// Dispatch custom event with event data // Dispatch custom event with event data
window.dispatchEvent(new CustomEvent('updateAttendees', { window.dispatchEvent(
detail: { new CustomEvent("updateAttendees", {
eventId: event.id, detail: {
eventName: event.event_name eventId: event.id,
} eventName: event.event_name,
})); },
})
);
// Show modal // Show modal
modal.showModal(); modal.showModal();

4
src/components/dashboard/Officer_EventManagement/Attendees.tsx
View file

@ -1,6 +1,6 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { Get } from '../../pocketbase/Get'; import { Get } from '../../../scripts/pocketbase/Get';
import { Authentication } from '../../pocketbase/Authentication'; import { Authentication } from '../../../scripts/pocketbase/Authentication';
// Add HighlightText component // Add HighlightText component
const HighlightText = ({ text, searchTerms }: { text: string | number | null | undefined, searchTerms: string[] }) => { const HighlightText = ({ text, searchTerms }: { text: string | number | null | undefined, searchTerms: string[] }) => {

10
src/components/dashboard/Officer_EventManagement/EventEditor.tsx
View file

@ -1,9 +1,9 @@
import React, { useState, useEffect, useCallback, useMemo, memo } from "react"; import React, { useState, useEffect, useCallback, useMemo, memo } from "react";
import { Get } from "../../pocketbase/Get"; import { Get } from "../../../scripts/pocketbase/Get";
import { Authentication } from "../../pocketbase/Authentication"; import { Authentication } from "../../../scripts/pocketbase/Authentication";
import { Update } from "../../pocketbase/Update"; import { Update } from "../../../scripts/pocketbase/Update";
import { FileManager } from "../../pocketbase/FileManager"; import { FileManager } from "../../../scripts/pocketbase/FileManager";
import { SendLog } from "../../pocketbase/SendLog"; import { SendLog } from "../../../scripts/pocketbase/SendLog";
import FilePreview from "./FilePreview"; import FilePreview from "./FilePreview";
// Extend Window interface // Extend Window interface

0
src/components/pocketbase/Authentication.ts → src/scripts/pocketbase/Authentication.ts
View file

0
src/components/pocketbase/FileManager.ts → src/scripts/pocketbase/FileManager.ts
View file

0
src/components/pocketbase/Get.ts → src/scripts/pocketbase/Get.ts
View file

0
src/components/pocketbase/SendLog.ts → src/scripts/pocketbase/SendLog.ts
View file

0
src/components/pocketbase/Update.ts → src/scripts/pocketbase/Update.ts
View file