Add subview option to dashboard views

[piitaya]

Proposed change

This PR add a new view configuration option to tag a view as "subview".

It allow user to easily create room oriented dashboard.

When a subview is displayed, the tab bar is replaced by the view name and the menu icon by a back icon. By default the back icon go to the previous page but the back_path option allow user to define a custom back path (always go back to the home view for example)

YAML example

title: Bathroom
path: bathroom
icon: mdi:shower
subview: true
back_path: /lovelace/home

Editor

Back path option is only displayed when subview is true.

Updated tab bar

The subviews doesn't appear in the tab bar and are greyed out in edit mode.

Demo time

https://user-images.githubusercontent.com/5878303/191218073-b3ba3bff-c75d-4544-bec9-3417b7941ddc.mp4

Type of change

• [ ] Dependency upgrade
• [ ] Bugfix (non-breaking change which fixes an issue)
• [x] New feature (thank you!)
• [ ] Breaking change (fix/feature causing existing functionality to break)
• [ ] Code quality improvements to existing code or addition of tests

Example configuration

Additional information

• This PR fixes or closes issue: fixes #
• This PR is related to issue or discussion:
• Link to documentation pull request:

Checklist

• [x] The code change is tested and works locally.
• [x] There is no commented out code in this PR.
• [x] Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

• [ ] Documentation added/updated for www.home-assistant.io

[ildar170975]

This functionality seems to be revolutionary and creates many possibilities in Lovelace!

[piitaya]

Update : Only display back_path field for advanced users 🙂

[jmcollin78]

Is there a way to prevent the opening of the subview in a new browser tab each time we click ? Typically with the companion app, a click on a button which opens a subview run the subview in a browser tab (and then leave the companion app)

[piitaya]

Is there a way to prevent the opening of the subview in a new browser tab each time we click ?

Typically with the companion app, a click on a button which opens a subview run the subview in a browser tab (and then leave the companion app)

How do you open the subview? Using the navigate action?

[jmcollin78]

With this kind of code:

- show_name: true
        show_icon: true
        type: button
        tap_action:
          action: url
          url_path: /lovelace-voitures/tesla
        entity: button.volets_bureau_identify
        name: Voitures
        icon: mdi:car-connected
        hold_action:
          action: none

[jmcollin78]

I just realise that I should rather use action: navigate and not url (with navigation_path instead of url_path).

Sorry for this question.

[piitaya]

Use navigate action instead of URL action. URL action is for external link and navigate for internal (other views for example).

[jmcollin78]

it works fine with navigate. Thank you for this cery cool feature. I love it.