diff --git a/src/components/dashboard/Officer_EventRequestManagement/EventRequestDetails.tsx b/src/components/dashboard/Officer_EventRequestManagement/EventRequestDetails.tsx index dee8075..b9d14d4 100644 --- a/src/components/dashboard/Officer_EventRequestManagement/EventRequestDetails.tsx +++ b/src/components/dashboard/Officer_EventRequestManagement/EventRequestDetails.tsx @@ -75,9 +75,9 @@ const FilePreviewModal: React.FC = ({ // Construct the secure file URL const auth = Authentication.getInstance(); const token = auth.getAuthToken(); - const pbUrl = import.meta.env.PUBLIC_POCKETBASE_URL; - const secureUrl = `${pbUrl}/api/files/${collectionName}/${recordId}/${fileName}?token=${token}`; + // Use hardcoded PocketBase URL + const secureUrl = `https://pocketbase.ieeeucsd.org/api/files/${collectionName}/${recordId}/${fileName}?token=${token}`; setFileUrl(secureUrl); @@ -414,10 +414,18 @@ const ASFundingTab: React.FC<{ request: ExtendedEventRequest }> = ({ request }) if (!request.as_funding_required) { return ( -
-

AS Funding Required

-

No

-
+ +
+ +

No AS Funding Required

+

This event does not require AS funding.

+
+ ); } @@ -455,87 +463,203 @@ const ASFundingTab: React.FC<{ request: ExtendedEventRequest }> = ({ request }) }; return ( -
-
-

AS Funding Required

-

Yes

+ +
+ {/* Funding Status Card */} + +
+
+ +
+
+

AS Funding Status

+

Funding has been requested for this event

+
+
+ +
+
+ Funding Status +
+
Required
+
+
+ +
+ Food & Drinks +
+ {request.food_drinks_being_served ? ( +
Yes
+ ) : ( +
No
+ )} +
+
+
+ + + {/* Invoice Summary Card (if available) */} + {invoiceData && ( + +
+
+ +
+
+

Invoice Summary

+

Quick overview of funding details

+
+
+ +
+ {typeof invoiceData === 'object' && invoiceData !== null && ( +
+ {/* Calculate total from invoiceData */} + {(() => { + let total = 0; + let items = []; + + if (invoiceData.items && Array.isArray(invoiceData.items)) { + items = invoiceData.items; + } else if (Array.isArray(invoiceData)) { + items = invoiceData; + } + + if (items.length > 0) { + total = items.reduce((sum: number, item: any) => { + const quantity = parseFloat(item?.quantity || 1); + const price = parseFloat(item?.unit_price || item?.price || 0); + return sum + (quantity * price); + }, 0); + } + + // If we have a total in the invoice data, use that instead + if (invoiceData.total) { + total = parseFloat(invoiceData.total); + } + + return ( +
+
+ Total Amount: + ${total.toFixed(2)} +
+ + {invoiceData.vendor && ( +
+ Vendor: + {invoiceData.vendor} +
+ )} + +
+ Items: + {items.length} items +
+
+ ); + })()} +
+ )} +
+ + )}
- {request.food_drinks_being_served && ( -
-

Food/Drinks Being Served

-

Yes

-
- )} - - {/* Display invoice files if available */} + {/* Invoice Files Section */} {hasInvoiceFiles ? ( -
-

Invoice Files

-
+ +
+
+ +
+
+

Invoice Files

+

Attached documentation for the funding request

+
+
+ +
{/* Display invoice_files array if available */} {request.invoice_files && request.invoice_files.map((fileId, index) => { const extension = getFileExtension(fileId); const displayName = getFriendlyFileName(fileId, 25); return ( -
openFilePreview(fileId, displayName)} + initial={{ opacity: 0, y: 5 }} + animate={{ opacity: 1, y: 0 }} + transition={{ delay: 0.3 + (index * 0.05) }} + whileHover={{ scale: 1.02 }} + whileTap={{ scale: 0.98 }} >
{isImageFile(fileId) ? ( - - - + ) : isPdfFile(fileId) ? ( - - - + ) : ( - - - + )}
-

{displayName}

+

+ {displayName} +

{extension ? extension.toUpperCase() : 'FILE'}

- - - - +
-
+ ); })} {/* Display single invoice file if available */} {request.invoice && ( -
{ const invoiceFile = request.invoice || ''; openFilePreview(invoiceFile, getFriendlyFileName(invoiceFile, 25)); }} + initial={{ opacity: 0, y: 5 }} + animate={{ opacity: 1, y: 0 }} + transition={{ delay: 0.3 + ((request.invoice_files?.length || 0) * 0.05) }} + whileHover={{ scale: 1.02 }} + whileTap={{ scale: 0.98 }} >
{isImageFile(request.invoice) ? ( - - - + ) : isPdfFile(request.invoice) ? ( - - - + ) : ( - - - + )}

@@ -545,29 +669,48 @@ const ASFundingTab: React.FC<{ request: ExtendedEventRequest }> = ({ request }) {getFileExtension(request.invoice) ? getFileExtension(request.invoice).toUpperCase() : 'FILE'}

- - - - +
-
+ )}
-
+ ) : ( - + + + )} - {/* Display invoice data if available */} -
-

