Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Support multiple dashboards #1683

Closed
mattrunyon opened this issue Dec 11, 2023 · 0 comments · Fixed by #1714
Closed

Support multiple dashboards #1683

mattrunyon opened this issue Dec 11, 2023 · 0 comments · Fixed by #1714
Assignees
@mattrunyon
Labels
enhancement New feature or request
Milestone
January 2024

Comments

@mattrunyon
Copy link
Collaborator

For Deephaven UI, we need multiple dashboard support so a user can create a dashboard which opens in a separate tab within the app. This should work like the enterprise tabs at the top of the app where dashboards are closeable and movable (except main dashboard)

Will need a way to emit a dashboard open event as well as saving the open dashboards and their layouts
@mattrunyon mattrunyon added the enhancement New feature or request label Dec 11, 2023
@mattrunyon mattrunyon added this to the December 2023 milestone Dec 11, 2023
@mattrunyon mattrunyon self-assigned this Dec 11, 2023
@mofojed mofojed modified the milestones: December 2023, January 2024 Jan 9, 2024
@mattrunyon mattrunyon mentioned this issue Jan 16, 2024
Merged
@mattrunyon mattrunyon mentioned this issue Jan 23, 2024
Open
mattrunyon added a commit that referenced this issue Jan 26, 2024
@mattrunyon
feat: Multiple dashboards (#1714)
32dde3c 
Fixes #1683

Test with the dh.ui plugin from
deephaven/deephaven-plugins#176

Example dashboard code

```
from deephaven import ui, time_table
from deephaven.ui import use_memo, use_state
from deephaven.plot.figure import Figure

def use_wave_input():
    """
    Demonstrating a custom hook.
    Creates an input panel that controls the amplitude, frequency, and phase for a wave
    """
    amplitude, set_amplitude = use_state(1.0)
    frequency, set_frequency = use_state(1.0)
    phase, set_phase = use_state(1.0)

    input_panel = ui.flex(
        ui.slider(
            label="Amplitude",
            default_value=amplitude,
            min_value=-100.0,
            max_value=100.0,
            on_change=set_amplitude,
            step=0.1,
        ),
        ui.slider(
            label="Frequency",
            default_value=frequency,
            min_value=-100.0,
            max_value=100.0,
            on_change=set_frequency,
            step=0.1,
        ),
        ui.slider(
            label="Phase",
            default_value=phase,
            min_value=-100.0,
            max_value=100.0,
            on_change=set_phase,
            step=0.1,
        ),
        direction="column",
    )

    return amplitude, frequency, phase, input_panel

@ui.component
def multiwave():
    amplitude, frequency, phase, wave_input = use_wave_input()

    tt = use_memo(lambda: time_table("PT1s").update("x=i"), [])
    t = use_memo(
        lambda: tt.update(
            [
                f"y_sin={amplitude}*Math.sin({frequency}*x+{phase})",
                f"y_cos={amplitude}*Math.cos({frequency}*x+{phase})",
                f"y_tan={amplitude}*Math.tan({frequency}*x+{phase})",
            ]
        ),
        [amplitude, frequency, phase],
    )
    p_sin = use_memo(
        lambda: Figure().plot_xy(series_name="Sine", t=t, x="x", y="y_sin").show(), [t]
    )
    p_cos = use_memo(
        lambda: Figure().plot_xy(series_name="Cosine", t=t, x="x", y="y_cos").show(),
        [t],
    )
    p_tan = use_memo(
        lambda: Figure().plot_xy(series_name="Tangent", t=t, x="x", y="y_tan").show(),
        [t],
    )

    return [
        ui.column(
            ui.row(
                ui.stack(
                    ui.panel(wave_input, title="Wave Input"),
                    ui.panel(t, title="Wave Table"),
                    activeItemIndex=0
                ),
                height=25
            ),
            ui.row(
                ui.stack(ui.panel(p_sin, title="Sine"), width=50),
                ui.stack(ui.panel(p_cos, title="Cosine"), width=30),
                ui.stack(ui.panel(p_tan, title="Tangent"))
            )
        )
    ]

mw = ui.dashboard(multiwave())
```
@mofojed mofojed mentioned this issue Jan 26, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@mattrunyon mattrunyon

Labels
enhancement New feature or request
Projects
None yet
Milestone
January 2024
Development

Successfully merging a pull request may close this issue.

feat: Multiple dashboards mattrunyon/web-client-ui
2 participants
@mofojed @mattrunyon