Allow deleting already pushed tags

Author: pol-rivero

app/src/models/popup.ts

@@ -64,6 +64,7 @@ export enum PopupType {
   StashAndSwitchBranch = 'StashAndSwitchBranch',
   ConfirmDiscardStash = 'ConfirmDiscardStash',
   ConfirmCheckoutCommit = 'ConfirmCheckoutCommit',
+  ConfirmDeletePushedTag = 'ConfirmDeletePushedTag',
   CreateTutorialRepository = 'CreateTutorialRepository',
   ConfirmExitTutorial = 'ConfirmExitTutorial',
   PushRejectedDueToMissingWorkflowScope = 'PushRejectedDueToMissingWorkflowScope',
@@ -256,6 +257,11 @@ export type PopupDetail =
       repository: Repository
       commit: CommitOneLine
     }
+  | {
+      type: PopupType.ConfirmDeletePushedTag
+      repository: Repository
+      tagName: string
+    }
   | {
       type: PopupType.CreateTutorialRepository
       account: Account

app/src/ui/app.tsx

@@ -109,6 +109,7 @@ import { Banner, BannerType } from '../models/banner'
 import { StashAndSwitchBranch } from './stash-changes/stash-and-switch-branch-dialog'
 import { ConfirmDiscardStashDialog } from './stashing/confirm-discard-stash'
 import { ConfirmCheckoutCommitDialog } from './checkout/confirm-checkout-commit'
+import { ConfirmDeletePushedTagDialog } from './tag/confirm-delete-pushed-tag'
 import { CreateTutorialRepositoryDialog } from './no-repositories/create-tutorial-repository-dialog'
 import { ConfirmExitTutorial } from './tutorial'
 import { TutorialStep, isValidTutorialStep } from '../models/tutorial-step'
@@ -2013,6 +2014,19 @@ export class App extends React.Component<IAppProps, IAppState> {
           />
         )
       }
+      case PopupType.ConfirmDeletePushedTag: {
+        const { repository, tagName } = popup
+
+        return (
+          <ConfirmDeletePushedTagDialog
+            key="confirm-delete-pushed-tag-dialog"
+            dispatcher={this.props.dispatcher}
+            repository={repository}
+            tagName={tagName}
+            onDismissed={onPopupDismissedFn}
+          />
+        )
+      }
       case PopupType.CreateTutorialRepository: {
         return (
           <CreateTutorialRepositoryDialog

app/src/ui/history/commit-list.tsx

@@ -118,8 +118,8 @@ interface ICommitListProps {
   /** Callback to fire to open the dialog to create a new tag on the given commit */
   readonly onCreateTag?: (targetCommitSha: string) => void
 
-  /** Callback to fire to delete an unpushed tag */
-  readonly onDeleteTag?: (tagName: string) => void
+  /** Callback to fire to delete a tag */
+  readonly onDeleteTag?: (tagName: string, unpushed: boolean) => void
 
   /**
    * A handler called whenever the user drops commits on the list to be inserted.
@@ -944,10 +944,10 @@ export class CommitList extends React.Component<
     if (commit.tags.length === 1) {
       const tagName = commit.tags[0]
 
+      const unpushed = unpushedTags.includes(tagName)
       return {
         label: `Delete tag ${tagName}`,
-        action: () => onDeleteTag(tagName),
-        enabled: unpushedTags.includes(tagName),
+        action: () => onDeleteTag(tagName, unpushed),
       }
     }
 
@@ -957,10 +957,10 @@ export class CommitList extends React.Component<
     return {
       label: 'Delete tag…',
       submenu: commit.tags.map(tagName => {
+        const unpushed = unpushedTagsSet.has(tagName)
         return {
           label: tagName,
-          action: () => onDeleteTag(tagName),
-          enabled: unpushedTagsSet.has(tagName),
+          action: () => onDeleteTag(tagName, unpushed),
         }
       }),
     }

app/src/ui/history/compare.tsx

@@ -685,8 +685,17 @@ export class CompareSidebar extends React.Component<
     }
   }
 
-  private onDeleteTag = (tagName: string) => {
-    this.props.dispatcher.showDeleteTagDialog(this.props.repository, tagName)
+  private onDeleteTag = (tagName: string, unpushed: boolean) => {
+    const { repository, dispatcher } = this.props
+    if (unpushed) {
+      dispatcher.showDeleteTagDialog(this.props.repository, tagName)
+    } else {
+      dispatcher.showPopup({
+        type: PopupType.ConfirmDeletePushedTag,
+        tagName: tagName,
+        repository,
+      })
+    }
   }
 
   private onCherryPick = (commits: ReadonlyArray<CommitOneLine>) => {

app/src/ui/tag/confirm-delete-pushed-tag.tsx

@@ -0,0 +1,78 @@
+import * as React from 'react'
+import { Dialog, DialogContent, DialogFooter } from '../dialog'
+import { Repository } from '../../models/repository'
+import { Dispatcher } from '../dispatcher'
+import { Row } from '../lib/row'
+import { OkCancelButtonGroup } from '../dialog/ok-cancel-button-group'
+
+interface IConfirmDeletePushedTagProps {
+  readonly dispatcher: Dispatcher
+  readonly repository: Repository
+  readonly tagName: string
+  readonly onDismissed: () => void
+}
+
+interface IConfirmDeletePushedTagState {
+  readonly isDeleting: boolean
+}
+/**
+ * Dialog to confirm deleting an already pushed tag
+ */
+export class ConfirmDeletePushedTagDialog extends React.Component<
+  IConfirmDeletePushedTagProps,
+  IConfirmDeletePushedTagState
+> {
+  public constructor(props: IConfirmDeletePushedTagProps) {
+    super(props)
+
+    this.state = {
+      isDeleting: false,
+    }
+  }
+
+  public render() {
+    const title = __DARWIN__ ? 'Delete Pushed Tag?' : 'Delete pushed tag?'
+
+    return (
+      <Dialog
+        id="delete-pushed-tag"
+        type="warning"
+        title={title}
+        loading={this.state.isDeleting}
+        disabled={this.state.isDeleting}
+        onSubmit={this.onSubmit}
+        onDismissed={this.props.onDismissed}
+        ariaDescribedBy="delete-pushed-tag-confirmation"
+        role="alertdialog"
+      >
+        <DialogContent>
+          <Row id="delete-pushed-tag-confirmation">
+            This tag has already been pushed to the remote. Are you sure you
+            want to delete it locally?
+          </Row>
+        </DialogContent>
+        <DialogFooter>
+          <OkCancelButtonGroup destructive={true} okButtonText="Delete" />
+        </DialogFooter>
+      </Dialog>
+    )
+  }
+
+  private onSubmit = async () => {
+    const { dispatcher, repository, tagName, onDismissed } = this.props
+
+    this.setState({
+      isDeleting: true,
+    })
+
+    try {
+      await dispatcher.deleteTag(repository, tagName)
+    } finally {
+      this.setState({
+        isDeleting: false,
+      })
+    }
+
+    onDismissed()
+  }
+}