Skip to content

fix(funbox): deselecting funbox effects does not reset without refresh (@d1rshan) #7582

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
d1rshan wants to merge 4 commits into
base: master
Choose a base branch
from
+23 −26
Open

fix(funbox): deselecting funbox effects does not reset without refresh (@d1rshan) #7582

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
c2b4da8
fix(funbox): deselecting funbox effects does not reset without refresh
d1rshan Mar 6, 2026
5e3fbf2
Update frontend/src/ts/test/funbox/funbox.ts
d1rshan Mar 6, 2026
4b06c67
Merge branch 'monkeytypegame:master' into fix/funbox-state
d1rshan Mar 6, 2026
49ca5ee
fix(funbox): make config sync path synchronous and avoid duplicate gl…
d1rshan Mar 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
49 changes: 23 additions & 26 deletions frontend/src/ts/test/funbox/funbox.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,13 @@ import {
getAllFunboxes,
getActiveFunboxes,
getActiveFunboxNames,
get,
getActiveFunboxesWithFunction,
isFunboxActiveWithProperty,
getActiveFunboxesWithProperty,
} from "./list";
import { checkForcedConfig } from "./funbox-validation";
import { tryCatch } from "@monkeytype/util/trycatch";
import { qs } from "../../utils/dom";
import { qs, qsa } from "../../utils/dom";
import * as ConfigEvent from "../../observables/config-event";

export function toggleScript(...params: string[]): void {
Expand Down Expand Up @@ -61,12 +60,6 @@ export function toggleFunbox(funbox: FunboxName): void {
}
FunboxMemory.load();
configToggleFunbox(funbox, false);

if (!getActiveFunboxNames().includes(funbox)) {
get(funbox).functions?.clearGlobal?.();
} else {
get(funbox).functions?.applyGlobalCSS?.();
}
}

export async function clear(): Promise<boolean> {
Expand All @@ -79,7 +72,7 @@ export async function clear(): Promise<boolean> {
?.join(" ") ?? "",
);

qs(".funBoxTheme")?.remove();
qsa(".funBoxTheme").remove();

qs("#wordsWrapper")?.show();
MemoryTimer.reset();
Expand Down Expand Up @@ -112,8 +105,8 @@ export async function activate(
}

MemoryTimer.reset();
await setFunboxBodyClasses();
await applyFunboxCSS();
setFunboxBodyClasses();
applyFunboxCSS();

qs("#wordsWrapper")?.show();

Expand Down Expand Up @@ -209,7 +202,7 @@ export async function rememberSettings(): Promise<void> {
}
}

async function setFunboxBodyClasses(): Promise<boolean> {
function setFunboxBodyClasses(): void {
const body = qs("body");

const activeFbClasses = getActiveFunboxNames().map(
Expand All @@ -230,31 +223,35 @@ async function setFunboxBodyClasses(): Promise<boolean> {
"class",
[...new Set([...currentClasses, ...activeFbClasses]).keys()].join(" "),
);
Comment on lines 223 to 225
Copy link

Copilot AI Mar 6, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Body class recompute can leave stale ignore-reduced-motion behind after disabling the last funbox with ignoreReducedMotion because non-fb- classes are preserved. Ensure ignore-reduced-motion is removed from the preserved set before conditionally re-adding it based on active funboxes.

Copilot uses AI. Check for mistakes.

return true;
}

async function applyFunboxCSS(): Promise<boolean> {
qs(".funBoxTheme")?.remove();
function applyFunboxCSS(): void {
qsa(".funBoxTheme").remove();
for (const funbox of getActiveFunboxesWithProperty("hasCssFile")) {
const css = document.createElement("link");
css.classList.add("funBoxTheme");
css.rel = "stylesheet";
css.href = "funbox/" + funbox.name + ".css";
document.head.appendChild(css);
}
return true;
}

ConfigEvent.subscribe(async ({ key }) => {
if (key === "funbox") {
const active = getActiveFunboxNames();
getAllFunboxes()
.filter((it) => !active.includes(it.name))
.forEach((it) => it.functions?.clearGlobal?.());
function syncFunboxStateWithConfig(): void {
const active = getActiveFunboxNames();
getAllFunboxes()
.filter((it) => !active.includes(it.name))
.forEach((it) => it.functions?.clearGlobal?.());

for (const fb of getActiveFunboxesWithFunction("applyGlobalCSS")) {
fb.functions.applyGlobalCSS();
}
setFunboxBodyClasses();
applyFunboxCSS();

for (const fb of getActiveFunboxesWithFunction("applyGlobalCSS")) {
fb.functions.applyGlobalCSS();
}
}

ConfigEvent.subscribe(({ key }) => {
if (key === "funbox") {
syncFunboxStateWithConfig();
}
});
Loading