Add support for timeline in Rapid Diffs commit diffs

Thomas Randolphrequested to merge
tor/feature/rd/commit-timeline into master

What does this MR do and why?

For #547881

Adds a timeline to the Commit view when rendered with Rapid Diffs.

Screenshots or screen recordings

See the Caveats section for discussion about the visuals of the After implementation.

Before Before (with ?rapid_diffs=true) After (with ?rapid_diffs=true)
image image image

How to set up and validate locally

  1. Go to a commit (this is from the top level menu Commits option, not from the Commits tab of an MR)
  2. Copy the URL to this commit and mention it (for example, paste it in the description of a new issue)
  3. Enable the rapid_diffs_on_commit_show feature flag: rails c => Feature.enable( :rapid_diffs_on_commit_show );
  4. Add ?rapid_diffs=true to the commit URL bar and submit that change
  5. Verify that your system note (logging your mention of the commit) appears below the diff.

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Caveats

The timeline uses the legacy system_note.vue component (imported in discussion_notes.vue) because the Rapid Diffs system note hasn't been migrated yet. This causes one visual issue:

  • A dot marker instead of a speech bubble icon
  • A persistent loading spinner (showSpinner defaults to true in the legacy note_header.vue)

@slashmanov mentioned that system note migration is planned separately and shouldn't block this work. Once discussion_notes.vue switches to a Rapid Diffs-native system_note.vue, the spinner issue will resolve without changes to this MR's code. Notably, most of this conversion work is being done in !214423 (merged).

Edited by Thomas Randolph

Merge request reports