diff --git a/src/App.jsx b/src/App.jsx index 3c882c51..1782f69e 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -26,37 +26,45 @@ import { RoomRedirect } from "./room/RoomRedirect"; import { ClientProvider } from "./ClientContext"; import { usePageFocusStyle } from "./usePageFocusStyle"; import { SequenceDiagramViewerPage } from "./SequenceDiagramViewerPage"; +import { InspectorContextProvider } from "./room/GroupCallInspector"; +import { CrashView } from "./FullScreenView"; const SentryRoute = Sentry.withSentryRouting(Route); export default function App({ history }) { usePageFocusStyle(); + const errorPage = ; + return ( - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + ); diff --git a/src/FullScreenView.jsx b/src/FullScreenView.jsx index fc252868..6dd71277 100644 --- a/src/FullScreenView.jsx +++ b/src/FullScreenView.jsx @@ -4,6 +4,8 @@ import styles from "./FullScreenView.module.css"; import { Header, HeaderLogo, LeftNav, RightNav } from "./Header"; import classNames from "classnames"; import { LinkButton, Button } from "./button"; +import { useSubmitRageshake } from "./settings/submit-rageshake"; +import { ErrorMessage } from "./input/Input"; export function FullScreenView({ className, children }) { return ( @@ -59,6 +61,56 @@ export function ErrorView({ error }) { ); } +export function CrashView() { + const { submitRageshake, sending, sent, error } = useSubmitRageshake(); + + const sendDebugLogs = useCallback(() => { + submitRageshake({ + description: "**Soft Crash**", + sendLogs: true, + }); + }, [submitRageshake]); + + const onReload = useCallback(() => { + window.location = "/"; + }, []); + + let logsComponent; + if (sent) { + logsComponent =
Thanks! We'll get right on it.
; + } else if (sending) { + logsComponent =
Sending...
; + } else { + logsComponent = ( + + ); + } + + return ( + +

Oops, something's gone wrong.

+

Submitting debug logs will help us track down the problem.

+
{logsComponent}
+ {error && Couldn't send debug logs!} + +
+ ); +} + export function LoadingView() { return ( diff --git a/src/FullScreenView.module.css b/src/FullScreenView.module.css index f30d9f6c..9d8fc665 100644 --- a/src/FullScreenView.module.css +++ b/src/FullScreenView.module.css @@ -36,6 +36,12 @@ margin-bottom: 0; } -.homeLink { +/* Make the buttons the same width */ +.wideButton { width: 291px; } + +/* Fixed height to avoid content jumping around*/ +.sendLogsSection { + height: 50px; +} diff --git a/src/main.tsx b/src/main.tsx index 50aa6cd4..2330bedc 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -28,9 +28,7 @@ import { Integrations } from "@sentry/tracing"; import "./index.css"; import App from "./App"; -import { ErrorView } from "./FullScreenView"; import { init as initRageshake } from "./settings/rageshake"; -import { InspectorContextProvider } from "./room/GroupCallInspector"; initRageshake(); @@ -104,11 +102,7 @@ Sentry.init({ ReactDOM.render( - - - - - + , document.getElementById("root") );