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.

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

feat: ui.fragment, ui.tabs, ui.tab_list, ui.tab_panels #138

Merged
merged 5 commits into from
Dec 20, 2023

Conversation

mofojed
Copy link
Member

@mofojed mofojed commented Nov 24, 2023

  • When decoding the JSON document, convert the element nodes right to their components then
    • Eliminates wrapper components like ElementView, which was causing some issues when used within components that expected children of a certain type (such as Tabs/TabPanels/TabList from spectrum)
    • Wraps exported objects in the ObjectView only when they are rendered as children of an element
    • Still checks for mixed panel/non-panels at root, and implicitly wraps root if no panels
  • Wrap children elements of spectrum components that are just string type to a Text element
    • Fixes up padding issues within Spectrum components
  • Fix styling on table to display: contents
    • Now it sizes correctly by default when used within tabs
  • Use a context (ReactPanelManagerContext) to handle the opening/closing of react panels within a document
    • Concept can be extended for opening/closing dashboards as well
  • Add an example for Tabs/ui.tabs
    • Looked into automatically mapping ui.item, but was annoying with setting the keys, not bothering to deviate right now
  • Handle exported object lifecycle more correctly

@mofojed mofojed requested a review from mattrunyon November 24, 2023 17:42
@mofojed mofojed self-assigned this Nov 24, 2023
@dsmmcken dsmmcken linked an issue Dec 7, 2023 that may be closed by this pull request
- This way components are rendered directly
- Still need to automatically wrap tables, figures, and top level to a panel to keep that behaviour

Clean up a bit

- it's working for a simple counter example
- Still need to wrap in a panel automatically, wrap in UITable/UIFigure automatically, etc

Add tabs

- They work in the most basic example, but they ain't working with tables:
```
from deephaven import ui

@ui.component
def tab_test():
    return ui.panel(
        ui.tabs(
            ui.tab_list(
                ui.item('Hello'),
                ui.item('World')
            ),
            ui.tab_panels(
                ui.item('Foo'),
                ui.item('Bar')
            )
        )
    )

tt = tab_test()
```

Clean up how objects are implicitly rendered

- Add a ui.object_view to explicitly wrap an exported object in an ObjectView
- ExportedObjects that are passed as children of an element are implicitly converted to an ObjectView when decoding the JSON in the WidgetHandler
- Enforce no mixed panel/non-panels for the document root, as well as implicitly wrapping the root array in a panel if necessary

Clean up all tests affected

- They all pass again

Clean up tables a bit

- They now appear correctly in the Tabs component

Fix issue where opening a widget twice wouldn't re-open it correctly

- Wasn't memoizing the onOpen/onClose callbacks correctly in DocumentHandler

Add a spec for ui.fragment and implementation

- Also provided an example for it

Clean up example a bit

Some fixes after Don reviewing

- Automatically map "string" that is set as a children in a spectrum element to a `Text` element. Makes padding more correct for buttons/tabs and things
- Provide an example for Tabs
- Handle object lifecycle in WidgetHandler
  - This will conflict with my other PR, and the two need to merge
  - Also need to handle how widget plugins handle the exported object. Not all objects can be copied (only Table can be), and we may also need to fetch an object twice if it's re-used.
@mofojed mofojed marked this pull request as ready for review December 13, 2023 21:47
plugins/ui/src/deephaven/ui/components/object_view.py Outdated Show resolved Hide resolved
plugins/ui/src/js/src/DocumentUtils.tsx Show resolved Hide resolved
plugins/ui/src/js/src/DocumentUtils.tsx Show resolved Hide resolved
plugins/ui/src/js/src/DocumentUtils.tsx Outdated Show resolved Hide resolved
plugins/ui/src/js/src/ElementUtils.ts Outdated Show resolved Hide resolved
plugins/ui/src/js/src/UITableUtils.tsx Outdated Show resolved Hide resolved
plugins/ui/src/js/src/styles.scss Outdated Show resolved Hide resolved
plugins/ui/src/js/src/spectrum/mapSpectrumProps.ts Outdated Show resolved Hide resolved
plugins/ui/src/js/src/WidgetUtils.tsx Show resolved Hide resolved
plugins/ui/src/js/src/WidgetUtils.tsx Outdated Show resolved Hide resolved
- Clean up some comments/params
- Delete object_view (wasn't being used)
- Remove overflow: hidden
- Other small changes
@mofojed mofojed requested a review from mattrunyon December 19, 2023 14:27
@mofojed mofojed requested a review from mattrunyon December 20, 2023 21:36
@mofojed mofojed enabled auto-merge (squash) December 20, 2023 21:37
@mofojed mofojed merged commit cedcd3c into deephaven:main Dec 20, 2023
11 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Fragment (ui.fragment) Tabs - ui.tabs to create a stack within a panel
2 participants