Update the New Review Request page for the latest UI improvements.

Review Request #10742 — Created Oct. 3, 2019 and submitted — Latest diff uploaded

Information

Review Board
release-4.0.x
bfc4254...

Reviewers

The New Review Request page temporarily broke with the introduction of
the new sidebar, base page, and RB.PageView changes, partly due to
some hackery we had in the old implementation centered around the
sidebar in mobile mode.

This change rewrites much of the page, including most (but not all) of
the styling, to work with all the new changes.

It now inherits directly from RB.PageView and RB.Page, taking
advantage of most of the new additions (sidebar management, full-page
mode, and mobile/desktop mode transitions). This simplifies a lot of the
custom logic in this page.

The template for the page is now simplified, taking advantage of the new
page setup support. The Python view for this page now takes care of
providing exactly the data we want in the model and view, rather than
providing an intermediary format that the template has to convert.

The largest change here is that, as stated, much of the styling has been
updated to use our new CSS component guidelines. Some of the utility
classes are still using old CSS class names, but those can be dealt with
separately. The new styles also have a much better mobile mode,
massively improving the visuals and interaction on this page.

The other large change has to do with the interactions in mobile mode.
We previously reused the exact same sidebar element in both desktop and
mobile modes, applying a special CSS class to <body> that caused it to
shift over when we wanted to display it, but that's not compatible with
modern sidebar support. We now reparent the sidebar contents depending
on the mode, and use CSS classes to manage the display state and
transitions between repository selection and commit lists.

Unit tests pass.

Tested clicking several repositories, including the "File Attachments only"
entry, in both desktop and mobile modes.

Tested commit scrolling in desktop and mobile modes.

Tested filtering of repositories.

Tested transitions between repositories and commits in mobile mode.

Tested that state all resets correctly when switching or unselecting
repositories.

Tested going between desktop and mobile modes, making sure that state and
UI was all correct.