Undo Success Banner

app/src/lib/stores/app-store.ts

@@ -5979,7 +5979,8 @@ export class AppStore extends TypedBaseStore<IAppState> {
   public async _undoCherryPick(
     repository: Repository,
     targetBranchName: string,
-    sourceBranch: Branch | null
+    sourceBranch: Branch | null,
+    countCherryPicked: number
   ): Promise<void> {
     const { branchesState } = this.repositoryStateCache.get(repository)
     const { tip } = branchesState
@@ -6013,6 +6014,13 @@ export class AppStore extends TypedBaseStore<IAppState> {
       )
     })
 
+    const banner: Banner = {
+      type: BannerType.CherryPickUndone,
+      targetBranchName,
+      countCherryPicked,
+    }
+    this._setBanner(banner)
+
     return this._refreshRepository(repository)
   }
 }

app/src/models/banner.ts

@@ -8,6 +8,7 @@ export enum BannerType {
   BranchAlreadyUpToDate = 'BranchAlreadyUpToDate',
   SuccessfulCherryPick = 'SuccessfulCherryPick',
   CherryPickConflictsFound = 'CherryPickConflictsFound',
+  CherryPickUndone = 'CherryPickUndone',
 }
 
 export type Banner =
@@ -62,3 +63,10 @@ export type Banner =
       /** callback to run when user clicks on link in banner text */
       readonly onOpenConflictsDialog: () => void
     }
+  | {
+      readonly type: BannerType.CherryPickUndone
+      /** name of the branch that the commits were cherry picked onto */
+      readonly targetBranchName: string
+      /** number of commits cherry picked */
+      readonly countCherryPicked: number
+    }

app/src/ui/banners/cherry-pick-undone.tsx

@@ -0,0 +1,33 @@
+import * as React from 'react'
+import { Octicon, OcticonSymbol } from '../octicons'
+import { Banner } from './banner'
+
+interface ICherryPickUndoneBannerProps {
+  readonly targetBranchName: string
+  readonly countCherryPicked: number
+  readonly onDismissed: () => void
+}
+
+export class CherryPickUndone extends React.Component<
+  ICherryPickUndoneBannerProps,
+  {}
+> {
+  public render() {
+    const { countCherryPicked, targetBranchName, onDismissed } = this.props
+    const pluralized = countCherryPicked === 1 ? 'commit' : 'commits'
+    return (
+      <Banner id="cherry-pick-undone" timeout={5000} onDismissed={onDismissed}>
+        <div className="green-circle">
+          <Octicon className="check-icon" symbol={OcticonSymbol.check} />
+        </div>
+        <div className="banner-message">
+          <span>
+            Cherry pick undone. Successfully removed the {countCherryPicked}
+            {' copied '}
+            {pluralized} from <strong>{targetBranchName}</strong>.
+          </span>
+        </div>
+      </Banner>
+    )
+  }
+}

app/src/ui/banners/render-banner.tsx

@@ -13,6 +13,7 @@ import { SuccessfulRebase } from './successful-rebase'
 import { BranchAlreadyUpToDate } from './branch-already-up-to-date-banner'
 import { SuccessfulCherryPick } from './successful-cherry-pick'
 import { CherryPickConflictsBanner } from './cherry-pick-conflicts-banner'
+import { CherryPickUndone } from './cherry-pick-undone'
 
 export function renderBanner(
   banner: Banner,
@@ -86,6 +87,15 @@ export function renderBanner(
           key={'cherry-pick-conflicts'}
         />
       )
+    case BannerType.CherryPickUndone:
+      return (
+        <CherryPickUndone
+          key="cherry-pick-undone"
+          targetBranchName={banner.targetBranchName}
+          countCherryPicked={banner.countCherryPicked}
+          onDismissed={onDismissed}
+        />
+      )
     default:
       return assertNever(banner, `Unknown popup type: ${banner}`)
   }

app/src/ui/dispatcher/dispatcher.ts

@@ -2603,7 +2603,8 @@ export class Dispatcher {
     repository: Repository,
     targetBranchName: string,
     countCherryPicked: number,
-    sourceBranch: Branch | null
+    sourceBranch: Branch | null,
+    commitsCount: number
   ): Promise<void> {
     this.closePopup()
 
@@ -2612,7 +2613,12 @@ export class Dispatcher {
       targetBranchName,
       countCherryPicked,
       onUndoCherryPick: () => {
-        this.undoCherryPick(repository, targetBranchName, sourceBranch)
+        this.undoCherryPick(
+          repository,
+          targetBranchName,
+          sourceBranch,
+          commitsCount
+        )
       },
     }
     this.setBanner(banner)
@@ -2703,7 +2709,8 @@ export class Dispatcher {
           repository,
           targetBranchName,
           commitsCount,
-          sourceBranch
+          sourceBranch,
+          commitsCount
         )
         break
       case CherryPickResult.ConflictsEncountered:
@@ -2778,12 +2785,14 @@ export class Dispatcher {
   private async undoCherryPick(
     repository: Repository,
     targetBranchName: string,
-    sourceBranch: Branch | null
+    sourceBranch: Branch | null,
+    commitsCount: number
   ): Promise<void> {
     await this.appStore._undoCherryPick(
       repository,
       targetBranchName,
-      sourceBranch
+      sourceBranch,
+      commitsCount
     )
   }
 }

app/styles/ui/banners/_successful.scss

@@ -1,3 +1,4 @@
+#cherry-pick-undone,
 #successful-cherry-pick,
 #successful-rebase,
 #successful-merge {