3pp-mirror/pomerium
1
0
Fork 0
mirror of https://github.com/pomerium/pomerium.git synced 2025-06-13 00:04:31 +02:00
Code Issues Projects Releases Packages Wiki Activity

core/ui: add request id to upstream error page (#5166)

Browse source
This commit is contained in:
Caleb Doxsey 2024-07-08 11:44:30 -06:00 • committed by GitHub
parent 8f8c66e9fd
commit 517abbada4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 31 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

48
ui/src/components/UpstreamErrorPage.tsx
View file

@ -9,14 +9,23 @@ import {
Link,
Stack,
Typography,
TypographyProps,
} from "@mui/material";
import React, { FC } from "react";
import { ErrorPageProps } from "./ErrorPage";
import IDField from "./IDField";
const TextBlock: FC<TypographyProps> = ({ children }) => {
return (
<Typography variant="body2" fontWeight={400} color="rgba(102, 112, 133, 1)">
{children}
</Typography>
);
};
export const UpstreamErrorPage: FC<ErrorPageProps> = ({ data }) => {
const status = data?.status || 500;
console.log(data.statusText);
return (
<Container>
<Card>
@ -91,10 +100,10 @@ export const UpstreamErrorPage: FC<ErrorPageProps> = ({ data }) => {
<Divider sx={{ color: "rgba(234, 236, 240, 1)" }} />
<Stack gap={1} sx={{ my: 5 }}>
<Typography variant="h5">What happened?</Typography>
<Typography variant="body2" color="rgba(102, 112, 133, 1)">
<TextBlock>
The web server is not returning a connection. As a result, the
webpage is not displaying.
</Typography>
</TextBlock>
</Stack>
<Divider sx={{ color: "rgba(234, 236, 240, 1)" }} />
<Stack gap={2} sx={{ my: 5 }}>
@ -102,30 +111,35 @@ export const UpstreamErrorPage: FC<ErrorPageProps> = ({ data }) => {
<Typography variant="h5">What can I do?</Typography>
</Stack>
<Stack>
<Typography variant="body2" fontWeight={700} color="rgba(102, 112, 133, 1)">
<Typography
variant="body2"
fontWeight={700}
color="rgba(102, 112, 133, 1)"
>
If you are a visitor of this website:
</Typography>
<Typography variant="body2" fontWeight={400} color="rgba(102, 112, 133, 1)">
Please try again in a few minutes.
</Typography>
<TextBlock>Please try again in a few minutes.</TextBlock>
</Stack>
<Stack>
<Typography variant="body2" fontWeight={700}>
If you are the owner of this website:
</Typography>
<Typography variant="body2" fontWeight={400} color="rgba(102, 112, 133, 1)">
<TextBlock>
Contact your hosting provider letting them know your web
server is not responding.
</Typography>
<Typography variant="body2" fontWeight={400} color="rgba(102, 112, 133, 1)">
Error Text: {data.statusText}
</Typography>
</TextBlock>
<TextBlock>Error Text: {data.statusText}</TextBlock>
{data?.requestId && (
<TextBlock>
Request ID: <IDField value={data.requestId} />
</TextBlock>
)}
<Link
href="https://www.pomerium.com/docs/troubleshooting#envoy-error-messages"
underline="hover"
color="primary.main"
variant="body2"
target="_blank"
href="https://www.pomerium.com/docs/troubleshooting#envoy-error-messages"
underline="hover"
color="primary.main"
variant="body2"
target="_blank"
>
Additional troubleshooting information.
</Link>