From 25f8457c5b43a6dd41b865407bc43fbf04102203 Mon Sep 17 00:00:00 2001
From: Keith Daulton <keith.daulton@gitkraken.com>
Date: Wed, 7 Jun 2023 12:07:32 -0400
Subject: [PATCH] Updates welcome view links when not available

---
 src/webviews/apps/welcome/welcome.html | 82 +++++++++++++++++++++++++++++-----
 src/webviews/apps/welcome/welcome.scss | 13 +++++-
 src/webviews/apps/welcome/welcome.ts   | 40 ++++++++++++++++-
 src/webviews/welcome/protocol.ts       |  8 +++-
 src/webviews/welcome/welcomeWebview.ts | 37 +++++++++++++--
 5 files changed, 162 insertions(+), 18 deletions(-)

diff --git a/src/webviews/apps/welcome/welcome.html b/src/webviews/apps/welcome/welcome.html
index 8c00c2b..c54e8f1 100644
--- a/src/webviews/apps/welcome/welcome.html
+++ b/src/webviews/apps/welcome/welcome.html
@@ -294,7 +294,11 @@
 				<h3>Commit Graph ✨</h3>
 				<p>
 					The
-					<a href="command:gitlens.showGraph" title="Open Commit Graph" aria-label="Open Commit Graph"
+					<a
+						href="command:gitlens.showGraph"
+						data-requires="repo"
+						title="Open Commit Graph"
+						aria-label="Open Commit Graph"
 						>Commit Graph</a
 					>
 					helps you easily visualize and keep track of all work in progress<br />
@@ -401,76 +405,109 @@
 				<h3>Side Bar Views</h3>
 				<p>Powerful views into Git that don't come with VS Code</p>
 				<nav class="welcome__views-nav" aria-label="Sidebar view links">
-					<a href="command:gitlens.showCommitsView" title="Show Commits view" aria-label="Show Commits view"
+					<a
+						href="command:gitlens.showCommitsView"
+						data-requires="repo"
+						title="Show Commits view"
+						aria-label="Show Commits view"
 						><code-icon icon="gl-commits-view" size="20"></code-icon>Commits</a
 					>
 					<a
 						href="command:gitlens.showCommitDetailsView"
+						data-requires="repo"
 						title="Show Commit Details view"
 						aria-label="Show Commit Details view"
 						><code-icon icon="gl-commit-view" size="20"></code-icon>Commit Details</a
 					>
 					<a
 						href="command:gitlens.showRepositoriesView"
+						data-requires="repo"
 						title="Show Repositories view"
 						aria-label="Show Repositories view"
 						><code-icon icon="gl-repositories-view" size="20"></code-icon>Repositories</a
 					>
 					<a
 						href="command:gitlens.showFileHistoryView"
+						data-requires="repo"
 						title="Show File History view"
 						aria-label="Show File History view"
 						><code-icon icon="gl-history-view" size="20"></code-icon>File History</a
 					>
 					<a
 						href="command:gitlens.showTimelineView"
+						data-requires="repo"
 						title="Show Visual File History view"
 						aria-label="Show Visual File History view"
 						><code-icon icon="graph-scatter" size="20"></code-icon>Visual File History ✨</a
 					>
 					<a
 						href="command:gitlens.showLineHistoryView"
+						data-requires="repo"
 						title="Show Line History view"
 						aria-label="Show Line History view"
 						><code-icon icon="gl-history-view" size="20"></code-icon>Line History</a
 					>
 					<a
 						href="command:gitlens.showBranchesView"
+						data-requires="repo"
 						title="Show Branches view"
 						aria-label="Show Branches view"
 						><code-icon icon="gl-branches-view" size="20"></code-icon>Branches</a
 					>
-					<a href="command:gitlens.showRemotesView" title="Show Remotes view" aria-label="Show Remotes view"
+					<a
+						href="command:gitlens.showRemotesView"
+						data-requires="repo"
+						title="Show Remotes view"
+						aria-label="Show Remotes view"
 						><code-icon icon="gl-remotes-view" size="20"></code-icon>Remotes</a
 					>
-					<a href="command:gitlens.showStashesView" title="Show Stashes view" aria-label="Show Stashes view"
+					<a
+						href="command:gitlens.showStashesView"
+						data-requires="repo"
+						title="Show Stashes view"
+						aria-label="Show Stashes view"
 						><code-icon icon="gl-stashes-view" size="20"></code-icon>Stashes</a
 					>
