Skip to content

Commit 8dc5474

Browse files
aeschliaeschli
committed
[themes] Debounce color theme selection. Fixes microsoft#71616 
1 parent ab7d961 commit 8dc5474

1 file changed

Lines changed: 54 additions & 39 deletions

File tree

‎src/vs/workbench/contrib/themes/browser/themes.contribution.ts‎

Lines changed: 54 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ import { IWorkbenchThemeService, COLOR_THEME_SETTING, ICON_THEME_SETTING, IColor
1414
import { VIEWLET_ID, IExtensionsViewlet } from 'vs/workbench/contrib/extensions/common/extensions';
1515
import { IExtensionGalleryService } from 'vs/platform/extensionManagement/common/extensionManagement';
1616
import { IViewletService } from 'vs/workbench/services/viewlet/browser/viewlet';
17-
import { Delayer } from 'vs/base/common/async';
1817
import { IColorRegistry, Extensions as ColorRegistryExtensions } from 'vs/platform/theme/common/colorRegistry';
1918
import { IEditorService } from 'vs/workbench/services/editor/common/editorService';
2019
import { Color } from 'vs/base/common/color';
@@ -52,34 +51,43 @@ export class SelectColorThemeAction extends Action {
5251
...configurationEntries(this.extensionGalleryService, localize('installColorThemes', "Install Additional Color Themes..."))
5352
];
5453

54+
let selectThemeTimeout: NodeJS.Timeout | undefined;
55+
5556
const selectTheme = (theme: ThemeItem, applyTheme: boolean) => {
56-
let themeId = theme.id;
57-
if (typeof theme.id === 'undefined') { // 'pick in marketplace' entry
57+
if (selectThemeTimeout) {
58+
clearTimeout(selectThemeTimeout);
59+
}
60+
selectThemeTimeout = setTimeout(() => {
61+
selectThemeTimeout = undefined;
62+
63+
let themeId = theme.id;
64+
if (typeof theme.id === 'undefined') { // 'pick in marketplace' entry
65+
if (applyTheme) {
66+
openExtensionViewlet(this.viewletService, 'category:themes ');
67+
}
68+
themeId = currentTheme.id;
69+
}
70+
let target: ConfigurationTarget | undefined = undefined;
5871
if (applyTheme) {
59-
openExtensionViewlet(this.viewletService, 'category:themes ');
72+
let confValue = this.configurationService.inspect(COLOR_THEME_SETTING);
73+
target = typeof confValue.workspace !== 'undefined' ? ConfigurationTarget.WORKSPACE : ConfigurationTarget.USER;
6074
}
61-
themeId = currentTheme.id;
62-
}
63-
let target: ConfigurationTarget | undefined = undefined;
64-
if (applyTheme) {
65-
let confValue = this.configurationService.inspect(COLOR_THEME_SETTING);
66-
target = typeof confValue.workspace !== 'undefined' ? ConfigurationTarget.WORKSPACE : ConfigurationTarget.USER;
67-
}
6875

69-
this.themeService.setColorTheme(themeId, target).then(undefined,
70-
err => {
71-
onUnexpectedError(err);
72-
this.themeService.setColorTheme(currentTheme.id, undefined);
73-
}
74-
);
76+
this.themeService.setColorTheme(themeId, target).then(undefined,
77+
err => {
78+
onUnexpectedError(err);
79+
this.themeService.setColorTheme(currentTheme.id, undefined);
80+
}
81+
);
82+
}, applyTheme ? 0 : 200);
7583
};
7684

7785
const placeHolder = localize('themes.selectTheme', "Select Color Theme (Up/Down Keys to Preview)");
7886
const autoFocusIndex = firstIndex(picks, p => isItem(p) && p.id === currentTheme.id);
7987
const activeItem: ThemeItem = picks[autoFocusIndex] as ThemeItem;
80-
const delayer = new Delayer<void>(100);
81-
const chooseTheme = (theme: ThemeItem) => delayer.trigger(() => selectTheme(theme || currentTheme, true), 0);
82-
const tryTheme = (theme: ThemeItem) => delayer.trigger(() => selectTheme(theme, false));
88+
89+
const chooseTheme = (theme: ThemeItem) => selectTheme(theme || currentTheme, true);
90+
const tryTheme = (theme: ThemeItem) => selectTheme(theme, false);
8391

8492
return this.quickInputService.pick(picks, { placeHolder, activeItem, onDidFocus: tryTheme })
8593
.then(chooseTheme);
@@ -115,33 +123,40 @@ class SelectIconThemeAction extends Action {
115123
configurationEntries(this.extensionGalleryService, localize('installIconThemes', "Install Additional File Icon Themes..."))
116124
);
117125

126+
let selectThemeTimeout: NodeJS.Timeout | undefined;
127+
118128
const selectTheme = (theme: ThemeItem, applyTheme: boolean) => {
119-
let themeId = theme.id;
120-
if (typeof theme.id === 'undefined') { // 'pick in marketplace' entry
121-
if (applyTheme) {
122-
openExtensionViewlet(this.viewletService, 'tag:icon-theme ');
123-
}
124-
themeId = currentTheme.id;
129+
if (selectThemeTimeout) {
130+
clearTimeout(selectThemeTimeout);
125131
}
126-
let target: ConfigurationTarget | undefined = undefined;
127-
if (applyTheme) {
128-
let confValue = this.configurationService.inspect(ICON_THEME_SETTING);
129-
target = typeof confValue.workspace !== 'undefined' ? ConfigurationTarget.WORKSPACE : ConfigurationTarget.USER;
130-
}
131-
this.themeService.setFileIconTheme(themeId, target).then(undefined,
132-
err => {
133-
onUnexpectedError(err);
134-
this.themeService.setFileIconTheme(currentTheme.id, undefined);
132+
selectThemeTimeout = setTimeout(() => {
133+
selectThemeTimeout = undefined;
134+
let themeId = theme.id;
135+
if (typeof theme.id === 'undefined') { // 'pick in marketplace' entry
136+
if (applyTheme) {
137+
openExtensionViewlet(this.viewletService, 'tag:icon-theme ');
138+
}
139+
themeId = currentTheme.id;
140+
}
141+
let target: ConfigurationTarget | undefined = undefined;
142+
if (applyTheme) {
143+
let confValue = this.configurationService.inspect(ICON_THEME_SETTING);
144+
target = typeof confValue.workspace !== 'undefined' ? ConfigurationTarget.WORKSPACE : ConfigurationTarget.USER;
135145
}
136-
);
146+
this.themeService.setFileIconTheme(themeId, target).then(undefined,
147+
err => {
148+
onUnexpectedError(err);
149+
this.themeService.setFileIconTheme(currentTheme.id, undefined);
150+
}
151+
);
152+
}, applyTheme ? 0 : 200);
137153
};
138154

139155
const placeHolder = localize('themes.selectIconTheme', "Select File Icon Theme");
140156
const autoFocusIndex = firstIndex(picks, p => isItem(p) && p.id === currentTheme.id);
141157
const activeItem: ThemeItem = picks[autoFocusIndex] as ThemeItem;
142-
const delayer = new Delayer<void>(100);
143-
const chooseTheme = (theme: ThemeItem) => delayer.trigger(() => selectTheme(theme || currentTheme, true), 0);
144-
const tryTheme = (theme: ThemeItem) => delayer.trigger(() => selectTheme(theme, false));
158+
const chooseTheme = (theme: ThemeItem) => selectTheme(theme || currentTheme, true);
159+
const tryTheme = (theme: ThemeItem) => selectTheme(theme, false);
145160

146161
return this.quickInputService.pick(picks, { placeHolder, activeItem, onDidFocus: tryTheme })
147162
.then(chooseTheme);

0 commit comments

Comments
 (0)