@xyo-network/react-error 2.81.8 → 2.81.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/dist/browser/components/ErrorBoundary/ThrownErrorBoundary.d.cts +2 -0
  2. package/dist/browser/components/ErrorBoundary/ThrownErrorBoundary.d.cts.map +1 -1
  3. package/dist/browser/components/ErrorBoundary/ThrownErrorBoundary.d.mts +2 -0
  4. package/dist/browser/components/ErrorBoundary/ThrownErrorBoundary.d.mts.map +1 -1
  5. package/dist/browser/components/ErrorBoundary/ThrownErrorBoundary.d.ts +2 -0
  6. package/dist/browser/components/ErrorBoundary/ThrownErrorBoundary.d.ts.map +1 -1
  7. package/dist/browser/components/ErrorRender/ErrorAlert.d.cts +2 -1
  8. package/dist/browser/components/ErrorRender/ErrorAlert.d.cts.map +1 -1
  9. package/dist/browser/components/ErrorRender/ErrorAlert.d.mts +2 -1
  10. package/dist/browser/components/ErrorRender/ErrorAlert.d.mts.map +1 -1
  11. package/dist/browser/components/ErrorRender/ErrorAlert.d.ts +2 -1
  12. package/dist/browser/components/ErrorRender/ErrorAlert.d.ts.map +1 -1
  13. package/dist/browser/components/ErrorRender/Props.d.cts +1 -0
  14. package/dist/browser/components/ErrorRender/Props.d.cts.map +1 -1
  15. package/dist/browser/components/ErrorRender/Props.d.mts +1 -0
  16. package/dist/browser/components/ErrorRender/Props.d.mts.map +1 -1
  17. package/dist/browser/components/ErrorRender/Props.d.ts +1 -0
  18. package/dist/browser/components/ErrorRender/Props.d.ts.map +1 -1
  19. package/dist/browser/components/ErrorRender/Render.d.cts.map +1 -1
  20. package/dist/browser/components/ErrorRender/Render.d.mts.map +1 -1
  21. package/dist/browser/components/ErrorRender/Render.d.ts.map +1 -1
  22. package/dist/browser/index.cjs +22 -8
  23. package/dist/browser/index.cjs.map +1 -1
  24. package/dist/browser/index.js +22 -8
  25. package/dist/browser/index.js.map +1 -1
  26. package/dist/neutral/components/ErrorBoundary/ThrownErrorBoundary.d.cts +2 -0
  27. package/dist/neutral/components/ErrorBoundary/ThrownErrorBoundary.d.cts.map +1 -1
  28. package/dist/neutral/components/ErrorBoundary/ThrownErrorBoundary.d.mts +2 -0
  29. package/dist/neutral/components/ErrorBoundary/ThrownErrorBoundary.d.mts.map +1 -1
  30. package/dist/neutral/components/ErrorBoundary/ThrownErrorBoundary.d.ts +2 -0
  31. package/dist/neutral/components/ErrorBoundary/ThrownErrorBoundary.d.ts.map +1 -1
  32. package/dist/neutral/components/ErrorRender/ErrorAlert.d.cts +2 -1
  33. package/dist/neutral/components/ErrorRender/ErrorAlert.d.cts.map +1 -1
  34. package/dist/neutral/components/ErrorRender/ErrorAlert.d.mts +2 -1
  35. package/dist/neutral/components/ErrorRender/ErrorAlert.d.mts.map +1 -1
  36. package/dist/neutral/components/ErrorRender/ErrorAlert.d.ts +2 -1
  37. package/dist/neutral/components/ErrorRender/ErrorAlert.d.ts.map +1 -1
  38. package/dist/neutral/components/ErrorRender/Props.d.cts +1 -0
  39. package/dist/neutral/components/ErrorRender/Props.d.cts.map +1 -1
  40. package/dist/neutral/components/ErrorRender/Props.d.mts +1 -0
  41. package/dist/neutral/components/ErrorRender/Props.d.mts.map +1 -1
  42. package/dist/neutral/components/ErrorRender/Props.d.ts +1 -0
  43. package/dist/neutral/components/ErrorRender/Props.d.ts.map +1 -1
  44. package/dist/neutral/components/ErrorRender/Render.d.cts.map +1 -1
  45. package/dist/neutral/components/ErrorRender/Render.d.mts.map +1 -1
  46. package/dist/neutral/components/ErrorRender/Render.d.ts.map +1 -1
  47. package/dist/neutral/index.cjs +22 -8
  48. package/dist/neutral/index.cjs.map +1 -1
  49. package/dist/neutral/index.js +22 -8
  50. package/dist/neutral/index.js.map +1 -1
  51. package/dist/node/components/ErrorBoundary/ThrownErrorBoundary.d.cts +2 -0
  52. package/dist/node/components/ErrorBoundary/ThrownErrorBoundary.d.cts.map +1 -1
  53. package/dist/node/components/ErrorBoundary/ThrownErrorBoundary.d.mts +2 -0
  54. package/dist/node/components/ErrorBoundary/ThrownErrorBoundary.d.mts.map +1 -1
  55. package/dist/node/components/ErrorBoundary/ThrownErrorBoundary.d.ts +2 -0
  56. package/dist/node/components/ErrorBoundary/ThrownErrorBoundary.d.ts.map +1 -1
  57. package/dist/node/components/ErrorRender/ErrorAlert.d.cts +2 -1
  58. package/dist/node/components/ErrorRender/ErrorAlert.d.cts.map +1 -1
  59. package/dist/node/components/ErrorRender/ErrorAlert.d.mts +2 -1
  60. package/dist/node/components/ErrorRender/ErrorAlert.d.mts.map +1 -1
  61. package/dist/node/components/ErrorRender/ErrorAlert.d.ts +2 -1
  62. package/dist/node/components/ErrorRender/ErrorAlert.d.ts.map +1 -1
  63. package/dist/node/components/ErrorRender/Props.d.cts +1 -0
  64. package/dist/node/components/ErrorRender/Props.d.cts.map +1 -1
  65. package/dist/node/components/ErrorRender/Props.d.mts +1 -0
  66. package/dist/node/components/ErrorRender/Props.d.mts.map +1 -1
  67. package/dist/node/components/ErrorRender/Props.d.ts +1 -0
  68. package/dist/node/components/ErrorRender/Props.d.ts.map +1 -1
  69. package/dist/node/components/ErrorRender/Render.d.cts.map +1 -1
  70. package/dist/node/components/ErrorRender/Render.d.mts.map +1 -1
  71. package/dist/node/components/ErrorRender/Render.d.ts.map +1 -1
  72. package/dist/node/index.cjs +22 -8
  73. package/dist/node/index.cjs.map +1 -1
  74. package/dist/node/index.js +22 -8
  75. package/dist/node/index.js.map +1 -1
  76. package/package.json +1 -1
  77. package/src/components/ErrorBoundary/ThrownErrorBoundary.tsx +4 -2
  78. package/src/components/ErrorRender/ErrorAlert.stories.tsx +42 -0
  79. package/src/components/ErrorRender/ErrorAlert.tsx +27 -11
  80. package/src/components/ErrorRender/Props.ts +1 -0
  81. package/src/components/ErrorRender/Render.tsx +2 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/ErrorBoundary/ThrownErrorBoundary.tsx","../../src/components/ErrorRender/ErrorAlert.tsx","../../src/components/ErrorRender/Render.tsx","../../src/contexts/ErrorReporter/Provider.tsx","../../src/contexts/ErrorReporter/Context.ts","../../src/contexts/ErrorReporter/useRollbar.tsx"],"sourcesContent":["import { ModuleError, ModuleErrorSchema } from '@xyo-network/payload-model'\nimport { Component, ErrorInfo, ReactNode } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorRender } from '../ErrorRender/index.js'\n\nexport interface ThrownErrorBoundaryProps {\n boundaryName?: string\n children: ReactNode\n errorComponent?: (e: ModuleError, boundaryName?: string) => ReactNode\n rethrow?: boolean\n rollbar?: Rollbar\n}\n\nexport interface ThrownErrorBoundaryState {\n xyoError?: ModuleError\n}\n\nexport class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, ThrownErrorBoundaryState> {\n override state: ThrownErrorBoundaryState = {\n xyoError: undefined,\n }\n\n static getDerivedStateFromError(error: Error) {\n return { hasError: true, xyoError: ThrownErrorBoundary.normalizeError(error) } as ThrownErrorBoundaryState\n }\n\n static normalizeError(error: Error | ModuleError): ModuleError {\n return (\n (error as ModuleError).schema === ModuleErrorSchema ?\n error\n : { message: error.message, schema: ModuleErrorSchema, sources: [] }) as ModuleError\n }\n\n override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n const { rethrow, rollbar } = this.props\n const { xyoError } = this.state\n\n rollbar?.error(error)\n\n console.error('Error:', xyoError, errorInfo)\n if (rethrow) {\n throw error\n }\n }\n\n override render() {\n const { xyoError } = this.state\n const { children, boundaryName, errorComponent } = this.props\n if (xyoError) {\n if (errorComponent) {\n return errorComponent(xyoError)\n }\n return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} />\n }\n\n return children\n }\n}\n","import { ExitToApp as ExitIcon } from '@mui/icons-material'\nimport { Alert, AlertProps, AlertTitle, Typography } from '@mui/material'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { ModuleError } from '@xyo-network/payload-model'\n\nexport interface ErrorAlertProps extends AlertProps {\n error?: ModuleError | Error\n errorContext?: string\n onCancel?: () => void\n}\n\nexport const ErrorAlert: React.FC<ErrorAlertProps> = ({ onCancel, error, errorContext, ...props }) => {\n return (\n <Alert severity=\"error\" {...props}>\n <AlertTitle>Whoops! Something went wrong</AlertTitle>\n {errorContext ?\n <Typography variant=\"caption\" my={0.5} lineHeight=\"1\" display=\"block\">\n {errorContext}\n </Typography>\n : null}\n <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n Error:\n </Typography>\n <Typography variant=\"caption\">{error?.message}</Typography>\n {onCancel ?\n <ButtonEx variant=\"outlined\" size=\"small\" onClick={onCancel} position=\"absolute\" style={{ right: 8, top: 8 }}>\n <ExitIcon fontSize=\"small\" />\n </ButtonEx>\n : null}\n </Alert>\n )\n}\n","import { FlexCol } from '@xylabs/react-flexbox'\nimport { useEffect } from 'react'\n\nimport { ErrorAlert } from './ErrorAlert.js'\nimport { ErrorRenderProps } from './Props.js'\n\nexport const ErrorRender: React.FC<ErrorRenderProps> = ({\n onCancel,\n error,\n noErrorDisplay = false,\n customError = null,\n children,\n errorContext,\n useLocation,\n ...props\n}) => {\n const location = useLocation?.()\n useEffect(() => {\n if (location) {\n // ensure we end up at the same place we are now after logging in\n location.state = {\n from: {\n pathname: window.location.pathname,\n },\n }\n }\n }, [location])\n\n return error ?\n <FlexCol alignItems=\"stretch\" {...props}>\n {noErrorDisplay ?\n customError\n : <FlexCol alignItems=\"center\" {...props}>\n <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} />\n </FlexCol>\n }\n </FlexCol>\n : (<>{children}</> ?? null)\n}\n","import { WithChildren } from '@xylabs/react-shared'\nimport { useEffect, useState } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorReporterContext } from './Context.js'\n\nexport interface ErrorReporterProviderProps {\n rollbar: Rollbar\n}\n\nconst ErrorReporterProvider: React.FC<WithChildren<ErrorReporterProviderProps>> = ({ children, rollbar }) => {\n const [rollbarInstance, setRollBarInstance] = useState<Rollbar>()\n\n useEffect(() => {\n if (rollbarInstance) {\n setRollBarInstance(rollbarInstance)\n }\n }, [rollbar, rollbarInstance])\n\n return <ErrorReporterContext.Provider value={{ rollbar }}>{children}</ErrorReporterContext.Provider>\n}\n\nexport { ErrorReporterProvider }\n","import { createContext } from 'react'\n\nimport { ErrorReporterContextState } from './State.js'\n\nexport const ErrorReporterContext = createContext<ErrorReporterContextState>({})\n","import { useContext } from 'react'\n\nimport { ErrorReporterContext } from './Context.js'\n\nconst useRollbar = () => {\n const context = useContext(ErrorReporterContext)\n if (context === undefined) {\n console.warn('useRollbar must be used within a ErrorReporterContext')\n }\n\n return context ?? {}\n}\n\nexport { useRollbar }\n"],"mappings":"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","names":["jsx","jsx","useEffect","jsx","useEffect"]}
