Add a Diff Viewer view for only the new file

Review Request #11226 — Created Oct. 16, 2020 and updated — Latest diff uploaded

Information

Review Board
release-4.0.x

Reviewers

The current diff viewer shows both the old and new view for every diff.
Sometimes, we want to just look at the new view and not the whole diff with
the existing code. Adding the feature to hide the old view and only show the
new view will allow users to have an uncluttered view.

We added a [Show/Hide] toggle to the revision-row on the diff viewer. This
button will toggle between showing both views and only showing the new view.
The button toggles a show-new-only class which show or hide the old view with
the CSS display: none property. If the line contain comments, the comment
flags are detached from the old view's column and appended to the new view's
column using jQuery's detach() and appendTo() function, vice versa.

Testing Done:
Wrote onShowNewClicked and On show new only in
diffReviewableViewTests.es6.js.

Tested following behaviour in browser:

  • Added comments before toggling, able to view in both views
  • Added comments after toggling, able to view in both views

Changes between revision 1 and 2

orig
1
2
3
4

Commits

Summary ID Author
Add button to show new only.
7cc388330d712a50d985451edc64805db8599ec3 Kean Weng Yap
Update Show New function to toggle.
57a3ec9619b329fe9b28d72fb4209d92fc81c971 Kean Weng Yap
The current diff viewer shows both the old and new view for every diff.
Sometimes, we want to just look at the new view and not the whole diff with the existing code. Adding the feature to hide the old view and only show the new view will allow users to have an uncluttered view. We added a `[Show/Hide]` toggle to the `revision-row` on the diff viewer. This button will toggle between showing both views and only showing the new view. The button toggles a `show-new-only` class which show or hide the old view with the CSS `display: none` property. If the line contain comments, the comment flags are detached from the old view's column and appended to the new view's column using jQuery's `detach()` and `appendTo()` function, vice versa. Testing Done: Tested following behaviour in browser: * Added comments before toggling, able to view in both views * Added comments after toggling, able to view in both views
50b01e1fb6d3dd20240602823c2ded37844becc3 Kean Weng Yap
reviewboard/static/rb/css/pages/diffviewer.less
reviewboard/static/rb/js/diffviewer/views/diffReviewableView.es6.js
reviewboard/templates/diffviewer/diff_file_fragment.html
Loading...