import { first } from 'rxjs/operators'
import { Injectable } from '@angular/core'
+import { UserLocalStorageKeys } from '@root-helpers/users'
+import { ServerConfig, ServerConfigTheme } from '@shared/models'
+import { environment } from '../../../environments/environment'
import { AuthService } from '../auth'
import { PluginService } from '../plugins/plugin.service'
import { ServerService } from '../server'
-import { LocalStorageService } from '../wrappers/storage.service'
-import { User } from '../users/user.model'
import { UserService } from '../users/user.service'
-import { ServerConfig, ServerConfigTheme } from '@shared/models'
-import { environment } from '../../../environments/environment'
+import { LocalStorageService } from '../wrappers/storage.service'
@Injectable()
export class ThemeService {
: this.userService.getAnonymousUser().theme
if (theme !== 'instance-default') return theme
- return this.serverConfig.theme.default
+
+ const instanceTheme = this.serverConfig.theme.default
+ if (instanceTheme !== 'default') return instanceTheme
+
+ // Default to dark theme if available and wanted by the user
+ if (
+ this.themes.find(t => t.name === 'dark') &&
+ window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
+ ) {
+ return 'dark'
+ }
+
+ return instanceTheme
}
private loadTheme (name: string) {
this.pluginService.reloadLoadedScopes()
- this.localStorageService.setItem(User.KEYS.THEME, JSON.stringify(theme), false)
+ this.localStorageService.setItem(UserLocalStorageKeys.LAST_ACTIVE_THEME, JSON.stringify(theme), false)
} else {
- this.localStorageService.removeItem(User.KEYS.THEME, false)
+ this.localStorageService.removeItem(UserLocalStorageKeys.LAST_ACTIVE_THEME, false)
}
this.oldThemeName = currentTheme
if (!this.auth.isLoggedIn()) {
this.updateCurrentTheme()
- this.localStorageService.watch([User.KEYS.THEME]).subscribe(
+ this.localStorageService.watch([ UserLocalStorageKeys.THEME ]).subscribe(
() => this.updateCurrentTheme()
)
}
}
private loadAndSetFromLocalStorage () {
- const lastActiveThemeString = this.localStorageService.getItem(User.KEYS.THEME)
+ const lastActiveThemeString = this.localStorageService.getItem(UserLocalStorageKeys.LAST_ACTIVE_THEME)
if (!lastActiveThemeString) return
try {