feat: DH-19000: Persist deephaven UI table client-side state by mattrunyon · Pull Request #1152 · deephaven/deephaven-plugins

mattrunyon · 2025-03-27T19:18:07Z

Needs to run with un-released web-client-ui.

Simple example that uses both regular and ui.table to show persistence.

Note that there is an issue with not many props in IrisGrid responding to changes, so the merging of client and server state is a best guess for what we'll want when it does respond to prop changes on those other props (sort, filters, etc.)

from deephaven import ui
import deephaven.plot.express as dx

_stocks = dx.data.stocks(False)


@ui.component
def my_comp():
    key, set_key = ui.use_state(0)
    return [
        ui.fragment(_stocks, key="base" + str(key)),
        ui.button("Reset", on_press=lambda: set_key(key + 1)),
        ui.table(_stocks, key="table" + str(key)),
    ]


tables = my_comp()

Should probably add

Ability to reload panel and clear initial state if there is a problem re-hydrating like migration issues. Right now it just throws and you cannot recover other than closing and re-opening the tab.

github-actions · 2025-03-27T19:21:03Z

ui docs preview (Available for 14 days)

github-actions · 2025-04-28T19:16:18Z

ui docs preview (Available for 14 days)

Copilot

Pull Request Overview

This PR adds client-side persistence for the Deephaven UI table and widget panel state.

Introduces a new optional property (panelStates) in the widget data type.
Adds onDataChange and getInitialData callbacks to the React panel manager components, updating their interfaces and usage in DocumentHandler, ReactPanel, and associated tests.
Integrates persistent state support in the ReactPanel and UITable components.

Reviewed Changes

Copilot reviewed 8 out of 9 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
plugins/ui/src/js/src/widget/WidgetTypes.ts	Added an optional panelStates property to support persisting panel state
plugins/ui/src/js/src/widget/DocumentHandler.tsx	Added onDataChange and getInitialData callbacks to propagate panel state changes
plugins/ui/src/js/src/layout/ReactPanelManager.ts	Updated ReactPanelManager and ReactPanelControl interfaces to include state persistence methods
plugins/ui/src/js/src/layout/ReactPanel.tsx	Wrapped children in PersistentStateProvider for persisted state updates
plugins/ui/src/js/src/layout/ReactPanel.test.tsx	Updated tests to include mocks for the new persistence callbacks
plugins/ui/src/js/src/elements/UITable/UITable.tsx	Integrated client-side state persistence by using usePersistentState and merging server and hydrated client state

Files not reviewed (1)

plugins/ui/src/js/package.json: Language not supported

Copilot · 2025-05-01T20:24:21Z

