Feature: support sort layout

[GodD6366]

This PR supports sorting of layouts so that the user can place the specified layout at the top

By default, the behavior remains the same as before, and the layout to be sorted needs to be declared manually for it to take effect

Edit: settings.yaml

layout:
  layout1:
    sort: true  # enable
    style: row
    columns: 3
  layout2:
    sort: true
    style: row
    columns: 3
  layout3:
    style: row
    columns: 3
  layout4:
    style: row
    columns: 3

[JazzFisch]

Is there a particular scenario that you are trying to solve with this PR? Could one not just sort their entries in the services.yaml file?

[GodD6366]

I wrote this in services.yaml

- Widget
- Public
- Intranet

But the actual rendering order is not fixed, it seems to be related to Service Discovery, every time I start a new docker service, the order will change, for example, my current order is not as expected

- Widget
- Intranet
- Public

So I have supported sorting in settings.yaml

[brhahlen]

@JazzFisch It seems to me is to support a fixed layout, instead of the dynamic one that is used now. For instance, my layout on homepage changes everytime I restart a Docker container, since I am using Docker Labels for everything. As it looks to me, this PR would fix this, by ensuring that certain areas remain at the top of the page.

[shamoon]

Well, rather than setting this at the per-group level perhaps it should be set globally (settings, perhaps docker)?

[brhahlen]

For me, if we can just define a static order of the groups, that would already be a huge plus. Sorting of services is secondary for me in that regard (of course, it's also nice, but hey, can't have everythign :) )

[shamoon]

Hi, two changes i just added, please feel free to revert / let me know if you have any concerns:

1. Just sort by default, if someone is unhappy with the sort, they just change the layout config. If they have no layout defined, this doesnt change anything.
2. I simplified the actual sorting logic. The section right before your previous code already looped through all the services, so I think it should be done there, where mergedGroups is getting built already.

Curious to hear your, and others thoughts on this now.

[shamoon]

By the way, this also means you can easily mix up discovered + configured services, e.g. this works great:

layout:
  Auto-Discovered1:
  Configured1:
  Configured2:
  Auto-Discovered2:
  Configured3:
    style: row
    columns: 3
...

[brhahlen]

Cool, thanks! Will see if I can test this in the next few days

[brhahlen]

@shamoon Just tried with nightly (nightly (f48ff3c, Nov 9, 2022)).

This is defined in my settings.yaml

  Network:
    style: row
    columns: 4
  System:
    style: row
    columns: 4
  Management:
  Home Automation:
  Personal:
  Sites:
  Media:
    style: row
    columns: 4

But this is what it looks like:

So either I'm doing something wrong, or it's not working as intended

[shamoon]

This isn’t merged yet, so it’s not in nightly to test :)

I think you’ll have to pull this branch

[brhahlen]

Well... That explains that then... 😂

Was looking to see if I could pulll the Docker file that was created from this, but I can't find it seems. Oh well, will wait a bit longer then :)

[brhahlen]

This does not work fully for me, it seems. Just switched from nightly to main to test.

This is what I have in settings.yaml

layout:
  Network:
    style: row
    columns: 4
  System:
    style: row
    columns: 4
  Management:
  Home Automation:
  Personal:
  Sites:
  Media:
    style: row
    columns: 4

After first start, it renders like this: (used CTRL+F5)

Adding a line in settings.yaml and saving, makes it render like this:

Changing the order of the layout section in settings doesn't do much either.

Can move all this to an issue as well, if you want to?

[shamoon]

I see the issue, I'll fix

[shamoon]

should be sorted, please check once its done building ~10 min

[brhahlen]

That was fast! :-) Will check in a bit

[brhahlen]

Yes, that works now, thanks a lot for the quick fix! Awesome work being done here :)

[github-actions[bot]]

This pull request has been automatically locked since there has not been any recent activity after it was closed. Please open a new discussion for related concerns.