Add "Reset to Remote" feature (#1087)

* Add new command `git:reset-to-remote`

Add command `git:reset-to-remote` and also add it to the main menu.

* Implement logic for `git:reset-to-remote`

`GitExtension.resetToCommit(str)` is re-used because it also does
`git reset --hard`.

* Format using `prettier`

* Update src/commandsAndMenu.tsx

Co-authored-by: Frédéric Collonval <[email protected]>

* Construct a new widget for `git:reset-to-remote`

Construct a widget form which can be used as a `Dialog` body for command
`git:reset-to-remote`.

Also aim to address
/pull/1087#discussion_r824696243

* Use `GitResetToRemoteForm`

Use `GitResetToRemoteForm` for `git:reset-to-remote`.

Also solve
/pull/1087#discussion_r824696243

* Add a test for `git:reset-to-remote`

Add a test to make sure `FileBrowserModel.manager.closeAll()` gets
invoked.

* Format using `prettier`

* Make `GitResetToCommitForm` generic

Refactor `GitResetToCommitForm` and make it a generic `CheckboxForm`.
This should address
/pull/1087#pullrequestreview-910168641.

* Adjust `commands.spec.tsx` to adopt naming changes

It is now `ICheckboxFormValue` instead of `IGitResetToRemoteFormValue`.

* Adopt docstring suggestions

Address /pull/1087#pullrequestreview-911933051

Co-authored-by: Frédéric Collonval <[email protected]>

Author: quachtridat

schema/plugin.json

@@ -109,6 +109,9 @@
             "command": "git:pull",
             "args": { "force": true }
           },
+          {
+            "command": "git:reset-to-remote"
+          },
           {
             "command": "git:add-remote"
           },

src/commandsAndMenu.tsx

@@ -47,6 +47,7 @@ import {
 } from './tokens';
 import { GitCredentialsForm } from './widgets/CredentialsBox';
 import { discardAllChanges } from './widgets/discardAllChanges';
+import { CheckboxForm } from './widgets/GitResetToRemoteForm';
 
 export interface IGitCloneArgs {
   /**
@@ -410,6 +411,64 @@ export function addCommands(
     }
   });
 
+  /** Add git reset --hard <remote-tracking-branch> command */
+  commands.addCommand(CommandIDs.gitResetToRemote, {
+    label: trans.__('Reset to Remote'),
+    caption: trans.__('Reset Current Branch to Remote State'),
+    isEnabled: () => gitModel.pathRepository !== null,
+    execute: async () => {
+      const result = await showDialog({
+        title: trans.__('Reset to Remote'),
+        body: new CheckboxForm(
+          trans.__(
+            'To bring the current branch to the state of its corresponding remote tracking branch, \
+            a hard reset will be performed, which may result in some files being permanently deleted \
+            and some changes being permanently discarded. Are you sure you want to proceed? \
+            This action cannot be undone.'
+          ),
+          trans.__('Close all opened files to avoid conflicts')
+        ),
+        buttons: [
+          Dialog.cancelButton({ label: trans.__('Cancel') }),
+          Dialog.warnButton({ label: trans.__('Proceed') })
+        ]
+      });
+      if (result.button.accept) {
+        try {
+          if (result.value.checked) {
+            logger.log({
+              message: trans.__('Closing all opened files...'),
+              level: Level.RUNNING
+            });
+            await fileBrowserModel.manager.closeAll();
+          }
+          logger.log({
+            message: trans.__('Resetting...'),
+            level: Level.RUNNING
+          });
+          await gitModel.resetToCommit(gitModel.status.remote);
+          logger.log({
+            message: trans.__('Successfully reset'),
+            level: Level.SUCCESS,
+            details: trans.__(
+              'Successfully reset the current branch to its remote state'
+            )
+          });
+        } catch (error) {
+          console.error(
+            'Encountered an error when resetting the current branch to its remote state. Error: ',
+            error
+          );
+          logger.log({
+            message: trans.__('Reset failed'),
+            level: Level.ERROR,
+            error
+          });
+        }
+      }
+    }
+  });
+
   /**
    * Git display diff command - internal command
    *
@@ -1141,6 +1200,7 @@ export function createGitMenu(
     CommandIDs.gitMerge,
     CommandIDs.gitPush,
     CommandIDs.gitPull,
+    CommandIDs.gitResetToRemote,
     CommandIDs.gitAddRemote,
     CommandIDs.gitTerminalCommand
   ].forEach(command => {

src/tokens.ts

@@ -1024,6 +1024,16 @@ export namespace Git {
       super('Not in a Git Repository');
     }
   }
+
+  /**
+   * Interface for dialog with one checkbox.
+   */
+  export interface ICheckboxFormValue {
+    /**
+     * Checkbox value
+     */
+    checked: boolean;
+  }
 }
 
 /**
@@ -1097,6 +1107,7 @@ export enum CommandIDs {
   gitOpenGitignore = 'git:open-gitignore',
   gitPush = 'git:push',
   gitPull = 'git:pull',
+  gitResetToRemote = 'git:reset-to-remote',
   gitSubmitCommand = 'git:submit-commit',
   gitShowDiff = 'git:show-diff'
 }

src/widgets/GitResetToRemoteForm.tsx

@@ -0,0 +1,49 @@
+import { Dialog } from '@jupyterlab/apputils';
+import { Widget } from '@lumino/widgets';
+import { Git } from '../tokens';
+
+/**
+ * A widget form containing a text block and a checkbox,
+ * can be used as a Dialog body.
+ */
+export class CheckboxForm
+  extends Widget
+  implements Dialog.IBodyWidget<Git.ICheckboxFormValue>
+{
+  constructor(textBody: string, checkboxLabel: string) {
+    super();
+    this.node.appendChild(this.createBody(textBody, checkboxLabel));
+  }
+
+  private createBody(textBody: string, checkboxLabel: string): HTMLElement {
+    const mainNode = document.createElement('div');
+
+    const text = document.createElement('div');
+    text.textContent = textBody;
+
+    const checkboxContainer = document.createElement('label');
+
+    this._checkbox = document.createElement('input');
+    this._checkbox.type = 'checkbox';
+    this._checkbox.checked = true;
+
+    const label = document.createElement('span');
+    label.textContent = checkboxLabel;
+
+    checkboxContainer.appendChild(this._checkbox);
+    checkboxContainer.appendChild(label);
+
+    mainNode.appendChild(text);
+    mainNode.appendChild(checkboxContainer);
+
+    return mainNode;
+  }
+
+  getValue(): Git.ICheckboxFormValue {
+    return {
+      checked: this._checkbox.checked
+    };
+  }
+
+  private _checkbox: HTMLInputElement;
+}

