Reviews dock item #1995

smashwilson · 2019-03-01T14:38:36Z

Description of the Change

View pull request reviews and review comments in a dock item.

📈 Feature project
📝 Feature request + PR Review Feature Request: review comment changes #1897. Specifically:
- Review progress bar in the pull request list
- ReviewsItem within the dock
- Footer showing review progress in PullRequestDetailItem
Prototype branch: vy/prototype-for-uxr

Screenshot/Gif

TODO

Benefits

Pull request authors will now enjoy many features for responding to code review comments from the comfort of their editor.

see review comments alongside the code
jump to code from reviews dock
jump to diff from reviews dock
reply to comments
resolve comments
see a progress bar of resolved comments, to keep track of progress
react with emoji to comments

Metrics

opening the reviews tab
='open-reviews-tab', {package: 'github', from: IssueishDetailController});
opening the review thread from the gutter decorations
open-review-thread', {package: 'github'}
jumping to a file from a review comment thread
'reviews-dock-open-file', {package: 'github'});
jumping to a diff from a reviews comment thread
'reviews-dock-open-diff', {package: 'github'});
opening a pull request detail view from the reviews dock
'reviews-dock-open-pr', {package: 'github', component: this.constructor.name});
running the command to show more context lines in a review comment thread
'reviews-dock-show-more-context', {package: 'github'});
running the command to show less context lines in a review comment thread
'reviews-dock-show-less-context', {package: 'github'});
resolving a comment thread
'resolve-comment-thread', {package: 'github'});
unresolving a comment thread
'unresolve-comment-thread', {package: 'github'});
adding a single comment
'add-single-comment', {package: 'github'});
starting a pull request review review
'start-pr-review', {package: 'github', component: (ReviewsFooterView or ReviewsView})
adding an emoji reaction
'add-emoji-reaction', {package: 'github'});
-removing an emoji reaction
'remove-emoji-reaction', {package: 'github'});

Tests

QA checklist:

PR detail view

open reviews dock from footer in pull request detail view
start a review button from footer in pull request detail view takes you to dotcom
open diff from dock
- activate changed files tab
- scrolls to where the comment is
comment gutter decorations take you to the comment dock and highlight the selected comment for 1500ms
tab selection is preserved upon restart of application

Comment dock

In-editor decorations

don't show up if you're not on a checked out pr branch
line highlighting shows up for lines with comments
gutter icon shows up for lines with comments
decoration position is adjusted to account for dirty working directory
clicking on gutter icon navigates to that comment in the reviews dock

Other

open reviews dock from GitHub tab if on a PR branch
- no open reviews button if not checked out
community & safety QA review

Documentation

See 📈 Feature project

Release Notes

The GitHub integration now displays pull request review comments in a dock, and supports replying to comments, emoji reacting to comments, and resolving comments.

User Experience Research (Optional)

We conducted 6 user interviews while developing the prototype for this feature.

todo · 2019-03-04T15:37:18Z

Set this based on performance measurements' }</div>

github/lib/views/reviews-view.js

Lines 152 to 157 in 4ab6105

    
             <div className="github-Review-diffLine is-added">{ '  // TODO: Set this based on performance measurements' }</div> 
        
             <div className="github-Review-diffLine is-added">{ '  largeDiffThreshold: 100,' }</div> 
        
           </pre> 
        
           <main className="github-Review-comments"> 
        
             <div className="github-Review-comment"> 
        
               <header className="github-Review-header">

This comment was generated by todo based on a `TODO` comment in `4ab6105` in #1995. cc @atom.

todo · 2019-03-04T15:54:21Z

Set this based on performance measurements' }</div>

github/lib/views/reviews-view.js

Lines 152 to 157 in da9c239

    
             <div className="github-Review-diffLine is-added">{ '  // TODO: Set this based on performance measurements' }</div> 
        
             <div className="github-Review-diffLine is-added">{ '  largeDiffThreshold: 100,' }</div> 
        
           </pre> 
        
           <main className="github-Review-comments"> 
        
             <div className="github-Review-comment"> 
        
               <header className="github-Review-header">

This comment was generated by todo based on a `TODO` comment in `da9c239` in #1995. cc @atom.

