Skip to content

Commit a70e2b9

Browse files
committed
Adds Working Changes tab to Commit/Graph Details
- Adds stage/unstage support
1 parent e19b9cf commit a70e2b9

File tree

17 files changed

+1727
-944
lines changed

17 files changed

+1727
-944
lines changed

CHANGELOG.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/) and this p
88

99
### Added
1010

11+
- Adds a _Working Changes_ tab to the _Commit Details_ and _Graph Details_ views to show your working tree changes
12+
- Adds _Stage Changes_ and _Unstage Changes_ commands to files on the _Working Changes_ tab
1113
- Adds a _[Show|Hide] Merge Commits_ toggle to the _File History_ view — closes [#2104](https://github.com/gitkraken/vscode-gitlens/issues/2104) & [#2944](https://github.com/gitkraken/vscode-gitlens/issues/2944)
1214
- Adds a `gitlens.advanced.fileHistoryShowMergeCommits` setting to specify whether merge commits will be show in file histories
1315
- Adds deep link support for workspaces in the _GitKraken Workspaces_ view

src/trackers/gitLineTracker.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export class GitLineTracker extends LineTracker<GitLineState> {
3131
updated = await this.updateState(e.selections, e.editor);
3232
}
3333

34-
super.fireLinesChanged(updated ? e : { ...e, selections: undefined });
34+
super.fireLinesChanged(updated ? e : { ...e, selections: undefined, suspended: this.suspended });
3535
}
3636

3737
private _subscriptionOnlyWhenActive: Disposable | undefined;

src/trackers/lineTracker.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ export interface LinesChangeEvent {
1313

1414
readonly reason: 'editor' | 'selection';
1515
readonly pending?: boolean;
16+
readonly suspended?: boolean;
1617
}
1718

1819
export interface LineSelection {

src/webviews/apps/commitDetails/commitDetails.scss

Lines changed: 96 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,24 @@
55
--gitlens-scrollbar-gutter-width: 10px;
66
}
77

