Add authentication #17
3 changed files with 166 additions and 261 deletions
|
@ -26,7 +26,6 @@ interface ExtendedEventRequest extends EventRequest {
|
||||||
};
|
};
|
||||||
[key: string]: any;
|
[key: string]: any;
|
||||||
};
|
};
|
||||||
feedback?: string;
|
|
||||||
[key: string]: any; // For other optional properties
|
[key: string]: any; // For other optional properties
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -41,14 +40,9 @@ try {
|
||||||
console.log("Fetching event requests in Astro component...");
|
console.log("Fetching event requests in Astro component...");
|
||||||
// Expand the requested_user field to get user details
|
// Expand the requested_user field to get user details
|
||||||
allEventRequests = await get
|
allEventRequests = await get
|
||||||
.getAll<ExtendedEventRequest>(
|
.getAll<ExtendedEventRequest>(Collections.EVENT_REQUESTS, "", "-created", {
|
||||||
Collections.EVENT_REQUESTS,
|
|
||||||
"",
|
|
||||||
"-created",
|
|
||||||
{
|
|
||||||
expand: ["requested_user"],
|
expand: ["requested_user"],
|
||||||
}
|
})
|
||||||
)
|
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
console.error("Error in get.getAll:", err);
|
console.error("Error in get.getAll:", err);
|
||||||
// Return empty array instead of throwing
|
// Return empty array instead of throwing
|
||||||
|
@ -56,7 +50,7 @@ try {
|
||||||
});
|
});
|
||||||
|
|
||||||
console.log(
|
console.log(
|
||||||
`Fetched ${allEventRequests.length} event requests in Astro component`
|
`Fetched ${allEventRequests.length} event requests in Astro component`,
|
||||||
);
|
);
|
||||||
|
|
||||||
// Process the event requests to add the requested_user_expand property
|
// Process the event requests to add the requested_user_expand property
|
||||||
|
@ -100,21 +94,16 @@ try {
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<div class="mb-8">
|
<div class="mb-8">
|
||||||
<h1 class="text-3xl font-bold text-white mb-2">
|
<h1 class="text-3xl font-bold text-white mb-2">Event Request Management</h1>
|
||||||
Event Request Management
|
|
||||||
</h1>
|
|
||||||
<p class="text-gray-300 mb-4">
|
<p class="text-gray-300 mb-4">
|
||||||
Review and manage event requests submitted by officers. Update
|
Review and manage event requests submitted by officers. Update status and
|
||||||
status, provide feedback, and coordinate with the team.
|
coordinate with the team.
|
||||||
</p>
|
</p>
|
||||||
<div class="bg-base-300/50 p-4 rounded-lg text-sm text-gray-300">
|
<div class="bg-base-300/50 p-4 rounded-lg text-sm text-gray-300">
|
||||||
<p class="font-medium mb-2">As an executive officer, you can:</p>
|
<p class="font-medium mb-2">As an executive officer, you can:</p>
|
||||||
<ul class="list-disc list-inside space-y-1 ml-2">
|
<ul class="list-disc list-inside space-y-1 ml-2">
|
||||||
<li>View all submitted event requests</li>
|
<li>View all submitted event requests</li>
|
||||||
<li>
|
<li>Update the status of requests (Pending, Completed, Declined)</li>
|
||||||
Update the status of requests (Pending, Completed, Declined)
|
|
||||||
</li>
|
|
||||||
<li>Add comments or feedback for the requesting officer</li>
|
|
||||||
<li>Filter and sort requests by various criteria</li>
|
<li>Filter and sort requests by various criteria</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
@ -181,7 +170,7 @@ try {
|
||||||
Collections.EVENT_REQUESTS,
|
Collections.EVENT_REQUESTS,
|
||||||
"",
|
"",
|
||||||
"-created",
|
"-created",
|
||||||
{ expand: "requested_user" }
|
{ expand: "requested_user" },
|
||||||
);
|
);
|
||||||
console.log("Initial data sync complete");
|
console.log("Initial data sync complete");
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
|
@ -195,7 +184,7 @@ try {
|
||||||
errorElement.textContent?.includes("Authentication error")
|
errorElement.textContent?.includes("Authentication error")
|
||||||
) {
|
) {
|
||||||
console.log(
|
console.log(
|
||||||
"Authentication error detected in UI, redirecting to login..."
|
"Authentication error detected in UI, redirecting to login...",
|
||||||
);
|
);
|
||||||
// Redirect to login page after a short delay
|
// Redirect to login page after a short delay
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
@ -208,11 +197,11 @@ try {
|
||||||
const tableContainer = document.querySelector(".event-table-container");
|
const tableContainer = document.querySelector(".event-table-container");
|
||||||
if (tableContainer) {
|
if (tableContainer) {
|
||||||
console.log(
|
console.log(
|
||||||
"Event table container found, component should load normally"
|
"Event table container found, component should load normally",
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
console.log(
|
console.log(
|
||||||
"Event table container not found, might be an issue with rendering"
|
"Event table container not found, might be an issue with rendering",
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -12,14 +12,12 @@ interface ExtendedEventRequest extends SchemaEventRequest {
|
||||||
email: string;
|
email: string;
|
||||||
};
|
};
|
||||||
invoice_data?: string | any;
|
invoice_data?: string | any;
|
||||||
feedback?: string;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface EventRequestDetailsProps {
|
interface EventRequestDetailsProps {
|
||||||
request: ExtendedEventRequest;
|
request: ExtendedEventRequest;
|
||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
onStatusChange: (id: string, status: "submitted" | "pending" | "completed" | "declined") => Promise<void>;
|
onStatusChange: (id: string, status: "submitted" | "pending" | "completed" | "declined") => Promise<void>;
|
||||||
onFeedbackChange: (id: string, feedback: string) => Promise<boolean>;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Separate component for AS Funding tab to isolate any issues
|
// Separate component for AS Funding tab to isolate any issues
|
||||||
|
@ -225,11 +223,8 @@ const InvoiceTable: React.FC<{ invoiceData: any }> = ({ invoiceData }) => {
|
||||||
const EventRequestDetails = ({
|
const EventRequestDetails = ({
|
||||||
request,
|
request,
|
||||||
onClose,
|
onClose,
|
||||||
onStatusChange,
|
onStatusChange
|
||||||
onFeedbackChange
|
|
||||||
}: EventRequestDetailsProps): React.ReactNode => {
|
}: EventRequestDetailsProps): React.ReactNode => {
|
||||||
const [feedback, setFeedback] = useState<string>(request.feedback || '');
|
|
||||||
const [isSaving, setIsSaving] = useState<boolean>(false);
|
|
||||||
const [activeTab, setActiveTab] = useState<'details' | 'pr' | 'funding'>('details');
|
const [activeTab, setActiveTab] = useState<'details' | 'pr' | 'funding'>('details');
|
||||||
const [status, setStatus] = useState<"submitted" | "pending" | "completed" | "declined">(request.status);
|
const [status, setStatus] = useState<"submitted" | "pending" | "completed" | "declined">(request.status);
|
||||||
const [isStatusChanging, setIsStatusChanging] = useState(false);
|
const [isStatusChanging, setIsStatusChanging] = useState(false);
|
||||||
|
@ -269,22 +264,6 @@ const EventRequestDetails = ({
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// Handle saving feedback
|
|
||||||
const handleSaveFeedback = async () => {
|
|
||||||
if (feedback === request.feedback) {
|
|
||||||
toast('No changes to save', { icon: 'ℹ️' });
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
setIsSaving(true);
|
|
||||||
const success = await onFeedbackChange(request.id, feedback);
|
|
||||||
setIsSaving(false);
|
|
||||||
|
|
||||||
if (success) {
|
|
||||||
toast.success('Feedback saved successfully');
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// Handle status change
|
// Handle status change
|
||||||
const handleStatusChange = async (newStatus: "submitted" | "pending" | "completed" | "declined") => {
|
const handleStatusChange = async (newStatus: "submitted" | "pending" | "completed" | "declined") => {
|
||||||
setIsStatusChanging(true);
|
setIsStatusChanging(true);
|
||||||
|
@ -479,36 +458,6 @@ const EventRequestDetails = ({
|
||||||
<ASFundingTab request={request} />
|
<ASFundingTab request={request} />
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Feedback section */}
|
|
||||||
<div className="p-4 border-t border-base-300">
|
|
||||||
<h4 className="text-sm font-medium text-gray-400 mb-2">Feedback for Requester</h4>
|
|
||||||
<div className="flex flex-col gap-3">
|
|
||||||
<textarea
|
|
||||||
className="textarea textarea-bordered w-full"
|
|
||||||
placeholder="Add feedback or notes for the event requester..."
|
|
||||||
rows={3}
|
|
||||||
value={feedback}
|
|
||||||
onChange={(e) => setFeedback(e.target.value)}
|
|
||||||
></textarea>
|
|
||||||
<div className="flex justify-end">
|
|
||||||
<button
|
|
||||||
className="btn btn-primary btn-sm"
|
|
||||||
onClick={handleSaveFeedback}
|
|
||||||
disabled={isSaving || feedback === request.feedback}
|
|
||||||
>
|
|
||||||
{isSaving ? (
|
|
||||||
<>
|
|
||||||
<span className="loading loading-spinner loading-xs"></span>
|
|
||||||
Saving...
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
'Save Feedback'
|
|
||||||
)}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</motion.div>
|
</motion.div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
@ -25,7 +25,6 @@ interface ExtendedEventRequest extends SchemaEventRequest {
|
||||||
[key: string]: any;
|
[key: string]: any;
|
||||||
};
|
};
|
||||||
invoice_data?: any;
|
invoice_data?: any;
|
||||||
feedback?: string;
|
|
||||||
status: "submitted" | "pending" | "completed" | "declined";
|
status: "submitted" | "pending" | "completed" | "declined";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -176,37 +175,6 @@ const EventRequestManagementTable = ({ eventRequests: initialEventRequests }: Ev
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// Add feedback to event request
|
|
||||||
const addFeedback = async (id: string, feedback: string) => {
|
|
||||||
try {
|
|
||||||
const update = Update.getInstance();
|
|
||||||
const result = await update.updateField('event_request', id, 'feedback', feedback);
|
|
||||||
|
|
||||||
// Update local state
|
|
||||||
setEventRequests(prev =>
|
|
||||||
prev.map(request =>
|
|
||||||
request.id === id ? { ...request, feedback } : request
|
|
||||||
)
|
|
||||||
);
|
|
||||||
|
|
||||||
setFilteredRequests(prev =>
|
|
||||||
prev.map(request =>
|
|
||||||
request.id === id ? { ...request, feedback } : request
|
|
||||||
)
|
|
||||||
);
|
|
||||||
|
|
||||||
// Force sync to update IndexedDB
|
|
||||||
await dataSync.syncCollection<ExtendedEventRequest>(Collections.EVENT_REQUESTS);
|
|
||||||
|
|
||||||
// Remove success toast for saving feedback
|
|
||||||
return true;
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Error saving feedback:', error);
|
|
||||||
toast.error('Failed to save feedback');
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// Format date for display
|
// Format date for display
|
||||||
const formatDate = (dateString: string) => {
|
const formatDate = (dateString: string) => {
|
||||||
if (!dateString) return 'Not specified';
|
if (!dateString) return 'Not specified';
|
||||||
|
@ -616,7 +584,6 @@ const EventRequestManagementTable = ({ eventRequests: initialEventRequests }: Ev
|
||||||
request={selectedRequest}
|
request={selectedRequest}
|
||||||
onClose={closeModal}
|
onClose={closeModal}
|
||||||
onStatusChange={updateEventRequestStatus}
|
onStatusChange={updateEventRequestStatus}
|
||||||
onFeedbackChange={addFeedback}
|
|
||||||
/>
|
/>
|
||||||
</AnimatePresence>
|
</AnimatePresence>
|
||||||
)}
|
)}
|
||||||
|
|
Loading…
Reference in a new issue