diff --git a/src/webviews/apps/home/components/preview-banner.ts b/src/webviews/apps/home/components/preview-banner.ts
index edde5782b74ce..8a501394d2033 100644
--- a/src/webviews/apps/home/components/preview-banner.ts
+++ b/src/webviews/apps/home/components/preview-banner.ts
@@ -66,28 +66,18 @@ export class GlPreviewBanner extends LitElement {
private _button!: HTMLButtonElement;
override render() {
- if (this._state.previewEnabled === true) {
+ if (this._state.previewEnabled !== true) {
return html`
-
- Welcome to the new Home View!
-
- We're reinventing GitLens' Home to be a more helpful daily workflow tool. We'll continue to
- refine this view and welcome your
- feedback .
+
+ this.togglePreview()}>
+ New Home View
+
+
+ Switch to the new Home View!
+ We're reimagining GitLens' Home to be a more helpful daily workflow tool. We'll continue to
+ refine this view and welcome your feedback.
-
- this.togglePreview()} full
- > Revert to Old Home View
-
- this.onClose()}
- >
-
+
`;
}
@@ -96,21 +86,31 @@ export class GlPreviewBanner extends LitElement {
}
return html`
-
- this.togglePreview()}>
- New Home View
-
-
- Switch to the new Home View!
- We're reinventing GitLens' Home to be a more helpful daily workflow tool. We'll continue to refine
- this view and welcome your feedback.
+
+ Welcome to the new Home View!
+
+ We're reimagining GitLens' Home to be a more helpful daily workflow tool. We'll continue to refine
+ this view and welcome your
+ feedback .
-
+
+ this.togglePreview(true)} full
+ > Revert to Old Home View
+
+ this.onClose()}
+ >
+
`;
}
- private togglePreview() {
+ private togglePreview(dismiss = false) {
this._ipc.sendCommand(TogglePreviewEnabledCommand);
+
+ if (dismiss) {
+ this.onClose();
+ }
}
private onClose() {
diff --git a/src/webviews/apps/plus/home/components/active-work.ts b/src/webviews/apps/plus/home/components/active-work.ts
index 6752e01711a99..06375a139e4ec 100644
--- a/src/webviews/apps/plus/home/components/active-work.ts
+++ b/src/webviews/apps/plus/home/components/active-work.ts
@@ -2,6 +2,7 @@ import { consume } from '@lit/context';
import { SignalWatcher } from '@lit-labs/signals';
import { css, html, LitElement, nothing } from 'lit';
import { customElement, state } from 'lit/decorators.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
import { when } from 'lit/directives/when.js';
import type { GitTrackingState } from '../../../../../git/models/branch';
import { createWebviewCommandLink } from '../../../../../system/webview';
@@ -79,10 +80,10 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
`;
}
- return this.renderComplete(this._overviewState.state);
+ return this.renderComplete(this._overviewState.state, true);
}
- private renderComplete(overview: Overview) {
+ private renderComplete(overview: Overview, isFetching = false) {
const repo = overview?.repository;
const activeBranches = repo?.branches?.active;
if (!activeBranches) return html`None `;
@@ -95,6 +96,8 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
() =>
html` `,
)}
- ${activeBranches.map(branch => this.renderRepoBranchCard(branch, repo.path))}
+ ${activeBranches.map(branch => this.renderRepoBranchCard(branch, repo.path, isFetching))}
`;
}
- private renderRepoBranchCard(branch: GetOverviewBranch, repo: string) {
+ private renderRepoBranchCard(branch: GetOverviewBranch, repo: string, isFetching: boolean) {
const { name, pr, state, workingTreeState, upstream } = branch;
return html`
@@ -117,7 +120,7 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
${name}
- ${when(state, () => this.renderBranchStateActions(state, upstream))}
+ ${when(state, () => this.renderBranchStateActions(state, upstream, isFetching))}
${when(pr, pr => {
return html`
@@ -179,14 +182,22 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
return html`${actions} `;
}
- private renderBranchStateActions(state?: GitTrackingState, upstream?: { name: string; missing: boolean }) {
+ private renderBranchStateActions(
+ state?: GitTrackingState,
+ upstream?: { name: string; missing: boolean },
+ isFetching?: boolean,
+ ) {
if (upstream?.missing !== false) {
+ const publishTooltip = upstream?.name ? `Publish branch to ${upstream.name}` : 'Publish branch';
return html`
Publish Branch
@@ -201,6 +212,8 @@ export class GlActiveWork extends SignalWatcher(LitElement) {
return html`
- ${this.label}
+ ${this.label}${when(!this.isFetching, () => html` (${this.branches.length})`)}
${this.branches.map(
branch => html` `,
diff --git a/src/webviews/apps/plus/home/components/branch-threshold-filter.ts b/src/webviews/apps/plus/home/components/branch-threshold-filter.ts
index 1d0cf3c901eb1..ec7523d3e820b 100644
--- a/src/webviews/apps/plus/home/components/branch-threshold-filter.ts
+++ b/src/webviews/apps/plus/home/components/branch-threshold-filter.ts
@@ -11,19 +11,22 @@ export const selectStyles = css`
background: none;
outline: none;
border: none;
- cursor: pointer;
- color: var(--color-foreground--50);
text-decoration: none !important;
font-weight: 500;
+ color: var(--color-foreground--25);
}
.select option {
color: var(--vscode-foreground);
background-color: var(--vscode-dropdown-background);
}
- .select:focus {
+ .select:not(:disabled) {
+ cursor: pointer;
+ color: var(--color-foreground--50);
+ }
+ .select:not(:disabled):focus {
outline: 1px solid var(--color-focus-border);
}
- .select:hover {
+ .select:not(:disabled):hover {
color: var(--vscode-foreground);
text-decoration: underline !important;
}
@@ -32,6 +35,7 @@ export const selectStyles = css`
export abstract class GlObjectSelect extends GlElement {
static override readonly styles = [selectStyles];
+ @property({ type: Boolean }) disabled: boolean = false;
@property({ type: String }) value?: V;
@property({ type: Array }) options?: T[];
@@ -44,7 +48,7 @@ export abstract class GlObjectSelect extends
return;
}
return html`
- this.onChange?.(e)}>
+ this.onChange?.(e)}>
${repeat(this.options, item => {
const value = this.getValue(item);
const label = this.getLabel(item);
diff --git a/src/webviews/apps/plus/home/components/launchpad.ts b/src/webviews/apps/plus/home/components/launchpad.ts
index db9adcb535cc9..4097cdda96296 100644
--- a/src/webviews/apps/plus/home/components/launchpad.ts
+++ b/src/webviews/apps/plus/home/components/launchpad.ts
@@ -148,6 +148,20 @@ export class GlLaunchpad extends SignalWatcher(LitElement) {
}
private renderSummaryResult() {
+ if (this._homeState.hasAnyIntegrationConnected === false) {
+ return html``;
+ }
+
return this._summaryState.render({
pending: () => this.renderPending(),
complete: summary => this.renderSummary(summary),
diff --git a/src/webviews/apps/plus/home/components/overview.ts b/src/webviews/apps/plus/home/components/overview.ts
index d59e11a45f5c1..85bade0993396 100644
--- a/src/webviews/apps/plus/home/components/overview.ts
+++ b/src/webviews/apps/plus/home/components/overview.ts
@@ -66,7 +66,7 @@ export class GlOverview extends SignalWatcher(LitElement) {
`;
}
- return this.renderComplete(this._overviewState.state);
+ return this.renderComplete(this._overviewState.state, true);
}
@consume({ context: ipcContext })
@@ -82,13 +82,14 @@ export class GlOverview extends SignalWatcher(LitElement) {
});
}
- private renderComplete(overview: Overview) {
+ private renderComplete(overview: Overview, isFetching = false) {
if (overview == null) return nothing;
const { repository } = overview;
return html`
@@ -103,6 +104,7 @@ export class GlOverview extends SignalWatcher(LitElement) {
value: OverviewRecentThreshold;
label: string;
}[]}
+ .disabled=${isFetching}
.value=${this._overviewState.filter.recent?.threshold}
>
diff --git a/src/webviews/apps/shared/components/button.ts b/src/webviews/apps/shared/components/button.ts
index 8a6d1e5b46400..4e24377a5dcbd 100644
--- a/src/webviews/apps/shared/components/button.ts
+++ b/src/webviews/apps/shared/components/button.ts
@@ -150,6 +150,7 @@ export class GlButton extends LitElement {
gl-tooltip {
height: 100%;
+ width: 100%;
display: inline-flex;
align-items: center;
justify-content: center;
diff --git a/src/webviews/apps/shared/components/overlays/tooltip.ts b/src/webviews/apps/shared/components/overlays/tooltip.ts
index 55e80d3ccdd50..d2e05d78ac34f 100644
--- a/src/webviews/apps/shared/components/overlays/tooltip.ts
+++ b/src/webviews/apps/shared/components/overlays/tooltip.ts
@@ -82,6 +82,9 @@ export class GlTooltip extends LitElement {
});
const target: any = this.shadowRoot?.querySelector('sl-tooltip')?.shadowRoot;
+ // TODO: sometimes sl-tooltip might not be upgraded yet, need to look at watching for the upgrade
+ if (!target) return;
+
this.observer.observe(target, {
attributes: true,
attributeFilter: ['data-current-placement'],
diff --git a/src/webviews/home/homeWebview.ts b/src/webviews/home/homeWebview.ts
index 66c5ecadc672a..7451daa8db3c5 100644
--- a/src/webviews/home/homeWebview.ts
+++ b/src/webviews/home/homeWebview.ts
@@ -469,7 +469,17 @@ export class HomeWebviewProvider implements WebviewProvider this.onWipChanged(repo)),
repo.onDidChange(e => {
- if (e.changed(RepositoryChange.Index, RepositoryChangeComparisonMode.Any)) {
+ if (
+ e.changed(
+ RepositoryChange.Unknown,
+ RepositoryChange.Index,
+ RepositoryChange.Status,
+ RepositoryChange.Remotes,
+ RepositoryChange.Config,
+ RepositoryChange.Heads,
+ RepositoryChangeComparisonMode.Any,
+ )
+ ) {
this.onWipChanged(repo);
}
}),