+   * In the future we may want to do a smarter merge of these.
+   */
+  const mergedIrisGridProps = useMemo(() => {
+    if (initialIrisGridServerProps.current === irisGridServerProps) {


Comparing initialIrisGridServerProps.current with irisGridServerProps using reference equality may be unreliable if the server state object is recreated on each render. Consider using a deep comparison utility or ensuring that the server props maintain stable references so that rehydration logic behaves as intended.

github-actions · 2025-05-01T20:27:02Z

ui docs preview (Available for 14 days)

github-actions · 2025-05-01T21:13:10Z

ui docs preview (Available for 14 days)

github-actions · 2025-05-02T16:31:17Z

ui docs preview (Available for 14 days)

mofojed

Update the client packages

mofojed · 2025-05-07T14:52:23Z

Published new web-client-ui packages so you should be able to use this now

github-actions · 2025-05-12T20:31:53Z

ui docs preview (Available for 14 days)

mattrunyon · 2025-05-12T21:41:06Z

This needs a nightly build of DHC with the latest web-client-ui for e2e tests to work because of the new externalized imports

Copilot

Pull Request Overview

This PR introduces client-side state persistence for Deephaven UI tables by integrating persistent state handling into panel management and table components.

Adds a new panelStates field to widget data and updates the panel manager interface with onDataChange and getInitialData methods.
Integrates a PersistentStateProvider in ReactPanel and updates UITable to merge client and server state for rehydration.

Reviewed Changes

Copilot reviewed 11 out of 11 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
plugins/ui/src/js/src/widget/WidgetTypes.ts	Added panelStates support to WidgetData.
plugins/ui/src/js/src/widget/DocumentHandler.tsx	Introduced onDataChange handler for state persistence.
plugins/ui/src/js/src/layout/ReactPanelManager.ts	Updated interface and hooks to include data persistence functions.
plugins/ui/src/js/src/layout/ReactPanelErrorBoundary.tsx	Enhanced error handling to provide a reset action via onReset.
plugins/ui/src/js/src/layout/ReactPanel.tsx	Integrated PersistentStateProvider and error reset logic for rehydration.
plugins/ui/src/js/src/layout/ReactPanel.test.tsx	Updated tests to accommodate new data persistence behaviors.
plugins/ui/src/js/src/elements/UITable/UITable.tsx	Merged persistent client state with server state for the table component.
plugins/ui/src/js/package.json	Updated dependencies to newer versions.

Copilot · 2025-05-14T19:18:59Z

+   * Otherwise, we have received changes from the server and we should use those over client state.
+   * In the future we may want to do a smarter merge of these.
+   */
+  const mergedIrisGridProps = useMemo(() => {


[nitpick] The conditional merge using reference equality to compare irisGridServerProps may be fragile. Consider using a more robust state comparison (or an explicit rehydration flag) to ensure the correct precedence of client vs server state.

Copilot · 2025-05-14T19:19:00Z

+  const onErrorReset = useCallback(() => {
+    // Not EMPTY_ARRAY, because we always want to trigger a re-render
+    // in case a panel is reloaded and errors again
+    setInitialData([]);


[nitpick] Using a literal empty array to reset state may be less clear in intent. Consider extracting this value to a named constant or adding an inline comment to clarify that an empty array forces a re-render for error recovery.

Suggested change

const onErrorReset = useCallback(() => {

// Not EMPTY_ARRAY, because we always want to trigger a re-render

// in case a panel is reloaded and errors again

setInitialData([]);

const EMPTY_ARRAY: never[] = []; // Used to reset state and trigger a re-render

const onErrorReset = useCallback(() => {

// Always use EMPTY_ARRAY to ensure a re-render for error recovery

setInitialData(EMPTY_ARRAY);

mattrunyon · 2025-05-14T19:19:29Z

Added an onReset to the ReactPanelErrorBoundary so we can trigger a reset from any child error

github-actions · 2025-05-14T19:21:08Z

ui docs preview (Available for 14 days)

github-actions · 2025-05-14T20:05:58Z

ui docs preview (Available for 14 days)

mofojed · 2025-05-14T20:18:17Z

    log.error('Error caught by ErrorBoundary', error, errorInfo);
  }

+  getError(): WidgetError | undefined {


Should probably memoize this.

We can, although it probably won't provide much benefit. The object is cheap to create and this component should basically never re-render until the action button is clicked

mofojed

Memoize

mattrunyon · 2025-05-19T18:48:25Z

Added memoization (although I don't think it's really necessary for this case)

github-actions · 2025-05-19T18:52:01Z

ui docs preview (Available for 14 days)

mattrunyon changed the title ~~DH-19000: Persist deephaven UI table client-side state~~ feat: DH-19000: Persist deephaven UI table client-side state Mar 31, 2025

mattrunyon added 3 commits May 1, 2025 15:02

WIP persisting client state across reloads

ca3395f

WIP

0cd97d8

Update to beta packages

45cf06a

mattrunyon force-pushed the mattrunyon_dh-19000 branch from 7e6d8be to 45cf06a Compare May 1, 2025 20:22

mattrunyon requested review from Copilot and mofojed and removed request for mofojed May 1, 2025 20:23

mattrunyon self-assigned this May 1, 2025

Copilot AI reviewed May 1, 2025

View reviewed changes

mattrunyon marked this pull request as ready for review May 1, 2025 20:26

Merge remote-tracking branch 'upstream/main' into mattrunyon_dh-19000

11b8abb

mofojed requested changes May 7, 2025

View reviewed changes

Comment thread plugins/ui/src/js/package.json

mofojed May 7, 2025

Copy link
Copy Markdown

Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Published new web-client-ui packages so you should be able to use this now

Update package versions

1266abe

mattrunyon requested a review from mofojed May 12, 2025 20:27

mofojed previously approved these changes May 13, 2025

View reviewed changes

Add reset for initial state

fc8e316

mattrunyon dismissed mofojed’s stale review via fc8e316 May 14, 2025 19:18

mattrunyon requested review from Copilot and mofojed May 14, 2025 19:18

Copilot AI reviewed May 14, 2025

View reviewed changes

Merge remote-tracking branch 'upstream/main' into mattrunyon_dh-19000

290d445

mofojed reviewed May 14, 2025

View reviewed changes

mofojed requested changes May 14, 2025

View reviewed changes

Memoize

a40675f

mattrunyon requested a review from mofojed May 19, 2025 18:48

mofojed approved these changes May 20, 2025

View reviewed changes

mattrunyon merged commit e1a9971 into deephaven:main May 20, 2025
16 checks passed

mattrunyon deleted the mattrunyon_dh-19000 branch May 20, 2025 19:16

mattrunyon mentioned this pull request May 20, 2025

Storing state of each element (such as UITable filters that are set) (something like a usePersistentState() hook, from the UITable component) #163

Closed

mofojed mentioned this pull request May 30, 2025

feat: DH-18354 Add input filter support to UITable #1180

Merged

Uh oh!

Conversation

mattrunyon commented Mar 27, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Should probably add

Uh oh!

github-actions Bot commented Mar 27, 2025

Uh oh!

github-actions Bot commented Apr 28, 2025

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI May 1, 2025

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented May 1, 2025

Uh oh!

github-actions Bot commented May 1, 2025

Uh oh!

github-actions Bot commented May 2, 2025

Uh oh!

mofojed left a comment

Choose a reason for hiding this comment

Uh oh!

mofojed May 7, 2025

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented May 12, 2025

Uh oh!

mattrunyon commented May 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI May 14, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI May 14, 2025

Choose a reason for hiding this comment

Uh oh!

mattrunyon commented May 14, 2025

Uh oh!

github-actions Bot commented May 14, 2025

Uh oh!

github-actions Bot commented May 14, 2025

Uh oh!

mofojed May 14, 2025

Choose a reason for hiding this comment

Uh oh!

mattrunyon May 14, 2025

Choose a reason for hiding this comment

Uh oh!

mofojed left a comment

Choose a reason for hiding this comment

Uh oh!

mattrunyon commented May 19, 2025

Uh oh!

github-actions Bot commented May 19, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

mattrunyon commented Mar 27, 2025 •

edited

Loading

mattrunyon commented May 12, 2025 •

edited

Loading