Skip to content

Commit 7f6a599

Browse files
d13d13
committed
Adds actions in Commit Graph for paused git operations
- moves GlMergeConflictWarning to shared - fixes header layout and adds ellipsis for repo name
1 parent 160ff65 commit 7f6a599

File tree

9 files changed

+175
-52
lines changed

9 files changed

+175
-52
lines changed

‎src/constants.commands.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -815,7 +815,11 @@ type GraphWebviewCommands = `graph.${
815815
| 'openWorktreeInNewWindow'
816816
| 'copyWorkingChangesToWorktree'
817817
| 'generateCommitMessage'
818-
| 'compareSelectedCommits.multi'}`;
818+
| 'compareSelectedCommits.multi'
819+
| 'skipPausedOperation'
820+
| 'continuePausedOperation'
821+
| 'abortPausedOperation'
822+
| 'openRebaseEditor'}`;
819823

820824
type TimelineWebviewCommands = `timeline.${'refresh' | 'split'}`;
821825

‎src/webviews/apps/plus/graph/GraphWrapper.tsx

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -93,6 +93,7 @@ import type {
9393
import type { DateTimeFormat } from '../../shared/date';
9494
import { formatDate, fromNow } from '../../shared/date';
9595
import { emitTelemetrySentEvent } from '../../shared/telemetry';
96+
import { GlMergeConflictWarning } from '../shared/components/merge-rebase-status.react';
9697
import { GitActionsButtons } from './actions/gitActionsButtons';
9798
import { GlGraphHover } from './hover/graphHover.react';
9899
import type { GraphMinimapDaySelectedEventDetail } from './minimap/minimap';
@@ -1138,7 +1139,9 @@ export function GraphWrapper({
11381139
disabled={repos.length < 2}
11391140
onClick={() => handleChooseRepository()}
11401141
>
1141-
{repo?.formattedName ?? 'none selected'}
1142+
<span className="action-button__truncated">
1143+
{repo?.formattedName ?? 'none selected'}
1144+
</span>
11421145
{repos.length > 1 && (
11431146
<CodeIcon className="action-button__more" icon="chevron-down" aria-hidden="true" />
11441147
)}
@@ -1298,6 +1301,21 @@ export function GraphWrapper({
12981301
)}
12991302
</div>
13001303
</div>
1304+
{allowed &&
1305+
workingTreeStats != null &&
1306+
(workingTreeStats.hasConflicts || workingTreeStats.pausedOpStatus) && (
1307+
<div className="merge-conflict-warning">
1308+
<GlMergeConflictWarning
1309+
className="merge-conflict-warning__content"
1310+
conflicts={workingTreeStats.hasConflicts}
1311+
pausedOpStatus={workingTreeStats.pausedOpStatus}
1312+
skipCommand="gitlens.graph.skipPausedOperation"
1313+
continueCommand="gitlens.graph.continuePausedOperation"
1314+
abortCommand="gitlens.graph.abortPausedOperation"
1315+
openEditorCommand="gitlens.graph.openRebaseEditor"
1316+
></GlMergeConflictWarning>
1317+
</div>
1318+
)}
13011319
{allowed && (
13021320
<div className="titlebar__row">
13031321
<div className="titlebar__group">

‎src/webviews/apps/plus/graph/graph.scss

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -883,7 +883,7 @@ button:not([disabled]),
883883
display: grid;
884884
grid-auto-flow: column;
885885
justify-content: start;
886-
grid-template-columns: minmax(min-content, 1fr) min-content;
886+
grid-template-columns: 1fr min-content;
887887
}
888888
}
889889

@@ -893,6 +893,10 @@ button:not([disabled]),
893893

894894
&__row--wrap &__group {
895895
white-space: nowrap;
896+
897+
&:nth-child(odd) {
898+
min-width: 0;
899+
}
896900
}
897901

898902
&__debugging {
@@ -1310,3 +1314,19 @@ sl-select:hover::part(combobox),
13101314
sl-select:focus::part(combobox) {
13111315
background-color: var(--color-graph-actionbar-selectedBackground);
13121316
}
1317+
1318+
.merge-conflict-warning {
1319+
flex: 0 0 100%;
1320+
min-width: 0;
1321+
1322+
// &__content {
1323+
// display: block;
1324+
// width: 100%;
1325+
// min-width: 0;
1326+
// max-width: fit-content;
1327+
// }
1328+
1329+
&__content::part(base) {
1330+
max-width: fit-content;
1331+
}
1332+
}

‎src/webviews/apps/plus/home/components/active-work.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ import '../../../shared/components/overlays/tooltip';
2626
import '../../../shared/components/pills/tracking';
2727
import '../../../shared/components/rich/issue-icon';
2828
import '../../../shared/components/rich/pr-icon';
29-
import './merge-rebase-status';
29+
import '../../shared/components/merge-rebase-status';
3030

3131
export const activeWorkTagName = 'gl-active-work';
3232

‎src/webviews/apps/plus/shared/components/merge-rebase-status.react.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import { reactWrapper } from '../../../shared/components/helpers/react-wrapper';
2+
import { GlMergeConflictWarning as GlMergeConflictWarningWC } from './merge-rebase-status';
3+
4+
export interface GlMergeConflictWarning extends GlMergeConflictWarningWC {}
5+
export const GlMergeConflictWarning = reactWrapper(GlMergeConflictWarningWC, { tagName: 'gl-merge-rebase-status' });

‎src/webviews/apps/plus/home/components/merge-rebase-status.ts renamed to ‎src/webviews/apps/plus/shared/components/merge-rebase-status.ts

Lines changed: 35 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { css, html, LitElement, nothing } from 'lit';
22
import { customElement, property } from 'lit/decorators.js';
33
import { when } from 'lit/directives/when.js';
4+
import type { Commands } from '../../../../../constants.commands';
45
import type { GitPausedOperationStatus } from '../../../../../git/models/pausedOperationStatus';
56
import { pausedOperationStatusStringsByType } from '../../../../../git/utils/pausedOperationStatus.utils';
67
import { createCommandLink } from '../../../../../system/commands';
@@ -14,9 +15,11 @@ export class GlMergeConflictWarning extends LitElement {
1415
static override styles = [
1516
css`
1617
.status {
18+
box-sizing: border-box;
1719
display: flex;
1820
align-items: center;
1921
gap: 0.6rem;
22+
width: 100%;
2023
max-width: 100%;
2124
margin-block: 0;
2225
background-color: var(--vscode-gitlens-decorations\\.statusMergingOrRebasingForegroundColor);
@@ -31,14 +34,16 @@ export class GlMergeConflictWarning extends LitElement {
3134
}
3235
3336
.label {
34-
flex-grow: 1;
37+
flex: 1;
38+
min-width: 0;
3539
white-space: nowrap;
3640
overflow: hidden;
3741
text-overflow: ellipsis;
3842
}
3943
4044
.icon,
41-
.steps {
45+
.steps,
46+
.actions {
4247
flex: none;
4348
}
4449
@@ -57,37 +62,41 @@ export class GlMergeConflictWarning extends LitElement {
5762
@property({ type: Object })
5863
pausedOpStatus?: GitPausedOperationStatus;
5964

65+
@property()
66+
skipCommand = 'gitlens.home.skipPausedOperation';
67+
68+
@property()
69+
continueCommand = 'gitlens.home.continuePausedOperation';
70+
71+
@property()
72+
abortCommand = 'gitlens.home.abortPausedOperation';
73+
74+
@property()
75+
openEditorCommand = 'gitlens.home.openRebaseEditor';
76+
6077
private get onSkipUrl() {
61-
return createCommandLink('gitlens.home.skipPausedOperation', {
62-
operation: this.pausedOpStatus,
63-
});
78+
return createCommandLink(this.skipCommand as Commands, this.pausedOpStatus);
6479
}
6580

6681
private get onContinueUrl() {
67-
return createCommandLink('gitlens.home.continuePausedOperation', {
68-
operation: this.pausedOpStatus,
69-
});
82+
return createCommandLink(this.continueCommand as Commands, this.pausedOpStatus);
7083
}
7184

7285
private get onAbortUrl() {
73-
return createCommandLink('gitlens.home.abortPausedOperation', {
74-
operation: this.pausedOpStatus,
75-
});
86+
return createCommandLink(this.abortCommand as Commands, this.pausedOpStatus);
7687
}
7788

7889
private get onOpenEditorUrl() {
79-
return createCommandLink('gitlens.home.openRebaseEditor', {
80-
operation: this.pausedOpStatus,
81-
});
90+
return createCommandLink(this.openEditorCommand as Commands, this.pausedOpStatus);
8291
}
8392

8493
override render() {
8594
if (this.pausedOpStatus == null) return nothing;
8695

8796
return html`
88-
<span class="status">
97+
<span class="status" part="base">
8998
<code-icon icon="warning" class="icon"></code-icon>
90-
${this.renderStatus(this.pausedOpStatus)}
99+
${this.renderStatus(this.pausedOpStatus)}${this.renderActions()}
91100
</span>
92101
`;
93102
}
@@ -96,15 +105,14 @@ export class GlMergeConflictWarning extends LitElement {
96105
if (pausedOpStatus.type !== 'rebase') {
97106
const strings = pausedOperationStatusStringsByType[pausedOpStatus.type];
98107
return html`<span class="label"
99-
>${this.conflicts ? strings.conflicts : strings.label}
100-
<code-icon
101-
icon="${pausedOpStatus.incoming.refType === 'branch' ? 'git-branch' : 'git-commit'}"
102-
class="icon"
103-
></code-icon>
104-
${getReferenceLabel(pausedOpStatus.incoming, { expand: false, icon: false })}
105-
${strings.directionality}
106-
${getReferenceLabel(pausedOpStatus.current, { expand: false, icon: false })}</span
107-
>${this.renderActions()}`;
108+
>${this.conflicts ? strings.conflicts : strings.label}
109+
<code-icon
110+
icon="${pausedOpStatus.incoming.refType === 'branch' ? 'git-branch' : 'git-commit'}"
111+
class="icon"
112+
></code-icon>
113+
${getReferenceLabel(pausedOpStatus.incoming, { expand: false, icon: false })} ${strings.directionality}
114+
${getReferenceLabel(pausedOpStatus.current, { expand: false, icon: false })}</span
115+
>`;
108116
}
109117

110118
const started = pausedOpStatus.steps.total > 0;
@@ -124,15 +132,15 @@ export class GlMergeConflictWarning extends LitElement {
124132
? html`<span class="steps"
125133
>(${pausedOpStatus.steps.current.number}/${pausedOpStatus.steps.total})</span
126134
>`
127-
: nothing}${this.renderActions()}`;
135+
: nothing}`;
128136
}
129137

130138
private renderActions() {
131139
if (this.pausedOpStatus == null) return nothing;
132140

133141
const status = this.pausedOpStatus.type;
134142

135-
return html`<action-nav>
143+
return html`<action-nav class="actions">
136144
${when(
137145
status !== 'revert' && !(status === 'rebase' && this.conflicts),
138146
() => html`

‎src/webviews/home/homeWebview.ts

Lines changed: 10 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -115,9 +115,6 @@ interface BranchRef {
115115
repoPath: string;
116116
branchId: string;
117117
}
118-
interface GitPausedOperationCommandArgs {
119-
operation: GitPausedOperationStatus;
120-
}
121118

122119
// type AutolinksInfo = Awaited<GetOverviewBranch['autolinks']>;
123120
type BranchMergeTargetStatusInfo = Awaited<GetOverviewBranch['mergeTarget']>;
@@ -462,8 +459,8 @@ export class HomeWebviewProvider implements WebviewProvider<State, State, HomeWe
462459
});
463460
}
464461

465-
private async abortPausedOperation(pausedOpArgs: GitPausedOperationCommandArgs) {
466-
const abortPausedOperation = this.container.git.status(pausedOpArgs.operation.repoPath).abortPausedOperation;
462+
private async abortPausedOperation(pausedOpArgs: GitPausedOperationStatus) {
463+
const abortPausedOperation = this.container.git.status(pausedOpArgs.repoPath).abortPausedOperation;
467464
if (abortPausedOperation == null) return;
468465

469466
try {
@@ -473,12 +470,10 @@ export class HomeWebviewProvider implements WebviewProvider<State, State, HomeWe
473470
}
474471
}
475472

476-
private async continuePausedOperation(pausedOpArgs: GitPausedOperationCommandArgs) {
477-
if (pausedOpArgs.operation.type === 'revert') return;
473+
private async continuePausedOperation(pausedOpArgs: GitPausedOperationStatus) {
474+
if (pausedOpArgs.type === 'revert') return;
478475

479-
const continuePausedOperation = this.container.git.status(
480-
pausedOpArgs.operation.repoPath,
481-
).continuePausedOperation;
476+
const continuePausedOperation = this.container.git.status(pausedOpArgs.repoPath).continuePausedOperation;
482477
if (continuePausedOperation == null) return;
483478

484479
try {
@@ -488,10 +483,8 @@ export class HomeWebviewProvider implements WebviewProvider<State, State, HomeWe
488483
}
489484
}
490485

491-
private async skipPausedOperation(pausedOpArgs: GitPausedOperationCommandArgs) {
492-
const continuePausedOperation = this.container.git.status(
493-
pausedOpArgs.operation.repoPath,
494-
).continuePausedOperation;
486+
private async skipPausedOperation(pausedOpArgs: GitPausedOperationStatus) {
487+
const continuePausedOperation = this.container.git.status(pausedOpArgs.repoPath).continuePausedOperation;
495488
if (continuePausedOperation == null) return;
496489

497490
try {
@@ -501,10 +494,10 @@ export class HomeWebviewProvider implements WebviewProvider<State, State, HomeWe
501494
}
502495
}
503496

504-
private async openRebaseEditor(pausedOpArgs: GitPausedOperationCommandArgs) {
505-
if (pausedOpArgs.operation.type !== 'rebase') return;
497+
private async openRebaseEditor(pausedOpArgs: GitPausedOperationStatus) {
498+
if (pausedOpArgs.type !== 'rebase') return;
506499

507-
const gitDir = await this.container.git.getGitDir(pausedOpArgs.operation.repoPath);
500+
const gitDir = await this.container.git.getGitDir(pausedOpArgs.repoPath);
508501
if (gitDir == null) return;
509502

510503
const rebaseTodoUri = Uri.joinPath(gitDir.uri, 'rebase-merge', 'git-rebase-todo');

0 commit comments

Comments
 (0)