PLG 138 welcome cursor

contributions.json

@@ -5767,6 +5767,11 @@
 			"label": "Show Visual File History View",
 			"commandPalette": "gitlens:enabled"
 		},
+		"gitlens.showWelcomePage": {
+			"label": "Show Welcome",
+			"icon": "$(heart)",
+			"commandPalette": "gitlens:enabled"
+		},
 		"gitlens.showWorkspacesView": {
 			"label": "Show Cloud Workspaces View",
 			"commandPalette": "gitlens:enabled && !gitlens:hasVirtualFolders"

package.json

@@ -8404,6 +8404,12 @@
 				"title": "Show Visual File History View",
 				"category": "GitLens"
 			},
+			{
+				"command": "gitlens.showWelcomePage",
+				"title": "Show Welcome",
+				"category": "GitLens",
+				"icon": "$(heart)"
+			},
 			{
 				"command": "gitlens.showWorkspacesView",
 				"title": "Show Cloud Workspaces View",
@@ -13280,6 +13286,10 @@
 					"command": "gitlens.showTimelineView",
 					"when": "gitlens:enabled"
 				},
+				{
+					"command": "gitlens.showWelcomePage",
+					"when": "gitlens:enabled"
+				},
 				{
 					"command": "gitlens.showWorkspacesView",
 					"when": "gitlens:enabled && !gitlens:hasVirtualFolders"

src/constants.commands.generated.ts

@@ -1010,6 +1010,7 @@ export type ContributedPaletteCommands =
 	| 'gitlens.showTagsView'
 	| 'gitlens.showTimelinePage'
 	| 'gitlens.showTimelineView'
+	| 'gitlens.showWelcomePage'
 	| 'gitlens.showWorkspacesView'
 	| 'gitlens.showWorktreesView'
 	| 'gitlens.startWork'

src/constants.telemetry.ts

@@ -363,6 +363,9 @@ export interface TelemetryEvents extends WebviewShowAbortedEvents, WebviewShownE
 	/** Sent when the walkthrough is opened */
 	'walkthrough/action': WalkthroughActionEvent;
 	'walkthrough/completion': WalkthroughCompletionEvent;
+
+	/** Sent when an action is taken in the welcome webview */
+	'welcome/action': WelcomeActionEvent;
 }
 
 type WebviewShowAbortedEvents = {
@@ -1219,6 +1222,12 @@ interface WalkthroughCompletionEvent {
 	'context.key': WalkthroughContextKeys;
 }
 
+type WelcomeActionNames = 'plus/sign-up';
+
+type WelcomeActionEvent =
+	| { type: 'command'; name: WelcomeActionNames; command: string; detail?: string }
+	| { type: 'url'; name: WelcomeActionNames; url: string; detail?: string };
+
 type WebviewContextEventData = {
 	'context.webview.id': string;
 	'context.webview.type': string;
@@ -1301,6 +1310,7 @@ export type Sources =
 	| 'view'
 	| 'view:hover'
 	| 'walkthrough'
+	| 'welcome'
 	| 'whatsnew'
 	| 'worktrees';
 

src/constants.views.ts

@@ -43,7 +43,7 @@ export type GroupableTreeViewTypes = Extract<
 >;
 export type GroupableTreeViewIds<T extends GroupableTreeViewTypes = GroupableTreeViewTypes> = TreeViewIds<T>;
 
-export type WebviewTypes = 'composer' | 'graph' | 'patchDetails' | 'settings' | 'timeline';
+export type WebviewTypes = 'composer' | 'graph' | 'patchDetails' | 'settings' | 'timeline' | 'welcome';
 export type WebviewIds = `gitlens.${WebviewTypes}`;
 
 export type WebviewViewTypes = 'commitDetails' | 'graph' | 'graphDetails' | 'home' | 'patchDetails' | 'timeline';

src/extension.ts

@@ -366,6 +366,12 @@ async function showWhatsNew(
 	if (previousVersion == null) {
 		Logger.log(`GitLens first-time install; window.focused=${window.state.focused}`);
 
+		// // Show welcome webview on first install for IDEs that don't support walkthroughs (e.g., Cursor)
+		// // For IDEs that support walkthroughs, the walkthrough will be shown instead
+		// if (window.state.focused && !container.walkthrough.isWalkthroughSupported) {
+		// 	void executeCommand('gitlens.showWelcomePage');
+		// }
+
 		return;
 	}
 

src/webviews/apps/home/components/welcome-overlay.ts

@@ -0,0 +1,95 @@
+import { consume } from '@lit/context';
+import { css, html, LitElement, nothing } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import type { State } from '../../../home/protocol';
+import { CollapseSectionCommand } from '../../../home/protocol';
+import { ipcContext } from '../../shared/contexts/ipc';
+import type { HostIpc } from '../../shared/ipc';
+import { stateContext } from '../context';
+import './welcome-page';
+
+declare global {
+	interface HTMLElementTagNameMap {
+		'gl-welcome-overlay': GlWelcomeOverlay;
+	}
+}
+
+@customElement('gl-welcome-overlay')
+export class GlWelcomeOverlay extends LitElement {
+	static override shadowRootOptions: ShadowRootInit = {
+		...LitElement.shadowRootOptions,
+		delegatesFocus: true,
+	};
+
+	static override styles = [
+		css`
+			:host {
+				--background-color: var(--vscode-editor-background);
+			}
+			.overlay {
+				position: fixed;
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+				z-index: 1000;
+				display: block;
+				background-color: var(--background-color);
+			}
+
+			gl-welcome-page {
+				--page-background-color: var(--background-color);
+				--page-margin-left: 1rem;
+				--page-margin-right: 0.5rem;
+			}
+
+			gl-welcome-page::part(page) {
+				padding: 0 0.5rem 0 1rem;
+			}
+		`,
+	];
+
+	@property({ type: String })
+	webroot?: string;
+
+	@property({ type: Boolean })
+	private isLightTheme = false;
+
+	@consume<State>({ context: stateContext, subscribe: true })
+	@state()
+	private _state!: State;
+
+	@consume<HostIpc>({ context: ipcContext, subscribe: true })
+	@state()
+	private _ipc!: HostIpc;
+
+	@state()
+	private closed = false;
+
+	override render(): unknown {
+		const { welcomeOverlayCollapsed, walkthroughSupported, newInstall } = this._state;
+		if (this.closed || welcomeOverlayCollapsed || walkthroughSupported || !newInstall) {
+			return nothing;
+		}
+
+		return html`
+			<div class="overlay">
+				<gl-welcome-page
+					.webroot=${this.webroot}
+					.isLightTheme=${this.isLightTheme}
+					closeable
+					@close=${() => this.onClose()}
+				></gl-welcome-page>
+			</div>
+		`;
+	}
+
+	private onClose() {
+		this.closed = true;
+
+		this._ipc.sendCommand(CollapseSectionCommand, {
+			section: 'welcomeOverlay',
+			collapsed: true,
+		});
+	}
+}