Treeview: Expand single-child folders in the new tree view

[philipp-spiess]

Part of #46602

This adds single-child folder expansion to the new tree view based on how VS Code does it 🎉

Since the implementation of the tree is append-only, only a bit of bookkeeping is needed to detect single-child expansion scenarios and change the tree entries accordingly. I've left various comments in the code which should explain the implementation for the curious.

VS Code Reference

reference.mov

Test plan

Screen.Recording.2023-01-30.at.17.44.03.mov

App preview:

• Web

Check out the client app preview documentation to learn more.

[philipp-spiess]

I tested it with VoiceOver as well and when expanding a directory, the name is repeated so this works great on screen readers :)

[sg-e2e-regression-test-bob]

Bundle size report 📦

Initial size	Total size	Async size	Modules
0.00% (0.00 kb)	0.00% (+0.56 kb)	0.00% (+0.56 kb)	0.00% (0)

Look at the Statoscope report for a full comparison between the commits 622192e and f180943 or learn more.

Open explanation

• Initial size is the size of the initial bundle (the one that is loaded when you open the page)
• Total size is the size of the initial bundle + all the async loaded chunks
• Async size is the size of all the async loaded chunks
• Modules is the number of modules in the initial bundle

[felixfbecker]

Is it possible to link the individual parts of a combined path?

Like

<a href="/foo">foo</a> / <a href="/foo/bar">bar</a> / <a href="/foo/bar/baz">baz</a>

[philipp-spiess]

@felixfbecker

Is it possible to link the individual parts of a combined path?

It is but this would break the keyboard handling since selection is handled with the tree component and for the tree, this is only a single item (it handles space and enter unrelated to what items are rendered inside).

I felt like this implementation was much easier to understand. I also don't really get why you would want to go to a directory individually since it will only show one folder anyways 😅

If you refer to this form a UI perspective, sure we can change this to whatever, but I would still recommend that we only have one logical interaction for the whole entry

[felixfbecker]

Yeah I guess you're right, I just thought it would be nice because VS Code does it too. But thinking about it, VS Code actually has use cases for it, like right click > new file/folder on the sub-items, which we don't have.

[taras-yemets]

Love the new file tree!

It would be helpful to cover the main tree data manipulations with tests, WDYT?