1
+ {"version":3,"sources":["../../src/components/ErrorBoundary/ThrownErrorBoundary.tsx","../../src/components/ErrorRender/ErrorAlert.tsx","../../src/components/ErrorRender/Render.tsx","../../src/contexts/ErrorReporter/Provider.tsx","../../src/contexts/ErrorReporter/Context.ts","../../src/contexts/ErrorReporter/useRollbar.tsx"],"sourcesContent":["import { ModuleError, ModuleErrorSchema } from '@xyo-network/payload-model'\nimport { Component, ErrorInfo, ReactNode } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorRender } from '../ErrorRender/index.js'\n\nexport interface ThrownErrorBoundaryProps {\n boundaryName?: string\n children: ReactNode\n errorComponent?: (e: ModuleError, boundaryName?: string) => ReactNode\n rethrow?: boolean\n rollbar?: Rollbar\n scope?: string\n title?: string\n}\n\nexport interface ThrownErrorBoundaryState {\n xyoError?: ModuleError\n}\n\nexport class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, ThrownErrorBoundaryState> {\n override state: ThrownErrorBoundaryState = {\n xyoError: undefined,\n }\n\n static getDerivedStateFromError(error: Error) {\n return { hasError: true, xyoError: ThrownErrorBoundary.normalizeError(error) } as ThrownErrorBoundaryState\n }\n\n static normalizeError(error: Error | ModuleError): ModuleError {\n return (\n (error as ModuleError).schema === ModuleErrorSchema ?\n error\n : { message: error.message, schema: ModuleErrorSchema, sources: [] }) as ModuleError\n }\n\n override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n const { rethrow, rollbar } = this.props\n const { xyoError } = this.state\n\n rollbar?.error(error)\n\n console.error('Error:', xyoError, errorInfo)\n if (rethrow) {\n throw error\n }\n }\n\n override render() {\n const { xyoError } = this.state\n const { children, boundaryName, errorComponent, scope, title } = this.props\n if (xyoError) {\n if (errorComponent) {\n return errorComponent(xyoError)\n }\n return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} scope={scope} title={title} />\n }\n\n return children\n }\n}\n","import { ExitToApp as ExitIcon } from '@mui/icons-material'\nimport { Alert, AlertProps, AlertTitle, Typography } from '@mui/material'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { ModuleError } from '@xyo-network/payload-model'\n\nexport interface ErrorAlertProps extends AlertProps {\n error?: ModuleError | Error | string\n /** @deprecated use scope instead */\n errorContext?: string\n onCancel?: () => void\n scope?: string\n}\n\n// eslint-disable-next-line deprecation/deprecation\nexport const ErrorAlert: React.FC<ErrorAlertProps> = ({\n title = 'Whoops! Something went wrong',\n onCancel,\n error = 'An unknown error occurred',\n errorContext,\n scope,\n ...props\n}) => {\n const finalScope = scope ?? errorContext\n return (\n <Alert severity=\"error\" {...props}>\n <AlertTitle>{title}</AlertTitle>\n {finalScope ?\n <div>\n <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n Scope:\n </Typography>\n <Typography variant=\"caption\">{finalScope}</Typography>\n </div>\n : null}\n <div>\n <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n Error:\n </Typography>\n <Typography variant=\"caption\">{typeof error === 'string' ? error : error?.message}</Typography>\n </div>\n {onCancel ?\n <ButtonEx variant=\"outlined\" size=\"small\" onClick={onCancel} position=\"absolute\" style={{ right: 8, top: 8 }}>\n <ExitIcon fontSize=\"small\" />\n </ButtonEx>\n : null}\n </Alert>\n )\n}\n","import { FlexCol } from '@xylabs/react-flexbox'\nimport { useEffect } from 'react'\n\nimport { ErrorAlert } from './ErrorAlert.js'\nimport { ErrorRenderProps } from './Props.js'\n\nexport const ErrorRender: React.FC<ErrorRenderProps> = ({\n onCancel,\n error,\n noErrorDisplay = false,\n customError = null,\n children,\n errorContext,\n scope,\n useLocation,\n ...props\n}) => {\n const location = useLocation?.()\n useEffect(() => {\n if (location) {\n // ensure we end up at the same place we are now after logging in\n location.state = {\n from: {\n pathname: window.location.pathname,\n },\n }\n }\n }, [location])\n\n return error ?\n <FlexCol alignItems=\"stretch\" {...props}>\n {noErrorDisplay ?\n customError\n : <FlexCol alignItems=\"center\" {...props}>\n <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} scope={scope} />\n </FlexCol>\n }\n </FlexCol>\n : (<>{children}</> ?? null)\n}\n","import { WithChildren } from '@xylabs/react-shared'\nimport { useEffect, useState } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorReporterContext } from './Context.js'\n\nexport interface ErrorReporterProviderProps {\n rollbar: Rollbar\n}\n\nconst ErrorReporterProvider: React.FC<WithChildren<ErrorReporterProviderProps>> = ({ children, rollbar }) => {\n const [rollbarInstance, setRollBarInstance] = useState<Rollbar>()\n\n useEffect(() => {\n if (rollbarInstance) {\n setRollBarInstance(rollbarInstance)\n }\n }, [rollbar, rollbarInstance])\n\n return <ErrorReporterContext.Provider value={{ rollbar }}>{children}</ErrorReporterContext.Provider>\n}\n\nexport { ErrorReporterProvider }\n","import { createContext } from 'react'\n\nimport { ErrorReporterContextState } from './State.js'\n\nexport const ErrorReporterContext = createContext<ErrorReporterContextState>({})\n","import { useContext } from 'react'\n\nimport { ErrorReporterContext } from './Context.js'\n\nconst useRollbar = () => {\n const context = useContext(ErrorReporterContext)\n if (context === undefined) {\n console.warn('useRollbar must be used within a ErrorReporterContext')\n }\n\n return context ?? {}\n}\n\nexport { useRollbar }\n"],"mappings":"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","names":["jsx","jsx","useEffect","jsx","useEffect"]}
package/package.json CHANGED
@@ -86,6 +86,6 @@
86
86
  },
