Change input type for volunteer log popup; Work on rendering coluntee… #72
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| useEffect(() => { | ||
| fetchData('/api/events/user') | ||
| .then(data => setEvents(data)) | ||
| .catch(err => setError(err)); | ||
| }, []); |
There was a problem hiding this comment.
This /api/events/user endpoint doesn't seem to exist
There was a problem hiding this comment.
I don't seem to find this error in my code. This code is responsible for fetching and displaying the signed events in the Volunteer dashboard and it seems to work fine. There is also a endpoint for this in the project.
There was a problem hiding this comment.
Did you push all your changes? Since currently the repository doesn't have a pages/api/events/user.ts, if we do a fetch on this endpoint, it is expected to reach 404, which is what happened as I ran the code.
|
|
||
| /** | ||
| * Helper function to format the time into a readable AM/PM format. | ||
| * | ||
| * Takes in an unformatted time and returns a formatted one. | ||
| */ | ||
| export const formatAMPM = (date: { | ||
| getHours: () => any; | ||
| getMinutes: () => any; | ||
| }) => { | ||
| var hours = date.getHours(); | ||
| var minutes = date.getMinutes(); | ||
| var ampm = hours >= 12 ? 'PM' : 'AM'; | ||
| hours = hours % 12; | ||
| hours = hours ? hours : 12; // the hour '0' should be '12' | ||
| minutes = minutes < 10 ? '0' + minutes : minutes; | ||
| var strTime = hours + ':' + minutes + ' ' + ampm; | ||
| return strTime; | ||
| }; |
There was a problem hiding this comment.
Move the helper functions to here.
| // Display success message | ||
| const successMessage = (message: string) => { | ||
| messageApi.open({ | ||
| type: 'success', | ||
| content: message, | ||
| }); | ||
| }; | ||
|
|
||
| // Display error message | ||
| const errorMessage = (message: string) => { | ||
| messageApi.open({ | ||
| type: 'error', | ||
| content: message, | ||
| }); | ||
| }; |
There was a problem hiding this comment.
Use antd message here to display success/error message in frontend.
| try { | ||
| // Implement endpoint for VolunteerEventApplication and call it | ||
| const response = await fetch('/api/volunteerLogs/create', { | ||
| method: 'POST', | ||
| body: data, | ||
| }); | ||
| if (response.status === 200) { | ||
| const message = (await response.json()).message; | ||
| setShowPopup(false); | ||
| successMessage(message); | ||
| } else { | ||
| const message = (await response.json()).message; | ||
| errorMessage(message); | ||
| } | ||
| } catch (err) { | ||
| errorMessage('Sorry an error occurred'); | ||
| } |
There was a problem hiding this comment.
When we get the response from backend, we need to decide whether it's a success or a failure.
Implemented a function to display the events user signed up for in Log Hour popup modal
Implemented the submit button to add the volunteer log data in database