@xyo-network/react-error 2.40.1 → 2.40.3

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 (33) hide show
  1. package/dist/cjs/components/XyoErrorBoundary/ThrownErrorBoundary.d.ts +3 -1
  2. package/dist/cjs/components/XyoErrorBoundary/ThrownErrorBoundary.d.ts.map +1 -1
  3. package/dist/cjs/components/XyoErrorBoundary/ThrownErrorBoundary.js +9 -3
  4. package/dist/cjs/components/XyoErrorBoundary/ThrownErrorBoundary.js.map +1 -1
  5. package/dist/cjs/components/XyoErrorRender/ErrorAlert.d.ts +1 -0
  6. package/dist/cjs/components/XyoErrorRender/ErrorAlert.d.ts.map +1 -1
  7. package/dist/cjs/components/XyoErrorRender/ErrorAlert.js +2 -2
  8. package/dist/cjs/components/XyoErrorRender/ErrorAlert.js.map +1 -1
  9. package/dist/cjs/components/XyoErrorRender/Props.d.ts +1 -0
  10. package/dist/cjs/components/XyoErrorRender/Props.d.ts.map +1 -1
  11. package/dist/cjs/components/XyoErrorRender/Render.d.ts.map +1 -1
  12. package/dist/cjs/components/XyoErrorRender/Render.js +2 -2
  13. package/dist/cjs/components/XyoErrorRender/Render.js.map +1 -1
  14. package/dist/docs.json +719 -565
  15. package/dist/esm/components/XyoErrorBoundary/ThrownErrorBoundary.d.ts +3 -1
  16. package/dist/esm/components/XyoErrorBoundary/ThrownErrorBoundary.d.ts.map +1 -1
  17. package/dist/esm/components/XyoErrorBoundary/ThrownErrorBoundary.js +9 -3
  18. package/dist/esm/components/XyoErrorBoundary/ThrownErrorBoundary.js.map +1 -1
  19. package/dist/esm/components/XyoErrorRender/ErrorAlert.d.ts +1 -0
  20. package/dist/esm/components/XyoErrorRender/ErrorAlert.d.ts.map +1 -1
  21. package/dist/esm/components/XyoErrorRender/ErrorAlert.js +2 -2
  22. package/dist/esm/components/XyoErrorRender/ErrorAlert.js.map +1 -1
  23. package/dist/esm/components/XyoErrorRender/Props.d.ts +1 -0
  24. package/dist/esm/components/XyoErrorRender/Props.d.ts.map +1 -1
  25. package/dist/esm/components/XyoErrorRender/Render.d.ts.map +1 -1
  26. package/dist/esm/components/XyoErrorRender/Render.js +2 -2
  27. package/dist/esm/components/XyoErrorRender/Render.js.map +1 -1
  28. package/package.json +1 -1
  29. package/src/components/XyoErrorBoundary/ThrownErrorBoundary.stories.tsx +1 -1
  30. package/src/components/XyoErrorBoundary/ThrownErrorBoundary.tsx +12 -4
  31. package/src/components/XyoErrorRender/ErrorAlert.tsx +7 -1
  32. package/src/components/XyoErrorRender/Props.ts +1 -0
  33. package/src/components/XyoErrorRender/Render.tsx +9 -2
@@ -7,7 +7,8 @@ export interface XyoErrorBoundaryProps {
7
7
  children: ReactNode;
8
8
  rollbar?: Rollbar;
9
9
  basePageProps?: BasePageProps;
10
- errorComponent?: (e: Error) => ReactNode;
10
+ errorComponent?: (e: XyoError, boundaryName?: string) => ReactNode;
11
+ boundaryName?: string;
11
12
  }
