[FlowUI] Composition UI without Dialog

Hi there,

in 2.x the following previously existing common pattern seems to be broken:

Entities: Customer 1:N Order (composition)

View: CustomerListView, CustomerDetailView, OrderDetailView

Now when I want to open the OrderDetailView not in the dialog, but as a regular full-screen view, it does not hold the tempary state of the customer object anymore. Instead it asks if I want to save the entity before closing the window:

  1. entering information about the customer and clicking the create order button
    CleanShot 2023-08-11 at 11.39.35.png
  2. order detail view is not opened
    CleanShot 2023-08-11 at 11.39.39.png

The only thing I changed over the generated code from studio:

            <actions>
                <action id="create" type="list_create" />
                <action id="edit" type="list_edit" />
                <action id="remove" type="list_remove"/>
            </actions>

instead of letting it open via dialog.

Does that mean that nested views are not supported any longer in Vaadin 24?

Attached you can find an example app:

jmix-flowui-problem-composition-ui-without-dialog.zip (461.6 KB)

Thanks,
Mario

1 Like

Hi,

By design, nested views must be opened in the dialog widow. Currently, with Vaadin Flow opening nester views in the same window isn’t possible. The reasons are:

  1. Views (Screens) are created based on a route.
    This means that when the user navigates to some route (e.g., http://example.com/some/path), either by clicking a link in the application or entering the address in the address bar, corresponding UI component (the one with the @Route("some/path") annotation) is created and shown on the page (See docs).
  2. Changes in the @PreserveOnRefresh annotation:

Vaadin 8

Marks a UI that should be retained when the user refreshed the browser window. By default, a new UI instance is created when refreshing, causing any UI state not captured in the URL or the URI fragment to get discarded. By adding this annotation to a UI class, the framework will instead reuse the * current UI instance when a reload is detected.

Vaadin Flow

Indicates that a previous view instance should be-reused when reloading a location in the same browser window/tab.
From Vaadin doc:
Preserving UIScope beans
Unlike with earlier Vaadin versions 7 and 8, the UI and thus the UIScope beans are not preserved when the @PreserveOnRefresh annotation is used and the browser is refreshed. In order to preserve the beans on refresh.

Regards,
Gleb