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

Add mark forgotten button

Browse Source
This commit is contained in:
Regalijan 2024-09-13 16:05:01 -04:00
parent 2b7c08dbd0
commit d4cc357cc0
Signed by: regalijan
GPG Key ID: 5D4196DA269EF520
1 changed files with 66 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -23,7 +23,7 @@ import {
Text, Text,
useDisclosure, useDisclosure,
useToast, useToast,
VStack VStack,
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import { useLoaderData } from "@remix-run/react"; import { useLoaderData } from "@remix-run/react";
import { useState } from "react"; import { useState } from "react";
@ -34,62 +34,62 @@ import { type LinksFunction } from "@remix-run/cloudflare";
export const links: LinksFunction = () => { export const links: LinksFunction = () => {
return [ return [
{ href: stylesheet, rel: "stylesheet" }, { href: stylesheet, rel: "stylesheet" },
{ href: calendarStyles, rel: "stylesheet" } { href: calendarStyles, rel: "stylesheet" },
]; ];
}; };
export async function loader({ context }: { context: RequestContext }) { export async function loader({ context }: { context: RequestContext }) {
if (!context.data.current_user) if (!context.data.current_user)
throw new Response(null, { throw new Response(null, {
status: 401 status: 401,
}); });
if ( if (
![1 << 3, 1 << 4, 1 << 12].find( ![1 << 3, 1 << 4, 1 << 12].find(
(p) => context.data.current_user.permissions & p (p) => context.data.current_user.permissions & p,
) )
) )
throw new Response(null, { throw new Response(null, {
status: 403 status: 403,
}); });
const now = new Date(); const now = new Date();
const monthEventList = await context.env.D1.prepare( const monthEventList = await context.env.D1.prepare(
"SELECT answer, approved, created_by, day, details, id, month, pending, performed_at, reached_minimum_player_count, type, year FROM events WHERE month = ? AND year = ? ORDER BY day ASC;" "SELECT answer, approved, created_by, day, details, id, month, pending, performed_at, reached_minimum_player_count, type, year FROM events WHERE month = ? AND year = ? ORDER BY day ASC;",
) )
.bind(now.getUTCMonth() + 1, now.getUTCFullYear()) .bind(now.getUTCMonth() + 1, now.getUTCFullYear())
.all(); .all();
if (monthEventList.error) if (monthEventList.error)
throw new Response(null, { throw new Response(null, {
status: 500 status: 500,
}); });
const membersList = await context.env.D1.prepare( const membersList = await context.env.D1.prepare(
"SELECT id, name FROM et_members WHERE id IN (SELECT created_by FROM events WHERE month = ? AND year = ?);" "SELECT id, name FROM et_members WHERE id IN (SELECT created_by FROM events WHERE month = ? AND year = ?);",
) )
.bind(now.getUTCMonth() + 1, now.getUTCFullYear()) .bind(now.getUTCMonth() + 1, now.getUTCFullYear())
.all(); .all();
if (membersList.error) if (membersList.error)
throw new Response(null, { throw new Response(null, {
status: 500 status: 500,
}); });
return { return {
can_approve: Boolean( can_approve: Boolean(
[1 << 4, 1 << 12].find((p) => context.data.current_user.permissions & p) [1 << 4, 1 << 12].find((p) => context.data.current_user.permissions & p),
), ),
events: monthEventList.results, events: monthEventList.results,
members: membersList.results as { id: string; name: string }[] members: membersList.results as { id: string; name: string }[],
}; };
} }
export default function() { export default function () {
const { const {
can_approve, can_approve,
events, events,
members members,
}: { }: {
can_approve: boolean; can_approve: boolean;
events: { [k: string]: any }[]; events: { [k: string]: any }[];
@ -100,17 +100,17 @@ export default function() {
const { const {
isOpen: isCompleteOpen, isOpen: isCompleteOpen,
onClose: closeComplete, onClose: closeComplete,
onOpen: openComplete onOpen: openComplete,
} = useDisclosure(); } = useDisclosure();
const { const {
isOpen: isAnsweredOpen, isOpen: isAnsweredOpen,
onClose: closeAnswered, onClose: closeAnswered,
onOpen: openAnswered onOpen: openAnswered,
} = useDisclosure(); } = useDisclosure();
const { const {
isOpen: isForgottenOpen, isOpen: isForgottenOpen,
onClose: onForgottenClose, onClose: onForgottenClose,
onOpen: onForgottenOpen onOpen: onForgottenOpen,
} = useDisclosure(); } = useDisclosure();
const toast = useToast(); const toast = useToast();
const [selectedEvent, setSelectedEvent] = useState(""); const [selectedEvent, setSelectedEvent] = useState("");
@ -122,10 +122,10 @@ export default function() {
{ {
body: JSON.stringify({ approved }), body: JSON.stringify({ approved }),
headers: { headers: {
"content-type": "application/json" "content-type": "application/json",
}, },
method: "POST" method: "POST",
} },
); );
if (!decisionResp.ok) { if (!decisionResp.ok) {
@ -133,13 +133,12 @@ export default function() {
try { try {
errorMsg = ((await decisionResp.json()) as { error: string }).error; errorMsg = ((await decisionResp.json()) as { error: string }).error;
} catch { } catch {}
}
toast({ toast({
description: errorMsg, description: errorMsg,
status: "error", status: "error",
title: "Oops!" title: "Oops!",
}); });
return; return;
@ -148,7 +147,7 @@ export default function() {
toast({ toast({
description: `Event ${approved ? "approved" : "rejected"}`, description: `Event ${approved ? "approved" : "rejected"}`,
status: "success", status: "success",
title: "Success" title: "Success",
}); });
const newEventData = eventData; const newEventData = eventData;
@ -166,10 +165,10 @@ export default function() {
{ {
body: "{}", body: "{}",
headers: { headers: {
"content-type": "application/json" "content-type": "application/json",
}, },
method: "POST" method: "POST",
} },
); );
if (!certifyResp.ok) { if (!certifyResp.ok) {
@ -177,13 +176,12 @@ export default function() {
try { try {
errorMsg = ((await certifyResp.json()) as { error: string }).error; errorMsg = ((await certifyResp.json()) as { error: string }).error;
} catch { } catch {}
}
toast({ toast({
description: errorMsg, description: errorMsg,
status: "error", status: "error",
title: "Failed to certify game night" title: "Failed to certify game night",
}); });
return; return;
@ -192,13 +190,13 @@ export default function() {
toast({ toast({
description: "Game night certified", description: "Game night certified",
status: "success", status: "success",
title: "Success" title: "Success",
}); });
const newEventData = eventData; const newEventData = eventData;
newEventData[ newEventData[
eventData.findIndex((e) => e.id === eventId) eventData.findIndex((e) => e.id === eventId)
].reached_minimum_player_count = true; ].reached_minimum_player_count = true;
setEventData([...newEventData]); setEventData([...newEventData]);
setSelectedEvent(""); setSelectedEvent("");
@ -208,9 +206,9 @@ export default function() {
const answerResp = await fetch(`/api/events-team/events/${eventId}/solve`, { const answerResp = await fetch(`/api/events-team/events/${eventId}/solve`, {
body: "{}", body: "{}",
headers: { headers: {
"content-type": "application/json" "content-type": "application/json",
}, },
method: "POST" method: "POST",
}); });
closeAnswered(); closeAnswered();
@ -219,7 +217,7 @@ export default function() {
toast({ toast({
description: "Failed to mark as solved", description: "Failed to mark as solved",
status: "error", status: "error",
title: "Oops" title: "Oops",
}); });
return; return;
@ -239,10 +237,10 @@ export default function() {
{ {
body: "{}", body: "{}",
headers: { headers: {
"content-type": "application/json" "content-type": "application/json",
}, },
method: "POST" method: "POST",
} },
); );
closeComplete(); closeComplete();
@ -252,13 +250,12 @@ export default function() {
try { try {
msg = ((await completeResp.json()) as { error: string }).error; msg = ((await completeResp.json()) as { error: string }).error;
} catch { } catch {}
}
toast({ toast({
description: msg, description: msg,
status: "error", status: "error",
title: "Failed to complete" title: "Failed to complete",
}); });
return; return;
@ -267,7 +264,7 @@ export default function() {
toast({ toast({
description: "Event marked as completed", description: "Event marked as completed",
status: "success", status: "success",
title: "Success" title: "Success",
}); });
const newEventData = eventData; const newEventData = eventData;
@ -286,10 +283,10 @@ export default function() {
{ {
body: "{}", body: "{}",
headers: { headers: {
"content-type": "application/json" "content-type": "application/json",
}, },
method: "POST" method: "POST",
} },
); );
onForgottenClose(); onForgottenClose();
@ -299,13 +296,12 @@ export default function() {
try { try {
msg = ((await forgottenResp.json()) as { error: string }).error; msg = ((await forgottenResp.json()) as { error: string }).error;
} catch { } catch {}
}
toast({ toast({
description: msg, description: msg,
status: "error", status: "error",
title: "Failed to forget" title: "Failed to forget",
}); });
return; return;
@ -396,11 +392,19 @@ export default function() {
<ModalContent> <ModalContent>
<ModalHeader>Mark as Forgotten</ModalHeader> <ModalHeader>Mark as Forgotten</ModalHeader>
<ModalCloseButton /> <ModalCloseButton />
<ModalBody>Are you sure you want to mark this event as forgotten? The creator will be given a 5 point <ModalBody>
penalty.</ModalBody> Are you sure you want to mark this event as forgotten? The creator
will be given a 5 point penalty.
</ModalBody>
<ModalFooter> <ModalFooter>
<Button onClick={onForgottenClose}>Cancel</Button> <Button onClick={onForgottenClose}>Cancel</Button>
<Button colorScheme="blue" ml="8px" onClick={async () => await markForgotten(selectedEvent)} <Button
colorScheme="blue"
ml="8px"
onClick={async () => await markForgotten(selectedEvent)}
>
Mark Forgotten
</Button>
</ModalFooter> </ModalFooter>
</ModalContent> </ModalContent>
</Modal> </Modal>
@ -410,14 +414,14 @@ export default function() {
if (!showOld && event.day < new Date().getUTCDate()) return; if (!showOld && event.day < new Date().getUTCDate()) return;
const eventCreatorName = members.find( const eventCreatorName = members.find(
(member) => member.id === event.created_by (member) => member.id === event.created_by,
)?.name; )?.name;
const eventColors: { [k: string]: string } = { const eventColors: { [k: string]: string } = {
fotd: "cyan", fotd: "cyan",
gamenight: "blue", gamenight: "blue",
rotw: "magenta", rotw: "magenta",
qotd: "#9900FF" qotd: "#9900FF",
}; };
return ( return (
@ -491,7 +495,15 @@ export default function() {
> >
Mark as Completed Mark as Completed
</Button> </Button>
<Button colorScheme="red">Mark as Forgotten</Button> <Button
colorScheme="red"
onClick={() => {
setSelectedEvent(event.id);
onForgottenOpen();
}}
>
Mark as Forgotten
</Button>
</> </>
) : null} ) : null}
{can_approve && {can_approve &&
@ -576,6 +588,7 @@ export default function() {
</Link> </Link>
) : null} ) : null}
</VStack> </VStack>
;
</Container> </Container>
); );
} }