From e0187e3bb81893b7be8bf0551472afdc97d47179 Mon Sep 17 00:00:00 2001
From: nzaytsev <nikolai.zaytsev@gitkraken.com>
Date: Thu, 29 Aug 2024 12:24:30 +0700
Subject: [PATCH 1/8] Truncates branch name inside the action button on the
 commit graph #3499

---
 src/webviews/apps/plus/graph/GraphWrapper.tsx |  4 ++--
 src/webviews/apps/plus/graph/graph.scss       | 14 ++++++++++++++
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/webviews/apps/plus/graph/GraphWrapper.tsx b/src/webviews/apps/plus/graph/GraphWrapper.tsx
index 247da6005cecb..ddbaa66eefc40 100644
--- a/src/webviews/apps/plus/graph/GraphWrapper.tsx
+++ b/src/webviews/apps/plus/graph/GraphWrapper.tsx
@@ -1107,7 +1107,7 @@ export function GraphWrapper({
 										) : (
 											''
 										)}
-										{branchName}
+										<span className="action-button__truncated">{branchName}</span>
 										<span
 											className="codicon codicon-chevron-down action-button__more"
 											aria-hidden="true"
@@ -1143,7 +1143,7 @@ export function GraphWrapper({
 							</>
 						)}
 					</div>