12
13
  export interface XyoErrorBoundaryState {
13
14
  xyoError?: XyoError;
@@ -15,6 +16,7 @@ export interface XyoErrorBoundaryState {
15
16
  export declare class XyoThrownErrorBoundary extends Component<XyoErrorBoundaryProps, XyoErrorBoundaryState> {
16
17
  state: XyoErrorBoundaryState;
17
18
  static normalizeError(error: Error | XyoError): XyoError;
19
+ static getDerivedStateFromError(error: Error): XyoErrorBoundaryState;
18
20
  componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
19
21
  render(): string | number | boolean | import("react").ReactFragment | JSX.Element | null | undefined;
20
22
  }
@@ -1 +1 @@
1
- {"version":3,"file":"ThrownErrorBoundary.d.ts","sourceRoot":"","sources":["../../../../src/components/XyoErrorBoundary/ThrownErrorBoundary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AACpD,OAAO,EAAE,QAAQ,EAAkB,MAAM,qBAAqB,CAAA;AAC9D,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACvD,OAAO,OAAO,MAAM,SAAS,CAAA;AAI7B,MAAM,WAAW,qBAAqB;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,SAAS,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,aAAa,CAAC,EAAE,aAAa,CAAA;IAC7B,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,KAAK,SAAS,CAAA;CACzC;AAED,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACpB;AAED,qBAAa,sBAAuB,SAAQ,SAAS,CAAC,qBAAqB,EAAE,qBAAqB,CAAC;IAC1F,KAAK,EAAE,qBAAqB,CAElC;WAEa,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ;IAIxD,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS;IAYpD,MAAM;CASd"}
1
+ {"version":3,"file":"ThrownErrorBoundary.d.ts","sourceRoot":"","sources":["../../../../src/components/XyoErrorBoundary/ThrownErrorBoundary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AACpD,OAAO,EAAE,QAAQ,EAAkB,MAAM,qBAAqB,CAAA;AAC9D,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACvD,OAAO,OAAO,MAAM,SAAS,CAAA;AAI7B,MAAM,WAAW,qBAAqB;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,SAAS,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,aAAa,CAAC,EAAE,aAAa,CAAA;IAC7B,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,SAAS,CAAA;IAClE,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACpB;AAED,qBAAa,sBAAuB,SAAQ,SAAS,CAAC,qBAAqB,EAAE,qBAAqB,CAAC;IAC1F,KAAK,EAAE,qBAAqB,CAElC;WAEa,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ;IAI/D,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,KAAK;IAIrC,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS;IAYpD,MAAM;CAYd"}
@@ -9,9 +9,12 @@ export class XyoThrownErrorBoundary extends Component {
9
9
  static normalizeError(error) {
10
10
  return (error.schema === XyoErrorSchema ? error : { message: error.message, schema: XyoErrorSchema, sources: [] });
11
11
  }
12
+ static getDerivedStateFromError(error) {
13
+ return { hasError: true, xyoError: XyoThrownErrorBoundary.normalizeError(error) };
14
+ }
12
15
  componentDidCatch(error, errorInfo) {
13
16
  const { rethrow, rollbar } = this.props;
14
- const xyoError = XyoThrownErrorBoundary.normalizeError(error);
17
+ const { xyoError } = this.state;
15
18
  rollbar?.error(error);
16
19
  console.error('XyoError:', xyoError, errorInfo);
17
20
  if (rethrow) {
@@ -20,9 +23,12 @@ export class XyoThrownErrorBoundary extends Component {
20
23
  }
21
24
  render() {
22
25
  const { xyoError } = this.state;
23
- const { children } = this.props;
26
+ const { children, boundaryName, errorComponent } = this.props;
24
27
  if (xyoError) {
25
- return _jsx(XyoErrorRender, { xyoError: xyoError });
28
+ if (errorComponent) {
29
+ return errorComponent(xyoError);
30
+ }
31
+ return _jsx(XyoErrorRender, { xyoError: xyoError, errorContext: `${boundaryName} Boundary` });
26
32
  }
27
33
  return children;
28
34
  }
@@ -1 +1 @@
1
- {"version":3,"file":"ThrownErrorBoundary.js","sourceRoot":"","sources":["../../../../src/components/XyoErrorBoundary/ThrownErrorBoundary.tsx"],"names":[],"mappings":";AACA,OAAO,EAAY,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,EAAE,SAAS,EAAwB,MAAM,OAAO,CAAA;AAGvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAclD,MAAM,OAAO,sBAAuB,SAAQ,SAAuD;IAC1F,KAAK,GAA0B;QACpC,QAAQ,EAAE,SAAS;KACpB,CAAA;IAEM,MAAM,CAAC,cAAc,CAAC,KAAuB;QAClD,OAAO,CAAE,KAAkB,CAAC,MAAM,KAAK,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,OAAO,EAAE,EAAE,EAAE,CAAa,CAAA;IAC9I,CAAC;IAEM,iBAAiB,CAAC,KAAY,EAAE,SAAoB;QACzD,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QACvC,MAAM,QAAQ,GAAG,sBAAsB,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;QAE7D,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAA;QAErB,OAAO,CAAC,KAAK,CAAC,WAAW,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAA;QAC/C,IAAI,OAAO,EAAE;YACX,MAAM,KAAK,CAAA;SACZ;IACH,CAAC;IAEM,MAAM;QACX,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAC/B,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAC/B,IAAI,QAAQ,EAAE;YACZ,OAAO,KAAC,cAAc,IAAC,QAAQ,EAAE,QAAQ,GAAI,CAAA;SAC9C;QAED,OAAO,QAAQ,CAAA;IACjB,CAAC;CACF"}
1
+ {"version":3,"file":"ThrownErrorBoundary.js","sourceRoot":"","sources":["../../../../src/components/XyoErrorBoundary/ThrownErrorBoundary.tsx"],"names":[],"mappings":";AACA,OAAO,EAAY,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,EAAE,SAAS,EAAwB,MAAM,OAAO,CAAA;AAGvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAelD,MAAM,OAAO,sBAAuB,SAAQ,SAAuD;IAC1F,KAAK,GAA0B;QACpC,QAAQ,EAAE,SAAS;KACpB,CAAA;IAEM,MAAM,CAAC,cAAc,CAAC,KAAuB;QAClD,OAAO,CAAE,KAAkB,CAAC,MAAM,KAAK,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,OAAO,EAAE,EAAE,EAAE,CAAa,CAAA;IAC9I,CAAC;IAED,MAAM,CAAC,wBAAwB,CAAC,KAAY;QAC1C,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,sBAAsB,CAAC,cAAc,CAAC,KAAK,CAAC,EAA2B,CAAA;IAC5G,CAAC;IAEM,iBAAiB,CAAC,KAAY,EAAE,SAAoB;QACzD,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QACvC,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAE/B,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAA;QAErB,OAAO,CAAC,KAAK,CAAC,WAAW,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAA;QAC/C,IAAI,OAAO,EAAE;YACX,MAAM,KAAK,CAAA;SACZ;IACH,CAAC;IAEM,MAAM;QACX,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAC/B,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAC7D,IAAI,QAAQ,EAAE;YACZ,IAAI,cAAc,EAAE;gBAClB,OAAO,cAAc,CAAC,QAAQ,CAAC,CAAA;aAChC;YACD,OAAO,KAAC,cAAc,IAAC,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,YAAY,WAAW,GAAI,CAAA;SACxF;QAED,OAAO,QAAQ,CAAA;IACjB,CAAC;CACF"}
@@ -3,6 +3,7 @@ import { AlertProps } from '@mui/material';
3
3
  import { XyoError } from '@xyo-network/module';
4
4
  export interface XyoErrorAlertProps extends AlertProps {
5
5
  error?: XyoError;
6
+ errorContext?: string;
6
7
  }
7
8
  export declare const XyoErrorAlert: React.FC<XyoErrorAlertProps>;
8
9
  //# sourceMappingURL=ErrorAlert.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ErrorAlert.d.ts","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/ErrorAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAS,UAAU,EAA0B,MAAM,eAAe,CAAA;AACzE,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAE9C,MAAM,WAAW,kBAAmB,SAAQ,UAAU;IACpD,KAAK,CAAC,EAAE,QAAQ,CAAA;CACjB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAUtD,CAAA"}
1
+ {"version":3,"file":"ErrorAlert.d.ts","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/ErrorAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAS,UAAU,EAA0B,MAAM,eAAe,CAAA;AACzE,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAE9C,MAAM,WAAW,kBAAmB,SAAQ,UAAU;IACpD,KAAK,CAAC,EAAE,QAAQ,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAetD,CAAA"}
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Alert, AlertTitle, Typography } from '@mui/material';
3
- export const XyoErrorAlert = ({ error, ...props }) => {
4
- return (_jsxs(Alert, { severity: "error", ...props, children: [_jsx(AlertTitle, { children: "Whoops! Something went wrong" }), _jsx(Typography, { variant: "caption", mr: 0.5, fontWeight: "bold", children: "Error:" }), _jsx(Typography, { variant: "caption", children: error?.message })] }));
3
+ export const XyoErrorAlert = ({ error, errorContext, ...props }) => {
4
+ return (_jsxs(Alert, { severity: "error", ...props, children: [_jsx(AlertTitle, { children: "Whoops! Something went wrong" }), errorContext ? (_jsx(Typography, { variant: "caption", my: 0.5, lineHeight: "1", display: "block", children: errorContext })) : null, _jsx(Typography, { variant: "caption", mr: 0.5, fontWeight: "bold", children: "Error:" }), _jsx(Typography, { variant: "caption", children: error?.message })] }));
5
5
  };
6
6
  //# sourceMappingURL=ErrorAlert.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ErrorAlert.js","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/ErrorAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAc,UAAU,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAOzE,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACjF,OAAO,CACL,MAAC,KAAK,IAAC,QAAQ,EAAC,OAAO,KAAK,KAAK,aAC/B,KAAC,UAAU,+CAA0C,EACrD,KAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,EAAE,EAAE,GAAG,EAAE,UAAU,EAAC,MAAM,uBAE3C,EACb,KAAC,UAAU,IAAC,OAAO,EAAC,SAAS,YAAE,KAAK,EAAE,OAAO,GAAc,IACrD,CACT,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"ErrorAlert.js","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/ErrorAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAc,UAAU,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAQzE,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC/F,OAAO,CACL,MAAC,KAAK,IAAC,QAAQ,EAAC,OAAO,KAAK,KAAK,aAC/B,KAAC,UAAU,+CAA0C,EACpD,YAAY,CAAC,CAAC,CAAC,CACd,KAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,EAAE,EAAE,GAAG,EAAE,UAAU,EAAC,GAAG,EAAC,OAAO,EAAC,OAAO,YAClE,YAAY,GACF,CACd,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,EAAE,EAAE,GAAG,EAAE,UAAU,EAAC,MAAM,uBAE3C,EACb,KAAC,UAAU,IAAC,OAAO,EAAC,SAAS,YAAE,KAAK,EAAE,OAAO,GAAc,IACrD,CACT,CAAA;AACH,CAAC,CAAA"}
@@ -6,5 +6,6 @@ export interface XyoErrorRenderProps extends FlexBoxProps {
6
6
  customError?: ReactNode;
7
7
  noReAuth?: boolean;
8
8
  noErrorDisplay?: boolean;
9
+ errorContext?: string;
9
10
  }
10
11
  //# sourceMappingURL=Props.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Props.d.ts","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/Props.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,MAAM,WAAW,mBAAoB,SAAQ,YAAY;IACvD,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB"}
1
+ {"version":3,"file":"Props.d.ts","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/Props.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,MAAM,WAAW,mBAAoB,SAAQ,YAAY;IACvD,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB"}
@@ -1 +1 @@
1
- {"version":3,"file":"Render.d.ts","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/Render.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAE7C,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA0BxD,CAAA"}
1
+ {"version":3,"file":"Render.d.ts","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/Render.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAE7C,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAiCxD,CAAA"}
@@ -3,7 +3,7 @@ import { FlexCol } from '@xylabs/react-flexbox';
3
3
  import { useEffect } from 'react';
4
4
  import { useLocation } from 'react-router-dom';
5
5
  import { XyoErrorAlert } from './ErrorAlert';
6
- export const XyoErrorRender = ({ xyoError, noErrorDisplay = false, customError = null, children, ...props }) => {
6
+ export const XyoErrorRender = ({ xyoError, noErrorDisplay = false, customError = null, children, errorContext, ...props }) => {
7
7
  const location = useLocation();
8
8
  useEffect(() => {
9
9
  // ensure we end up at the same place we are now after logging in
@@ -14,7 +14,7 @@ export const XyoErrorRender = ({ xyoError, noErrorDisplay = false, customError =
14
14
  };
15
15
  }, [location]);
16
16
  if (xyoError) {
17
- return (_jsx(FlexCol, { alignItems: "stretch", ...props, children: noErrorDisplay ? (customError) : (_jsx(FlexCol, { alignItems: "center", ...props, children: _jsx(XyoErrorAlert, { error: xyoError }) })) }));
17
+ return (_jsx(FlexCol, { alignItems: "stretch", ...props, children: noErrorDisplay ? (customError) : (_jsx(FlexCol, { alignItems: "center", ...props, children: _jsx(XyoErrorAlert, { error: xyoError, errorContext: errorContext }) })) }));
18
18
  }
19
19
  else {
20
20
  return _jsx(_Fragment, { children: children }) ?? null;
@@ -1 +1 @@
1
- {"version":3,"file":"Render.js","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/Render.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAE9C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAG5C,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAAE,QAAQ,EAAE,cAAc,GAAG,KAAK,EAAE,WAAW,GAAG,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC5I,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAA;IAC9B,SAAS,CAAC,GAAG,EAAE;QACb,iEAAiE;QACjE,QAAQ,CAAC,KAAK,GAAG;YACf,IAAI,EAAE;gBACJ,QAAQ,EAAE,MAAM,CAAC,QAAQ,CAAC,QAAQ;aACnC;SACF,CAAA;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,IAAI,QAAQ,EAAE;QACZ,OAAO,CACL,KAAC,OAAO,IAAC,UAAU,EAAC,SAAS,KAAK,KAAK,YACpC,cAAc,CAAC,CAAC,CAAC,CAChB,WAAW,CACZ,CAAC,CAAC,CAAC,CACF,KAAC,OAAO,IAAC,UAAU,EAAC,QAAQ,KAAK,KAAK,YACpC,KAAC,aAAa,IAAC,KAAK,EAAE,QAAQ,GAAI,GAC1B,CACX,GACO,CACX,CAAA;KACF;SAAM;QACL,OAAO,4BAAG,QAAQ,GAAI,IAAI,IAAI,CAAA;KAC/B;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"Render.js","sourceRoot":"","sources":["../../../../src/components/XyoErrorRender/Render.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAE9C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAG5C,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,QAAQ,EACR,cAAc,GAAG,KAAK,EACtB,WAAW,GAAG,IAAI,EAClB,QAAQ,EACR,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAA;IAC9B,SAAS,CAAC,GAAG,EAAE;QACb,iEAAiE;QACjE,QAAQ,CAAC,KAAK,GAAG;YACf,IAAI,EAAE;gBACJ,QAAQ,EAAE,MAAM,CAAC,QAAQ,CAAC,QAAQ;aACnC;SACF,CAAA;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,IAAI,QAAQ,EAAE;QACZ,OAAO,CACL,KAAC,OAAO,IAAC,UAAU,EAAC,SAAS,KAAK,KAAK,YACpC,cAAc,CAAC,CAAC,CAAC,CAChB,WAAW,CACZ,CAAC,CAAC,CAAC,CACF,KAAC,OAAO,IAAC,UAAU,EAAC,QAAQ,KAAK,KAAK,YACpC,KAAC,aAAa,IAAC,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,YAAY,GAAI,GACtD,CACX,GACO,CACX,CAAA;KACF;SAAM;QACL,OAAO,4BAAG,QAAQ,GAAI,IAAI,IAAI,CAAA;KAC/B;AACH,CAAC,CAAA"}
package/package.json CHANGED
@@ -72,5 +72,5 @@
72
72
  },
73
73
  "sideEffects": false,
74
74
  "types": "dist/esm/index.d.ts",
75
- "version": "2.40.1"
75
+ "version": "2.40.3"
76
76
  }
@@ -59,7 +59,7 @@ const Template: ComponentStory<typeof XyoThrownErrorBoundary> = ({ basePageProps
59
59
  <NetworkMemoryProvider>
60
60
  <ApiProvider apiDomain="http://localhost:8080">
61
61
  <ArchivesProvider>
62
- <XyoThrownErrorBoundary basePageProps={basePageProps} errorComponent={errorComponent}>
62
+ <XyoThrownErrorBoundary basePageProps={basePageProps} errorComponent={errorComponent} boundaryName="StoryBook">
63
63
  <Alert severity="info">Use React Dev Tools to trigger and error within the boundary</Alert>
64
64
  </XyoThrownErrorBoundary>
65
65
  </ArchivesProvider>
@@ -10,7 +10,8 @@ export interface XyoErrorBoundaryProps {
10
10
  children: ReactNode
11
11
  rollbar?: Rollbar
12
12
  basePageProps?: BasePageProps
13
- errorComponent?: (e: Error) => ReactNode
13
+ errorComponent?: (e: XyoError, boundaryName?: string) => ReactNode
14
+ boundaryName?: string
14
15
  }
15
16
 
16
17
  export interface XyoErrorBoundaryState {
@@ -26,9 +27,13 @@ export class XyoThrownErrorBoundary extends Component<XyoErrorBoundaryProps, Xyo
26
27
  return ((error as XyoError).schema === XyoErrorSchema ? error : { message: error.message, schema: XyoErrorSchema, sources: [] }) as XyoError
27
28
  }
28
29
 
30
+ static getDerivedStateFromError(error: Error) {
31
+ return { hasError: true, xyoError: XyoThrownErrorBoundary.normalizeError(error) } as XyoErrorBoundaryState
32
+ }
33
+
29
34
  public componentDidCatch(error: Error, errorInfo: ErrorInfo) {
30
35
  const { rethrow, rollbar } = this.props
31
- const xyoError = XyoThrownErrorBoundary.normalizeError(error)
36
+ const { xyoError } = this.state
32
37
 
33
38
  rollbar?.error(error)
34
39
 
@@ -40,9 +45,12 @@ export class XyoThrownErrorBoundary extends Component<XyoErrorBoundaryProps, Xyo
40
45
 
41
46
  public render() {
42
47
  const { xyoError } = this.state
43
- const { children } = this.props
48
+ const { children, boundaryName, errorComponent } = this.props
44
49
  if (xyoError) {
45
- return <XyoErrorRender xyoError={xyoError} />
50
+ if (errorComponent) {
51
+ return errorComponent(xyoError)
52
+ }
53
+ return <XyoErrorRender xyoError={xyoError} errorContext={`${boundaryName} Boundary`} />
46
54
  }
47
55
 
48
56
  return children
@@ -3,12 +3,18 @@ import { XyoError } from '@xyo-network/module'
3
3
 
4
4
  export interface XyoErrorAlertProps extends AlertProps {
5
5
  error?: XyoError
6
+ errorContext?: string
6
7
  }
7
8
 
8
- export const XyoErrorAlert: React.FC<XyoErrorAlertProps> = ({ error, ...props }) => {
9
+ export const XyoErrorAlert: React.FC<XyoErrorAlertProps> = ({ error, errorContext, ...props }) => {
9
10
  return (
10
11
  <Alert severity="error" {...props}>
11
12
  <AlertTitle>Whoops! Something went wrong</AlertTitle>
13
+ {errorContext ? (
14
+ <Typography variant="caption" my={0.5} lineHeight="1" display="block">
15
+ {errorContext}
16
+ </Typography>
17
+ ) : null}
12
18
  <Typography variant="caption" mr={0.5} fontWeight="bold">
13
19
  Error:
14
20
  </Typography>
@@ -7,4 +7,5 @@ export interface XyoErrorRenderProps extends FlexBoxProps {
7
7
  customError?: ReactNode
8
8
  noReAuth?: boolean
9
9
  noErrorDisplay?: boolean
10
+ errorContext?: string
10
11
  }
@@ -5,7 +5,14 @@ import { useLocation } from 'react-router-dom'
5
5
  import { XyoErrorAlert } from './ErrorAlert'
6
6
  import { XyoErrorRenderProps } from './Props'
7
7
 
8
- export const XyoErrorRender: React.FC<XyoErrorRenderProps> = ({ xyoError, noErrorDisplay = false, customError = null, children, ...props }) => {
8
+ export const XyoErrorRender: React.FC<XyoErrorRenderProps> = ({
9
+ xyoError,
10
+ noErrorDisplay = false,
11
+ customError = null,
12
+ children,
13
+ errorContext,
14
+ ...props
15
+ }) => {
9
16
  const location = useLocation()
10
17
  useEffect(() => {
11
18
  // ensure we end up at the same place we are now after logging in
@@ -23,7 +30,7 @@ export const XyoErrorRender: React.FC<XyoErrorRenderProps> = ({ xyoError, noErro
23
30
  customError
24
31
  ) : (
25
32
  <FlexCol alignItems="center" {...props}>
26
- <XyoErrorAlert error={xyoError} />
33
+ <XyoErrorAlert error={xyoError} errorContext={errorContext} />
27
34
  </FlexCol>
28
35
  )}
29
36
  </FlexCol>