Edit object type settings from the settings GUI

[9at8]

A lot of settings expose configuration in the form of simple non-nested objects. It will be useful to explore different ways to expose editing functionality for these kinds of objects in the GUI.

Before	After

---

Non-nested objects can be broadly put in three different categories:

1. Static Objects
   • All properties are defined using the properties keyword and default values for all properties are defined.
   • All the properties along with their default values are rendered in the GUI in a tabular format.
   • No additional properties may be added.
   • None of the existing properties can be removed. Instead, each property can be reset to its default value.
2. Dynamic Objects
   • Properties can only be defined using and the patternProperties keyword and additionalProperties keyword, and NOT the properties keyword.
3. A mix of static and dynamic objects
   • These contain statically defined properties keyword, and at least one of patternProperties keyword and additionalProperties keyword.

Requirements ✅

• Optimistic UI - setting should update when immediately, rather than just firing the change event, and waiting for the data to flow in.

Static Objects

• Show all keys with their default value
• Show a revert to default value button
• Hide the 'Add Item' button
• Keys should not be editable

Dynamic Objects

• Show all the configured pairs
• Show the 'Add Item' button
• Show the remove button
• New value widget should match additionalProperties / patternProperties type

Some unknowns 🤔

• Should we limit the number of settings that are shown in the GUI? 10 pairs are fine, but what about 100 pairs? Do such settings exist?
• Should we show a blue bar beside each pair that's edited? (just like other settings)
• What should validators look like? Should key-value pairs be validated individually?
• How should boolean values be rendered?
  • If an object has all values of type boolean, then we should render checkboxes, just like everywhere else in the settings UI.
  • What if an object has a mixture of boolean values and other primitives?
• Should an autocomplete be shown when adding a new key-value pair?

Impacted Settings ⚙️

• files.associations
• emmet.includeLanguages
• emmet.variables

This is not a complete list. Settings that have type object and define either properties, patternProperties or additionalProperties as a non-nested object might be impacted.

Prototypes

You can play around with the setting by using the insiders build of VSCode.

Latest Prototypes (in insiders)

Example from the go extension:

Example: files.associations

Old prototypes

Example from the go extension:

Example: files.associations

cc: @roblourens

[JacksonKearl]

You'll want to explicitly add a Milestone to every feature-request or else the bot will auto-assign it to our candidate milestone.

[savannahostrowski]

@9at8 With this work, would it be possible to render enums values as a dropdown in the UI? For my specific use case, this would make the UX much better by preventing users from having to read external documentation.

In an ideal case, the keys would be hard-coded in the UI for that setting, and the values would be dropdowns.

[9at8]

@savannahostrowski yes!