Add graphic for commit diffstat in Commits Panel

[ckcherry23]

What feature(s) would you like to see in RepoSense

Along with each commit on the Commits Panel, show the number of insertions and deletions with a simple visualization. This can be placed next to the LoC changed count.

Purpose

This graphic must be useful to get a high-level overview of the impact of a commit:

• Compare the ratio of additions/deletions per commit
• Compare commit sizes across commits

Existing design alternatives

1. GitHub style: Fixed-width

• Histogram-style visualization of the number of additions and deletions in a fixed-width bar.
• The number of green and red boxes is calculated based on the ratio of additions to deletions.
• Due to the fixed size of each graphic, we cannot compare commit sizes across commits.
• Example:
  
  Image source

2. cgit style: Proportional to commit size

• (Right-aligned) Contribution bar that visualizes the number of additions and deletions.
• The size of each bar should be calculated based on the actual commit size, rather than ratio between additions/deletions.
• Due to the varying size of each graphic, it may introduce some challenges in size calculations or alignment (responsiveness). Good to define a maximum width.
• One large commit (like package.json) may make other significant commits seem too small.
• Example:
  
  Image source

Proposed solution

I believe the contribution bar proportional to commit size meets most of our requirements, though it may require more work to implement. We could also hide the contribution bar when the commit messages are hidden, to reduce clutter. Please do add any alternative suggestions or thoughts!

[damithc]

Is it possible to reuse the code used to generate contribution bar in the ramp chart?

[ckcherry23]

Yes, seems like we can refactor the code and reuse it. Some changes may be required if we are not okay with multi-line contribution bars on the commit panel.