diff options
Diffstat (limited to 'frontend')
| -rw-r--r-- | frontend/src/pages/UIError.tsx | 65 |
1 files changed, 39 insertions, 26 deletions
diff --git a/frontend/src/pages/UIError.tsx b/frontend/src/pages/UIError.tsx index 22def326b..7f84ab91b 100644 --- a/frontend/src/pages/UIError.tsx +++ b/frontend/src/pages/UIError.tsx @@ -7,41 +7,54 @@ import { Box, Button, Center, + Code, Container, Group, Text, Title, } from "@mantine/core"; -import { FunctionComponent } from "react"; +import { FunctionComponent, useMemo } from "react"; + +const Placeholder = "********"; interface Props { error: Error; } -const UIError: FunctionComponent<Props> = ({ error }) => ( - <Container my="lg"> - <Center> - <Title> - <Box component="span" mr="md"> - <FontAwesomeIcon icon={faDizzy}></FontAwesomeIcon> - </Box> - <Text component="span" inherit> - Oops! UI is crashed! - </Text> - </Title> - </Center> - <Center> - <Text mb="lg">{error.message}</Text> - </Center> - <Group position="center"> - <Anchor href={`${GithubRepoRoot}/issues/new/choose`} target="_blank"> - <Button color="yellow">Report Issue</Button> - </Anchor> - <Button onClick={Reload} color="light"> - Reload Page - </Button> - </Group> - </Container> -); +const UIError: FunctionComponent<Props> = ({ error }) => { + const stack = useMemo(() => { + let callStack = error.stack ?? ""; + + // Remove sensitive information from the stack + callStack = callStack.replaceAll(window.location.hostname, Placeholder); + + return callStack; + }, [error.stack]); + return ( + <Container my="lg"> + <Center> + <Title> + <Box component="span" mr="md"> + <FontAwesomeIcon icon={faDizzy}></FontAwesomeIcon> + </Box> + <Text component="span" inherit> + Oops! UI is crashed! + </Text> + </Title> + </Center> + <Center my="xl"> + <Code>{stack}</Code> + </Center> + <Group position="center"> + <Anchor href={`${GithubRepoRoot}/issues/new/choose`} target="_blank"> + <Button color="yellow">Report Issue</Button> + </Anchor> + <Button onClick={Reload} color="light"> + Reload Page + </Button> + </Group> + </Container> + ); +}; export default UIError; |