2022-10-29 09:06:09 +00:00
|
|
|
import { captureException } from '@sentry/browser';
|
2022-06-18 08:35:51 +00:00
|
|
|
import { FallbackProps } from 'react-error-boundary';
|
2023-05-30 09:24:05 +00:00
|
|
|
import { useRouteError } from 'react-router';
|
2023-02-24 08:12:21 +00:00
|
|
|
import { useDebugState } from '@sd/client';
|
2023-01-20 03:32:35 +00:00
|
|
|
import { Button } from '@sd/ui';
|
2023-05-30 09:24:05 +00:00
|
|
|
import { useOperatingSystem } from './hooks';
|
|
|
|
|
|
|
|
export function RouterErrorBoundary() {
|
|
|
|
const error = useRouteError();
|
|
|
|
return (
|
|
|
|
<ErrorPage
|
|
|
|
message={(error as any).toString()}
|
|
|
|
sendReportBtn={() => {
|
|
|
|
captureException(error);
|
|
|
|
location.reload();
|
|
|
|
}}
|
|
|
|
reloadBtn={() => {
|
|
|
|
location.reload();
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
);
|
|
|
|
}
|
2022-06-18 08:35:51 +00:00
|
|
|
|
2023-02-28 05:29:48 +00:00
|
|
|
export default ({ error, resetErrorBoundary }: FallbackProps) => (
|
|
|
|
<ErrorPage
|
2023-05-30 09:24:05 +00:00
|
|
|
message={`Error: ${error.message}`}
|
2023-02-28 05:29:48 +00:00
|
|
|
sendReportBtn={() => {
|
|
|
|
captureException(error);
|
|
|
|
resetErrorBoundary();
|
|
|
|
}}
|
|
|
|
reloadBtn={resetErrorBoundary}
|
|
|
|
/>
|
|
|
|
);
|
2022-10-29 09:06:09 +00:00
|
|
|
|
2023-02-25 13:50:22 +00:00
|
|
|
export function ErrorPage({
|
|
|
|
reloadBtn,
|
|
|
|
sendReportBtn,
|
2023-05-30 09:24:05 +00:00
|
|
|
message,
|
|
|
|
submessage
|
2023-02-25 13:50:22 +00:00
|
|
|
}: {
|
|
|
|
reloadBtn?: () => void;
|
|
|
|
sendReportBtn?: () => void;
|
|
|
|
message: string;
|
2023-05-30 09:24:05 +00:00
|
|
|
submessage?: string;
|
2023-02-25 13:50:22 +00:00
|
|
|
}) {
|
2023-02-24 08:12:21 +00:00
|
|
|
const debug = useDebugState();
|
2023-05-30 09:24:05 +00:00
|
|
|
const os = useOperatingSystem();
|
|
|
|
const isMacOS = os === 'macOS';
|
|
|
|
|
|
|
|
if (!submessage && debug.enabled)
|
|
|
|
submessage = 'Check the console (CMD/CTRL + OPTION + i) for stack trace.';
|
2023-02-24 08:12:21 +00:00
|
|
|
|
2022-06-18 08:35:51 +00:00
|
|
|
return (
|
|
|
|
<div
|
|
|
|
data-tauri-drag-region
|
|
|
|
role="alert"
|
2023-05-30 09:24:05 +00:00
|
|
|
className={
|
|
|
|
'flex h-screen w-screen flex-col items-center justify-center border border-app-divider bg-app p-4' +
|
|
|
|
(isMacOS ? ' rounded-lg' : '')
|
|
|
|
}
|
2022-06-18 08:35:51 +00:00
|
|
|
>
|
2023-04-04 05:39:07 +00:00
|
|
|
<p className="m-3 text-sm font-bold text-ink-faint">APP CRASHED</p>
|
|
|
|
<h1 className="text-2xl font-bold text-ink">We're past the event horizon...</h1>
|
2023-05-30 09:24:05 +00:00
|
|
|
<pre className="m-2 text-ink">{message}</pre>
|
|
|
|
{submessage && <pre className="m-2 text-sm text-ink-dull">{submessage}</pre>}
|
2023-04-04 05:39:07 +00:00
|
|
|
<div className="flex flex-row space-x-2 text-ink">
|
2023-02-25 13:50:22 +00:00
|
|
|
{reloadBtn && (
|
|
|
|
<Button variant="accent" className="mt-2" onClick={reloadBtn}>
|
|
|
|
Reload
|
|
|
|
</Button>
|
|
|
|
)}
|
|
|
|
{sendReportBtn && (
|
|
|
|
<Button variant="gray" className="mt-2" onClick={sendReportBtn}>
|
|
|
|
Send report
|
|
|
|
</Button>
|
|
|
|
)}
|
2023-05-30 12:45:28 +00:00
|
|
|
{message === 'failed to initialize config' && (
|
|
|
|
<div className="flex flex-col items-center pt-12">
|
|
|
|
<p className="text-center">
|
|
|
|
We detected you may have created your library with an older version of
|
|
|
|
<br />
|
|
|
|
Spacedrive. Please reset it to continue using the app!
|
|
|
|
<br />
|
|
|
|
YOU WILL LOSE ANY EXISTING SPACEDRIVE DATA!
|
|
|
|
</p>
|
|
|
|
<Button
|
|
|
|
variant="colored"
|
|
|
|
className="mt-2 max-w-xs bg-red-500"
|
|
|
|
onClick={() => {
|
|
|
|
console.log('A'); // TODO
|
|
|
|
// @ts-expect-error
|
|
|
|
window.__TAURI_INVOKE__('reset_spacedrive');
|
|
|
|
}}
|
|
|
|
>
|
|
|
|
Reset Library
|
|
|
|
</Button>
|
|
|
|
</div>
|
|
|
|
)}
|
2022-06-18 08:35:51 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|