Add Status Bar Item for JSConfig/TSConfig (#20571)

Fixes #20356

Adds a status bar item that shows which jsconfig/tsconfig a ts or js file currently belongs to. This triggers the `typescript.goToProjectConfig` command when clicked, which either jumps to the config file or shows an alert about creating a configuration file

extensions/typescript/src/typescriptMain.ts

@@ -44,6 +44,7 @@ import * as BuildStatus from './utils/buildStatus';
 import * as ProjectStatus from './utils/projectStatus';
 import TypingsStatus, { AtaProgressReporter } from './utils/typingsStatus';
 import * as VersionStatus from './utils/versionStatus';
+import ProjectConfigStatus from './utils/projectConfigStatus';
 
 interface LanguageDescription {
 	id: string;
@@ -110,7 +111,9 @@ export function activate(context: ExtensionContext): void {
 	context.subscriptions.push(commands.registerCommand('javascript.goToProjectConfig', goToProjectConfig.bind(null, false)));
 
 	window.onDidChangeActiveTextEditor(VersionStatus.showHideStatus, null, context.subscriptions);
+
 	client.onReady().then(() => {
+		context.subscriptions.push(new ProjectConfigStatus(client));
 		context.subscriptions.push(ProjectStatus.create(client,
 			path => new Promise(resolve => setTimeout(() => resolve(clientHost.handles(path)), 750)),
 			context.workspaceState));

extensions/typescript/src/utils/projectConfigStatus.ts

@@ -0,0 +1,84 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+'use strict';
+
+import * as vscode from 'vscode';
+
+import { ITypescriptServiceClient } from '../typescriptService';
+
+import { loadMessageBundle } from 'vscode-nls';
+const localize = loadMessageBundle();
+
+export default class ProjectConfigStatus implements vscode.Disposable {
+	private entry: vscode.StatusBarItem;
+	private subscription: vscode.Disposable;
+
+	constructor(private client: ITypescriptServiceClient) {
+		this.entry = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Right, Number.MIN_VALUE);
+		this.entry.color = 'white';
+		this.entry.command = 'typescript.goToProjectConfig';
+
+		this.subscription = vscode.window.onDidChangeActiveTextEditor(editor => this.showHideStatus(editor));
+		if (vscode.window.activeTextEditor) {
+			this.showHideStatus(vscode.window.activeTextEditor);
+		}
+	}
+
+	private showHideStatus(editor: vscode.TextEditor | undefined) {
+		editor = editor || vscode.window.activeTextEditor;
+		if (!editor || !vscode.workspace.rootPath) {
+			this.hide();
+			return;
+		}
+		const doc = editor.document;
+		const isTypeScript = !!(vscode.languages.match('typescript', doc) || vscode.languages.match('typescriptreact', doc));
+		if (isTypeScript || vscode.languages.match('javascript', doc) || vscode.languages.match('javascriptreact', doc)) {
+			this.showStatusForResource(doc.uri, isTypeScript);
+		} else {
+			this.hide();
+		}
+	}
+
+	private showStatusForResource(resource: vscode.Uri, isTypeScript: boolean) {
+		const file = this.client.normalizePath(resource);
+		if (!file) {
+			this.hide();
+			return;
+		}
+		return this.client.execute('projectInfo', { file, needFileNameList: false }).then(res => {
+			if (!res || !res.body || !res.body.configFileName) {
+				this.hide();
+				return;
+			}
+
+			const { configFileName } = res.body;
+			this.entry.tooltip = configFileName;
+			this.entry.command = isTypeScript ? 'typescript.goToProjectConfig' : 'javascript.goToProjectConfig';
+
+			if (configFileName.toLowerCase().endsWith('tsconfig.json')) {
+				this.entry.text = 'tsconfig';
+			} else if (configFileName.toLowerCase().endsWith('jsconfig.json')) {
+				this.entry.text = 'jsconfig';
+			} else {
+				this.entry.text = isTypeScript
+					? localize('typescript.projectConfigStatus.noTypeScriptProject', 'No TS Project')
+					: localize('typescript.projectConfigStatus.noJavaScriptProject', 'No JS Project');
+			}
+			this.entry.show();
+		});
+	}
+
+	private hide() {
+		this.entry.hide();
+		this.entry.text = '';
+		this.entry.tooltip = '';
+	}
+
+	dispose() {
+		this.entry.dispose();
+		this.subscription.dispose();
+	}
+}

extensions/typescript/src/utils/versionStatus.ts

@@ -7,7 +7,7 @@
 
 import vscode = require('vscode');
 
-const versionBarEntry = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Right, Number.MIN_VALUE);
+const versionBarEntry = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Right, Number.MIN_VALUE + 1);
 
 export function showHideStatus() {
 	if (!versionBarEntry) {