todo · 2019-03-04T16:24:57Z

Set this based on performance measurements' }</div>

github/lib/views/reviews-view.js

Lines 152 to 157 in 3d6eaff

    
             <div className="github-Review-diffLine is-added">{ '  // TODO: Set this based on performance measurements' }</div> 
        
             <div className="github-Review-diffLine is-added">{ '  largeDiffThreshold: 100,' }</div> 
        
           </pre> 
        
           <main className="github-Review-comments"> 
        
             <div className="github-Review-comment"> 
        
               <header className="github-Review-header">

This comment was generated by todo based on a `TODO` comment in `3d6eaff` in #1995. cc @atom.

todo · 2019-03-04T16:29:13Z

Set this based on performance measurements' }</div>

github/lib/views/reviews-view.js

Lines 152 to 157 in 4c3211d

    
             <div className="github-Review-diffLine is-added">{ '  // TODO: Set this based on performance measurements' }</div> 
        
             <div className="github-Review-diffLine is-added">{ '  largeDiffThreshold: 100,' }</div> 
        
           </pre> 
        
           <main className="github-Review-comments"> 
        
             <div className="github-Review-comment"> 
        
               <header className="github-Review-header">

This comment was generated by todo based on a `TODO` comment in `4c3211d` in #1995. cc @atom.

todo · 2019-03-04T18:31:52Z

fixme

github/lib/views/reviews-view.js

Lines 100 to 105 in c2c08d7

    
           // TODO: fixme 
        
           const lineNumber = rootComment.position; 
        
           return ( 
        
             <details className="github-Review" key={`review-comment-${rootComment.id}`}> 
        
               <summary className="github-Review-reference">

This comment was generated by todo based on a `TODO` comment in `c2c08d7` in #1995. cc @atom.

codecov · 2019-03-14T15:20:32Z

Codecov Report

Merging #1995 into master will decrease coverage by 0.08%.
The diff coverage is 92.94%.

@@            Coverage Diff             @@
##           master    #1995      +/-   ##
==========================================
- Coverage   92.58%   92.49%   -0.09%     
==========================================
  Files         189      207      +18     
  Lines       11244    12010     +766     
  Branches     1634     1745     +111     
==========================================
+ Hits        10410    11109     +699     
- Misses        834      901      +67

Impacted Files	Coverage Δ
lib/containers/remote-container.js	`100% <ø> (ø)`	⬆️
lib/containers/current-pull-request-container.js	`100% <ø> (+5%)`	⬆️
lib/views/issue-detail-view.js	`100% <ø> (ø)`	⬆️
lib/views/github-dotcom-markdown.js	`100% <ø> (ø)`	⬆️
lib/views/github-tab-view.js	`100% <ø> (ø)`	⬆️
lib/controllers/remote-controller.js	`100% <ø> (ø)`	⬆️
lib/controllers/github-tab-controller.js	`100% <ø> (ø)`	⬆️
lib/controllers/multi-file-patch-controller.js	`100% <ø> (ø)`	⬆️
lib/atom/atom-text-editor.js	`100% <ø> (ø)`	⬆️
lib/containers/github-tab-container.js	`100% <ø> (ø)`	⬆️
... and 81 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update b5e9a6f...dcd0ad6. Read the comment docs.

Our tests were failing because we were rendering the fragment container instead of the direct component.

Co-Authored-By: Vanessa Yuen <vanessayuenn@users.noreply.github.com>

This fixes our failing test.

Co-Authored-By: Ash Wilson <smashwilson@gmail.com>

kuychaco

Finished up reviewing the mutations and views, as well as all of the changes based on my review feedback. Everything looks good! Great job everyone! 🙌

Left a couple of comments, nothing blocking.

It's time to 🚢:shipit: 🚀!!!!

lib/mutations/add-pr-review-comment.js

kuychaco · 2019-04-06T02:00:42Z

lib/views/multi-file-patch-view.js

+    }
+
+    // "forceRerender" ensures that the PullRequestReviewCommentThreadView re-renders each time that the
+    // MultiFilePatchView does. It doesn't re-query for reviews, but it does re-check patch visibility.


