Apply MVVM Pattern to Settings UI #12640

Closed
opened 2026-01-31 03:20:54 +00:00 by claunia · 2 comments
Owner

Originally created by @carlos-zamora on GitHub (Feb 18, 2021).

The Settings UI is currently directly bound to the settings model. Unfortunately, this forces us to run into a few issues every now and then:

  • polluting the settings model with more XAML dependencies
  • inability to check if a value truly changed

The Model-View-ViewModel Design Pattern was designed to keep the settings model and the settings UI pure simultaneously.

We've already started some of this work by introducing the ProfileViewModel. It serves as a middle-man between the UI controls and the settings model, and can be used to track extra information like "is this the base layer" and special values for settings (i.e. background image's use desktop wallpaper, etc.).

We need to apply this design pattern to...

  • ColorSchemes
  • Global settings
  • CascadiaSettings

This allows for the following scenarios:

  • detect unsaved changes and display an appropriate warning label
  • only load font lists once, and share them across all ProfileViewModels and AppearanceViewModels
  • load the color schemes and be able to display a mini-grid of colors to display throughout the code (i.e. profile page)
  • load the key bindings upon initial SUI load asynchronously, then just pass that into the actions page for a huge performance boost
Originally created by @carlos-zamora on GitHub (Feb 18, 2021). The Settings UI is currently directly bound to the settings model. Unfortunately, this forces us to run into a few issues every now and then: - polluting the settings model with more XAML dependencies - inability to check if a value truly changed [The Model-View-ViewModel Design Pattern](https://docs.microsoft.com/en-us/archive/msdn-magazine/2009/february/patterns-wpf-apps-with-the-model-view-viewmodel-design-pattern#the-demo-application) was designed to keep the settings model and the settings UI pure simultaneously. We've already started some of this work by introducing the `ProfileViewModel`. It serves as a middle-man between the UI controls and the settings model, and can be used to track extra information like "is this the base layer" and special values for settings (i.e. background image's use desktop wallpaper, etc.). We need to apply this design pattern to... - ColorSchemes - Global settings - CascadiaSettings This allows for the following scenarios: - detect unsaved changes and display an appropriate warning label - only load font lists _once_, and share them across all `ProfileViewModel`s and `AppearanceViewModel`s - load the color schemes and be able to display a mini-grid of colors to display throughout the code (i.e. profile page) - load the key bindings upon initial SUI load asynchronously, then just pass that into the actions page for a huge performance boost
claunia added the Issue-FeatureNeeds-Tag-FixProduct-TerminalArea-SettingsUI labels 2026-01-31 03:20:55 +00:00
Author
Owner

@carlos-zamora commented on GitHub (Dec 15, 2021):

I should do this: https://github.com/microsoft/terminal/pull/11877#discussion_r765133799

(or really, anybody should haha. Doesn't have to be me :P)

@carlos-zamora commented on GitHub (Dec 15, 2021): I should do this: https://github.com/microsoft/terminal/pull/11877#discussion_r765133799 (or really, anybody should haha. Doesn't have to be me :P)
Author
Owner

@zadjii-msft commented on GitHub (Aug 25, 2022):

There was a long series of PRs for all the global settings pages, with which we can finally close this out. I think that landed broadly in 1.15 ish.

@zadjii-msft commented on GitHub (Aug 25, 2022): There was a long series of PRs for all the global settings pages, with which we can finally close this out. I think that landed broadly in 1.15 ish.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/terminal#12640