Skip to content

Commit 25dbeac

Browse files
d13d13
committed
Splits home overview state by active and inactive branches
1 parent 21a6359 commit 25dbeac

File tree

6 files changed

+332
-272
lines changed

6 files changed

+332
-272
lines changed

‎src/webviews/apps/home/home.ts

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,12 @@ import { customElement, query } from 'lit/decorators.js';
66
import { when } from 'lit/directives/when.js';
77
import type { State } from '../../home/protocol';
88
import { DidFocusAccount } from '../../home/protocol';
9-
import { OverviewState, overviewStateContext } from '../plus/home/components/overviewState';
9+
import {
10+
ActiveOverviewState,
11+
activeOverviewStateContext,
12+
InactiveOverviewState,
13+
inactiveOverviewStateContext,
14+
} from '../plus/home/components/overviewState';
1015
import type { GLHomeHeader } from '../plus/shared/components/home-header';
1116
import { GlApp } from '../shared/app';
1217
import { scrollableBase } from '../shared/components/styles/lit/base.css';
@@ -27,16 +32,20 @@ import './components/repo-alerts';
2732
export class GlHomeApp extends GlApp<State> {
2833
static override styles = [homeBaseStyles, scrollableBase, homeStyles];
2934

30-
@provide({ context: overviewStateContext })
31-
private _overviewState!: OverviewState;
35+
@provide({ context: activeOverviewStateContext })
36+
private _activeOverviewState!: ActiveOverviewState;
37+
38+
@provide({ context: inactiveOverviewStateContext })
39+
private _inactiveOverviewState!: InactiveOverviewState;
3240

3341
@query('gl-home-header')
3442
private _header!: GLHomeHeader;
3543

3644
private badgeSource = { source: 'home', detail: 'badge' };
3745

3846
protected override createStateProvider(state: State, ipc: HostIpc): HomeStateProvider {
39-
this.disposables.push((this._overviewState = new OverviewState(ipc)));
47+
this.disposables.push((this._activeOverviewState = new ActiveOverviewState(ipc)));
48+
this.disposables.push((this._inactiveOverviewState = new InactiveOverviewState(ipc)));
4049

4150
return new HomeStateProvider(this, state, ipc);
4251
}

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

Lines changed: 15 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@ import { ifDefined } from 'lit/directives/if-defined.js';
77
import { when } from 'lit/directives/when.js';
88
import { createCommandLink } from '../../../../../system/commands';
99
import { createWebviewCommandLink } from '../../../../../system/webview';
10-
import type { GetOverviewBranch, OpenInGraphParams, State } from '../../../../home/protocol';
10+
import type { GetActiveOverviewResponse, GetOverviewBranch, OpenInGraphParams, State } from '../../../../home/protocol';
1111
import { stateContext } from '../../../home/context';
1212
import { linkStyles } from '../../shared/components/vscode.css';
1313
import { branchCardStyles, GlBranchCardBase } from './branch-card';
14-
import type { Overview, OverviewState } from './overviewState';
15-
import { overviewStateContext } from './overviewState';
14+
import type { ActiveOverviewState } from './overviewState';
15+
import { activeOverviewStateContext } from './overviewState';
1616
import '../../../shared/components/button';
1717
import '../../../shared/components/code-icon';
1818
import '../../../shared/components/skeleton-loader';
@@ -62,14 +62,14 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
6262
@state()
6363
private _homeState!: State;
6464

65-
@consume({ context: overviewStateContext })
66-
private _overviewState!: OverviewState;
65+
@consume({ context: activeOverviewStateContext })
66+
private _activeOverviewState!: ActiveOverviewState;
6767

6868
override connectedCallback(): void {
6969
super.connectedCallback();
7070

7171
if (this._homeState.repositories.openCount > 0) {
72-
this._overviewState.run();
72+
this._activeOverviewState.run();
7373
}
7474
}
7575

@@ -82,7 +82,7 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
8282
return nothing;
8383
}
8484

