Skip to content

Commit

Permalink
feat(ui): Add error boundary to prevent UI crashing due to rendering …
Browse files Browse the repository at this point in the history
…errors (#245)

This should prevent the whole UI from going blank if there's a rendering
error in JS. An example dashboard that would crash the whole UI
previously is provided below. Now you get an error message and can still
go back to your code studio.

```py
from deephaven import ui

@ui.component
def Foo():
    return [
        ui.row(ui.stack(ui.panel(ui.text('Foo')))),
        ui.row(ui.stack(ui.panel(ui.text('Bar'))))
    ]
f = ui.dashboard(Foo())
```
  • Loading branch information
mattrunyon authored Jan 31, 2024
1 parent 8b17e85 commit 74d3007
Showing 1 changed file with 6 additions and 3 deletions.
9 changes: 6 additions & 3 deletions plugins/ui/src/js/src/DashboardPlugin.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import { useConnection } from '@deephaven/jsapi-components';
import { DeferredApiBootstrap } from '@deephaven/jsapi-bootstrap';
import { Widget } from '@deephaven/jsapi-types';
import type { VariableDefinition } from '@deephaven/jsapi-types';
import { ErrorBoundary } from '@deephaven/components';
import styles from './styles.scss?inline';
import { WidgetWrapper } from './WidgetTypes';
import PortalPanel from './PortalPanel';
Expand Down Expand Up @@ -204,9 +205,11 @@ export function DashboardPlugin({
const widgetHandlers = useMemo(
() =>
[...widgetMap.entries()].map(([widgetId, widget]) => (
<DeferredApiBootstrap key={widgetId} options={widget.metadata}>
<WidgetHandler widget={widget} onClose={handleWidgetClose} />
</DeferredApiBootstrap>
<ErrorBoundary key={widgetId}>
<DeferredApiBootstrap options={widget.metadata}>
<WidgetHandler widget={widget} onClose={handleWidgetClose} />
</DeferredApiBootstrap>
</ErrorBoundary>
)),
[handleWidgetClose, widgetMap]
);
Expand Down

0 comments on commit 74d3007

Please sign in to comment.