-					<a href="command:gitlens.showTagsView" title="Show Tags view" aria-label="Show Tags view"
+					<a
+						href="command:gitlens.showTagsView"
+						data-requires="repo"
+						title="Show Tags view"
+						aria-label="Show Tags view"
 						><code-icon icon="gl-tags-view" size="20"></code-icon>Tags</a
 					>
 					<a
 						href="command:gitlens.showWorktreesView"
+						data-requires="repo"
 						title="Show Worktrees view"
 						aria-label="Show Worktrees view"
 						><code-icon icon="gl-worktrees-view" size="20"></code-icon>Worktrees ✨</a
 					>
-					<a href="command:gitlens.showContributorsView"
+					<a href="command:gitlens.showContributorsView" data-requires="repo"
 						><code-icon icon="gl-contributors-view" size="20"></code-icon>Contributors</a
 					>
 					<a
 						href="command:gitlens.showSearchAndCompareView"
+						data-requires="repo"
 						title="Show Search &amp; Compare view"
 						aria-label="Show Search &amp; Compare view"
 						><code-icon icon="gl-search-view" size="20"></code-icon>Search &amp; Compare</a
 					>
 				</nav>
+				<p data-requires="norepo">
+					<code-icon icon="question"></code-icon> Features which need a repository are currently unavailable
+				</p>
 
 				<h3>Focus ✨</h3>
 				<p>
 					The
-					<a href="command:gitlens.showFocusPage" title="Open Focus" aria-label="Open Focus">Focus</a> view
-					helps you focus on what's important by providing you with a comprehensive list of all your pull
+					<a
+						href="command:gitlens.showFocusPage"
+						data-requires="repo"
+						title="Open Focus"
+						aria-label="Open Focus"
+						>Focus</a
+					>
+					view helps you focus on what's important by providing you with a comprehensive list of all your pull
 					requests and issues on your GitHub repos.
 				</p>
 
@@ -522,12 +559,14 @@
 					>
 					<a
 						href="command:workbench.view.scm"
+						data-requires="repo"
 						title="Show Source Control Side Bar"
 						aria-label="Show GitLens Side Bar"
 						><code-icon icon="source-control"></code-icon><span>Source Control</span></a
 					>
 					<a
 						href="command:workbench.view.extension.gitlensInspect"
+						data-requires="repo"
 						title="Show GitLens Inspect Side Bar"
 						aria-label="Show GitLens Inspect Side Bar"
 						><code-icon icon="gl-gitlens-inspect"></code-icon><span>GitLens Inspect</span></a
@@ -535,41 +574,58 @@
 				</nav>
 				<nav class="welcome__resources-nav">
 					<h3 class="t-eyebrow">Popular views</h3>
-					<a href="command:gitlens.showGraph" title="Show Commit Graph" aria-label="Show Commit Graph"
+					<a
+						href="command:gitlens.showGraph"
+						data-requires="repo"
+						title="Show Commit Graph"
+						aria-label="Show Commit Graph"
 						><code-icon icon="gl-graph"></code-icon><span>Commit Graph ✨</span></a
 					>
-					<a href="command:gitlens.showFocusPage" title="Open Focus" aria-label="Open Focus"
+					<a
+						href="command:gitlens.showFocusPage"
+						data-requires="repo"
+						title="Open Focus"
+						aria-label="Open Focus"
 						><code-icon icon="target"></code-icon><span>Focus ✨</span></a
 					>
-					<a href="command:gitlens.showCommitsView" title="Show Commits view" aria-label="Show Commits view"
+					<a
+						href="command:gitlens.showCommitsView"
+						data-requires="repo"
+						title="Show Commits view"
+						aria-label="Show Commits view"
 						><code-icon icon="gl-commits-view"></code-icon><span>Commits view</span></a
 					>
 					<a
 						href="command:gitlens.showCommitDetailsView"
+						data-requires="repo"
 						title="Show Commit Details view"
 						aria-label="Show Commit Details view"
 						><code-icon icon="gl-commit-view"></code-icon><span>Commit Details view</span></a
 					>
 					<a
 						href="command:gitlens.showFileHistoryView"
+						data-requires="repo"
 						title="Show File History view"
 						aria-label="Show File History view"
 						><code-icon icon="gl-history-view"></code-icon><span>File History view</span></a
 					>
 					<a
 						href="command:gitlens.showTimelineView"
+						data-requires="repo"
 						title="Show Visual File History view"
 						aria-label="Show Visual File History view"
 						><code-icon icon="graph-scatter"></code-icon><span>Visual File History ✨</span></a
 					>
 					<a
 						href="command:gitlens.showSearchAndCompareView"
+						data-requires="repo"
 						title="Show Search &amp; Compare view"
 						aria-label="Show Search &amp; Compare view"
 						><code-icon icon="gl-search-view"></code-icon>Search &amp; Compare</a
 					>
 					<a
 						href="command:gitlens.showWorktreesView"
