Make site not brick itself when decisions object exists
This commit is contained in:
parent
2fc73a62cc
commit
5daf23d337
@ -12,7 +12,7 @@ import {
|
|||||||
StackDivider,
|
StackDivider,
|
||||||
Text,
|
Text,
|
||||||
UnorderedList,
|
UnorderedList,
|
||||||
useToast
|
useToast,
|
||||||
} from "@chakra-ui/react";
|
} from "@chakra-ui/react";
|
||||||
|
|
||||||
export default function (props: InactivityNoticeProps) {
|
export default function (props: InactivityNoticeProps) {
|
||||||
@ -22,17 +22,17 @@ export default function(props: InactivityNoticeProps) {
|
|||||||
const decisionReq = await fetch(`/api/inactivity/${props.id}`, {
|
const decisionReq = await fetch(`/api/inactivity/${props.id}`, {
|
||||||
body: JSON.stringify({ accepted }),
|
body: JSON.stringify({ accepted }),
|
||||||
headers: {
|
headers: {
|
||||||
"content-type": "application/json"
|
"content-type": "application/json",
|
||||||
},
|
},
|
||||||
method: "POST"
|
method: "POST",
|
||||||
});
|
});
|
||||||
|
|
||||||
if (!decisionReq.ok) {
|
if (!decisionReq.ok) {
|
||||||
toast({
|
toast({
|
||||||
description: (await decisionReq.json() as { error: string }).error,
|
description: ((await decisionReq.json()) as { error: string }).error,
|
||||||
isClosable: true,
|
isClosable: true,
|
||||||
status: "error",
|
status: "error",
|
||||||
title: "Oops"
|
title: "Oops",
|
||||||
});
|
});
|
||||||
|
|
||||||
return;
|
return;
|
||||||
@ -42,21 +42,23 @@ export default function(props: InactivityNoticeProps) {
|
|||||||
description: `Inactivity notice ${accepted ? "accepted" : "denied"}.`,
|
description: `Inactivity notice ${accepted ? "accepted" : "denied"}.`,
|
||||||
isClosable: true,
|
isClosable: true,
|
||||||
status: "success",
|
status: "success",
|
||||||
title: "Success"
|
title: "Success",
|
||||||
});
|
});
|
||||||
|
|
||||||
location.reload();
|
location.reload();
|
||||||
}
|
}
|
||||||
|
|
||||||
const Approved = () => <Icon fill="currentColor" height="16" viewBox="0 0 16 16" width="16">
|
const Approved = () => (
|
||||||
<path
|
<Icon fill="currentColor" height="16" viewBox="0 0 16 16" width="16">
|
||||||
d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
|
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
|
||||||
</Icon>;
|
</Icon>
|
||||||
|
);
|
||||||
|
|
||||||
const Denied = () => <Icon fill="currentColor" height="16" viewBox="0 0 16 16" width="16">
|
const Denied = () => (
|
||||||
<path
|
<Icon fill="currentColor" height="16" viewBox="0 0 16 16" width="16">
|
||||||
d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z" />
|
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z" />
|
||||||
</Icon>;
|
</Icon>
|
||||||
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card w="100%">
|
<Card w="100%">
|
||||||
@ -78,20 +80,33 @@ export default function(props: InactivityNoticeProps) {
|
|||||||
<Heading size="xs">End Date</Heading>
|
<Heading size="xs">End Date</Heading>
|
||||||
<Text>{new Date(props.end).toLocaleDateString()}</Text>
|
<Text>{new Date(props.end).toLocaleDateString()}</Text>
|
||||||
</Box>
|
</Box>
|
||||||
{props.decisions ? <Box>
|
{props.decisions ? (
|
||||||
|
<Box>
|
||||||
<Heading size="xs">Decisions</Heading>
|
<Heading size="xs">Decisions</Heading>
|
||||||
<UnorderedList>
|
<UnorderedList>
|
||||||
{props.decisions.map(decision => <ListItem>
|
{Object.entries(props.decisions).map(([dept, accepted]) => (
|
||||||
{decision.accepted ? <Approved /> : <Denied />} {decision.department}
|
<ListItem>
|
||||||
</ListItem>)}
|
{accepted ? <Approved /> : <Denied />} {dept}
|
||||||
|
</ListItem>
|
||||||
|
))}
|
||||||
</UnorderedList>
|
</UnorderedList>
|
||||||
</Box> : null}
|
</Box>
|
||||||
|
) : null}
|
||||||
</Stack>
|
</Stack>
|
||||||
</CardBody>
|
</CardBody>
|
||||||
<CardFooter pb="4px">
|
<CardFooter pb="4px">
|
||||||
<Box>
|
<Box>
|
||||||
<Button colorScheme="red" onClick={async () => await makeDecision(false)}>Deny</Button>
|
<Button
|
||||||
<Button colorScheme="blue" ml="8px" onClick={async () => await makeDecision(true)}>
|
colorScheme="red"
|
||||||
|
onClick={async () => await makeDecision(false)}
|
||||||
|
>
|
||||||
|
Deny
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
colorScheme="blue"
|
||||||
|
ml="8px"
|
||||||
|
onClick={async () => await makeDecision(true)}
|
||||||
|
>
|
||||||
Accept
|
Accept
|
||||||
</Button>
|
</Button>
|
||||||
</Box>
|
</Box>
|
||||||
|
8
index.d.ts
vendored
8
index.d.ts
vendored
@ -45,9 +45,11 @@ declare global {
|
|||||||
interface InactivityNoticeProps {
|
interface InactivityNoticeProps {
|
||||||
created_at: number;
|
created_at: number;
|
||||||
decisions?: {
|
decisions?: {
|
||||||
accepted: boolean;
|
DM?: boolean;
|
||||||
department: string;
|
ET?: boolean;
|
||||||
}[];
|
FM?: boolean;
|
||||||
|
WM?: boolean;
|
||||||
|
};
|
||||||
departments: string[];
|
departments: string[];
|
||||||
end: string;
|
end: string;
|
||||||
id: string;
|
id: string;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user