87
87
  "sideEffects": false,
88
88
  "types": "dist/browser/index.d.ts",
89
- "version": "2.81.8",
89
+ "version": "2.81.10",
90
90
  "type": "module"
91
91
  }
@@ -10,6 +10,8 @@ export interface ThrownErrorBoundaryProps {
10
10
  errorComponent?: (e: ModuleError, boundaryName?: string) => ReactNode
11
11
  rethrow?: boolean
12
12
  rollbar?: Rollbar
13
+ scope?: string
14
+ title?: string
13
15
  }
14
16
 
15
17
  export interface ThrownErrorBoundaryState {
@@ -46,12 +48,12 @@ export class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, Thr
46
48
 
47
49
  override render() {
48
50
  const { xyoError } = this.state
49
- const { children, boundaryName, errorComponent } = this.props
51
+ const { children, boundaryName, errorComponent, scope, title } = this.props
50
52
  if (xyoError) {
51
53
  if (errorComponent) {
52
54
  return errorComponent(xyoError)
53
55
  }
54
- return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} />
56
+ return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} scope={scope} title={title} />
55
57
  }
56
58
 
57
59
  return children
@@ -0,0 +1,42 @@
1
+ import { Meta, StoryFn } from '@storybook/react'
2
+ import React from 'react'
3
+
4
+ import { ErrorAlert } from './ErrorAlert.js'
5
+
6
+ const StorybookEntry: Meta = {
7
+ argTypes: {},
8
+ component: ErrorAlert,
9
+ parameters: {
10
+ docs: {
11
+ page: null,
12
+ },
13
+ },
14
+ title: 'error/ErrorAlert',
15
+ }
16
+
17
+ const Template: StoryFn<typeof ErrorAlert> = (props) => {
18
+ return <ErrorAlert {...props} />
19
+ }
20
+
21
+ const Default = Template.bind({})
22
+ Default.args = {}
23
+
24
+ const WithTitle = Template.bind({})
25
+ WithTitle.args = { title: 'Oh No!' }
26
+
27
+ const WithError = Template.bind({})
28
+ WithError.args = { error: 'An error happened' }
29
+
30
+ const WithScope = Template.bind({})
31
+ WithScope.args = { scope: 'Storybook' }
32
+
33
+ const WithErrorAndScope = Template.bind({})
34
+ WithErrorAndScope.args = { error: 'An error happened', scope: 'Storybook' }
35
+
36
+ const WithErrorAndScopeAndTitle = Template.bind({})
37
+ WithErrorAndScopeAndTitle.args = { error: 'An error happened', scope: 'Storybook', title: 'Oh No!' }
38
+
39
+ export { Default, WithError, WithErrorAndScope, WithErrorAndScopeAndTitle, WithScope, WithTitle }
40
+
41
+ // eslint-disable-next-line import/no-default-export
42
+ export default StorybookEntry
@@ -4,24 +4,40 @@ import { ButtonEx } from '@xylabs/react-button'
4
4
  import { ModuleError } from '@xyo-network/payload-model'
