Canonicalize workbench theme storage

This commit is contained in:
elpresidank 2026-06-02 08:03:43 -05:00
parent 5c4948cc2e
commit c5e7708911
4 changed files with 99 additions and 35 deletions

View file

@ -82,7 +82,16 @@
<script>
// Restore theme preference before first paint
(function() {
var theme = localStorage.getItem('tg-theme');
var rawTheme = localStorage.getItem('trustgraph-workbench-theme-v1');
var theme = null;
if (rawTheme === '"light"') {
theme = 'light';
} else if (rawTheme === '"dark"') {
theme = 'dark';
}
if (theme !== 'dark' && theme !== 'light') {
theme = localStorage.getItem('tg-theme');
}
if (theme === 'light') {
document.body.classList.remove('dark');
document.body.classList.add('light');

View file

@ -447,8 +447,8 @@ function legacyConversation(): ConversationState {
function defaultTheme(): Theme {
if (typeof localStorage !== "undefined") {
const saved = localStorage.getItem("tg-theme");
if (saved === "dark" || saved === "light") return saved;
const legacyTheme = localStorage.getItem("tg-theme");
if (legacyTheme === "dark" || legacyTheme === "light") return legacyTheme;
}
if (typeof document !== "undefined" && document.documentElement.classList.contains("light")) {
return "light";
@ -773,7 +773,6 @@ export const themeClassAtom = Atom.make((get) => {
document.documentElement.classList.toggle("light", theme === "light");
document.body.classList.toggle("light", theme === "light");
document.body.classList.toggle("dark", theme === "dark");
localStorage.setItem("tg-theme", theme);
}
return theme;
}).pipe(Atom.keepAlive);

View file

@ -34,6 +34,12 @@ test("settings persist view state and drive feature switches", async ({ page })
await page.getByText("Theme").click();
await expect.poll(() => page.evaluate(() => document.body.classList.contains("light"))).toBe(true);
await expect.poll(() =>
page.evaluate(() => ({
canonical: window.localStorage.getItem("trustgraph-workbench-theme-v1"),
legacy: window.localStorage.getItem("tg-theme"),
}))
).toEqual({ canonical: "\"light\"", legacy: null });
await page.getByLabel("Create collection").click();
const collectionDialog = page.getByRole("dialog", { name: "Create Collection" });