Fixes #117 - Add x/y-axis scrolling to branch drop-down

[cyrus-raitava]

Related Issue/Keyword: Closes #177

Description: Previously, the user was not able to view long branch names within the drop-down of branch search. Additionally, if the repo the user was opening had a multitude of branches, there was no vertical scrolling of these (and thus the user wouldn't necessarily be able to see all the branches they had. Thus, VisualGit would not be as usable for particularly large repositories, with numerous branches (with long names).

Changes: Whereas the user previously could neither scroll vertically nor horizontally for branch names, now they may do both:

Text previously only cut off if branch name was beyond component width:

Now, horizontal scrollbars appear if branch name overflows, as well as vertical scrolling being enabled.

Manual Testing outline:

• Open any repository, that contains branches with significantly long names (~30/32+ characters)

• Click the 'Search or create' branch drop-down

• Hover over a branch name that is cut off - you should see horizontal scrollbars

• Open a repository with a large number of branches (~16/20+ branches)

• Click the 'Search or create' branch drop-down

• You should be able to view all branches, by vertically scrolling down

• [x] Latest master merged/rebased into your feature branch
• [ ] Tests covering all changes (see manual testing guidelines)
• [x] Meets the projects coding conventions
• [x] No out of scope changes
• [x] @Mentioned any relevant team members
• [x] Included a relevant gif (search here for inspiration)

[emipeanz]

Awesome job! 😀 is there any way to make the actual scrolling bars a little smaller, on my screen they take up almost half the space of a branch name???

Also, is this functionality still present when the app is really small??? ie.

[cyrus-raitava]

@emipeanz I've investigated, and there are numerous scrolling options outlined here.

Solution

The best alternative is to set scrolling to 'auto', in which horizontal scrollbars are only made when necessary. This should reduce CPU usage dramatically, for processing scrolling. In regards to scrollbar size, I'm not sure how to make them any smaller than they are, there doesn't seem to be many non-hacky ways to achieve it.

Follow-Up

Given the current state of the app in master, I would propose opening new issues for both:

• needing branch scrolling when app is of smaller size
• making scrollbars smaller if possible

The reason behind these would be that the branch dropdown issue could be seen as a related but separate problem, which would involve changes out of the scope of this issue, AND that I think horizontal scrolling functionality is a more immediate problem than how much space is taken up by said branch names. I would be more than happy to make new issues for both though, or you if you wanted 😄

[emipeanz]

Agreed ^^ . But to be honest, in the grand scheme of things the scroll bar size is not on the top of the priority list 😆 In my opinion the solution you've provided is really goo - ill do some more testing and if anyone else wants to review, by all means