+						data-requires="repo"
 						title="Show Worktrees view"
 						aria-label="Show Worktrees view"
 						><code-icon icon="gl-worktrees-view"></code-icon>Worktrees ✨</a
@@ -585,6 +641,7 @@
 					>
 					<a
 						href="command:gitlens.gitCommands"
+						data-requires="repo"
 						title="Open Git Command Palette"
 						aria-label="Open Git Command Palette"
 						><code-icon icon="symbol-color"></code-icon><span>Git Command Palette</span></a
@@ -640,6 +697,9 @@
 		</main>
 		<footer>
 			<p>✨ Requires a trial or subscription to use this on privately hosted repos</p>
+			<p data-requires="norepo">
+				<code-icon icon="question"></code-icon> Features which need a repository are currently unavailable
+			</p>
 		</footer>
 		#{endOfBody}
 	</body>
diff --git a/src/webviews/apps/welcome/welcome.scss b/src/webviews/apps/welcome/welcome.scss
index b411c56..e2f9097 100644
--- a/src/webviews/apps/welcome/welcome.scss
+++ b/src/webviews/apps/welcome/welcome.scss
@@ -316,7 +316,7 @@ gk-card p {
 		grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
 		gap: 0.64rem 2rem;
 		// width: min-content;
-		margin: 0 1rem;
+		margin: 0 1rem 1.3rem;
 
 		> * {
 			white-space: nowrap;
@@ -841,3 +841,14 @@ body[data-feature-revision='off'] {
 		}
 	}
 }
+
+body {
+	&[data-repos='blocked'] [data-requires='repo'] {
+		opacity: 0.5;
+		cursor: not-allowed;
+	}
+
+	&:not([data-repos='blocked']) [data-requires='norepo'] {
+		display: none;
+	}
+}
diff --git a/src/webviews/apps/welcome/welcome.ts b/src/webviews/apps/welcome/welcome.ts
index 37fb00e..c88a2a5 100644
--- a/src/webviews/apps/welcome/welcome.ts
+++ b/src/webviews/apps/welcome/welcome.ts
@@ -1,8 +1,10 @@
 /*global*/
 import './welcome.scss';
 import type { Disposable } from 'vscode';
+import type { IpcMessage } from '../../protocol';
+import { onIpc } from '../../protocol';
 import type { State } from '../../welcome/protocol';
-import { UpdateConfigurationCommandType } from '../../welcome/protocol';
+import { DidChangeRepositoriesType, UpdateConfigurationCommandType } from '../../welcome/protocol';
 import { App } from '../shared/appBase';
 import { DOM } from '../shared/dom';
 // import { Snow } from '../shared/snow';
@@ -38,10 +40,40 @@ export class WelcomeApp extends App<State> {
 
 				document.getElementById(hoverTargetId)?.setAttribute('hovering', 'false');
 			}),
+			DOM.on('[data-requires="repo"]', 'click', (e, target: HTMLElement) => this.onRepoFeatureClicked(e, target)),
 		];
 		return disposables;
 	}
 
