konnosDashboard
GlobalErrorBoundaryState.tsx65 lines · main
1import { isError } from 'lodash'
2import Link from 'next/link'
3import { useRouter } from 'next/router'
4
5import { ClientSideExceptionHandler } from './ClientSideExceptionHandler'
6import { InsertBeforeRemoveChildErrorHandler } from './InsertBeforeRemoveChildErrorHandler'
7import { useIsFeatureEnabled } from '@/hooks/misc/useIsFeatureEnabled'
8
9export type FallbackProps = {
10 error: unknown
11 resetErrorBoundary: (...args: unknown[]) => void
12}
13
14export const GlobalErrorBoundaryState = ({ error, resetErrorBoundary }: FallbackProps) => {
15 const router = useRouter()
16 const checkIsError = isError(error)
17
18 const largeLogo = useIsFeatureEnabled('branding:large_logo')
19
20 const errorMessage = checkIsError ? error.message : ''
21 const urlMessage = checkIsError ? `Path name: ${router.pathname}\n\n${error?.stack}` : ''
22
23 const isRemoveChildError = checkIsError
24 ? errorMessage.includes("Failed to execute 'removeChild' on 'Node'")
25 : false
26 const isInsertBeforeError = checkIsError
27 ? errorMessage.includes("Failed to execute 'insertBefore' on 'Node'")
28 : false
29
30 // Get Sentry issue ID from error if available
31 const sentryIssueId = (!!error && typeof error === 'object' && (error as any).sentryId) ?? ''
32
33 return (
34 <div className="w-screen mx-auto h-screen flex items-center justify-center">
35 <header className="h-12 absolute top-0 w-full border-b px-4 flex items-center">
36 <Link href="/" className="items-center justify-center">
37 <img
38 alt="Briven"
39 src={`${router.basePath}/img/briven-logo.svg`}
40 className={largeLogo ? 'h-[20px]' : 'h-[18px]'}
41 />
42 </Link>
43 </header>
44
45 <div className="flex flex-col gap-y-4 max-w-full sm:max-w-[660px] px-4 sm:px-0">
46 {isRemoveChildError || isInsertBeforeError ? (
47 <InsertBeforeRemoveChildErrorHandler
48 message={errorMessage}
49 sentryIssueId={sentryIssueId}
50 urlMessage={urlMessage}
51 isRemoveChildError={isRemoveChildError}
52 isInsertBeforeError={isInsertBeforeError}
53 />
54 ) : (
55 <ClientSideExceptionHandler
56 message={errorMessage}
57 sentryIssueId={sentryIssueId}
58 urlMessage={urlMessage}
59 resetErrorBoundary={resetErrorBoundary}
60 />
61 )}
62 </div>
63 </div>
64 )
65}