85-
return this._overviewState.render({
85+
return this._activeOverviewState.render({
8686
pending: () => this.renderPending(),
8787
complete: overview => this.renderComplete(overview),
8888
error: () => html`<span>Error</span>`,
@@ -99,16 +99,16 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
9999
}
100100

101101
private renderPending() {
102-
if (this._overviewState.state == null) {
102+
if (this._activeOverviewState.state == null) {
103103
return this.renderLoader();
104104
}
105-
return this.renderComplete(this._overviewState.state, true);
105+
return this.renderComplete(this._activeOverviewState.state, true);
106106
}
107107

108-
private renderComplete(overview: Overview, isFetching = false) {
108+
private renderComplete(overview: GetActiveOverviewResponse, isFetching = false) {
109109
const repo = overview?.repository;
110-
const activeBranches = repo?.branches?.active;
111-
if (!activeBranches) return html`<span>None</span>`;
110+
const activeBranch = overview?.active;
111+
if (!repo || !activeBranch) return html`<span>None</span>`;
112112

113113
return html`
114114
<gl-section ?loading=${isFetching}>
@@ -138,7 +138,7 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
138138
tooltip="Open in Commit Graph"
139139
href=${createCommandLink('gitlens.home.openInGraph', {
140140
type: 'repo',
141-
repoPath: this._overviewState.state!.repository.path,
141+
repoPath: this._activeOverviewState.state!.repository.path,
142142
} satisfies OpenInGraphParams)}
143143
><code-icon icon="gl-graph"></code-icon
144144
></gl-button>
@@ -152,9 +152,7 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
152152
><code-icon icon="repo-fetch"></code-icon
153153
></gl-button>
154154
</span>
155-
${activeBranches.map(branch => {
156-
return this.renderRepoBranchCard(branch, repo.path, isFetching);
157-
})}
155+
${this.renderRepoBranchCard(activeBranch, repo.path, isFetching)}
158156
</gl-section>
159157
`;
160158
}
@@ -191,7 +189,7 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
191189
}
192190

193191
private onChange(_e: MouseEvent) {
194-
void this._overviewState.changeRepository();
192+
this._activeOverviewState.changeRepository();
195193
}
196194
}
197195

‎src/webviews/apps/plus/home/components/overview.ts

Lines changed: 17 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,17 @@ import { SignalWatcher } from '@lit-labs/signals';
33
import { css, html, LitElement, nothing } from 'lit';
44
import { customElement, state } from 'lit/decorators.js';
55
import { when } from 'lit/directives/when.js';
6-
import type { GetOverviewResponse, OverviewRecentThreshold, State } from '../../../../home/protocol';
6+
import type { GetInactiveOverviewResponse, OverviewRecentThreshold, State } from '../../../../home/protocol';
77
import { SetOverviewFilter } from '../../../../home/protocol';
88
import { stateContext } from '../../../home/context';
99
import { ipcContext } from '../../../shared/context';
1010
import type { HostIpc } from '../../../shared/ipc';
1111
import { linkStyles } from '../../shared/components/vscode.css';
12-
import type { OverviewState } from './overviewState';
13-
import { overviewStateContext } from './overviewState';
12+
import type { InactiveOverviewState } from './overviewState';
13+
import { inactiveOverviewStateContext } from './overviewState';
1414
import '../../../shared/components/skeleton-loader';
1515
import './branch-threshold-filter';
1616

17-
type Overview = GetOverviewResponse;
18-
1917
export const overviewTagName = 'gl-overview';
2018

2119
@customElement(overviewTagName)
@@ -35,14 +33,14 @@ export class GlOverview extends SignalWatcher(LitElement) {
3533
@state()
3634
private _homeState!: State;
3735

38-
@consume({ context: overviewStateContext })
39-
private _overviewState!: OverviewState;
36+
@consume({ context: inactiveOverviewStateContext })
37+
private _inactiveOverviewState!: InactiveOverviewState;
4038

4139
override connectedCallback(): void {
4240
super.connectedCallback();
4341

4442
if (this._homeState.repositories.openCount > 0) {
45-
this._overviewState.run();
43+
this._inactiveOverviewState.run();
4644
}
4745
}
4846

@@ -55,7 +53,7 @@ export class GlOverview extends SignalWatcher(LitElement) {
5553
return nothing;
5654
}
5755

58-
return this._overviewState.render({
56+
return this._inactiveOverviewState.render({
5957
pending: () => this.renderPending(),
6058
complete: summary => this.renderComplete(summary),
6159
error: () => html`<span>Error</span>`,
@@ -72,34 +70,34 @@ export class GlOverview extends SignalWatcher(LitElement) {
7270
}
7371

7472
private renderPending() {
75-
if (this._overviewState.state == null) {
73+
if (this._inactiveOverviewState.state == null) {
7674
return this.renderLoader();
7775
}
78-
return this.renderComplete(this._overviewState.state, true);
76+
return this.renderComplete(this._inactiveOverviewState.state, true);
7977
}
8078

8179
@consume({ context: ipcContext })
8280
private readonly _ipc!: HostIpc;
8381

8482
private onChangeRecentThresholdFilter(e: CustomEvent<{ threshold: OverviewRecentThreshold }>) {
85-
if (!this._overviewState.filter.stale || !this._overviewState.filter.recent) {
83+
if (!this._inactiveOverviewState.filter.stale || !this._inactiveOverviewState.filter.recent) {
8684
return;
8785
}
8886
this._ipc.sendCommand(SetOverviewFilter, {
89-
stale: this._overviewState.filter.stale,
90-
recent: { ...this._overviewState.filter.recent, threshold: e.detail.threshold },
87+
stale: this._inactiveOverviewState.filter.stale,
88+
recent: { ...this._inactiveOverviewState.filter.recent, threshold: e.detail.threshold },
9189
});
9290
}
9391

94-
private renderComplete(overview: Overview, isFetching = false) {
92+
private renderComplete(overview: GetInactiveOverviewResponse, isFetching = false) {
9593
if (overview == null) return nothing;
9694
const { repository } = overview;
9795
return html`
9896
<gl-branch-section
9997
label="recent"
10098
.isFetching=${isFetching}
10199
.repo=${repository.path}
102-
.branches=${repository.branches.recent}
100+
.branches=${overview.recent}
103101
>
104102
<gl-branch-threshold-filter
105103
slot="heading-actions"
@@ -113,16 +111,16 @@ export class GlOverview extends SignalWatcher(LitElement) {
113111
label: string;
114112
}[]}
115113
.disabled=${isFetching}
116-
.value=${this._overviewState.filter.recent?.threshold}
114+
.value=${this._inactiveOverviewState.filter.recent?.threshold}
117115
></gl-branch-threshold-filter>
118116
</gl-branch-section>
119117
${when(
120-
this._overviewState.filter.stale?.show === true,
118+
this._inactiveOverviewState.filter.stale?.show === true && overview.stale,
121119
() => html`
122120
<gl-branch-section
123121
label="stale"
124122
.repo=${repository.path}
125-
.branches=${repository.branches.stale}
123+
.branches=${overview.stale!}
126124
></gl-branch-section>
127125
`,
128126
)}

‎src/webviews/apps/plus/home/components/overviewState.ts

Lines changed: 56 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,39 @@
11
import { createContext } from '@lit/context';
22
import { signalObject } from 'signal-utils/object';
3-
import type { GetOverviewResponse, OverviewFilters } from '../../../../home/protocol';
3+
import type {
4+
GetActiveOverviewResponse,
5+
GetInactiveOverviewResponse,
6+
OverviewFilters,
7+
} from '../../../../home/protocol';
48
import {
5-
ChangeOverviewRepository,
9+
ChangeOverviewRepositoryCommand,
610
DidChangeOverviewFilter,
11+
DidChangeOverviewRepository,
712
DidChangeRepositories,
813
DidChangeRepositoryWip,
9-
GetOverview,
14+
GetActiveOverview,
15+
GetInactiveOverview,
1016
GetOverviewFilterState,
1117
} from '../../../../home/protocol';
1218
import { AsyncComputedState } from '../../../shared/components/signal-utils';
1319
import type { Disposable } from '../../../shared/events';
1420
import type { HostIpc } from '../../../shared/ipc';
1521

16-
export type Overview = GetOverviewResponse;
22+
export type ActiveOverview = GetActiveOverviewResponse;
23+
export type InactiveOverview = GetInactiveOverviewResponse;
1724

18-
export class OverviewState extends AsyncComputedState<Overview> {
25+
export class ActiveOverviewState extends AsyncComputedState<ActiveOverview> {
1926
private readonly _disposable: Disposable | undefined;
2027

2128
constructor(
2229
private readonly _ipc: HostIpc,
2330
options?: {
2431
runImmediately?: boolean;
25-
initial?: Overview;
32+
initial?: ActiveOverview;
2633
},
2734
) {
2835
super(async _abortSignal => {
29-
const rsp: Overview = await this._ipc.sendRequest(GetOverview, {});
30-
36+
const rsp: ActiveOverview = await this._ipc.sendRequest(GetActiveOverview, undefined);
3137
return rsp;
3238
}, options);
3339

@@ -39,11 +45,51 @@ export class OverviewState extends AsyncComputedState<Overview> {
3945
case DidChangeRepositoryWip.is(msg):
4046
this.run(true);
4147
break;
48+
case DidChangeOverviewRepository.is(msg):
49+
this.run(true);
50+
break;
51+
}
52+
});
53+
}
54+
55+
dispose() {
56+
this._disposable?.dispose();
57+
}
58+
59+
changeRepository(): void {
60+
this._ipc.sendCommand(ChangeOverviewRepositoryCommand, undefined);
61+
}
62+
}
63+
64+
export class InactiveOverviewState extends AsyncComputedState<InactiveOverview> {
65+
private readonly _disposable: Disposable | undefined;
66+
filter = signalObject<Partial<OverviewFilters>>({});
67+
68+
constructor(
69+
private readonly _ipc: HostIpc,
70+
options?: {
71+
runImmediately?: boolean;
72+
initial?: InactiveOverview;
73+
},
74+
) {
75+
super(async _abortSignal => {
76+
const rsp: InactiveOverview = await this._ipc.sendRequest(GetInactiveOverview, undefined);
77+
return rsp;
78+
}, options);
79+
80+
this._disposable = this._ipc.onReceiveMessage(msg => {
81+
switch (true) {
82+
case DidChangeRepositories.is(msg):
83+
this.run(true);
84+
break;
4285
case DidChangeOverviewFilter.is(msg):
4386
this.filter.recent = msg.params.filter.recent;
4487
this.filter.stale = msg.params.filter.stale;
4588
this.run(true);
4689
break;
90+
case DidChangeOverviewRepository.is(msg):
91+
this.run(true);
92+
break;
4793
}
4894
});
4995
void this._ipc.sendRequest(GetOverviewFilterState, undefined).then(rsp => {
@@ -55,13 +101,7 @@ export class OverviewState extends AsyncComputedState<Overview> {
55101
dispose(): void {
56102
this._disposable?.dispose();
57103
}
58-
59-
filter = signalObject<Partial<OverviewFilters>>({});
60-
61-
async changeRepository(): Promise<void> {
62-
await this._ipc.sendRequest(ChangeOverviewRepository, undefined);
63-
this.run(true);
64-
}
65104
}
66105

67-
export const overviewStateContext = createContext<Overview>('overviewState');
106+
export const activeOverviewStateContext = createContext<ActiveOverview>('activeOverviewState');
107+
export const inactiveOverviewStateContext = createContext<InactiveOverview>('inactiveOverviewState');

0 commit comments

Comments
 (0)