[dashboard] Sync theme preference between dashboard and editor

[gtsiolis]

Problem to solve

We recently merged the first iteration of the dark theme for the dashboard in #3901. Users can now switch between a dark and light theme for both dashboard and editor.

Currently, the dashboard theme defaults to system default while the editor defaults to a light theme. We could try to sync the theme preference between dashboard and editor as long as the user has never changed the editor theme.

See relevant discussion (internal).

Proposal

TBD (To be discussed)

[svenefftinge]

We could have a preference in the dashboard that says Align with VS Code and becomes the new default. I.e. if the user switches to any dark theme in Code it will switch to dark theme in dashboard as well and switching to any light theme in code will switch to light theme in dashboard.

I don't mean applying the color scheme to the dashboard (as we used to do) but just whether it is dark or light.

[akosyakov]

Just fyi we cannot do much in VS Code, only decide which theme should be used by default if a user never touched settings.

[jankeromnes]

I agree that the default theme of the dashboard and the default theme of VS Code should probably be the same. (And maybe we don't need to sync changes back-and-forth?)

Just fyi we cannot do much in VS Code, only decide which theme should be used by default if a user never touched settings.

Ah, then we could also make VS Code use the "System" theme by default, right? (When user never touched the settings.)

You can get it like so:

// Get the value once
const isDark = window.matchMedia("(prefers-color-scheme: dark)").matches;

// Listen to changes
window.matchMedia("(prefers-color-scheme: dark)").addEventListener('change', event => {
    const isDark = event.matches;
});

I'd vote for either:

1. "System" default in both dashboard and IDE (& react to system changes automatically)
2. "Light" default in both dashboard and IDE

[shaal]

++ for this feature!

I see it in the dashboard, but I don't think it works affects the theme for a new user that see VSCode interface for the first time.
(I changed my VSCode theme to dark theme, and it remembers that option for me across workspaces).

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.