add tooltips to git && GitHub status bar icons

[annthurium]

Description of the Change

During usability testing, some users tried to hover over the git and GitHub icons in the status bar. I noticed that these buttons don't have tooltips, but the rest of the status bar icons do.

This pull request adds tooltips to these status bar icons that show up on hover.

Alternate Designs

• We thought about just saying "Click to open the git || GitHub pane." However, @mofo37 and myself thought telling users what they can accomplish by doing so would be more informative.

Benefits

• Making our UI more consistent (all the other status bar things have tooltips)
• Possibly improving discoverability of the git and GitHub panes
• Cleaned up a few autobind calls while I was at it.

Possible Drawbacks

Users who already know what the buttons do might be annoyed by the real estate taken up by the tooltips. However, the tooltip delay is relatively long. We can always increase it if there's a problem.

Applicable Issues

https://github.com/atom/github/issues/1774

Metrics

It might be beneficial to collect metrics about when tooltips are shown. However, actually showing the tooltip is handled by some Atom core apis, so it's a bit out of scope for us to track that here.

We do already have metrics showing how many times the icons are clicked, so if there's a jump in that, we'll know this change was beneficial for discoverability. That said, I'm not expecting a massive increase.

Tests

• Manually tested that tooltips show up as expected, and the buttons still open the panes.
• Unit tests for both components verifying that tooltip shows up and contains the expected message.

Documentation

N/A

Release Notes

Added tooltips to the git and GitHub status bar icons that are shown on hover.

User Experience Research (Optional)

This change was a result of research we've already done. woo!

[codecov[bot]]

Codecov Report

Merging #1848 into master will increase coverage by <.01%. The diff coverage is 100%.

@@            Coverage Diff             @@
##           master    #1848      +/-   ##
==========================================
+ Coverage   90.85%   90.85%   +<.01%     
==========================================
  Files         195      195              
  Lines       10727    10729       +2     
  Branches     1570     1570              
==========================================
+ Hits         9746     9748       +2     
  Misses        981      981

Impacted Files	Coverage Δ
lib/controllers/status-bar-tile-controller.js	92.45% <ø> (ø)	:arrow_up:
lib/views/github-tile-view.js	100% <100%> (ø)	:arrow_up:
lib/views/changed-files-count-view.js	100% <100%> (ø)	:arrow_up:
lib/git-shell-out-strategy.js	87.52% <0%> (-0.18%)	:arrow_down:
lib/github-package.js	68.48% <0%> (+0.38%)	:arrow_up:

---

Continue to review full report at Codecov.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 755132b...f524f22. Read the comment docs.

[winstliu]

Would it help to include the number of files changed in the tooltip somewhere? I also noticed that our other tooltips don't specify actions (i.e. they are more passive). x unstaged files, y staged files

[simurai]

Would it help to include the number of files changed in the tooltip somewhere?

Ya, that seems like a good idea. Not sure if people would use it. Might be quicker to just open the panel instead of waiting for the tooltip to appear. But you have to click again to hide it. 🤔 Anyways, I like the idea to make the tooltips show additional details that don't fit in the tile. Like the GitHub tooltip could show the current PR ID (#12345).

Making our UI more consistent (all the other status bar things have tooltips)

The branch picker also doesn't have a tooltip yet.