UI splitpanes sizes are no longer persisted to local storage

[posva]

Describe the bug

It seems that there was a regression of https://github.com/vitest-dev/vitest/pull/5166

• vitest --ui
• Resize splitpanes on the left
• reload page
• the left pane resets to the default size

I think that the initOnMounted option no longer takes effect since they were moved outside of a component. Maybe they should be exposed as functions instead of variables const useDetailsSizes = () => useLocalStorage(...)

Reproduction

https://stackblitz.com/edit/vitest-dev-vitest-enxjhj?file=README.md&initialPath=__vitest__/

(default repro, might have outdated deps but I tested locally too)

System Info

na

Used Package Manager

pnpm

Validations

• [X] Follow our Code of Conduct
• [X] Read the Contributing Guidelines.
• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• [X] The provided reproduction is a minimal reproducible example of the bug.

[userquin]

I guess we need to split logic for ui and browser ui: right now using mainSizes on UI when we should use detailSizes (in the new UI there is no details, the middle panel has been removed)

[userquin]

Check the video, it is working again: https://streamable.com/8tzfxh

EDIT: we'll have some side effect when switching between UI and Browser UI: mainSizes and detailSizes for Browser UI and we should add a new sizes for UI /cc @sheremet-va