Discussing Create PR

We just looked again @queerviolet’s PR. It’s a viable path since it’s close to the web UI experience. But it made us think again about how to keep the PR creation experience as close as possible to the VS Code UX. Below is an attempt to capture our discussions starting with restating some goals.

Goal

• Ensure users don’t have to leave the editor to create a PR. (There are steps users have to take today in order to create a PR such as creating a branch, pushing commits to the branch, ensuring that the branch is in a good shape. All of this can be done in the editor today. So, we can start with assuming the same.)
• Integrate tightly with the markdown editing experience. This is actually not limited to “Create PR” since this is also a challenge for comments in general.
• Fit in the overall VS Code experience; i.e. maintain the perceived lightweight nature of VS Code.

Proposed Flow for first iteration

1. User is reponsible creating branch, push branch, nesure branch is in good shape. Just as they are if they use the web UI.

2. User chooses Create Pull Request from command palette. Same as PR.

3. This opens the QuickPick with 3 steps and a Create button, and the user fills in the data

   1. Title of the PR
   2. Target repository (dropdown list)
   3. Target branch (dropdown list)

→ This creates the PR on GH. → VS Code switches to the same mode as if the user would have checked out a PR, and it opens the Overview page of the PR.

1. User hits the edit button next to the description of the PR

→ Description switches into edit mode. → Text field has an affordance to “maximize/flyout”.

1. User hits the Maximize button.

→ Markdown editor opens on synthesized document (extension is the document provider). Extension listens to all document changes and live updates the draft of the description (same for comments).

1. User uses the markdown text editor to write the description, they can use the markdown preview to see what the markdown would be rendered.

2. User closes the markdown editor (or switches back to the Overview page)

→ Description is the same as it was/is on the markdown editor.

1. User submits/saves draft.

What we need

• Ensure draft comments are maintained when switching away from the Overview Page. @rebornix is working on this.
• Ensure we can edit. @rmacfarlane is working on this.
• QuickPick: The steps show the same information as the current PRs (see below) just in a linear fashion. The same data is needed to create the QuickPick items.
• Have the “maximize”. Not yet taken. Close to what @queerviolet experimented with.

[drguthals]

It would be great to test out both with users, I love that idea! We can setup some UXR for early November with these two approaches.

Thanks for the two gifs 🎉

[kieferrm]

@Ghostbird can you pls create a new issue. Thanks!