I believe this comment is simply stale and we don't need to worry about re-rendering, right @smashwilson?

Indeed it was just stale. Good catch 🙇

kuychaco · 2019-04-06T03:32:42Z

lib/views/reviews-view.js

+        </summary>
+        <nav className="github-Review-nav">
+          <button className={openFileClasses}
+            data-path={nativePath} data-line={lineNumber} data-diff={rootComment.diffHunk}


🔥data-diff as we are not using it

smashwilson · 2019-04-08T13:49:07Z

I've filed issues for the remaining refactor-y bits of feedback so we don't lose track of them. Thanks for the super-thoughtful review as always, @kuychaco 👌 🙇

vanessayuenn

AHHH this is so exciting! Let's ship it! 🚀

mcrocker · 2019-04-15T16:59:51Z

This stuff looks amazing. Great work!

Does this work with GitLab Merge Requests, or are the plans too make it GitLab compatible, or is the a GitLab equivalent feature somewhere else?

annthurium · 2019-04-15T17:44:43Z

@mcrocker thanks!

we have no plans to build a GitLab integration into our package.

Good news, though. Atom does have some community packages for GitLab integration. I'd try filing an issue at https://github.com/blakawk/gitlab-integration and see if you can work with the folks maintaining that package to get that feature request on their roadmap.

This comment has been minimized.

Sign in to view

smashwilson mentioned this pull request Mar 1, 2019

PR Review Feature Request: review comment changes #1897

Merged

This was referenced Mar 7, 2019

Funky comment ordering within thread #1945

Closed

Comment threads on same line appear in the wrong order #1944

Closed

Consistently use GraphQL builders in unit tests #2015

Open

smashwilson and others added 19 commits March 27, 2019 09:36

Open the ReviewsItem and jump to the thread on gutter decoration click

af51ec4

Fade in a border color on highlighted comment threads

c4ecfa7

Remove line number and button background decorations

c747540

Reset thread highlight after 1.5s

bbf510d

Support decorating inherited decorables on prop-provided editors

6a5078c

Use the <Decoration> fix to avoid creating unnecessary markers

ebf97e6

add test scaffolding for CommentDecorationsContainer

0fc62e9

"start a review" should link to files tab on dotcom

18ad661

why did i commit an empty test

8749628

[wip] CommentDecorationsContainer tests

f386239

Render <BareReviewsController> instead of <ReviewsController>

11d0774

Our tests were failing because we were rendering the fragment container instead of the direct component.

EditorCommentDecorationsController tests ✅ + 💯

a5f8ff0

add link for reporting abuse

30745c8

unit test for CommentDecorationsContainer happy path

f579bee

Co-Authored-By: Vanessa Yuen <vanessayuenn@users.noreply.github.com>

🔥 unused import

1b0debd

🔥 diagnostic console.log

2831257

Consistent <detail> toggle methods

ff95ffd

Use native path separators in ReviewsView

f1d8233

Use native paths in CommentDecorationsController

56f08d6

vanessayuenn and others added 13 commits April 5, 2019 11:41

make copying works for all GithubDotcomMarkdown components

141bbfc

Supply a default value for selectedTab when building a URL

fe291a9

This fixes our failing test.

Prevent PullRequestPatchContainer from calling setState after unmount

d8a947d

Pass props recovered from the StubItem to support deserialized state

a146aff

Move IssueishDetailItem selected tab state into the item

984144b

Deserialize the selected tab

c1842ff

Pass selectedTab from state properly

88b2b96

No need for that onTabSelected() call

f5f7b57

Place the cursor on the comment line in the MFP View 👌

27b4f2e

Unbreak tests

9a4d0bf

Intentionally skip deleted and hidden files when placing diff comments

7a3a14b

Actually pass {bypassReadOnly: true} when setting text

b292c04

Co-Authored-By: Ash Wilson <smashwilson@gmail.com>

🔥 unused data-diff attribute

1570afe

kuychaco approved these changes Apr 6, 2019

View reviewed changes

This was referenced Apr 8, 2019

Extract common "isCheckedOutPullRequest" function #2045

Open

Extract fragments from Accumulators and move them closer to the views that render them #2046