8+
.vscode-high-contrast,
9+
.vscode-dark {
10+
--color-background--level-05: var(--color-background--lighten-05);
11+
--color-background--level-075: var(--color-background--lighten-075);
12+
--color-background--level-10: var(--color-background--lighten-10);
13+
--color-background--level-15: var(--color-background--lighten-15);
14+
--color-background--level-30: var(--color-background--lighten-30);
15+
}
16+
17+
.vscode-high-contrast-light,
18+
.vscode-light {
19+
--color-background--level-05: var(--color-background--darken-05);
20+
--color-background--level-075: var(--color-background--darken-075);
21+
--color-background--level-10: var(--color-background--darken-10);
22+
--color-background--level-15: var(--color-background--darken-15);
23+
--color-background--level-30: var(--color-background--darken-30);
24+
}
25+
826
// generic resets
927
html {
1028
font-size: 62.5%;
@@ -19,6 +37,9 @@ html {
1937
}
2038

2139
body {
40+
--gk-badge-outline-color: var(--vscode-badge-foreground);
41+
--gk-badge-filled-background-color: var(--vscode-badge-background);
42+
--gk-badge-filled-color: var(--vscode-badge-foreground);
2243
font-family: var(--font-family);
2344
font-size: var(--font-size);
2445
color: var(--color-foreground);
@@ -250,13 +271,6 @@ ul {
250271
margin-bottom: 1rem;
251272
}
252273

253-
.gl-actionbar {
254-
}
255-
.gl-actionbar__group {
256-
}
257-
.gl-action {
258-
}
259-
260274
.message-block {
261275
font-size: 1.3rem;
262276
border: 1px solid var(--vscode-input-border);
@@ -305,6 +319,14 @@ ul {
305319
flex: none;
306320
}
307321

322+
&--highlight {
323+
margin-left: 0.25em;
324+
padding: 0 4px 2px 4px;
325+
border: 1px solid var(--color-background--level-15);
326+
border-radius: 0.3rem;
327+
font-family: var(--vscode-editor-font-family);
328+
}
329+
308330
&.is-pinned {
309331
background-color: var(--color-alert-warningBackground);
310332
box-shadow: 0 0 0 0.1rem var(--color-alert-warningBorder);
@@ -378,3 +400,70 @@ ul {
378400
}
379401
}
380402
}
403+
404+
.wip-details {
405+
display: flex;
406+
padding: 0.4rem 0.8rem;
407+
background: var(--color-alert-infoBackground);
408+
border-left: 0.3rem solid var(--color-alert-infoBorder);
409+
align-items: center;
410+
justify-content: space-between;
411+
412+
.wip-changes {
413+
display: inline-flex;
414+
align-items: baseline;
415+
}
416+
417+
.wip-branch {
418+
display: inline-block;
419+
padding: 0 0.3rem 0.2rem;
420+
margin-left: 0.4rem;
421+
// background: var(--color-background--level-05);
422+
border: 1px solid var(--color-foreground--50);
423+
border-radius: 0.3rem;
424+
}
425+
426+
gl-button {
427+
padding: 0.2rem 0.8rem;
428+
opacity: 0.8;
429+
}
430+
}
431+
432+
.details-tab {
433+
display: flex;
434+
justify-content: stretch;
435+
align-items: center;
436+
margin-bottom: 0.4rem;
437+
gap: 0.2rem;
438+
439+
& > * {
440+
flex: 1;
441+
}
442+
443+
&__item {
444+
appearance: none;
445+
padding: 0.4rem;
446+
color: var(--color-foreground--85);
447+
background-color: transparent;
448+
border: none;
449+
border-bottom: 0.2rem solid transparent;
450+
cursor: pointer;
451+
// background-color: #00000030;
452+
line-height: 1.8rem;
453+
454+
gk-badge {
455+
line-height: 1.36rem;
456+
}
457+
458+
&:hover {
459+
color: var(--color-foreground);
460+
// background-color: var(--vscode-button-hoverBackground);
461+
background-color: #00000020;
462+
}
463+
464+
&.is-active {
465+
color: var(--color-foreground);
466+
border-bottom-color: var(--vscode-button-hoverBackground);
467+
}
468+
}
469+
}

src/webviews/apps/commitDetails/commitDetails.ts

Lines changed: 48 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
/*global*/
22
import type { ViewFilesLayout } from '../../../config';
33
import type { Serialized } from '../../../system/serialize';
4-
import type { CommitActionsParams, State } from '../../commitDetails/protocol';
4+
import type { CommitActionsParams, Mode, State } from '../../commitDetails/protocol';
55
import {
66
AutolinkSettingsCommandType,
77
CommitActionsCommandType,
88
DidChangeNotificationType,
9-
DidExplainCommitCommandType,
10-
ExplainCommitCommandType,
9+
DidChangeWipStateNotificationType,
10+
DidExplainCommandType,
11+
ExplainCommandType,
1112
FileActionsCommandType,
1213
NavigateCommitCommandType,
1314
OpenFileCommandType,
@@ -16,8 +17,11 @@ import {
1617
OpenFileOnRemoteCommandType,
1718
PickCommitCommandType,
1819
PinCommitCommandType,
19-
PreferencesCommandType,
2020
SearchCommitCommandType,
21+
StageFileCommandType,
22+
SwitchModeCommandType,
23+
UnstageFileCommandType,
24+
UpdatePreferencesCommandType,
2125
} from '../../commitDetails/protocol';
2226
import type { IpcMessage } from '../../protocol';
2327
import { ExecuteCommandType, onIpc } from '../../protocol';
@@ -44,7 +48,7 @@ import './components/commit-details-app';
4448

4549
export const uncommittedSha = '0000000000000000000000000000000000000000';
4650

47-
export type CommitState = SomeNonNullable<Serialized<State>, 'selected'>;
51+
export type CommitState = SomeNonNullable<Serialized<State>, 'commit'>;
4852
export class CommitDetailsApp extends App<Serialized<State>> {
4953
constructor() {
5054
super('CommitDetailsApp');
@@ -71,8 +75,16 @@ export class CommitDetailsApp extends App<Serialized<State>> {
7175
DOM.on<FileChangeListItem, FileChangeListItemDetail>('file-change-list-item', 'file-more-actions', e =>
7276
this.onFileMoreActions(e.detail),
7377
),
78+
DOM.on<FileChangeListItem, FileChangeListItemDetail>('file-change-list-item', 'file-stage', e =>
79+
this.onStageFile(e.detail),
80+
),
81+
DOM.on<FileChangeListItem, FileChangeListItemDetail>('file-change-list-item', 'file-unstage', e =>
82+
this.onUnstageFile(e.detail),
83+
),
7484
DOM.on('[data-action="commit-actions"]', 'click', e => this.onCommitActions(e)),
7585
DOM.on('[data-action="pick-commit"]', 'click', e => this.onPickCommit(e)),
86+
DOM.on('[data-action="wip"]', 'click', e => this.onSwitchMode(e, 'wip')),
87+
DOM.on('[data-action="details"]', 'click', e => this.onSwitchMode(e, 'commit')),
7688
DOM.on('[data-action="search-commit"]', 'click', e => this.onSearchCommit(e)),
7789
DOM.on('[data-action="autolink-settings"]', 'click', e => this.onAutolinkSettings(e)),
7890
DOM.on('[data-action="files-layout"]', 'click', e => this.onToggleFilesLayout(e)),
@@ -129,6 +141,14 @@ export class CommitDetailsApp extends App<Serialized<State>> {
129141
});
130142
break;
131143

144+
case DidChangeWipStateNotificationType.method:
145+
onIpc(DidChangeWipStateNotificationType, msg, params => {
146+
this.state = { ...this.state, ...params };
147+
this.setState(this.state);
148+
this.attachState();
149+
});
150+
break;
151+
132152
default:
133153
super.onMessageReceived?.(e);
134154
}
@@ -147,19 +167,14 @@ export class CommitDetailsApp extends App<Serialized<State>> {
147167

148168
async onExplainCommit(_e: MouseEvent) {
149169
try {
150-
const result = await this.sendCommandWithCompletion(
151-
ExplainCommitCommandType,
152-
undefined,
153-
DidExplainCommitCommandType,
154-
);
170+
const result = await this.sendCommandWithCompletion(ExplainCommandType, undefined, DidExplainCommandType);
155171

156172
if (result.error) {
157173
this.component.explain = { error: { message: result.error.message ?? 'Error retrieving content' } };
158174
} else if (result.summary) {
159175
this.component.explain = { summary: result.summary };
160176
} else {
161177
this.component.explain = undefined;
162-
this.component.explainBusy = false;
163178
}
164179
} catch (ex) {
165180
this.component.explain = { error: { message: 'Error retrieving content' } };
@@ -173,24 +188,19 @@ export class CommitDetailsApp extends App<Serialized<State>> {
173188
const files = {
174189
...this.state.preferences?.files,
175190
layout: layout ?? 'auto',
176-
compact: this.state.preferences?.files?.compact ?? true,
177-
threshold: this.state.preferences?.files?.threshold ?? 5,
178-
icon: this.state.preferences?.files?.icon ?? 'type',
179191
};
180192

181193
this.state = { ...this.state, preferences: { ...this.state.preferences, files: files } };
182194
this.attachState();
183195

184-
this.sendCommand(PreferencesCommandType, { files: files });
196+
this.sendCommand(UpdatePreferencesCommandType, { files: files });
185197
}
186198

187199
private onExpandedChange(e: WebviewPaneExpandedChangeEventDetail) {
188-
this.state.preferences = {
189-
...this.state.preferences,
190-
autolinksExpanded: e.expanded,
191-
};
200+
this.state = { ...this.state, preferences: { ...this.state.preferences, autolinksExpanded: e.expanded } };
201+
this.attachState();
192202

193-
this.sendCommand(PreferencesCommandType, { autolinksExpanded: e.expanded });
203+
this.sendCommand(UpdatePreferencesCommandType, { autolinksExpanded: e.expanded });
194204
}
195205

196206
private onNavigate(direction: 'back' | 'forward', e: Event) {
@@ -208,12 +218,19 @@ export class CommitDetailsApp extends App<Serialized<State>> {
208218
this.sendCommand(AutolinkSettingsCommandType, undefined);
209219
}
210220

221+
private onPickCommit(_e: MouseEvent) {
222+
this.sendCommand(PickCommitCommandType, undefined);
223+
}
224+
211225
private onSearchCommit(_e: MouseEvent) {
212226
this.sendCommand(SearchCommitCommandType, undefined);
213227
}
214228

215-
private onPickCommit(_e: MouseEvent) {
216-
this.sendCommand(PickCommitCommandType, undefined);
229+
private onSwitchMode(_e: MouseEvent, mode: Mode) {
230+
this.state = { ...this.state, mode: mode };
231+
this.attachState();
232+
233+
this.sendCommand(SwitchModeCommandType, { mode: mode, repoPath: this.state.commit?.repoPath });
217234
}
218235

219236
private onOpenFileOnRemote(e: FileChangeListItemDetail) {
@@ -236,9 +253,17 @@ export class CommitDetailsApp extends App<Serialized<State>> {
236253
this.sendCommand(FileActionsCommandType, e);
237254
}
238255

256+
onStageFile(e: FileChangeListItemDetail): void {
257+
this.sendCommand(StageFileCommandType, e);
258+
}
259+
260+
onUnstageFile(e: FileChangeListItemDetail): void {
261+
this.sendCommand(UnstageFileCommandType, e);
262+
}
263+
239264
private onCommitActions(e: MouseEvent) {
240265
e.preventDefault();
241-
if (this.state.selected === undefined) {
266+
if (this.state.commit === undefined) {
242267
e.stopPropagation();
243268
return;
244269
}

0 commit comments

Comments
 (0)