tests/commands.spec.tsx

@@ -1,5 +1,6 @@
 import { JupyterFrontEnd } from '@jupyterlab/application';
 import { showDialog } from '@jupyterlab/apputils';
+import { FileBrowserModel } from '@jupyterlab/filebrowser';
 import { nullTranslator } from '@jupyterlab/translation';
 import { CommandRegistry } from '@lumino/commands';
 import 'jest';
@@ -16,13 +17,22 @@ import {
 
 jest.mock('../src/git');
 jest.mock('@jupyterlab/apputils');
+jest.mock('@jupyterlab/filebrowser');
 
 describe('git-commands', () => {
   const mockGit = git as jest.Mocked<typeof git>;
   let commands: CommandRegistry;
   let model: GitExtension;
   let mockResponses: IMockedResponses;
 
+  const mockedFileBrowserModel = {
+    manager: {
+      closeAll: jest
+        .fn<Promise<void>, any[]>()
+        .mockImplementation(() => Promise.resolve())
+    }
+  } as any as FileBrowserModel;
+
   beforeEach(async () => {
     jest.restoreAllMocks();
 
@@ -39,7 +49,13 @@ describe('git-commands', () => {
     };
 
     model = new GitExtension(app as any);
-    addCommands(app as JupyterFrontEnd, model, null, null, nullTranslator);
+    addCommands(
+      app as JupyterFrontEnd,
+      model,
+      mockedFileBrowserModel,
+      null,
+      nullTranslator
+    );
   });
 
   describe('git:add-remote', () => {
@@ -159,4 +175,65 @@ describe('git-commands', () => {
       });
     });
   });
+
+  describe('git:reset-to-remote', () => {
+    [true, false].forEach(checked => {
+      it(
+        checked
+          ? 'should close all opened files when the checkbox is checked'
+          : 'should not close all opened files when the checkbox is not checked',
+        async () => {
+          const mockDialog = showDialog as jest.MockedFunction<
+            typeof showDialog
+          >;
+          mockDialog.mockResolvedValue({
+            button: {
+              accept: true,
+              actions: [],
+              caption: '',
+              className: '',
+              displayType: 'default',
+              iconClass: '',
+              iconLabel: '',
+              label: ''
+            },
+            value: {
+              checked
+            } as Git.ICheckboxFormValue
+          });
+
+          const spyCloseAll = jest.spyOn(
+            mockedFileBrowserModel.manager,
+            'closeAll'
+          );
+          spyCloseAll.mockResolvedValueOnce(undefined);
+
+          mockGit.requestAPI.mockImplementation(
+            mockedRequestAPI({
+              ...mockResponses,
+              reset_to_commit: {
+                body: () => {
+                  return { code: 0 };
+                }
+              }
+            })
+          );
+
+          const path = DEFAULT_REPOSITORY_PATH;
+          model.pathRepository = path;
+          await model.ready;
+
+          await commands.execute(CommandIDs.gitResetToRemote);
+
+          if (checked) {
+            expect(spyCloseAll).toHaveBeenCalled();
+          } else {
+            expect(spyCloseAll).not.toHaveBeenCalled();
+          }
+
+          spyCloseAll.mockRestore();
+        }
+      );
+    });
+  });
 });