Open

Use Repository::getCurrentGitHubRemote() in GitHubTabController #2047

Open

smashwilson added 3 commits April 8, 2019 09:39

Render the "add emoji" button when no reaction groups are present

229acd5

Set reactionGroups to [] on optimistically rendered PR review comments

c7adcb4

✂️ stale comment

dcd0ad6

vanessayuenn approved these changes Apr 8, 2019

View reviewed changes

smashwilson merged commit 728b974 into master Apr 8, 2019

smashwilson deleted the all/review-comments branch April 8, 2019 14:20

smashwilson mentioned this pull request Apr 8, 2019

v0.28.0-0 QA Review #2051

Closed

3 tasks

vanessayuenn mentioned this pull request Apr 8, 2019

Add some new screenshots #2054

Merged

vanessayuenn mentioned this pull request Apr 15, 2019

Prefill some metadata for report abuse link in review comments #2074

Merged

smashwilson added the feature request 003 Work related to the Pull Request Review feature request label May 3, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Reviews dock item #1995

Reviews dock item #1995

smashwilson commented Mar 1, 2019 •

edited by vanessayuenn

Loading

This comment has been minimized.

todo bot commented Mar 4, 2019

todo bot commented Mar 4, 2019

todo bot commented Mar 4, 2019

todo bot commented Mar 4, 2019

todo bot commented Mar 4, 2019

codecov bot commented Mar 14, 2019 •

edited

Loading

kuychaco left a comment

kuychaco Apr 6, 2019

smashwilson Apr 8, 2019

kuychaco Apr 6, 2019

smashwilson commented Apr 8, 2019

vanessayuenn left a comment

mcrocker commented Apr 15, 2019

annthurium commented Apr 15, 2019

Reviews dock item #1995

Reviews dock item #1995

Conversation

smashwilson commented Mar 1, 2019 • edited by vanessayuenn Loading

Description of the Change

Screenshot/Gif

Benefits

Metrics

Tests

QA checklist:

PR detail view

Comment dock

In-editor decorations

Other

Documentation

Release Notes

User Experience Research (Optional)

This comment has been minimized.

todo bot commented Mar 4, 2019

Set this based on performance measurements' }</div>

This comment was generated by todo based on a TODO comment in 4ab6105 in #1995. cc @atom.

todo bot commented Mar 4, 2019

Set this based on performance measurements' }</div>

This comment was generated by todo based on a TODO comment in da9c239 in #1995. cc @atom.

todo bot commented Mar 4, 2019

Set this based on performance measurements' }</div>

This comment was generated by todo based on a TODO comment in 3d6eaff in #1995. cc @atom.

todo bot commented Mar 4, 2019

Set this based on performance measurements' }</div>

This comment was generated by todo based on a TODO comment in 4c3211d in #1995. cc @atom.

todo bot commented Mar 4, 2019

fixme

This comment was generated by todo based on a TODO comment in c2c08d7 in #1995. cc @atom.

codecov bot commented Mar 14, 2019 • edited Loading

Codecov Report

kuychaco left a comment

Choose a reason for hiding this comment

kuychaco Apr 6, 2019

Choose a reason for hiding this comment

smashwilson Apr 8, 2019

Choose a reason for hiding this comment

kuychaco Apr 6, 2019

Choose a reason for hiding this comment

smashwilson commented Apr 8, 2019

vanessayuenn left a comment

Choose a reason for hiding this comment

mcrocker commented Apr 15, 2019

annthurium commented Apr 15, 2019

smashwilson commented Mar 1, 2019 •

edited by vanessayuenn

Loading

This comment was generated by todo based on a `TODO` comment in `4ab6105` in #1995. cc @atom.

This comment was generated by todo based on a `TODO` comment in `da9c239` in #1995. cc @atom.

This comment was generated by todo based on a `TODO` comment in `3d6eaff` in #1995. cc @atom.

This comment was generated by todo based on a `TODO` comment in `4c3211d` in #1995. cc @atom.

This comment was generated by todo based on a `TODO` comment in `c2c08d7` in #1995. cc @atom.

codecov bot commented Mar 14, 2019 •

edited

Loading