+	protected override onMessageReceived(e: MessageEvent) {
+		const msg = e.data as IpcMessage;
+
+		switch (msg.method) {
+			case DidChangeRepositoriesType.method:
+				this.log(`onMessageReceived(${msg.id}): name=${msg.method}`);
+
+				onIpc(DidChangeRepositoriesType, msg, params => {
+					this.state.repoFeaturesBlocked = params.repoFeaturesBlocked;
+					this.setState(this.state);
+					this.updateRepoState();
+				});
+				break;
+			default:
+				super.onMessageReceived?.(e);
+				break;
+		}
+	}
+
+	private onRepoFeatureClicked(e: MouseEvent, _target: HTMLElement) {
+		if (this.state.repoFeaturesBlocked ?? false) {
+			e.preventDefault();
+			e.stopPropagation();
+			return false;
+		}
+
+		return true;
+	}
+
 	private onFeatureToggled(e: Event, target: HTMLElement) {
 		const feature = target.dataset.feature;
 		if (!feature) return;
@@ -73,6 +105,7 @@ export class WelcomeApp extends App<State> {
 	private updateState() {
 		this.updateVersion();
 		this.updateFeatures();
+		this.updateRepoState();
 	}
 
 	private updateVersion() {
@@ -95,6 +128,11 @@ export class WelcomeApp extends App<State> {
 		const state = document.body.getAttribute(`data-feature-${feature}`);
 		this.setFeatureState(feature, state === 'off');
 	}
+
+	private updateRepoState() {
+		const { repoFeaturesBlocked } = this.state;
+		document.body.dataset.repos = repoFeaturesBlocked ? 'blocked' : 'allowed';
+	}
 }
 
 new WelcomeApp();
diff --git a/src/webviews/welcome/protocol.ts b/src/webviews/welcome/protocol.ts
index 050b403..98c7709 100644
--- a/src/webviews/welcome/protocol.ts
+++ b/src/webviews/welcome/protocol.ts
@@ -1,5 +1,5 @@
 import type { Config } from '../../config';
-import { IpcCommandType } from '../protocol';
+import { IpcCommandType, IpcNotificationType } from '../protocol';
 
 export interface State {
 	timestamp: number;
@@ -9,6 +9,7 @@ export interface State {
 		currentLine: Config['currentLine']['enabled'];
 	};
 	customSettings?: Record<string, boolean>;
+	repoFeaturesBlocked?: boolean;
 }
 
 export interface UpdateConfigurationParams {
@@ -18,3 +19,8 @@ export interface UpdateConfigurationParams {
 export const UpdateConfigurationCommandType = new IpcCommandType<UpdateConfigurationParams>(
 	'welcome/configuration/update',
 );
+
+export interface DidChangeRepositoriesParams {
+	repoFeaturesBlocked?: boolean;
+}
+export const DidChangeRepositoriesType = new IpcNotificationType<DidChangeRepositoriesParams>('repositories/didChange');
diff --git a/src/webviews/welcome/welcomeWebview.ts b/src/webviews/welcome/welcomeWebview.ts
index ee6ad1c..1eb9cc1 100644
--- a/src/webviews/welcome/welcomeWebview.ts
+++ b/src/webviews/welcome/welcomeWebview.ts
@@ -1,17 +1,28 @@
-import { Disposable } from 'vscode';
+import { Disposable, workspace } from 'vscode';
 import type { Container } from '../../container';
 import { configuration } from '../../system/configuration';
 import type { IpcMessage } from '../protocol';
 import { onIpc } from '../protocol';
 import type { WebviewController, WebviewProvider } from '../webviewController';
-import type { State, UpdateConfigurationParams } from './protocol';
-import { UpdateConfigurationCommandType } from './protocol';
+import type { DidChangeRepositoriesParams, State, UpdateConfigurationParams } from './protocol';
+import { DidChangeRepositoriesType, UpdateConfigurationCommandType } from './protocol';
+
+const emptyDisposable = Object.freeze({
+	dispose: () => {
+		/* noop */
+	},
+});
 
 export class WelcomeWebviewProvider implements WebviewProvider<State> {
 	private readonly _disposable: Disposable;
 
 	constructor(private readonly container: Container, private readonly host: WebviewController<State>) {
-		this._disposable = Disposable.from();
+		this._disposable = Disposable.from(
+			this.container.git.onDidChangeRepositories(this.notifyDidChangeRepositories, this),
+			!workspace.isTrusted
+				? workspace.onDidGrantWorkspaceTrust(this.notifyDidChangeRepositories, this)
+				: emptyDisposable,
+		);
 	}
 
 	dispose() {
@@ -19,6 +30,8 @@ export class WelcomeWebviewProvider implements WebviewProvider<State> {
 	}
 
 	includeBootstrap(): State {
+		const { repoFeaturesBlocked } = this.getRepositoriesState();
+
 		return {
 			timestamp: Date.now(),
 			version: this.container.version,
@@ -27,6 +40,7 @@ export class WelcomeWebviewProvider implements WebviewProvider<State> {
 				codeLens: configuration.get('codeLens.enabled'),
 				currentLine: configuration.get('currentLine.enabled'),
 			},
+			repoFeaturesBlocked: repoFeaturesBlocked,
 		};
 	}
 
@@ -38,7 +52,22 @@ export class WelcomeWebviewProvider implements WebviewProvider<State> {
 		}
 	}
 
+	private getRepositoriesState(): DidChangeRepositoriesParams {
+		// const count = this.container.git.repositoryCount;
+		const openCount = this.container.git.openRepositoryCount;
+		const hasUnsafe = this.container.git.hasUnsafeRepositories();
+		const trusted = workspace.isTrusted;
+
+		return {
+			repoFeaturesBlocked: !trusted || openCount === 0 || hasUnsafe,
+		};
+	}
+
 	private updateConfiguration(params: UpdateConfigurationParams) {
 		void configuration.updateEffective(`${params.type}.enabled`, params.value);
 	}
+
+	private notifyDidChangeRepositories() {
+		void this.host.notify(DidChangeRepositoriesType, this.getRepositoriesState());
+	}
 }