Merge pull request #912 from fcollonval/auto-backport-of-pr-887-on-jlab-2

Backport PR #887: Allow `commit & push`

Author: fcollonval

README.md

@@ -43,6 +43,7 @@ Once installed, extension behavior can be modified via the following settings wh
 
 - **blockWhileCommandExecutes**: suspend JupyterLab user interaction until Git commands (e.g., `commit`, `pull`, `reset`, `revert`) finish executing. Setting this to `true` helps mitigate potential race conditions leading to data loss, conflicts, and a broken Git history. Unless running a slow network, UI suspension should not interfere with standard workflows. Setting this to `false` allows for actions to trigger multiple concurrent Git actions.
 - **cancelPullMergeConflict**: cancel pulling changes from a remote repository if there exists a merge conflict. If set to `true`, when fetching and integrating changes from a remote repository, a conflicting merge is canceled and the working tree left untouched.
+- **commitAndPush**: Whether to trigger or not a push for each commit; default is `true`.
 - **disableBranchWithChanges**: disable all branch operations, such as creating a new branch or switching to a different branch, when there are changed/staged files. When set to `true`, this setting guards against overwriting and/or losing uncommitted changes.
 - **displayStatus**: display Git extension status updates in the JupyterLab status bar. If `true`, the extension displays status updates in the JupyterLab status bar, such as when pulling and pushing changes, switching branches, and polling for changes. Depending on the level of extension activity, some users may find the status updates distracting. In which case, setting this to `false` should reduce visual noise.
 - **doubleClickDiff**: double click a file in the Git extension panel to open a diff of the file instead of opening the file for editing.

schema/plugin.json

@@ -58,6 +58,12 @@
       "title": "Simple staging flag",
       "description": "If true, use a simplified concept of staging. Only files with changes are shown (instead of showing staged/changed/untracked), and all files with changes will be automatically staged",
       "default": false
