Skip to content

Commit 45b3cb4

Browse files
9at89at8
authored
Change value widget in object renderer based on key (microsoft#101261)
* Use controlled input for object renderer * Display correct value widget based on key * Remove TODO comment
1 parent c25e7c1 commit 45b3cb4

3 files changed

Lines changed: 257 additions & 150 deletions

File tree

‎src/vs/workbench/contrib/preferences/browser/media/settingsWidgets.css‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -148,9 +148,12 @@
148148
.settings-editor > .settings-body > .settings-tree-container .setting-item.setting-item-list .setting-list-object-widget .setting-list-object-input {
149149
max-width: unset;
150150
}
151+
.settings-editor > .settings-body > .settings-tree-container .setting-item.setting-item-list .setting-list-object-widget .setting-list-object-value-container .setting-list-object-input {
152+
margin-right: 0;
153+
}
151154

152155
.settings-editor > .settings-body > .settings-tree-container .setting-item.setting-item-list .setting-list-ok-button {
153-
margin-right: 4px;
156+
margin: 0 4px;
154157
}
155158

156159
.settings-editor > .settings-body > .settings-tree-container .setting-item.setting-item-list .setting-list-widget,
@@ -160,6 +163,7 @@
160163
padding: 1px;
161164
}
162165

166+
.settings-editor > .settings-body > .settings-tree-container .setting-item.setting-item-list .setting-list-object-widget .setting-list-object-value-container,
163167
.settings-editor > .settings-body > .settings-tree-container .setting-item.setting-item-list .setting-list-object-widget .setting-list-object-input select {
164168
width: 100%;
165169
height: 24px;

‎src/vs/workbench/contrib/preferences/browser/settingsTree.ts‎

Lines changed: 41 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ import { ICssStyleCollector, IColorTheme, IThemeService, registerThemingParticip
4444
import { getIgnoredSettings } from 'vs/platform/userDataSync/common/settingsMerge';
4545
import { ITOCEntry } from 'vs/workbench/contrib/preferences/browser/settingsLayout';
4646
import { ISettingsEditorViewState, settingKeyToDisplayFormat, SettingsTreeElement, SettingsTreeGroupChild, SettingsTreeGroupElement, SettingsTreeNewExtensionsElement, SettingsTreeSettingElement } from 'vs/workbench/contrib/preferences/browser/settingsTreeModels';
47-
import { ExcludeSettingWidget, ISettingListChangeEvent, IListDataItem, ListSettingWidget, settingsHeaderForeground, settingsNumberInputBackground, settingsNumberInputBorder, settingsNumberInputForeground, settingsSelectBackground, settingsSelectBorder, settingsSelectForeground, settingsSelectListBorder, settingsTextInputBackground, settingsTextInputBorder, settingsTextInputForeground, ObjectSettingWidget, IObjectDataItem, IObjectEnumOption, ObjectValue } from 'vs/workbench/contrib/preferences/browser/settingsWidgets';
47+
import { ExcludeSettingWidget, ISettingListChangeEvent, IListDataItem, ListSettingWidget, settingsHeaderForeground, settingsNumberInputBackground, settingsNumberInputBorder, settingsNumberInputForeground, settingsSelectBackground, settingsSelectBorder, settingsSelectForeground, settingsSelectListBorder, settingsTextInputBackground, settingsTextInputBorder, settingsTextInputForeground, ObjectSettingWidget, IObjectDataItem, IObjectEnumOption, ObjectValue, IObjectValueSuggester } from 'vs/workbench/contrib/preferences/browser/settingsWidgets';
4848
import { SETTINGS_EDITOR_COMMAND_SHOW_CONTEXT_MENU } from 'vs/workbench/contrib/preferences/common/preferences';
4949
import { IWorkbenchEnvironmentService } from 'vs/workbench/services/environment/common/environmentService';
5050
import { ISetting, ISettingsGroup, SettingValueType } from 'vs/workbench/services/preferences/common/preferences';
@@ -174,6 +174,45 @@ function getObjectDisplayValue(element: SettingsTreeSettingElement): IObjectData
174174
});
175175
}
176176

177+
function createObjectValueSuggester(element: SettingsTreeSettingElement): IObjectValueSuggester {
178+
const { objectProperties, objectPatternProperties, objectAdditionalProperties } = element.setting;
179+
180+
const patternsAndSchemas = Object
181+
.entries(objectPatternProperties ?? {})
182+
.map(([pattern, schema]) => ({
183+
pattern: new RegExp(pattern),
184+
schema
185+
}));
186+
187+
return (key: string) => {
188+
let suggestedSchema: IJSONSchema | undefined;
189+
190+
if (isDefined(objectProperties) && key in objectProperties) {
191+
suggestedSchema = objectProperties[key];
192+
}
193+
194+
const patternSchema = suggestedSchema ?? patternsAndSchemas.find(({ pattern }) => pattern.test(key))?.schema;
195+
196+
if (isDefined(patternSchema)) {
197+
suggestedSchema = patternSchema;
198+
} else if (isDefined(objectAdditionalProperties) && typeof objectAdditionalProperties === 'object') {
199+
suggestedSchema = objectAdditionalProperties;
200+
}
201+
202+
if (isDefined(suggestedSchema)) {
203+
const type = getObjectValueType(suggestedSchema);
204+
205+
if (type === 'boolean') {
206+
return { type, data: suggestedSchema.default ?? true };
207+
} else {
208+
return { type, data: suggestedSchema.default ?? '', options: getEnumOptionsFromSchema(suggestedSchema) };
209+
}
210+
}
211+
212+
return;
213+
};
214+
}
215+
177216
function getListDisplayValue(element: SettingsTreeSettingElement): IListDataItem[] {
178217
if (!element.value || !isArray(element.value)) {
179218
return [];
@@ -1039,13 +1078,13 @@ export class SettingObjectRenderer extends AbstractSettingRenderer implements IT
10391078
protected renderValue(dataElement: SettingsTreeSettingElement, template: ISettingObjectItemTemplate, onChange: (value: string) => void): void {
10401079
const items = getObjectDisplayValue(dataElement);
10411080

1042-
10431081
template.objectWidget.setValue(items, {
10441082
showAddButton: (
10451083
isDefined(dataElement.setting.objectAdditionalProperties) ||
10461084
isDefined(dataElement.setting.objectPatternProperties) ||
10471085
!areAllPropertiesDefined(Object.keys(dataElement.setting.objectProperties ?? {}), items)
10481086
),
1087+
valueSuggester: createObjectValueSuggester(dataElement),
10491088
});
10501089

10511090
this.setElementAriaLabels(dataElement, this.templateId, template);

0 commit comments

Comments
 (0)