5
5
 
6
6
  export interface ErrorAlertProps extends AlertProps {
7
- error?: ModuleError | Error
7
+ error?: ModuleError | Error | string
8
+ /** @deprecated use scope instead */
8
9
  errorContext?: string
9
10
  onCancel?: () => void
11
+ scope?: string
10
12
  }
11
13
 
12
- export const ErrorAlert: React.FC<ErrorAlertProps> = ({ onCancel, error, errorContext, ...props }) => {
14
+ // eslint-disable-next-line deprecation/deprecation
15
+ export const ErrorAlert: React.FC<ErrorAlertProps> = ({
16
+ title = 'Whoops! Something went wrong',
17
+ onCancel,
18
+ error = 'An unknown error occurred',
19
+ errorContext,
20
+ scope,
21
+ ...props
22
+ }) => {
23
+ const finalScope = scope ?? errorContext
13
24
  return (
14
25
  <Alert severity="error" {...props}>
15
- <AlertTitle>Whoops! Something went wrong</AlertTitle>
16
- {errorContext ?
17
- <Typography variant="caption" my={0.5} lineHeight="1" display="block">
18
- {errorContext}
19
- </Typography>
26
+ <AlertTitle>{title}</AlertTitle>
27
+ {finalScope ?
28
+ <div>
29
+ <Typography variant="caption" mr={0.5} fontWeight="bold">
30
+ Scope:
31
+ </Typography>
32
+ <Typography variant="caption">{finalScope}</Typography>
33
+ </div>
20
34
  : null}
21
- <Typography variant="caption" mr={0.5} fontWeight="bold">
22
- Error:
23
- </Typography>
24
- <Typography variant="caption">{error?.message}</Typography>
35
+ <div>
36
+ <Typography variant="caption" mr={0.5} fontWeight="bold">
37
+ Error:
38
+ </Typography>
39
+ <Typography variant="caption">{typeof error === 'string' ? error : error?.message}</Typography>
40
+ </div>
25
41
  {onCancel ?
26
42
  <ButtonEx variant="outlined" size="small" onClick={onCancel} position="absolute" style={{ right: 8, top: 8 }}>
27
43
  <ExitIcon fontSize="small" />
@@ -10,5 +10,6 @@ export interface ErrorRenderProps extends FlexBoxProps {
10
10
  noErrorDisplay?: boolean
11
11
  noReAuth?: boolean
12
12
  onCancel?: () => void
13
+ scope?: string
13
14
  useLocation?: () => Location
14
15
  }
@@ -11,6 +11,7 @@ export const ErrorRender: React.FC<ErrorRenderProps> = ({
11
11
  customError = null,
12
12
  children,
13
13
  errorContext,
14
+ scope,
14
15
  useLocation,
15
16
  ...props
16
17
  }) => {
@@ -31,7 +32,7 @@ export const ErrorRender: React.FC<ErrorRenderProps> = ({
31
32
  {noErrorDisplay ?
32
33
  customError
33
34
  : <FlexCol alignItems="center" {...props}>
34
- <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} />
35
+ <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} scope={scope} />
35
36
  </FlexCol>
36
37
  }
37
38
  </FlexCol>