refactor: config split (@miodec) by Miodec · Pull Request #7659 · monkeytypegame/monkeytype

Miodec · 2026-03-16T08:31:53Z

Description

Checks

Closes #

Copilot

Pull request overview

Refactors the frontend config system by splitting the former monolithic config.ts into dedicated modules (store, setters, lifecycle, persistence, remote, etc.) and updates call sites/tests to use the new imports.

Changes:

Replaced default Config imports and mixed exports with explicit modules: config/store, config/setters, config/lifecycle, config/persistence, config/remote.
Added new config modules and removed frontend/src/ts/config.ts.
Updated Vitest specs and affected UI/controllers/commandline code to compile against the new config structure.

Reviewed changes

Copilot reviewed 113 out of 113 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
frontend/src/ts/ui.ts	Switches Config import to `config/store`.
frontend/src/ts/test/words-generator.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/test/tts.ts	Switches Config import to `config/store`.
frontend/src/ts/test/timer-progress.ts	Switches Config import to `config/store`.
frontend/src/ts/test/test-ui.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/test/test-timer.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/test/test-stats.ts	Switches Config import to `config/store`.
frontend/src/ts/test/test-logic.ts	Moves config imports to `store` + `setters`.
frontend/src/ts/test/test-input.ts	Switches Config import to `config/store`.
frontend/src/ts/test/test-config.ts	Switches Config import to `config/store`.
frontend/src/ts/test/shift-tracker.ts	Switches Config import to `config/store`.
frontend/src/ts/test/result.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/test/replay.ts	Removes legacy config default import; uses `Config` from store.
frontend/src/ts/test/practise-words.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/test/pace-caret.ts	Switches Config import to `config/store`.
frontend/src/ts/test/out-of-focus.ts	Switches Config import to `config/store`.
frontend/src/ts/test/monkey.ts	Switches Config import to `config/store`.
frontend/src/ts/test/live-speed.ts	Switches Config import to `config/store`.
frontend/src/ts/test/live-burst.ts	Switches Config import to `config/store`.
frontend/src/ts/test/live-acc.ts	Switches Config import to `config/store`.
frontend/src/ts/test/layout-emulator.ts	Switches Config import to `config/store`.
frontend/src/ts/test/funbox/list.ts	Switches Config import to `config/store`.
frontend/src/ts/test/funbox/funbox.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/test/funbox/funbox-memory.ts	Moves `setConfig` import to `config/setters`.
frontend/src/ts/test/funbox/funbox-functions.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/test/caret.ts	Switches Config import to `config/store`.
frontend/src/ts/test/caps-warning.ts	Switches Config import to `config/store`.
frontend/src/ts/test/british-english.ts	Switches Config import to `config/store`.
frontend/src/ts/test/break-ligatures.ts	Switches Config import to `config/store`.
frontend/src/ts/singletons/format.ts	Uses `Config` from `config/store` for formatter singleton.
frontend/src/ts/signals/config.ts	Reads legacy config snapshot via `getConfig` from `config/store`.
frontend/src/ts/ready.ts	Moves `configLoadPromise` import to `config/lifecycle`.
frontend/src/ts/pages/settings.ts	Splits config imports across store/setters/lifecycle.
frontend/src/ts/pages/account.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/modals/simple-modals.ts	Moves reset/apply config imports to lifecycle/setters.
frontend/src/ts/modals/share-test-settings.ts	Switches Config import to `config/store`.
frontend/src/ts/modals/share-custom-theme.ts	Switches Config import to `config/store`.
frontend/src/ts/modals/quote-submit.ts	Switches Config import to `config/store`.
frontend/src/ts/modals/quote-search.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/modals/quote-report.ts	Switches Config import to `config/store`.
frontend/src/ts/modals/pb-tables.ts	Switches Config import to `config/store`.
frontend/src/ts/modals/mobile-test-config.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/modals/mini-result-chart.ts	Switches Config import to `config/store`.
frontend/src/ts/modals/import-export-settings.ts	Moves import/export behavior to `config/remote`.
frontend/src/ts/modals/edit-preset.ts	Updates metadata/utils imports to new config module paths.
frontend/src/ts/modals/custom-word-amount.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/modals/custom-text.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/modals/custom-test-duration.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/input/helpers/word-navigation.ts	Switches Config import to `config/store`.
frontend/src/ts/input/helpers/validation.ts	Switches Config import to `config/store`.
frontend/src/ts/input/helpers/fail-or-finish.ts	Switches Config import to `config/store`.
frontend/src/ts/input/handlers/keyup.ts	Switches Config import to `config/store`.
frontend/src/ts/input/handlers/keydown.ts	Switches Config import to `config/store`.
frontend/src/ts/input/handlers/insert-text.ts	Switches Config import to `config/store`.
frontend/src/ts/input/handlers/delete.ts	Switches Config import to `config/store`.
frontend/src/ts/input/handlers/before-insert-text.ts	Switches Config import to `config/store`.
frontend/src/ts/input/handlers/before-delete.ts	Switches Config import to `config/store`.
frontend/src/ts/index.ts	Moves config imports to `config/store` + `config/lifecycle`.
frontend/src/ts/event-handlers/test.ts	Switches Config import to `config/store`.
frontend/src/ts/event-handlers/global.ts	Switches Config import to `config/store`.
frontend/src/ts/elements/settings/theme-picker.ts	Splits config imports and moves persistence call to `config/persistence`.
frontend/src/ts/elements/settings/settings-group.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/elements/monkey-power.ts	Switches Config import to `config/store`.
frontend/src/ts/elements/modes-notice.ts	Switches Config import to `config/store`.
frontend/src/ts/elements/last-10-average.ts	Switches Config import to `config/store`.
frontend/src/ts/elements/keymap.ts	Switches Config import to `config/store`.
frontend/src/ts/elements/input-validation.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/elements/custom-background-filter.ts	Moves `setConfig` import to `config/setters`.
frontend/src/ts/elements/caret.ts	Switches Config import to `config/store`.
frontend/src/ts/elements/account/result-filters.ts	Switches Config import to `config/store`.
frontend/src/ts/controllers/url-handler.tsx	Splits config imports into `store` + `setters`.
frontend/src/ts/controllers/theme-controller.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/controllers/sound-controller.ts	Switches Config import to `config/store`.
frontend/src/ts/controllers/pw-ad-controller.ts	Switches Config import to `config/store`.
frontend/src/ts/controllers/preset-controller.ts	Moves apply/persist behavior to `config/lifecycle` + `config/persistence`.
frontend/src/ts/controllers/chart-controller.ts	Switches Config import to `config/store`.
frontend/src/ts/controllers/challenge-controller.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/controllers/ad-controller.ts	Switches Config import to `config/store`.
frontend/src/ts/config/validation.ts	Adjusts imports for new folder structure.
frontend/src/ts/config/utils.ts	Moves migrate utilities and reintroduces `getConfigChanges` under config module.
frontend/src/ts/config/testing.ts	Adds testing helpers for config store replacement/reset.
frontend/src/ts/config/store.ts	Introduces shared mutable config store + accessor.
frontend/src/ts/config/setters.ts	Introduces config mutation API (`setConfig`, `toggleFunbox`, etc.).
frontend/src/ts/config/remote.ts	Introduces remote sync + JSON import logic.
frontend/src/ts/config/persistence.ts	Introduces localStorage + debounced DB sync logic.
frontend/src/ts/config/metadata.ts	Updates config metadata imports to new module layout.
frontend/src/ts/config/lifecycle.ts	Introduces load/apply/reset lifecycle and `configLoadPromise`.
frontend/src/ts/config.ts	Removes monolithic config module (split into config/*).
frontend/src/ts/components/layout/footer/ThemeIndicator.tsx	Splits config imports into `store` + `setters`.
frontend/src/ts/commandline/util.ts	Updates config metadata + config access imports.
frontend/src/ts/commandline/lists/themes.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/commandline/lists/tags.ts	Switches Config import to `config/store`.
frontend/src/ts/commandline/lists/result-screen.ts	Switches Config import to `config/store`.
frontend/src/ts/commandline/lists/quote-favorites.ts	Switches Config import to `config/store`.
frontend/src/ts/commandline/lists/min-burst.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/commandline/lists/font-family.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/commandline/lists/custom-themes-list.ts	Moves `setConfig` import to `config/setters`.
frontend/src/ts/commandline/lists/bail-out.ts	Switches Config import to `config/store`.
frontend/src/ts/commandline/lists/background-filter.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/commandline/lists/add-or-remove-theme-to-favorites.ts	Splits config imports into `store` + `setters`.
frontend/src/ts/commandline/lists.ts	Moves config JSON import to `config/remote`; uses store/setters.
frontend/src/ts/commandline/commandline.ts	Switches Config import to `config/store`.
frontend/src/ts/commandline/commandline-metadata.ts	Switches Config import to `config/store`.
frontend/src/ts/auth.tsx	Moves update-from-server logic to `config/remote`.
frontend/tests/utils/config.spec.ts	Updates migrateConfig import to new location.
frontend/tests/test/british-english.spec.ts	Switches Config import to `config/store`.
frontend/tests/root/config.spec.ts	Updates tests to use lifecycle/setters/utils/testing modules.
frontend/tests/root/config-metadata.spec.ts	Updates metadata + setters/testing imports.
frontend/tests/input/helpers/validation.spec.ts	Updates `__testing` import to `config/testing`.
frontend/tests/input/helpers/fail-or-finish.spec.ts	Updates `__testing` import to `config/testing`.
frontend/tests/controllers/url-handler.spec.ts	Updates config setter imports.
frontend/tests/controllers/preset-controller.spec.ts	Updates config imports across lifecycle/store/utils/persistence.
frontend/tests/commandline/util.spec.ts	Updates config metadata import path and mocks.

You can also share your feedback on Copilot code review. Take the survey.

frontend/src/ts/config/persistence.ts

+  configToSend = {} as ConfigSchemas.Config;
+});
+
+export function resetPendingConfigSync(
+  newConfigToSend: ConfigSchemas.Config,


frontend/src/ts/config/lifecycle.ts

+  if (newConfig === undefined) {
+    await resetConfig();
+  } else {
+    await applyConfig(newConfig);
+    saveFullConfigToLocalStorage(true);
+  }


frontend/src/ts/config/lifecycle.ts

+export const lastConfigsToApply: Set<keyof ConfigSchema> = new Set([
+  "keymapMode",
+  "minWpm",
+  "minAcc",
+  "minBurst",
+  "paceCaret",
+  "quoteLength", //quote length sets mode,
+  "words",
+  "time",
+  "mode", // mode sets punctuation and numbers
+  "numbers",
+  "punctuation",
+  "funbox",
+]);


frontend/src/ts/config/store.ts

+let Config: ConfigSchema = {
+  ...getDefaultConfig(),
+};


frontend/src/ts/config/remote.ts

+  const areConfigsEqual =
+    JSON.stringify(Config) === JSON.stringify(remoteConfig);
+
+  if (Config === undefined || !areConfigsEqual) {
+    console.log(
+      "no local config or local and db configs are different - applying db",
+    );
+    await applyConfig(remoteConfig);
+    saveFullConfigToLocalStorage(true);
+  }


Miodec added 6 commits March 15, 2026 18:36

big

6f3ee13

beboppin

6444fb9

blop

a764264

ayooop

76fd033

move config load promise

7d16624

todo

9b3421c

Copilot AI review requested due to automatic review settings March 16, 2026 08:31

monkeytypegeorge added the frontend User interface or web stuff label Mar 16, 2026

github-actions bot added the waiting for review Pull requests that require a review before continuing label Mar 16, 2026

Copilot started reviewing on behalf of Miodec March 16, 2026 08:32 View session

Copilot AI reviewed Mar 16, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

refactor: config split (@miodec)#7659

refactor: config split (@miodec)#7659
Miodec wants to merge 6 commits intomasterfrom
config

Miodec commented Mar 16, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

Conversation

Miodec commented Mar 16, 2026

Description

Checks

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants