Add frontend support for branching from an arbitrary branch

Author: kgryte

src/components/NewBranchDialog.tsx

@@ -16,6 +16,7 @@ import {
   closeButtonClass,
   contentWrapperClass,
   createButtonClass,
+  listItemBoldTitleClass,
   listItemClass,
   listItemContentClass,
   listItemDescClass,
@@ -27,6 +28,13 @@ import {
   titleWrapperClass
 } from '../style/NewBranchDialog';
 
+const BRANCH_DESC = {
+  current:
+    'The current branch. Pick this if you want to build on work done in this branch.',
+  default:
+    'The default branch. Pick this if you want to start fresh from the default branch.'
+};
+
 /**
  * Interface describing component properties.
  */
@@ -202,25 +210,33 @@ export class NewBranchDialog extends React.Component<
    * @returns fragment
    */
   private _renderItem(branch: Git.IBranch, idx: number) {
+    const isBase = branch.name === this.state.base;
+    const isCurr = branch.name === this.state.current;
+
+    let isBold;
+    let desc;
+    if (isCurr) {
+      isBold = true;
+      desc = BRANCH_DESC['current'];
+    }
     return (
       <ListItem
         button
-        className={classes(
-          listItemClass,
-          branch.name === this.state.base ? activeListItemClass : null
-        )}
+        className={classes(listItemClass, isBase ? activeListItemClass : null)}
         key={idx}
         onClick={this._onBranchClickFactory(branch.name)}
       >
         <span className={classes(listItemIconClass, 'jp-Icon-16')} />
         <div className={listItemContentClass}>
-          <p className={listItemTitleClass}>{branch.name}</p>
-          {branch.name === this.state.current ? (
-            <p className={listItemDescClass}>
-              The current branch. Pick this if you want to build on work done in
-              this branch.
-            </p>
-          ) : null}
+          <p
+            className={classes(
+              listItemTitleClass,
+              isBold ? listItemBoldTitleClass : null
+            )}
+          >
+            {branch.name}
+          </p>
+          {desc ? <p className={listItemDescClass}>{desc}</p> : null}
         </div>
       </ListItem>
     );

src/model.ts

@@ -387,6 +387,7 @@ export class GitExtension implements IGitExtension {
       checkout_branch: false,
       new_check: false,
       branchname: '',
+      startpoint: '',
       checkout_all: true,
       filename: '',
       top_repo_path: path
@@ -397,6 +398,9 @@ export class GitExtension implements IGitExtension {
         body.branchname = options.branchname;
         body.checkout_branch = true;
         body.new_check = options.newBranch === true;
+        if (options.newBranch) {
+          body.startpoint = options.startpoint || this._currentBranch.name;
+        }
       } else if (options.filename) {
         body.filename = options.filename;
         body.checkout_all = false;

src/style/NewBranchDialog.ts

@@ -136,7 +136,9 @@ export const listItemIconClass = style({
   backgroundPosition: 'center'
 });
 
-export const listItemTitleClass = style({
+export const listItemTitleClass = style({});
+
+export const listItemBoldTitleClass = style({
   fontWeight: 700
 });
 

src/tokens.ts

@@ -319,6 +319,10 @@ export namespace Git {
      * Is it a new branch?
      */
     newBranch?: boolean;
+    /**
+     * The commit (branch name, tag, or commit id) to which a new branch HEAD will point.
+     */
+    startpoint?: string;
     /**
      * Filename
      */