1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-14 07:13:32 +00:00

[PM-11691] Remove Nord and Solarized Dark from extension (#11013)

* remove nord and solarized dark from AppearanceV2 component
- This component already behind the extension refresh feature flag

* update the users theme to system when nord or solarized dark is selected

* For desktop, still allow all theme types by overriding the default theme service.

* change theme on the fly rather than updating local state.

- When the feature flag is removed then a migration will have to take place
This commit is contained in:
Nick Krantz
2024-09-19 10:55:40 -05:00
committed by GitHub
parent afff91e0f3
commit 01e530d02b
7 changed files with 62 additions and 11 deletions

View File

@@ -1,5 +1,7 @@
import { Observable, map } from "rxjs";
import { Observable, combineLatest, map } from "rxjs";
import { FeatureFlag } from "../../enums/feature-flag.enum";
import { ConfigService } from "../abstractions/config/config.service";
import { ThemeType } from "../enums";
import { GlobalStateProvider, KeyDefinition, THEMING_DISK } from "../state";
@@ -16,17 +18,32 @@ export abstract class ThemeStateService {
abstract setSelectedTheme(theme: ThemeType): Promise<void>;
}
const THEME_SELECTION = new KeyDefinition<ThemeType>(THEMING_DISK, "selection", {
export const THEME_SELECTION = new KeyDefinition<ThemeType>(THEMING_DISK, "selection", {
deserializer: (s) => s,
});
export class DefaultThemeStateService implements ThemeStateService {
private readonly selectedThemeState = this.globalStateProvider.get(THEME_SELECTION);
selectedTheme$ = this.selectedThemeState.state$.pipe(map((theme) => theme ?? this.defaultTheme));
selectedTheme$ = combineLatest([
this.selectedThemeState.state$,
this.configService.getFeatureFlag$(FeatureFlag.ExtensionRefresh),
]).pipe(
map(([theme, isExtensionRefresh]) => {
// The extension refresh should not allow for Nord or SolarizedDark
// Default the user to their system theme
if (isExtensionRefresh && [ThemeType.Nord, ThemeType.SolarizedDark].includes(theme)) {
return ThemeType.System;
}
return theme;
}),
map((theme) => theme ?? this.defaultTheme),
);
constructor(
private globalStateProvider: GlobalStateProvider,
private configService: ConfigService,
private defaultTheme: ThemeType = ThemeType.System,
) {}