Invoice Data

- -
+ {/* Invoice Data Table */} + +
+
+ +
+
+

Invoice Details

+

Itemized breakdown of the funding request

+
+
+ +
+ +
+ {/* File Preview Modal */} = ({ request }) fileName={selectedFile.name} displayName={selectedFile.displayName} /> -
+ ); }; @@ -1179,9 +1322,7 @@ const EventRequestDetails = ({ onClick={() => setActiveTab('details')} >
- - - + Event Details
@@ -1191,9 +1332,7 @@ const EventRequestDetails = ({ onClick={() => setActiveTab('funding')} >
- - - + AS Funding
@@ -1204,9 +1343,7 @@ const EventRequestDetails = ({ onClick={() => setActiveTab('pr')} >
- - - + PR Materials
@@ -1300,116 +1437,135 @@ const EventRequestDetails = ({ {/* Tab content */}
{activeTab === 'details' && ( -
-
-
-

- - - - Event Information -

-
-
- -

{request.name}

-
-
- -

{request.event_description}

-
-
-
- -

{formatDate(request.start_date_time)}

-
-
- -

{formatDate(request.end_date_time)}

-
-
-
- -

{request.location}

-
+
+
+

+ + Event Information +

+ +
+
+ +

{request.name}

+
+ +
+ +

{request.event_description}

+
+ +
+ +

{request.location}

+
+ +
+ +

{formatDate(request.start_date_time)}

+
+ +
+ +

{formatDate(request.end_date_time)}

+
-
-

- - - +
+
+

+ Requirements & Special Requests

-
-
+
+

AS Funding Required

+
{request.as_funding_required ? 'Yes' : 'No'}
-

AS Funding Required

-
-
+
+

PR Materials Needed

+
{request.flyers_needed ? 'Yes' : 'No'}
-

PR Materials Needed

-
-
+
+

Room Reservation Needed

+
{request.room_reservation_needed ? 'Yes' : 'No'}
-

Room Reservation Needed

-
-
- {request.room_reservation_needed && ( -
-

- - - + {request.room_reservation_needed ? ( +
+

+ Room Reservation Details

-
- -

{request.room_reservation_location || 'Not specified'}

+
+ +

{request.room_reservation_location || 'Not specified'}

-
- -

{request.room_reservation_confirmed ? 'Confirmed' : 'Not confirmed'}

+
+ +
+
+ {request.room_reservation_confirmed ? 'Confirmed' : 'Pending'} +
+
- )} - - {request.files && request.files.length > 0 && ( -
-

- - - - Event Files -

-
- {request.files.map((file, index) => ( - - ))} + ) : ( + request.files && request.files.length > 0 && ( +
+

+ + Event Files +

+
+ {request.files.map((file, index) => ( + + ))} +
-
+ ) )}
+ + {/* Display event files if available and not shown above */} + {!request.room_reservation_needed && request.files && request.files.length > 0 && ( +
+

+ + Event Files +

+
+ {request.files.map((file, index) => ( + + ))} +
+
+ )}
)}