-					<div className="titlebar__group">
+					<div className="titlebar__group--last">
 						<GlTooltip placement="bottom">
 							<a
 								href={`command:gitlens.showLaunchpad?${encodeURIComponent(
diff --git a/src/webviews/apps/plus/graph/graph.scss b/src/webviews/apps/plus/graph/graph.scss
index 33c0be49d806b..be745cc1934f0 100644
--- a/src/webviews/apps/plus/graph/graph.scss
+++ b/src/webviews/apps/plus/graph/graph.scss
@@ -345,6 +345,12 @@ button:not([disabled]),
 		overflow: hidden;
 	}
 
+	&__truncated {
+		width: 100%;
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+
 	&.is-ahead {
 		background-color: var(--branch-status-ahead-background);
 
@@ -888,6 +894,13 @@ button:not([disabled]),
 		}
 	}
 
+	&__group--last {
+		display: flex;
+		gap: 0.5rem;
+		flex-shrink: 0;
+		width: auto;
+	}
+
 	&,
 	&__row {
 		justify-content: space-between;
@@ -966,6 +979,7 @@ gl-feature-gate gl-feature-badge {
 	&__header {
 		flex: none;
 		z-index: 101;
+		width: fit-content;
 		position: relative;
 	}
 

From 8c95fae7dbd6a8e07ce0d91dc64ef0a80f9956df Mon Sep 17 00:00:00 2001
From: nzaytsev <nikolai.zaytsev@gitkraken.com>
Date: Thu, 29 Aug 2024 16:12:31 +0700
Subject: [PATCH 2/8] Adds create branch button to the commit graph

---
 CHANGELOG.md                                  |  1 +
 src/commands/git/branch.ts                    |  4 +
 src/commands/gitWizard.ts                     |  2 +-
 src/plus/webviews/graph/graphWebview.ts       | 11 ++-
 src/plus/webviews/graph/protocol.ts           |  2 +-
 src/webviews/apps/plus/graph/GraphWrapper.tsx | 96 ++++++++++++++++++-
 src/webviews/apps/plus/graph/graph.scss       | 10 +-
 src/webviews/apps/shared/codicons.scss        |  9 ++
 8 files changed, 129 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ec6aeb4d363b5..0406a54ea3472 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -13,6 +13,7 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/) and this p
 - Adds a new `${authorFirst}` and `${authorLast}` commit formatting tokens that can be used in inline blame, commit hovers, etc &mdash; closes [#2980](https://github.com/gitkraken/vscode-gitlens/issues/2980)
 - Adds a way to force push from the Graph
 - Adds a new `gitlens.launchpad.includedOrganizations` setting to specify which organizations to include in _Launchpad_ &mdash; closes [#3550](https://github.com/gitkraken/vscode-gitlens/issues/3550)
+- Adds create branch button to the commit graph &mdash; closes [#3553](https://github.com/gitkraken/vscode-gitlens/issues/3553)
 
 ### Changed
 
diff --git a/src/commands/git/branch.ts b/src/commands/git/branch.ts
index 8712422e81e89..b5d948384f33d 100644
--- a/src/commands/git/branch.ts
+++ b/src/commands/git/branch.ts
@@ -155,6 +155,10 @@ export class BranchGitCommand extends QuickCommand {
 
 			switch (args?.state.subcommand) {
 				case 'create':
+					if (args.state.flags != null) {
+						counter++;
+					}
+
 					if (args.state.reference != null) {
 						counter++;
 					}
diff --git a/src/commands/gitWizard.ts b/src/commands/gitWizard.ts
index a81595b753f8c..3331df19ffcf4 100644
--- a/src/commands/gitWizard.ts
+++ b/src/commands/gitWizard.ts
@@ -93,7 +93,7 @@ export class GitWizardCommand extends QuickWizardCommandBase {
 	) {
 		switch (context.command) {
 			case Commands.GitCommandsBranch:
-				return this.execute({ command: 'branch' });
+				return this.execute({ command: 'branch', ...args });
 			case Commands.GitCommandsBranchCreate:
 				return this.execute({ command: 'branch', state: { subcommand: 'create' } });
 			case Commands.GitCommandsBranchDelete:
diff --git a/src/plus/webviews/graph/graphWebview.ts b/src/plus/webviews/graph/graphWebview.ts
index 85be4a5f02e48..147f965620807 100644
--- a/src/plus/webviews/graph/graphWebview.ts
+++ b/src/plus/webviews/graph/graphWebview.ts
@@ -2428,7 +2428,16 @@ export class GraphWebviewProvider implements WebviewProvider<State, State, Graph
 			selectedRepository: this.repository.path,
 			selectedRepositoryVisibility: visibility,
 			branchesVisibility: refsVisibility.branchesVisibility,
-			branchName: branch?.name,
+			branch: branch && {
+				name: branch.name,
+				ref: branch.ref,
+				refType: branch.refType,
+				remote: branch.remote,
+				repoPath: branch.repoPath,
+				sha: branch.sha,
+				id: branch.id,
+				upstream: branch.upstream,
+			},
 			branchState: branchState,
 			lastFetched: new Date(getSettledValue(lastFetchedResult)!),
 			selectedRows: this._selectedRows,
diff --git a/src/plus/webviews/graph/protocol.ts b/src/plus/webviews/graph/protocol.ts
index c686b748a1b95..1473c1b270af8 100644
--- a/src/plus/webviews/graph/protocol.ts
+++ b/src/plus/webviews/graph/protocol.ts
@@ -95,7 +95,7 @@ export interface State extends WebviewState {
 	selectedRepository?: string;
 	selectedRepositoryVisibility?: RepositoryVisibility;
 	branchesVisibility?: GraphBranchesVisibility;
-	branchName?: string;
+	branch?: GitBranchReference;
 	branchState?: BranchState;
 	lastFetched?: Date;
 	selectedRows?: GraphSelectedRows;
diff --git a/src/webviews/apps/plus/graph/GraphWrapper.tsx b/src/webviews/apps/plus/graph/GraphWrapper.tsx
index ddbaa66eefc40..aaca469e6e65d 100644
--- a/src/webviews/apps/plus/graph/GraphWrapper.tsx
+++ b/src/webviews/apps/plus/graph/GraphWrapper.tsx
@@ -19,6 +19,7 @@ import { SlOption, SlSelect } from '@shoelace-style/shoelace/dist/react';
 import type { FormEvent, MouseEvent, ReactElement } from 'react';
 import React, { createElement, useEffect, useMemo, useRef, useState } from 'react';
 import type { ConnectCloudIntegrationsCommandArgs } from '../../../../commands/cloudIntegrations';
+import type { BranchGitCommandArgs } from '../../../../commands/git/branch';
 import type { DateStyle, GraphBranchesVisibility } from '../../../../config';
 import type { Commands } from '../../../../constants.commands';
 import type { SearchQuery } from '../../../../constants.search';
@@ -269,7 +270,7 @@ export function GraphWrapper({
 	const [pagingHasMore, setPagingHasMore] = useState(state.paging?.hasMore ?? false);
 	const [isLoading, setIsLoading] = useState(state.loading);
 	const [styleProps, setStyleProps] = useState(state.theming);
-	const [branchName, setBranchName] = useState(state.branchName);
+	const [branch, setBranch] = useState(state.branch);
 	const [lastFetched, setLastFetched] = useState(state.lastFetched);
 	const [windowFocused, setWindowFocused] = useState(state.windowFocused);
 	const [allowed, setAllowed] = useState(state.allowed ?? false);
@@ -287,6 +288,7 @@ export function GraphWrapper({
 	const [workingTreeStats, setWorkingTreeStats] = useState(
 		state.workingTreeStats ?? { added: 0, modified: 0, deleted: 0 },
 	);
+	const branchName = branch?.name;
 
 	const minimap = useRef<GlGraphMinimapContainer | undefined>(undefined);
 	const hover = useRef<GlGraphHover | undefined>(undefined);
@@ -388,7 +390,7 @@ export function GraphWrapper({
 				if (!themingChanged) {
 					setStyleProps(state.theming);
 				}
-				setBranchName(state.branchName);
+				setBranch(state.branch);
 				setLastFetched(state.lastFetched);
 				setColumns(state.columns);
 				setRows(state.rows ?? []);
@@ -1144,6 +1146,96 @@ export function GraphWrapper({
 						)}
 					</div>
 					<div className="titlebar__group--last">
+						<span className="button-group">
+							<GlTooltip placement="bottom">
+								<a
+									className="action-button"
+									href={createCommandLink(Commands.GitCommandsBranch, {
+										args: {
+											state: { subcommand: 'create', flags: ['--switch'], reference: branch },
+											command: 'branch',
+											confirm: false,
+										} satisfies BranchGitCommandArgs,
+									})}
+								>
+									<span className="codicon codicon-git-branch-create action-button__icon"></span>
+								</a>
+								<span slot="content">
+									Create a branch from <i>{branchName}</i> and switch
+								</span>
+							</GlTooltip>
+							<GlTooltip placement="top" distance={7}>
+								<PopMenu position="right">
+									<button
+										type="button"
+										className="action-button"
+										slot="trigger"
+										aria-label="Minimap Options"
+									>
+										<span
+											className="codicon codicon-chevron-down action-button__more"
+											aria-hidden="true"
+										></span>
+									</button>
+									<MenuList slot="content" id="create-branch">
+										<MenuLabel>Create branch options</MenuLabel>
+										<MenuItem>
+											<a href={createCommandLink(Commands.GitCommandsBranchCreate)}>
+												Create Branch...
+											</a>
+										</MenuItem>
+										<MenuItem>
+											<a
+												href={createCommandLink(Commands.GitCommandsBranch, {
+													args: {
+														command: 'branch',
+														confirm: false,
+														state: { flags: [], reference: branch, subcommand: 'create' },
+													} satisfies BranchGitCommandArgs,
+												})}
+											>
+												Create Branch from <i>{branchName}</i>
+											</a>
+										</MenuItem>
+										<MenuItem>
+											<a
+												href={createCommandLink(Commands.GitCommandsBranch, {
+													args: {
+														command: 'branch',
+														confirm: false,
+														state: {
+															flags: ['--switch'],
+															reference: branch,
+															subcommand: 'create',
+														},
+													} satisfies BranchGitCommandArgs,
+												})}
+											>
+												Create from <i>{branchName}</i> & Switch to Branch
+											</a>
+										</MenuItem>
+										<MenuItem>
+											<a
+												href={createCommandLink(Commands.GitCommandsBranch, {
+													args: {
+														state: {
+															subcommand: 'create',
+															flags: ['--worktree'],
+															reference: branch,
+														},
+														command: 'branch',
+														confirm: false,
+													} satisfies BranchGitCommandArgs,
+												})}
+											>
+												Create Branch from <i>{branchName}</i> in New Worktree
+											</a>
+										</MenuItem>
+									</MenuList>
+								</PopMenu>
+								<span slot="content">Create branch options</span>
+							</GlTooltip>
+						</span>
 						<GlTooltip placement="bottom">
 							<a
 								href={`command:gitlens.showLaunchpad?${encodeURIComponent(
diff --git a/src/webviews/apps/plus/graph/graph.scss b/src/webviews/apps/plus/graph/graph.scss
index be745cc1934f0..62f5694c64366 100644
--- a/src/webviews/apps/plus/graph/graph.scss
+++ b/src/webviews/apps/plus/graph/graph.scss
@@ -979,7 +979,7 @@ gl-feature-gate gl-feature-badge {
 	&__header {
 		flex: none;
 		z-index: 101;
-		width: fit-content;
+		width: --webkit-fill-available;
 		position: relative;
 	}
 
@@ -1197,6 +1197,14 @@ gl-feature-gate gl-feature-badge {
 	width: 1px;
 }
 
+menu-list#create-branch {
+	menu-item > a {
+		display: block;
+		color: var(--vscode-foreground);
+		text-decoration: none;
+	}
+}
+
 #opts-popover {
 	font-size: var(--vscode-font-size);
 	font-family: var(--vscode-font-family);
diff --git a/src/webviews/apps/shared/codicons.scss b/src/webviews/apps/shared/codicons.scss
index 0dc04c1e16c46..a00fea4399a5c 100644
--- a/src/webviews/apps/shared/codicons.scss
+++ b/src/webviews/apps/shared/codicons.scss
@@ -159,6 +159,15 @@
 .codicon-git-branch-create:before {
 	content: '\ea68';
 }
+.codicon-git-branch-create:after {
+	content: '\ea60';
+	position: absolute;
+	right: 0;
+	bottom: 0px;
+	font-size: 0.6em;
+	line-height: normal;
+	transform: translate(-50%, 0%);
+}
 .codicon-git-branch-delete:before {
 	content: '\ea68';
 }

From 98ae938611223c981b9a621f50afa5c778c79e8e Mon Sep 17 00:00:00 2001
From: Keith Daulton <keith.daulton@gitkraken.com>
Date: Tue, 1 Oct 2024 14:40:44 -0400
Subject: [PATCH 3/8] Changes PopMenu for GlPopover

---
 src/webviews/apps/plus/graph/GraphWrapper.tsx | 118 +++++++++---------
 src/webviews/apps/plus/graph/graph.scss       |   8 --
 2 files changed, 58 insertions(+), 68 deletions(-)

diff --git a/src/webviews/apps/plus/graph/GraphWrapper.tsx b/src/webviews/apps/plus/graph/GraphWrapper.tsx
index aaca469e6e65d..c9a2d9a90f8bc 100644
--- a/src/webviews/apps/plus/graph/GraphWrapper.tsx
+++ b/src/webviews/apps/plus/graph/GraphWrapper.tsx
@@ -1164,8 +1164,14 @@ export function GraphWrapper({
 									Create a branch from <i>{branchName}</i> and switch
 								</span>
 							</GlTooltip>
-							<GlTooltip placement="top" distance={7}>
-								<PopMenu position="right">
+							<GlPopover
+								className="popover"
+								placement="bottom-start"
+								trigger="focus"
+								arrow={false}
+								distance={0}
+							>
+								<GlTooltip placement="top" distance={7}>
 									<button
 										type="button"
 										className="action-button"
@@ -1177,64 +1183,56 @@ export function GraphWrapper({
 											aria-hidden="true"
 										></span>
 									</button>
-									<MenuList slot="content" id="create-branch">
-										<MenuLabel>Create branch options</MenuLabel>
-										<MenuItem>
-											<a href={createCommandLink(Commands.GitCommandsBranchCreate)}>
-												Create Branch...
-											</a>
-										</MenuItem>
-										<MenuItem>
-											<a
-												href={createCommandLink(Commands.GitCommandsBranch, {
-													args: {
-														command: 'branch',
-														confirm: false,
-														state: { flags: [], reference: branch, subcommand: 'create' },
-													} satisfies BranchGitCommandArgs,
-												})}
-											>
-												Create Branch from <i>{branchName}</i>
-											</a>
-										</MenuItem>
-										<MenuItem>
-											<a
-												href={createCommandLink(Commands.GitCommandsBranch, {
-													args: {
-														command: 'branch',
-														confirm: false,
-														state: {
-															flags: ['--switch'],
-															reference: branch,
-															subcommand: 'create',
-														},
-													} satisfies BranchGitCommandArgs,
-												})}
-											>
-												Create from <i>{branchName}</i> & Switch to Branch
-											</a>
-										</MenuItem>
-										<MenuItem>
-											<a
-												href={createCommandLink(Commands.GitCommandsBranch, {
-													args: {
-														state: {
-															subcommand: 'create',
-															flags: ['--worktree'],
-															reference: branch,
-														},
-														command: 'branch',
-														confirm: false,
-													} satisfies BranchGitCommandArgs,
-												})}
-											>
-												Create Branch from <i>{branchName}</i> in New Worktree
-											</a>
-										</MenuItem>
-									</MenuList>
-								</PopMenu>
-								<span slot="content">Create branch options</span>
-							</GlTooltip>
+									<span slot="content">Create branch options</span>
+								</GlTooltip>
+								<div slot="content">
+									<MenuLabel>Create branch options</MenuLabel>
+									<MenuItem href={createCommandLink(Commands.GitCommandsBranchCreate)}>
+										Create Branch...
+									</MenuItem>
+									<MenuItem
+										href={createCommandLink(Commands.GitCommandsBranch, {
+											args: {
+												command: 'branch',
+												confirm: false,
+												state: { flags: [], reference: branch, subcommand: 'create' },
+											} satisfies BranchGitCommandArgs,
+										})}
+									>
+										Create Branch from <i>{branchName}</i>
+									</MenuItem>
+									<MenuItem
+										href={createCommandLink(Commands.GitCommandsBranch, {
+											args: {
+												command: 'branch',
+												confirm: false,
+												state: {
+													flags: ['--switch'],
+													reference: branch,
+													subcommand: 'create',
+												},
+											} satisfies BranchGitCommandArgs,
+										})}
+									>
+										Create from <i>{branchName}</i> & Switch to Branch
+									</MenuItem>
+									<MenuItem
+										href={createCommandLink(Commands.GitCommandsBranch, {
+											args: {
+												state: {
+													subcommand: 'create',
+													flags: ['--worktree'],
+													reference: branch,
+												},
+												command: 'branch',
+												confirm: false,
+											} satisfies BranchGitCommandArgs,
+										})}
+									>
+										Create Branch from <i>{branchName}</i> in New Worktree
+									</MenuItem>
+								</div>
+							</GlPopover>
 						</span>
 						<GlTooltip placement="bottom">
 							<a
diff --git a/src/webviews/apps/plus/graph/graph.scss b/src/webviews/apps/plus/graph/graph.scss
index 62f5694c64366..7684e86852314 100644
--- a/src/webviews/apps/plus/graph/graph.scss
+++ b/src/webviews/apps/plus/graph/graph.scss
@@ -1197,14 +1197,6 @@ gl-feature-gate gl-feature-badge {
 	width: 1px;
 }
 
-menu-list#create-branch {
-	menu-item > a {
-		display: block;
-		color: var(--vscode-foreground);
-		text-decoration: none;
-	}
-}
-
 #opts-popover {
 	font-size: var(--vscode-font-size);
 	font-family: var(--vscode-font-family);

From 7cf65e10b22222514eb6461a44e6627113981a3a Mon Sep 17 00:00:00 2001
From: Keith Daulton <keith.daulton@gitkraken.com>
Date: Tue, 1 Oct 2024 15:51:08 -0400
Subject: [PATCH 4/8] Removes graph icon customization from codicons

---
 src/webviews/apps/plus/graph/GraphWrapper.tsx | 11 +++--------
 src/webviews/apps/plus/graph/graph.scss       | 16 +++++++++++++++-
 src/webviews/apps/shared/codicons.scss        |  9 ---------
 3 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/src/webviews/apps/plus/graph/GraphWrapper.tsx b/src/webviews/apps/plus/graph/GraphWrapper.tsx
index c9a2d9a90f8bc..bfe7eebdbefe1 100644
--- a/src/webviews/apps/plus/graph/GraphWrapper.tsx
+++ b/src/webviews/apps/plus/graph/GraphWrapper.tsx
@@ -1158,7 +1158,7 @@ export function GraphWrapper({
 										} satisfies BranchGitCommandArgs,
 									})}
 								>
-									<span className="codicon codicon-git-branch-create action-button__icon"></span>
+									<span className="codicon codicon-custom-git-branch-create action-button__icon"></span>
 								</a>
 								<span slot="content">
 									Create a branch from <i>{branchName}</i> and switch
@@ -1171,13 +1171,8 @@ export function GraphWrapper({
 								arrow={false}
 								distance={0}
 							>
-								<GlTooltip placement="top" distance={7}>
-									<button
-										type="button"
-										className="action-button"
-										slot="trigger"
-										aria-label="Minimap Options"
-									>
+								<GlTooltip placement="top" distance={7} slot="anchor">
+									<button type="button" className="action-button" aria-label="Minimap Options">
 										<span
 											className="codicon codicon-chevron-down action-button__more"
 											aria-hidden="true"
diff --git a/src/webviews/apps/plus/graph/graph.scss b/src/webviews/apps/plus/graph/graph.scss
index 7684e86852314..dc66fa8efdadd 100644
--- a/src/webviews/apps/plus/graph/graph.scss
+++ b/src/webviews/apps/plus/graph/graph.scss
@@ -304,6 +304,20 @@ button:not([disabled]),
 	.codicon[class*='codicon-graph-line'] {
 		transform: translateY(1px);
 	}
+	.codicon-custom-git-branch-create {
+		&:before {
+			content: '\ea68';
+		}
+		&:after {
+			content: '\ea60';
+			position: absolute;
+			right: 0;
+			bottom: 0;
+			font-size: 0.6em;
+			line-height: normal;
+			transform: translate(-50%, 0%);
+		}
+	}
 
 	&__pill {
 		.is-ahead & {
@@ -979,7 +993,7 @@ gl-feature-gate gl-feature-badge {
 	&__header {
 		flex: none;
 		z-index: 101;
-		width: --webkit-fill-available;
+		width: fit-content;
 		position: relative;
 	}
 
diff --git a/src/webviews/apps/shared/codicons.scss b/src/webviews/apps/shared/codicons.scss
index a00fea4399a5c..0dc04c1e16c46 100644
--- a/src/webviews/apps/shared/codicons.scss
+++ b/src/webviews/apps/shared/codicons.scss
@@ -159,15 +159,6 @@
 .codicon-git-branch-create:before {
 	content: '\ea68';
 }
-.codicon-git-branch-create:after {
-	content: '\ea60';
-	position: absolute;
-	right: 0;
-	bottom: 0px;
-	font-size: 0.6em;
-	line-height: normal;
-	transform: translate(-50%, 0%);
-}
 .codicon-git-branch-delete:before {
 	content: '\ea68';
 }

From 8356c52d9d4681440e063a94e999ad84b8a9cb0d Mon Sep 17 00:00:00 2001
From: Keith Daulton <keith.daulton@gitkraken.com>
Date: Wed, 2 Oct 2024 12:03:16 -0400
Subject: [PATCH 5/8] Removes current branch default for create branch command

---
 src/commands/git/branch.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/commands/git/branch.ts b/src/commands/git/branch.ts
index b5d948384f33d..b6d5022acbb9c 100644
--- a/src/commands/git/branch.ts
+++ b/src/commands/git/branch.ts
@@ -1,7 +1,7 @@
 import { QuickInputButtons } from 'vscode';
 import type { Container } from '../../container';
 import type { GitBranchReference, GitReference } from '../../git/models/reference';
-import { getNameWithoutRemote, getReferenceLabel, isRevisionReference } from '../../git/models/reference';
+import { getReferenceLabel, isRevisionReference } from '../../git/models/reference';
 import { Repository } from '../../git/models/repository';
 import type { GitWorktree } from '../../git/models/worktree';
 import { getWorktreesByBranch } from '../../git/models/worktree';
@@ -361,7 +361,7 @@ export class BranchGitCommand extends QuickCommand {
 						icon: false,
 						label: state.reference.refType !== 'branch',
 					})}`,
-					value: state.name ?? getNameWithoutRemote(state.reference),
+					value: state.name,
 				});
 				if (result === StepResultBreak) continue;
 

From bd589a316d6246cc2b9e7ebefd8969087f01983e Mon Sep 17 00:00:00 2001
From: Keith Daulton <keith.daulton@gitkraken.com>
Date: Wed, 2 Oct 2024 12:53:55 -0400
Subject: [PATCH 6/8] Simplifies create branch action on graph

---
 src/webviews/apps/plus/graph/GraphWrapper.tsx | 77 ++-----------------
 src/webviews/apps/plus/graph/graph.scss       |  9 +--
 2 files changed, 7 insertions(+), 79 deletions(-)

diff --git a/src/webviews/apps/plus/graph/GraphWrapper.tsx b/src/webviews/apps/plus/graph/GraphWrapper.tsx
index bfe7eebdbefe1..26706979b4ec1 100644
--- a/src/webviews/apps/plus/graph/GraphWrapper.tsx
+++ b/src/webviews/apps/plus/graph/GraphWrapper.tsx
@@ -1145,90 +1145,25 @@ export function GraphWrapper({
 							</>
 						)}
 					</div>
-					<div className="titlebar__group--last">
-						<span className="button-group">
+					<div className="titlebar__group">
 							<GlTooltip placement="bottom">
 								<a
 									className="action-button"
 									href={createCommandLink(Commands.GitCommandsBranch, {
 										args: {
-											state: { subcommand: 'create', flags: ['--switch'], reference: branch },
-											command: 'branch',
-											confirm: false,
-										} satisfies BranchGitCommandArgs,
-									})}
-								>
-									<span className="codicon codicon-custom-git-branch-create action-button__icon"></span>
-								</a>
-								<span slot="content">
-									Create a branch from <i>{branchName}</i> and switch
-								</span>
-							</GlTooltip>
-							<GlPopover
-								className="popover"
-								placement="bottom-start"
-								trigger="focus"
-								arrow={false}
-								distance={0}
-							>
-								<GlTooltip placement="top" distance={7} slot="anchor">
-									<button type="button" className="action-button" aria-label="Minimap Options">
-										<span
-											className="codicon codicon-chevron-down action-button__more"
-											aria-hidden="true"
-										></span>
-									</button>
-									<span slot="content">Create branch options</span>
-								</GlTooltip>
-								<div slot="content">
-									<MenuLabel>Create branch options</MenuLabel>
-									<MenuItem href={createCommandLink(Commands.GitCommandsBranchCreate)}>
-										Create Branch...
-									</MenuItem>
-									<MenuItem
-										href={createCommandLink(Commands.GitCommandsBranch, {
-											args: {
-												command: 'branch',
-												confirm: false,
-												state: { flags: [], reference: branch, subcommand: 'create' },
-											} satisfies BranchGitCommandArgs,
-										})}
-									>
-										Create Branch from <i>{branchName}</i>
-									</MenuItem>
-									<MenuItem
-										href={createCommandLink(Commands.GitCommandsBranch, {
-											args: {
-												command: 'branch',
-												confirm: false,
 												state: {
-													flags: ['--switch'],
-													reference: branch,
 													subcommand: 'create',
-												},
-											} satisfies BranchGitCommandArgs,
-										})}
-									>
-										Create from <i>{branchName}</i> & Switch to Branch
-									</MenuItem>
-									<MenuItem
-										href={createCommandLink(Commands.GitCommandsBranch, {
-											args: {
-												state: {
-													subcommand: 'create',
-													flags: ['--worktree'],
 													reference: branch,
 												},
 												command: 'branch',
-												confirm: false,
+										confirm: true,
 											} satisfies BranchGitCommandArgs,
 										})}
 									>
-										Create Branch from <i>{branchName}</i> in New Worktree
-									</MenuItem>
-								</div>
-							</GlPopover>
-						</span>
+								<span className="codicon codicon-custom-git-branch-create action-button__icon"></span>
+							</a>
+							<span slot="content">Create new branch</span>
+						</GlTooltip>
 						<GlTooltip placement="bottom">
 							<a
 								href={`command:gitlens.showLaunchpad?${encodeURIComponent(
diff --git a/src/webviews/apps/plus/graph/graph.scss b/src/webviews/apps/plus/graph/graph.scss
index dc66fa8efdadd..49e2369e6a75f 100644
--- a/src/webviews/apps/plus/graph/graph.scss
+++ b/src/webviews/apps/plus/graph/graph.scss
@@ -908,13 +908,6 @@ button:not([disabled]),
 		}
 	}
 
-	&__group--last {
-		display: flex;
-		gap: 0.5rem;
-		flex-shrink: 0;
-		width: auto;
-	}
-
 	&,
 	&__row {
 		justify-content: space-between;
@@ -993,7 +986,7 @@ gl-feature-gate gl-feature-badge {
 	&__header {
 		flex: none;
 		z-index: 101;
-		width: fit-content;
+		// width: fit-content;
 		position: relative;
 	}
 

From 66a08e426db781e376fe1ae15bbb96b8942802ef Mon Sep 17 00:00:00 2001
From: Keith Daulton <keith.daulton@gitkraken.com>
Date: Wed, 2 Oct 2024 12:55:33 -0400
Subject: [PATCH 7/8] Fixes Command import

---
 src/webviews/apps/plus/graph/GraphWrapper.tsx | 28 +++++++++----------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/webviews/apps/plus/graph/GraphWrapper.tsx b/src/webviews/apps/plus/graph/GraphWrapper.tsx
index 26706979b4ec1..1149fa5e303d9 100644
--- a/src/webviews/apps/plus/graph/GraphWrapper.tsx
+++ b/src/webviews/apps/plus/graph/GraphWrapper.tsx
@@ -21,7 +21,7 @@ import React, { createElement, useEffect, useMemo, useRef, useState } from 'reac
 import type { ConnectCloudIntegrationsCommandArgs } from '../../../../commands/cloudIntegrations';
 import type { BranchGitCommandArgs } from '../../../../commands/git/branch';
 import type { DateStyle, GraphBranchesVisibility } from '../../../../config';
-import type { Commands } from '../../../../constants.commands';
+import { Commands } from '../../../../constants.commands';
 import type { SearchQuery } from '../../../../constants.search';
 import type { Subscription } from '../../../../plus/gk/account/subscription';
 import { isSubscriptionPaid } from '../../../../plus/gk/account/subscription';
@@ -1146,20 +1146,20 @@ export function GraphWrapper({
 						)}
 					</div>
 					<div className="titlebar__group">
-							<GlTooltip placement="bottom">
-								<a
-									className="action-button"
-									href={createCommandLink(Commands.GitCommandsBranch, {
-										args: {
-												state: {
-													subcommand: 'create',
-													reference: branch,
-												},
-												command: 'branch',
+						<GlTooltip placement="bottom">
+							<a
+								className="action-button"
+								href={createCommandLink(Commands.GitCommandsBranch, {
+									args: {
+										state: {
+											subcommand: 'create',
+											reference: branch,
+										},
+										command: 'branch',
 										confirm: true,
-											} satisfies BranchGitCommandArgs,
-										})}
-									>
+									} satisfies BranchGitCommandArgs,
+								})}
+							>
 								<span className="codicon codicon-custom-git-branch-create action-button__icon"></span>
 							</a>
 							<span slot="content">Create new branch</span>

From 1091131fd5733e70fbfdd760b4aa11d951c59f62 Mon Sep 17 00:00:00 2001
From: Eric Amodio <eamodio@gmail.com>
Date: Wed, 2 Oct 2024 17:26:38 -0400
Subject: [PATCH 8/8] Fixes command start & updates tooltip

---
 src/webviews/apps/plus/graph/GraphWrapper.tsx | 21 ++++++++++---------
 1 file changed, 11 insertions(+), 10 deletions(-)

diff --git a/src/webviews/apps/plus/graph/GraphWrapper.tsx b/src/webviews/apps/plus/graph/GraphWrapper.tsx
index 1149fa5e303d9..574c547f891ca 100644
--- a/src/webviews/apps/plus/graph/GraphWrapper.tsx
+++ b/src/webviews/apps/plus/graph/GraphWrapper.tsx
@@ -1149,20 +1149,21 @@ export function GraphWrapper({
 						<GlTooltip placement="bottom">
 							<a
 								className="action-button"
-								href={createCommandLink(Commands.GitCommandsBranch, {
-									args: {
-										state: {
-											subcommand: 'create',
-											reference: branch,
-										},
-										command: 'branch',
-										confirm: true,
-									} satisfies BranchGitCommandArgs,
+								href={createCommandLink<BranchGitCommandArgs>(Commands.GitCommandsBranch, {
+									state: {
+										subcommand: 'create',
+										reference: branch,
+									},
+									command: 'branch',
+									confirm: true,
 								})}
 							>
 								<span className="codicon codicon-custom-git-branch-create action-button__icon"></span>
 							</a>
-							<span slot="content">Create new branch</span>
+							<span slot="content">
+								Create New Branch from <span className="codicon codicon-git-branch"></span>
+								<span className="md-code">{branchName}</span>
+							</span>
 						</GlTooltip>
 						<GlTooltip placement="bottom">
 							<a