feat: support electron titlebar string template

packages/core-browser/src/preferences/preference-service.ts

@@ -112,7 +112,7 @@ export class PreferenceServiceImpl implements PreferenceService {
     this.toDispose.dispose();
   }
 
-  public onSpecificPreferenceChange(preferenceName, listener) {
+  public onSpecificPreferenceChange(preferenceName: string, listener: (change: PreferenceChange) => void) {
     if (!this.specificEmitters.has(preferenceName)) {
       this.specificEmitters.set(preferenceName, new Emitter());
     }

packages/core-browser/src/preferences/types.ts

@@ -110,9 +110,8 @@ export interface PreferenceService extends IDisposable {
   /**
    * 都走 onPreferenceChanged 再用if判断性能太差了
    * TODO: 将只监听一个偏好的使用这个方法
-   * @param preferenceName
    */
-  onSpecificPreferenceChange(preferenceName, listener: (change: PreferenceChange) => void): IDisposable;
+  onSpecificPreferenceChange(preferenceName: string, listener: (change: PreferenceChange) => void): IDisposable;
 }
 
 export const PreferenceProviderProvider = Symbol('PreferenceProviderProvider');

packages/electron-basic/__mocks__/index.ts

@@ -5,7 +5,6 @@ import { IMessageService } from '@opensumi/ide-overlay/lib/common';
 
 import { createBrowserInjector } from '../../../tools/dev-tool/src/injector-helper';
 import { MockInjector } from '../../../tools/dev-tool/src/mock-injector';
-import { IElectronHeaderService } from '../src/common/header';
 
 import { mockService } from './utils';
 

packages/electron-basic/src/browser/electron-preference.contribution.ts

@@ -0,0 +1,18 @@
+import { PreferenceSchema, PreferenceContribution, localize, Domain } from '@opensumi/ide-core-browser';
+
+export const electronPreferencesSchema: PreferenceSchema = {
+  type: 'object',
+  properties: {
+    'window.title': {
+      type: 'string',
+      description: localize('window.title'),
+    },
+  },
+};
+
+export const ElectronPreferences = Symbol('ElectronPreferences');
+
+@Domain(PreferenceContribution)
+export class ElectronPreferenceContribution implements PreferenceContribution {
+  schema: PreferenceSchema = electronPreferencesSchema;
+}

packages/electron-basic/src/browser/header/header.service.ts

@@ -1,11 +1,12 @@
-import { Injectable, Autowired, INJECTOR_TOKEN, Injector } from '@opensumi/di';
+import { Injectable, Autowired } from '@opensumi/di';
 import {
   AppConfig,
   localize,
   replaceLocalizePlaceholder,
   Emitter,
   DisposableCollection,
   isMacintosh,
+  PreferenceService,
 } from '@opensumi/ide-core-browser';
 import { WorkbenchEditorService } from '@opensumi/ide-editor/lib/browser';
 import { basename, dirname, relative } from '@opensumi/ide-utils/lib/path';
@@ -28,13 +29,13 @@ export class ElectronHeaderService implements IElectronHeaderService {
   disposableCollection = new DisposableCollection();
 
   @Autowired(WorkbenchEditorService)
-  editorService: WorkbenchEditorService;
+  private readonly editorService: WorkbenchEditorService;
 
-  @Autowired(INJECTOR_TOKEN)
-  injector: Injector;
+  @Autowired(PreferenceService)
+  private readonly preferenceService: PreferenceService;
 
   @Autowired(AppConfig)
-  appConfig: AppConfig;
+  private readonly appConfig: AppConfig;
 
   private _onTitleChanged = new Emitter<string>();
   onTitleChanged = this._onTitleChanged.event;
@@ -59,11 +60,25 @@ export class ElectronHeaderService implements IElectronHeaderService {
   }
 
   constructor() {
+    this._titleTemplate = this.preferenceService.getValid('window.title', this._titleTemplate);
+
     this.disposableCollection.push(
       this.editorService.onActiveResourceChange(() => {
         this.updateAppTitle();
       }),
     );
+
+    this.disposableCollection.push(
+      this.preferenceService.onSpecificPreferenceChange('window.title', async (e) => {
+        if (e.newValue) {
+          this.titleTemplate = e.newValue;
+        }
+        // window.title is deleted
+        if (!e.newValue && this.titleTemplate !== DEFAULT_TEMPLATE) {
+          this.titleTemplate = DEFAULT_TEMPLATE;
+        }
+      }),
+    );
   }
 
   updateAppTitle() {

packages/electron-basic/src/browser/index.ts

@@ -39,10 +39,13 @@ import { IElectronHeaderService } from '../common/header';
 
 import { ElectronClipboardService } from './clipboard';
 import { ElectronNativeDialogService } from './dialog';
+import { ElectronPreferenceContribution } from './electron-preference.contribution';
 import { ElectronHeaderService } from './header/header.service';
 import { ElectronHeaderBar } from './header/header.view';
 import { WelcomeContribution } from './welcome/contribution';
 
+import '../common/i18n/setup';
+
 @Injectable()
 export class ElectronBasicModule extends BrowserModule {
   providers: Provider[] = [
@@ -55,6 +58,7 @@ export class ElectronBasicModule extends BrowserModule {
       useClass: ElectronHeaderService,
     },
     ElectronBasicContribution,
+    ElectronPreferenceContribution,
     WelcomeContribution,
   ];
 }

packages/electron-basic/src/common/header.ts

@@ -31,7 +31,7 @@ export interface IElectronHeaderService {
    * - `${folderPath}`: file path of the workspace folder the file is contained in (e.g. /Users/Development/myFolder).
    * - `${rootName}`: name of the opened workspace or folder (e.g. myFolder or myWorkspace).
    * - `${rootPath}`: file path of the opened workspace or folder (e.g. /Users/Development/myWorkspace).
-   * - `${appName}`: e.g. VS Code.
+   * - `${appName}`: e.g. OpenSumi.
    * - `${remoteName}`: e.g. SSH
    * - `${dirty}`: an indicator for when the active editor has unsaved changes.
    * - `${separator}`: a conditional separator (" - ") that only shows when surrounded by variables with values or static text.

packages/electron-basic/src/common/i18n/en-US.lang.ts

@@ -0,0 +1,24 @@
+export const localizationBundle = {
+  languageId: 'en-US',
+  languageName: 'english',
+  localizedLanguageName: 'English',
+  contents: {
+    'window.title': [
+      'Controls the window title based on the active editor. Variables are substituted based on the context:',
+      '`${activeEditorShort}`: the file name (e.g. myFile.txt).',
+      '`${activeEditorMedium}`: the path of the file relative to the workspace folder (e.g. myFolder/myFileFolder/myFile.txt).',
+      '`${activeEditorLong}`: the full path of the file (e.g. /Users/Development/myFolder/myFileFolder/myFile.txt).',
+      '`${activeFolderShort}`: the name of the folder the file is contained in (e.g. myFileFolder).',
+      '`${activeFolderMedium}`: the path of the folder the file is contained in, relative to the workspace folder (e.g. myFolder/myFileFolder).',
+      '`${activeFolderLong}`: the full path of the folder the file is contained in (e.g. /Users/Development/myFolder/myFileFolder).',
+      '`${folderName}`: name of the workspace folder the file is contained in (e.g. myFolder).',
+      '`${folderPath}`: file path of the workspace folder the file is contained in (e.g. /Users/Development/myFolder).',
+      '`${rootName}`: name of the opened workspace or folder (e.g. myFolder or myWorkspace).',
+      '`${rootPath}`: file path of the opened workspace or folder (e.g. /Users/Development/myWorkspace).',
+      '`${appName}`: e.g. OpenSumi.',
+      '`${remoteName}`: e.g. SSH',
+      '`${dirty}`: an indicator for when the active editor has unsaved changes.',
+      '`${separator}`: a conditional separator (" - ") that only shows when surrounded by variables with values or static text.',
+    ].join('\n- '),
+  },
+};

packages/electron-basic/src/common/i18n/setup.ts

@@ -0,0 +1,7 @@
+import { registerLocalizationBundle } from '@opensumi/ide-core-common/lib/localize';
+
+import { localizationBundle as en } from './en-US.lang';
+import { localizationBundle as zh } from './zh-CN.lang';
+
+registerLocalizationBundle(zh);
+registerLocalizationBundle(en);

packages/electron-basic/src/common/i18n/zh-CN.lang.ts

@@ -0,0 +1,24 @@
+export const localizationBundle = {
+  languageId: 'zh-CN',
+  languageName: 'Chinese',
+  localizedLanguageName: '中文(中国)',
+  contents: {
+    'window.title': [
+      '基于活跃文件控制窗口标题。变量根据上下文替换：',
+      '`${activeEditorShort}`: 活跃文件标题 (例如: myFile.txt).',
+      '`${activeEditorMedium}`: 活跃文件相对工作区的路径 (例如: myFolder/myFileFolder/myFile.txt).',
+      '`${activeEditorLong}`: 活跃文件的绝对路径 (例如: /Users/Development/myFolder/myFileFolder/myFile.txt).',
+      '`${activeFolderShort}`: 活跃文件的父目录 (例如: myFileFolder).',
+      '`${activeFolderMedium}`: 活跃文件的父目录相约对工作区的路径 (例如: myFolder/myFileFolder).',
+      '`${activeFolderLong}`: 活跃文件的父目录相约对工作区的绝对路径 (例如: /Users/Development/myFolder/myFileFolder).',
+      '`${folderName}`: 目录名称 (例如: myFolder).',
+      '`${folderPath}`: 目录绝对路径 (例如: /Users/Development/myFolder).',
+      '`${rootName}`: 工作区名称 (例如: myFolder or myWorkspace).',
+      '`${rootPath}`: 工作区绝对路径 (例如: /Users/Development/myWorkspace).',
+      '`${appName}`: 例如: OpenSumi.',
+      '`${remoteName}`: 例如: SSH',
+      '`${dirty}`: 有文件被修改的标记',
+      '`${separator}`: 分隔符只在两边都有值的变量中出现',
+    ].join('\n- '),
+  },
+};