Hotfix: Popups no longer show up during infiltration (#847)

This commit is contained in:
Snarling 2023-10-04 09:52:04 -04:00 committed by GitHub
parent e22527e7b7
commit 74fe6af595
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 42 additions and 51 deletions

@ -9,7 +9,7 @@ import Button from "@mui/material/Button";
export const InvitationEvent = new EventEmitter<[Faction]>();
export function InvitationModal(): React.ReactElement {
export function InvitationModal({ hidden }: { hidden: boolean }): React.ReactElement {
const [faction, setFaction] = useState<Faction | null>(null);
function join(): void {
if (faction === null) return;
@ -25,10 +25,10 @@ export function InvitationModal(): React.ReactElement {
useEffect(() => InvitationEvent.subscribe((faction) => setFaction(faction)), []);
return (
<Modal open={faction !== null} onClose={() => setFaction(null)}>
<Modal open={!hidden && faction !== null} onClose={() => setFaction(null)}>
<Typography variant="h4">You have received a faction invitation.</Typography>
<Typography>
Would you like to join {(faction || { name: "" }).name}? <br />
Would you like to join {faction?.name}? <br />
<br />
Warning: Joining this faction may prevent you from joining other factions during this run!
</Typography>

@ -398,13 +398,11 @@ export function GameRoot(): React.ReactElement {
<Box className={classes.root}>{mainPage}</Box>
)}
<Unclickable />
<div style={{ display: withPopups ? "inherit" : "none", position: "absolute" }}>
<LogBoxManager />
<AlertManager />
<PromptManager />
<InvitationModal />
<Snackbar />
</div>
<LogBoxManager hidden={!withPopups} />
<AlertManager hidden={!withPopups} />
<PromptManager hidden={!withPopups} />
<InvitationModal hidden={!withPopups} />
<Snackbar hidden={!withPopups} />
<Apr1 />
</SnackbarProvider>
</HistoryProvider>

@ -14,7 +14,7 @@ interface Alert {
}
let i = 0;
export function AlertManager(): React.ReactElement {
export function AlertManager({ hidden }: { hidden: boolean }): React.ReactElement {
const [alerts, setAlerts] = useState<Alert[]>([]);
useEffect(
() =>
@ -49,6 +49,8 @@ export function AlertManager(): React.ReactElement {
return () => document.removeEventListener("keydown", handle);
}, []);
const alertMessage = alerts[0]?.text || "No alert to show";
function getMessageHash(text: string | JSX.Element): string {
if (typeof text === "string") return sha256(text);
return sha256(JSON.stringify(text.props));
@ -61,14 +63,10 @@ export function AlertManager(): React.ReactElement {
}
return (
<>
{alerts.length > 0 && (
<Modal open={true} onClose={close}>
<Box overflow="scroll" sx={{ overflowWrap: "break-word", whiteSpace: "pre-line" }}>
<Typography component={"span"}>{alerts[0].text}</Typography>
</Box>
</Modal>
)}
</>
<Modal open={!hidden && alerts.length > 0} onClose={close}>
<Box overflow="scroll" sx={{ overflowWrap: "break-word", whiteSpace: "pre-line" }}>
<Typography component={"span"}>{alertMessage}</Typography>
</Box>
</Modal>
);
}

@ -78,7 +78,7 @@ interface Log {
let logs: Log[] = [];
export function LogBoxManager(): React.ReactElement {
export function LogBoxManager({ hidden }: { hidden: boolean }): React.ReactElement {
const rerender = useRerender();
//Close tail windows by their pid.
@ -130,7 +130,7 @@ export function LogBoxManager(): React.ReactElement {
return (
<>
{logs.map((log) => (
<LogWindow key={log.id} script={log.script} onClose={() => close(log.id)} />
<LogWindow hidden={hidden} key={log.id} script={log.script} onClose={() => close(log.id)} />
))}
</>
);
@ -139,6 +139,7 @@ export function LogBoxManager(): React.ReactElement {
interface LogWindowProps {
script: RunningScript;
onClose: () => void;
hidden: boolean;
}
const useStyles = makeStyles(() =>
@ -164,10 +165,9 @@ const useStyles = makeStyles(() =>
export const logBoxBaseZIndex = 1500;
function LogWindow(props: LogWindowProps): React.ReactElement {
function LogWindow({ hidden, script, onClose }: LogWindowProps): React.ReactElement {
const draggableRef = useRef<HTMLDivElement>(null);
const rootRef = useRef<Draggable>(null);
const script = props.script;
const classes = useStyles();
const container = useRef<HTMLDivElement>(null);
const textArea = useRef<HTMLDivElement>(null);
@ -316,7 +316,7 @@ function LogWindow(props: LogWindowProps): React.ReactElement {
return (
<Draggable handle=".drag" onDrag={onDrag} ref={rootRef} onMouseDown={updateLayer}>
<Box
display="flex"
display={hidden ? "none" : "flex"}
sx={{
flexFlow: "column",
position: "fixed",
@ -377,12 +377,7 @@ function LogWindow(props: LogWindowProps): React.ReactElement {
>
{minimized ? <ExpandMoreIcon /> : <ExpandLessIcon />}
</IconButton>
<IconButton
title="Close window"
className={classes.titleButton}
onClick={props.onClose}
onTouchEnd={props.onClose}
>
<IconButton title="Close window" className={classes.titleButton} onClick={onClose} onTouchEnd={onClose}>
<CloseIcon />
</IconButton>
</span>

@ -16,7 +16,7 @@ interface Prompt {
resolve: (result: boolean | string) => void;
}
export function PromptManager(): React.ReactElement {
export function PromptManager({ hidden }: { hidden: boolean }): React.ReactElement {
const [prompt, setPrompt] = useState<Prompt | null>(null);
useEffect(() => {
return PromptEvent.subscribe((p: Prompt) => {
@ -24,10 +24,6 @@ export function PromptManager(): React.ReactElement {
});
}, []);
if (prompt === null) {
return <></>;
}
function close(): void {
if (prompt === null) return;
if (["text", "select"].includes(prompt.options?.type ?? "")) {
@ -44,19 +40,23 @@ export function PromptManager(): React.ReactElement {
};
let PromptContent = PromptMenuBoolean;
if (prompt.options?.type && ["text", "select"].includes(prompt.options.type))
if (prompt?.options?.type && ["text", "select"].includes(prompt.options.type))
PromptContent = types[prompt.options.type];
const resolve = (value: boolean | string): void => {
prompt.resolve(value);
prompt?.resolve(value);
setPrompt(null);
};
return (
<Modal open={true} onClose={close}>
<pre>
<Typography>{prompt.txt}</Typography>
</pre>
<PromptContent prompt={prompt} resolve={resolve} />
<Modal open={!hidden && prompt !== null} onClose={close}>
{prompt && (
<>
<pre>
<Typography>{prompt.txt}</Typography>
</pre>
<PromptContent prompt={prompt} resolve={resolve} />
</>
)}
</Modal>
);
}

@ -40,18 +40,19 @@ export function SnackbarProvider(props: IProps): React.ReactElement {
export const SnackbarEvents = new EventEmitter<[string | React.ReactNode, ToastVariant, number | null]>();
export function Snackbar(): React.ReactElement {
export function Snackbar({ hidden }: { hidden: boolean }): React.ReactElement {
const { enqueueSnackbar, closeSnackbar } = useSnackbar();
useEffect(() =>
SnackbarEvents.subscribe((s, variant, duration) => {
useEffect(() => {
if (hidden) return;
return SnackbarEvents.subscribe((s, variant, duration) => {
const id = enqueueSnackbar(<Alert severity={variant}>{s}</Alert>, {
content: (k, m) => <Paper key={k}>{m}</Paper>,
variant: variant,
autoHideDuration: duration,
onClick: () => closeSnackbar(id),
});
}),
);
});
}, [closeSnackbar, enqueueSnackbar, hidden]);
return <></>;
}

@ -1,8 +1,7 @@
import React, { useState } from "react";
import { Button, Tooltip } from "@mui/material";
import { ConfirmationModal } from "./ConfirmationModal";
import Button from "@mui/material/Button";
import { Tooltip, Typography } from "@mui/material";
import RestartAltIcon from "@mui/icons-material/RestartAlt";
interface IProps {
@ -50,7 +49,7 @@ Are you sure?
onConfirm={onTriggered}
open={modalOpened}
onClose={() => setModalOpened(false)}
confirmationText={<Typography style={{ whiteSpace: "pre-wrap" }}>{confirmationMessage}</Typography>}
confirmationText={<span style={{ whiteSpace: "pre-wrap" }}>{confirmationMessage}</span>}
additionalButton={<Button onClick={() => setModalOpened(false)}>Cancel</Button>}
/>
</>