e.preventDefault()}
diff --git a/packages/web/src/settings/SettingsModal.svelte b/packages/web/src/settings/SettingsModal.svelte
index e91874400..a4fb4eca9 100644
--- a/packages/web/src/settings/SettingsModal.svelte
+++ b/packages/web/src/settings/SettingsModal.svelte
@@ -28,6 +28,8 @@
selectedWidget,
lockedDatabaseMode,
visibleWidgetSideBar,
+ currentTheme,
+ getSystemTheme,
} from '../stores';
import { isMac } from '../utility/common';
import getElectron from '../utility/getElectron';
@@ -280,6 +282,32 @@ ORDER BY
Application theme
+
+ {
+ if ($currentTheme) {
+ $currentTheme = null;
+ } else {
+ $currentTheme = getSystemTheme();
+ }
+ },
+ }}
+ >
+ {
+ if (e.target['checked']) {
+ $currentTheme = null;
+ } else {
+ $currentTheme = getSystemTheme();
+ }
+ }}
+ />
+
+
{#each $extensions.themes as theme}
@@ -495,16 +523,12 @@ ORDER BY
label="Folder with mysql plugins (for example for authentication). Set only in case of problems"
defaultValue=""
/>
-
-
+
diff --git a/packages/web/src/stores.ts b/packages/web/src/stores.ts
index fbcb73cb2..45a7ce616 100644
--- a/packages/web/src/stores.ts
+++ b/packages/web/src/stores.ts
@@ -26,15 +26,19 @@ export interface TabDefinition {
focused?: boolean;
}
-function getSystemTheme() {
+export function getSystemTheme() {
return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? 'theme-dark' : 'theme-light';
}
-export function writableWithStorage(defaultValue: T, storageName) {
+export function writableWithStorage(defaultValue: T, storageName, removeCondition?: (value: T) => boolean) {
const init = localStorage.getItem(storageName);
const res = writable(init ? safeJsonParse(init, defaultValue, true) : defaultValue);
res.subscribe(value => {
- localStorage.setItem(storageName, JSON.stringify(value));
+ if (removeCondition && removeCondition(value)) {
+ localStorage.removeItem(storageName);
+ } else {
+ localStorage.setItem(storageName, JSON.stringify(value));
+ }
});
return res;
}
@@ -104,8 +108,8 @@ export const extensions = writable(null);
export const visibleCommandPalette = writable(null);
export const commands = writable({});
export const currentTheme = getElectron()
- ? writableSettingsValue(getSystemTheme(), 'currentTheme')
- : writableWithStorage(getSystemTheme(), 'currentTheme');
+ ? writableSettingsValue(null, 'currentTheme')
+ : writableWithStorage(null, 'currentTheme', x => x == null);
export const currentEditorTheme = getElectron()
? writableSettingsValue(null, 'currentEditorTheme')
: writableWithStorage(null, 'currentEditorTheme');
@@ -197,12 +201,21 @@ export const connectionAppObjectSearchSettings = writableWithStorage(
'connectionAppObjectSearchSettings2'
);
-export const currentThemeDefinition = derived([currentTheme, extensions], ([$currentTheme, $extensions]) =>
- $extensions?.themes?.find(x => x.themeClassName == $currentTheme)
-);
+let currentThemeValue = null;
+currentTheme.subscribe(value => {
+ currentThemeValue = value;
+});
+export const getCurrentTheme = () => currentThemeValue;
+
+export const currentThemeDefinition = derived([currentTheme, extensions], ([$currentTheme, $extensions]) => {
+ const usedTheme = $currentTheme ?? getSystemTheme();
+ return $extensions?.themes?.find(x => x.themeClassName == usedTheme);
+});
currentThemeDefinition.subscribe(value => {
- if (value?.themeType) {
+ if (value?.themeType && getCurrentTheme()) {
localStorage.setItem('currentThemeType', value?.themeType);
+ } else {
+ localStorage.removeItem('currentThemeType');
}
});
export const openedConnectionsWithTemporary = derived(
diff --git a/packages/web/src/widgets/AdminPremiumPromoWidget.svelte b/packages/web/src/widgets/AdminPremiumPromoWidget.svelte
index a26f494a6..b7560eeb8 100644
--- a/packages/web/src/widgets/AdminPremiumPromoWidget.svelte
+++ b/packages/web/src/widgets/AdminPremiumPromoWidget.svelte
@@ -14,6 +14,7 @@
Compare database models
Synchronize database structure
Backup & restore database
+ Advanced ER diagram settings
Export database model
AI assistant
libSQL, Turso, CosmosDB, Redshift support