Enhance Devtools UI with Root-only Filter Feature In History

[hackerwins]

Description:

Currently, Root of Document stores the content of the document, while Presence stores user presence information such as cursors. During debugging, developers may want to track how the content changes specifically. However, since Presence events can occur more frequently, developers may wish to focus solely on content changes. Introducing a filter feature in History that allows users to view only the root would be beneficial.

Why:

[gwbaik9717]

Could I give it a try?

[krapie]

@gwbaik9717 Sure :)

[gwbaik9717]

I considered adding a filter button but wasn't sure where to place it,

so I added an 'expand' button next to the title of the Document tab.

When the user clicks the button, it will expand to occupy the entire space, and clicking it again will revert it to its original state.

However, there is already a fold button (▶) in the History tab, so there might be a possibility that users get confused.

Therefore, I am seeking guidance on this matter.

Also, I noticed that there are SVG icons already in the project. Could you recommend where I should get additional SVG icons from if I want to add more?

[hackerwins]

@gwbaik9717 Thanks for your interest in this issue.

I recommend adding Root Filter Button to the right of the four existing navigation buttons on the right side of the History Tab.

I also modified description and title because it seems the original text didn't specifically mention that the filter is for the changes displayed in the History Tab. This lack of clarity might have led to the suggestion of adding it to the Document Tab instead.

[gwbaik9717]

Oh, I got it. thanks for the reply!