regalijan/car-crushers-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Take 1 at trying to stop double clicks

Browse Source
This commit is contained in:
Regalijan 2025-02-01 04:10:04 -05:00
parent 1bed3edaf9
commit e7c6b8fa5b
Signed by: regalijan
GPG Key ID: 5D4196DA269EF520
1 changed files with 57 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
app/routes/events-team.tsx
View File

@ -119,9 +119,14 @@ export default function () {
} = useDisclosure();
const toast = useToast();
const [selectedEvent, setSelectedEvent] = useState("");
const [disableClicks, setDisableClicks] = useState(false);
const [showOld, setShowOld] = useState(false);
async function decide(approved: boolean, eventId: string) {
if (disableClicks) return;
setDisableClicks(true);
const decisionResp = await fetch(
`/api/events-team/events/${eventId}/decision`,
{
@ -146,6 +151,7 @@ export default function () {
title: "Oops!",
});
setDisableClicks(false);
return;
}
@ -162,9 +168,14 @@ export default function () {
newEventData[eventIdx].pending = false;
setEventData([...newEventData]);
setDisableClicks(false);
}
async function certify(eventId: string) {
if (disableClicks) return;
setDisableClicks(true);
const certifyResp = await fetch(
`/api/events-team/events/${eventId}/certify`,
{
@ -189,6 +200,7 @@ export default function () {
title: "Failed to certify game night",
});
setDisableClicks(false);
return;
}
@ -205,9 +217,12 @@ export default function () {
setEventData([...newEventData]);
setSelectedEvent("");
setDisableClicks(false);
}
async function markComplete(eventId: string) {
setDisableClicks(true);
const completeResp = await fetch(
`/api/events-team/events/${eventId}/complete`,
{
@ -234,6 +249,7 @@ export default function () {
title: "Failed to complete",
});
setDisableClicks(false);
return;
}
@ -251,9 +267,12 @@ export default function () {
setEventData([...newEventData]);
setSelectedEvent("");
setDisableClicks(false);
}
async function markForgotten(eventId: string) {
setDisableClicks(true);
const forgottenResp = await fetch(
`/api/events-team/events/${eventId}/forgotten`,
{
@ -280,6 +299,7 @@ export default function () {
title: "Failed to forget",
});
setDisableClicks(false);
return;
}
@ -288,9 +308,12 @@ export default function () {
newEventData[eventData.findIndex((e) => e.id === eventId)].performed_at = 0;
setEventData([...newEventData]);
setSelectedEvent("");
setDisableClicks(false);
}
async function deleteEvent(eventId: string) {
setDisableClicks(true);
const deleteResp = await fetch(`/api/events-team/events/${eventId}`, {
method: "DELETE",
});
@ -310,14 +333,18 @@ export default function () {
title: "Failed to delete",
});
setDisableClicks(false);
return;
}
setEventData(eventData.filter((e) => e.id !== eventId));
setSelectedEvent("");
setDisableClicks(false);
}
async function reschedule(eventId: string) {
setDisableClicks(true);
const newDate = (
document.getElementById("reschedule-input") as HTMLInputElement
).value;
@ -343,6 +370,7 @@ export default function () {
title: "Failed to reschedule",
});
setDisableClicks(false);
return;
}
@ -352,6 +380,7 @@ export default function () {
setEventData([...newEventData]);
setSelectedEvent("");
onRescheduleClose();
setDisableClicks(false);
toast({
description: `Event rescheduled to ${newDate}`,
status: "success",
@ -373,11 +402,16 @@ export default function () {
</Text>
</ModalBody>
<ModalFooter>
<Button colorScheme="red" onClick={onClose}>
<Button
colorScheme="red"
disabled={disableClicks}
onClick={onClose}
>
Cancel
</Button>
<Button
colorScheme="blue"
disabled={disableClicks}
ml="8px"
onClick={async () => {
await certify(selectedEvent);
@ -401,9 +435,12 @@ export default function () {
</Text>
</ModalBody>
<ModalFooter>
<Button onClick={closeComplete}>Cancel</Button>
<Button disabled={disableClicks} onClick={closeComplete}>
Cancel
</Button>
<Button
colorScheme="blue"
disabled={disableClicks}
ml="8px"
onClick={async () => await markComplete(selectedEvent)}
>
@ -422,9 +459,12 @@ export default function () {
will be given a 5 point penalty.
</ModalBody>
<ModalFooter>
<Button onClick={onForgottenClose}>Cancel</Button>
<Button disabled={disableClicks} onClick={onForgottenClose}>
Cancel
</Button>
<Button
colorScheme="blue"
disabled={disableClicks}
ml="8px"
onClick={async () => await markForgotten(selectedEvent)}
>
@ -443,9 +483,12 @@ export default function () {
want to continue?
</ModalBody>
<ModalFooter>
<Button onClick={onDeleteClose}>Cancel</Button>
<Button disabled={disableClicks} onClick={onDeleteClose}>
Cancel
</Button>
<Button
colorScheme="red"
disabled={disableClicks}
ml="8px"
onClick={async () => await deleteEvent(selectedEvent)}
>
@ -478,9 +521,12 @@ export default function () {
</Text>
</ModalBody>
<ModalFooter>
<Button onClick={onRescheduleClose}>Cancel</Button>
<Button disabled={disableClicks} onClick={onRescheduleClose}>
Cancel
</Button>
<Button
colorScheme="blue"
disabled={disableClicks}
ml="8px"
onClick={async () => await reschedule(selectedEvent)}
>
@ -585,12 +631,14 @@ export default function () {
<>
<Button
colorScheme="red"
disabled={disableClicks}
onClick={async () => await decide(false, event.id)}
>
Reject
</Button>
<Button
colorScheme="blue"
disabled={disableClicks}
onClick={async () => await decide(true, event.id)}
>
Approve
@ -603,6 +651,7 @@ export default function () {
<>
<Button
colorScheme="blue"
disabled={disableClicks}
onClick={() => {
setSelectedEvent(event.id);
openComplete();
@ -612,6 +661,7 @@ export default function () {
</Button>
<Button
colorScheme="red"
disabled={disableClicks}
onClick={() => {
setSelectedEvent(event.id);
onForgottenOpen();
@ -628,6 +678,7 @@ export default function () {
!event.reached_minimum_player_count ? (
<Button
colorScheme="blue"
disabled={disableClicks}
onClick={() => {
setSelectedEvent(event.id);
onOpen();
@ -650,6 +701,7 @@ export default function () {
<IconButton
alignSelf="center"
aria-label="Delete event"
disabled={disableClicks}
display={
(event.created_by === user_id &&
event.day > new Date().getUTCDate()) ||