+    },
+    "commitAndPush": {
+      "type": "boolean",
+      "title": "Trigger push on commit",
+      "description": "Whether to trigger or not a push for each commit.",
+      "default": true
     }
   },
   "jupyter.lab.shortcuts": [

src/components/CommitBox.tsx

@@ -1,12 +1,12 @@
+import { CommandRegistry } from '@lumino/commands';
 import * as React from 'react';
 import TextareaAutosize from 'react-textarea-autosize';
 import {
-  commitFormClass,
-  commitSummaryClass,
+  commitButtonClass,
   commitDescriptionClass,
-  commitButtonClass
+  commitFormClass,
+  commitSummaryClass
 } from '../style/CommitBox';
-import { CommandRegistry } from '@lumino/commands';
 import { CommandIDs } from '../tokens';
 
 /**
@@ -23,6 +23,11 @@ export interface ICommitBoxProps {
    */
   hasFiles: boolean;
 
+  /**
+   * Commit button label
+   */
+  label: string;
+
   /**
    * Callback to invoke in order to commit changes.
    *
@@ -87,7 +92,7 @@ export class CommitBox extends React.Component<
       ? 'Disabled: No files are staged for commit'
       : !this.state.summary
       ? 'Disabled: No commit message summary'
-      : 'Commit';
+      : this.props.label;
 
     const shortcutHint = CommandRegistry.formatKeystroke(
       this._getSubmitKeystroke()
@@ -116,7 +121,7 @@ export class CommitBox extends React.Component<
           className={commitButtonClass}
           type="button"
           title={title}
-          value="Commit"
+          value={this.props.label}
           disabled={disabled}
           onClick={this._onCommitSubmit}
         />

src/components/GitPanel.tsx

@@ -254,6 +254,13 @@ export class GitPanel extends React.Component<IGitPanelProps, IGitPanelState> {
       console.error(error);
       this.props.logger.log({ ...errorLog, error });
     }
+    const hasRemote = this.props.model.branches.some(
+      branch => branch.is_remote_branch
+    );
+    // If enabled commit and push, push here
+    if (this.props.settings.composite['commitAndPush'] && hasRemote) {
+      await this.props.commands.execute(CommandIDs.gitPush);
+    }
   };
 
   /**
@@ -360,6 +367,12 @@ export class GitPanel extends React.Component<IGitPanelProps, IGitPanelState> {
    * @returns React element
    */
   private _renderChanges(): React.ReactElement {
+    const hasRemote = this.props.model.branches.some(
+      branch => branch.is_remote_branch
+    );
+    const commitAndPush =
+      (this.props.settings.composite['commitAndPush'] as boolean) && hasRemote;
+    const buttonLabel = commitAndPush ? 'Commit and Push' : 'Commit';
     return (
       <React.Fragment>
         <FileList
@@ -370,15 +383,17 @@ export class GitPanel extends React.Component<IGitPanelProps, IGitPanelState> {
         />
         {this.props.settings.composite['simpleStaging'] ? (
           <CommitBox
+            commands={this.props.commands}
             hasFiles={this._markedFiles.length > 0}
+            label={buttonLabel}
             onCommit={this.commitMarkedFiles}
-            commands={this.props.commands}
           />
         ) : (
           <CommitBox
+            commands={this.props.commands}
             hasFiles={this._hasStagedFile()}
+            label={buttonLabel}
             onCommit={this.commitStagedFiles}
-            commands={this.props.commands}
           />
         )}
       </React.Fragment>

tests/test-components/CommitBox.spec.tsx

@@ -1,25 +1,25 @@
-import * as React from 'react';
-import 'jest';
-import { shallow } from 'enzyme';
-import { CommitBox} from '../../src/components/CommitBox';
 import { CommandRegistry } from '@lumino/commands';
+import { shallow } from 'enzyme';
+import 'jest';
+import * as React from 'react';
+import { CommitBox } from '../../src/components/CommitBox';
 import { CommandIDs } from '../../src/tokens';
 
 describe('CommitBox', () => {
-
-  const defaultCommands = new CommandRegistry()
+  const defaultCommands = new CommandRegistry();
   defaultCommands.addKeyBinding({
     keys: ['Accel Enter'],
     command: CommandIDs.gitSubmitCommand,
     selector: '.jp-git-CommitBox'
-  })
+  });
 
   describe('#constructor()', () => {
     it('should return a new instance', () => {
       const box = new CommitBox({
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       });
       expect(box).toBeInstanceOf(CommitBox);
     });
@@ -28,7 +28,8 @@ describe('CommitBox', () => {
       const box = new CommitBox({
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       });
       expect(box.state.summary).toEqual('');
     });
@@ -37,7 +38,8 @@ describe('CommitBox', () => {
       const box = new CommitBox({
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       });
       expect(box.state.description).toEqual('');
     });
@@ -48,35 +50,42 @@ describe('CommitBox', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('input[type="text"]').first();
-      expect(node.prop('placeholder')).toEqual('Summary (Ctrl+Enter to commit)');
+      expect(node.prop('placeholder')).toEqual(
+        'Summary (Ctrl+Enter to commit)'
+      );
     });
 
     it('should adjust placeholder text for the commit message summary when keybinding changes', () => {
-      const adjustedCommands = new CommandRegistry()
+      const adjustedCommands = new CommandRegistry();
       adjustedCommands.addKeyBinding({
         keys: ['Shift Enter'],
         command: CommandIDs.gitSubmitCommand,
         selector: '.jp-git-CommitBox'
-      })
+      });
       const props = {
         onCommit: async () => {},
         hasFiles: false,
-        commands: adjustedCommands
+        commands: adjustedCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('input[type="text"]').first();
-      expect(node.prop('placeholder')).toEqual('Summary (Shift+Enter to commit)');
+      expect(node.prop('placeholder')).toEqual(
+        'Summary (Shift+Enter to commit)'
+      );
     });
 
     it('should set a `title` attribute on the input element to provide a commit message summary', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('input[type="text"]').first();
@@ -87,7 +96,8 @@ describe('CommitBox', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('TextareaAutosize').first();
@@ -98,7 +108,8 @@ describe('CommitBox', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('TextareaAutosize').first();
@@ -109,7 +120,8 @@ describe('CommitBox', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('input[type="button"]').first();
@@ -120,7 +132,8 @@ describe('CommitBox', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('input[type="button"]').first();
@@ -131,7 +144,8 @@ describe('CommitBox', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: false,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('input[type="button"]').first();
@@ -143,7 +157,8 @@ describe('CommitBox', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: true,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       const node = component.find('input[type="button"]').first();
@@ -155,7 +170,8 @@ describe('CommitBox', () => {
       const props = {
         onCommit: async () => {},
         hasFiles: true,
-        commands: defaultCommands
+        commands: defaultCommands,
+        label: 'Commit'
       };
       const component = shallow(<CommitBox {...props} />);
       component.setState({