nx/graph/client/src/app/ui-components/error-boundary.tsx
Emily Xiong a3ef2c6c3f
feat(graph): add error boundary error page for project details (#22007)
Co-authored-by: Nicholas Cunningham <ndcunningham@gmail.com>
2024-03-05 13:52:21 -05:00

28 lines
922 B
TypeScript

import { useEnvironmentConfig } from '@nx/graph/shared';
import { ProjectDetailsHeader } from 'graph/project-details/src/lib/project-details-header';
import { useRouteError } from 'react-router-dom';
export function ErrorBoundary() {
let error = useRouteError()?.toString();
console.error(error);
const environment = useEnvironmentConfig()?.environment;
let message = 'Disconnected from graph server. ';
if (environment === 'nx-console') {
message += 'Please refresh the page.';
} else {
message += 'Please rerun your command and refresh the page.';
}
return (
<div className="flex flex-col items-center h-screen w-full">
<ProjectDetailsHeader />
<h1 className="text-4xl mb-4 dark:text-slate-100">Error</h1>
<div>
<p className="text-lg mb-4 dark:text-slate-200">{message}</p>
<p className="text-sm">Error message: {error}</p>
</div>
</div>
);
}