Reimagining code review in Bitbucket Cloud
Working with code is a critical part of your day-to-day job. Whether you have created code and are waiting for your team's review or you're reviewing and approving code to help implement and deliver new features, pull requests are a part of your daily lives.
We've spent the year researching, user testing, and reimagining the Bitbucket Cloud code review experience. Check out the updates and changes we are launching, and our current and long term plans for adding new functionality and features to the pull request interface.
A new code-first design
To help reviewers assess changes quickly, we've historically taken a ‘code-first’ design approach for the pull request view (reviewing and working in a pull request). Bitbucket displays the diff front and center so reviewers don't need to click around to see what's changed or to provide feedback.
Today, we're taking this concept a step further: we've redesigned the pull request view to display everything the reviewer needs on a single page, without tabs.
Through several rounds of user testing, we optimized the new design around improving navigability for the reviewer. In the new pull request experience, we’ve calculated that reviewers reduce their time-to-approve by 21% compared to the existing UI.
Below are some of the key features that help reviewers evaluate code quickly:
Sidebar with file tree and activity feed
Just like the sidebar in the new source browser, the pull request sidebar groups information into collapsible cards for quick reference at any time. One of these cards is the brand new file tree for navigating between files in the diff. Now, you can jump between files without having to scroll back to the top of the page.
Files are organized into collapsible folders in a familiar layout, and files are marked with comment counts and conflict markers so they can be addressed. If a filename is truncated, hover over the filename to reveal a tooltip with the full filename or click-and-drag the edge of the sidebar to reveal more of the tree. You can also collapse and expand the sidebar by clicking on its edge or using the ']' keyboard shortcut.
A powerful new activity feed
No more switching back and forth between the activity tab and the code. Now you can see all of the prior history of the activity feed as you're reviewing the diffs from your pull request, with an easy one-click navigation to jump you to key events that spark your interest.
Sticky action header as you scroll
The redesigned header remains sticky to the top of the page as you scroll, which also allows you to more easily approve or merge the PR once you've finished reviewing.
Sticky file headers and file tree highlighting as you scroll
Similarly, diff file headers are also sticky to the top of the page as you scroll so you don't lose your place viewing long diffs. And to further reinforce this, the current file is highlighted in the file tree as you scroll, so it's always clear which file you're viewing.
Collapsible diffs
Each file's diff is collapsible, so you can mark your progress and reduce scrolling as you move through your review.
And each diff's side-by-side view is now available inline, instead of in a modal window.
Recent Releases and Upcoming Feature Investments
In addition to those new features, the new interface includes most of the key functionality from the existing pull request experience. However, some features have not yet been migrated but will be added soon. We've also got plans to address some highly requested improvements from users.
Here is the approximate order in which we will be addressing these requests, ordered by what we think will have the highest impact (or reduce our technical burden by deprecating the old PR experience).
Feature | Legacy PR | New PR UI | Status | Public Ticket |
|---|---|---|---|---|
| Completed | ||||
Tasks on Sidebar |
|
| DONE | |
File Tree |
|
| DONE | |
Activity Feed filters |
|
| DONE | BCLOUD-19748 - Getting issue details... STATUS |
Side-by-side diff comments |
|
| DONE | BCLOUD-6357 - Getting issue details... STATUS |
| Global PR settings |  |  | DONE | BCLOUD-19951 - Getting issue details... STATUS |
Improved Big Diff performance |
|
| DONE | BCLOUD-7723 - Getting issue details... STATUS |
Collapsible File Headers |
|
| DONE | |
Sync Branches |
|
| DONE | |
Revert Branches |
|
| DONE | |
Tasks on Comments |
|
| DONE | BCLOUD-19747 - Getting issue details... STATUS |
Activity Feed |
|
| DONE | |
Image Diffs |
|
| DONE | BCLOUD-19746 - Getting issue details... STATUS |
Likes |
|
| DONE | BCLOUD-19744 - Getting issue details... STATUS |
| View Whole File at Once | | | DONE | BCLOUD-19935 - Getting issue details... STATUS |
Merge Checklist |
|
| DONE | BCLOUD-19745 - Getting issue details... STATUS |
| Single-file-mode for Big PRs | | | V1 COMPLETE | BCLOUD-19934 - Getting issue details... STATUS ** we're still doing some follow on work related to virtualizing the file tree. |
| Rolling Out | ||||
| Pending Merges | |  | IN PROGRESS | BCLOUD-20061 - Getting issue details... STATUS |
| Planned Work | ||||
Mark Files as Reviewed |
|
| DESIGNED | BCLOUD-19679 - Getting issue details... STATUS |
'Needs Work' status |
|
| DESIGNED | BCLOUD-13021 - Getting issue details... STATUS |
'Work in progress' status |
|
| DESIGNED | BCLOUD-12503 - Getting issue details... STATUS |
Syntax Highlighting |
|
| WAITING | BCLOUD-8673 - Getting issue details... STATUS |
Labels for PRs |
|
| EVALUATING | BCLOUD-11976 - Getting issue details... STATUS |
Commit-based diffing |
|
| EVALUATING | BCLOUD-19687 - Getting issue details... STATUS |
What about the old PR experience?
We have no immediate plans to turn off the old pull request experience, but are planning on launching all new features on the new pull request experience. We expect that our support for the old UI will continue to decrease over the first half of 2020. Once we've reached a point where almost everyone is on the new UI (and mostly happy with it), we will plan to turn off the old experience.
How to leave feedback
The new experience includes a Feedback card at the bottom of the right sidebar. Let us know what you think. Customer feedback strongly informs our roadmap, so if you're missing a key feature – let us know!
The Feedback card also includes a link to temporarily see a pull request you're viewing in the old experience.
Enable the new pull request interface
Click your avatar in the Bitbucket sidebar.
Select Bitbucket Labs.
Enable the New pull request experience feature.
All pull requests will now load in the new interface.
Disable the new pull request interface
Disabling the new interface switches to the old pull request interface. If you find yourself switching back often because of a missing feature, let us know using the Feedback button.
To disable the new interface temporarily, click the link in Feedback card in the right sidebar.
To disable the new interface entirely:
Click your avatar in the left sidebar.
Select Bitbucket Labs.
Enable the Old pull request experience feature.
