From 92aa5a63745a58a50e1b25bc632f35368cde8398 Mon Sep 17 00:00:00 2001 From: Miodec Date: Wed, 25 Mar 2026 22:38:48 +0100 Subject: [PATCH 1/4] fix: dispatch authEvent when creating a new account with google --- frontend/src/ts/modals/google-sign-up.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/frontend/src/ts/modals/google-sign-up.ts b/frontend/src/ts/modals/google-sign-up.ts index 33da69dddaf4..8f6305d0438f 100644 --- a/frontend/src/ts/modals/google-sign-up.ts +++ b/frontend/src/ts/modals/google-sign-up.ts @@ -21,6 +21,7 @@ import { resetIgnoreAuthCallback } from "../firebase"; import { ValidatedHtmlInputElement } from "../elements/input-validation"; import { UserNameSchema } from "@monkeytype/schemas/users"; import { remoteValidation } from "../utils/remote-validation"; +import { authEvent } from "../events/auth"; let signedInUser: UserCredential | undefined = undefined; @@ -109,6 +110,11 @@ async function apply(): Promise { showSuccessNotification("Account created"); await AccountController.loadUser(signedInUser.user); + authEvent.dispatch({ + type: "authStateChanged", + data: { isUserSignedIn: true, loadPromise: Promise.resolve() }, + }); + signedInUser = undefined; hideLoaderBar(); void hide(); From 93b61c1df50e4d9ee6f0ed6288a19b6688d70920 Mon Sep 17 00:00:00 2001 From: Miodec Date: Wed, 25 Mar 2026 22:55:13 +0100 Subject: [PATCH 2/4] chore: add yaml as dev dependency --- package.json | 3 +- pnpm-lock.yaml | 74 ++++++-------------------------------------------- 2 files changed, 10 insertions(+), 67 deletions(-) diff --git a/package.json b/package.json index 45a9bab2499c..6d904664f6b4 100644 --- a/package.json +++ b/package.json @@ -73,7 +73,8 @@ "oxlint-tsgolint": "0.17.3", "prettier": "3.7.1", "turbo": "2.7.5", - "vitest": "4.1.0" + "vitest": "4.1.0", + "yaml": "2.8.2" }, "lint-staged": { "*": [ diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1e40af4d5068..50270802713f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -59,6 +59,9 @@ importers: vitest: specifier: 4.1.0 version: 4.1.0(@types/node@20.5.1)(happy-dom@20.0.10)(jsdom@27.4.0)(vite@8.0.1(@types/node@20.5.1)(esbuild@0.27.3)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2)) + yaml: + specifier: 2.8.2 + version: 2.8.2 backend: dependencies: @@ -659,7 +662,7 @@ importers: version: 6.0.2 vitest: specifier: 4.1.0 - version: 4.1.0(@types/node@24.9.1)(happy-dom@20.0.10)(jsdom@27.4.0)(vite@8.0.1(@types/node@24.9.1)(esbuild@0.25.11)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2)) + version: 4.1.0(@opentelemetry/api@1.8.0)(@types/node@24.9.1)(happy-dom@20.0.10)(jsdom@27.4.0)(vite@8.0.1(@types/node@24.9.1)(esbuild@0.27.3)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2)) packages/funbox: dependencies: @@ -10779,11 +10782,6 @@ packages: resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==} engines: {node: '>= 6'} - yaml@2.8.1: - resolution: {integrity: sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==} - engines: {node: '>= 14.6'} - hasBin: true - yaml@2.8.2: resolution: {integrity: sha512-mplynKqc1C2hTVYxd0PU2xQAc22TI1vShAYGksCCfxbn/dFwnHTNi1bvYsBTkhdUNtGIf5xNOg938rrSSYvS9A==} engines: {node: '>= 14.6'} @@ -14727,14 +14725,6 @@ snapshots: optionalDependencies: vite: 8.0.1(@types/node@20.5.1)(esbuild@0.27.3)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2) - '@vitest/mocker@4.1.0(vite@8.0.1(@types/node@24.9.1)(esbuild@0.25.11)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2))': - dependencies: - '@vitest/spy': 4.1.0 - estree-walker: 3.0.3 - magic-string: 0.30.21 - optionalDependencies: - vite: 8.0.1(@types/node@24.9.1)(esbuild@0.25.11)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2) - '@vitest/mocker@4.1.0(vite@8.0.1(@types/node@24.9.1)(esbuild@0.27.3)(jiti@2.6.1)(sass@1.70.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2))': dependencies: '@vitest/spy': 4.1.0 @@ -17001,7 +16991,7 @@ snapshots: winston: 3.6.0 winston-transport: 4.7.1 ws: 7.5.10 - yaml: 2.8.1 + yaml: 2.8.2 transitivePeerDependencies: - bufferutil - encoding @@ -17062,7 +17052,7 @@ snapshots: lodash: 4.17.21 mkdirp: 2.1.6 subset-font: 2.3.0 - yaml: 2.8.1 + yaml: 2.8.2 optionalDependencies: '@fortawesome/fontawesome-free': 5.15.4 @@ -18370,7 +18360,7 @@ snapshots: object-inspect: 1.13.4 pidtree: 0.6.0 string-argv: 0.3.2 - yaml: 2.8.1 + yaml: 2.8.2 transitivePeerDependencies: - enquirer - supports-color @@ -19450,7 +19440,7 @@ snapshots: openapi3-ts@3.2.0: dependencies: - yaml: 2.8.1 + yaml: 2.8.2 optionator@0.9.4: dependencies: @@ -21885,23 +21875,6 @@ snapshots: tsx: 4.21.0 yaml: 2.8.2 - vite@8.0.1(@types/node@24.9.1)(esbuild@0.25.11)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2): - dependencies: - lightningcss: 1.32.0 - picomatch: 4.0.3 - postcss: 8.5.8 - rolldown: 1.0.0-rc.10 - tinyglobby: 0.2.15 - optionalDependencies: - '@types/node': 24.9.1 - esbuild: 0.25.11 - fsevents: 2.3.3 - jiti: 2.6.1 - sass: 1.98.0 - terser: 5.46.1 - tsx: 4.21.0 - yaml: 2.8.2 - vite@8.0.1(@types/node@24.9.1)(esbuild@0.27.3)(jiti@2.6.1)(sass@1.70.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2): dependencies: lightningcss: 1.32.0 @@ -22033,35 +22006,6 @@ snapshots: transitivePeerDependencies: - msw - vitest@4.1.0(@types/node@24.9.1)(happy-dom@20.0.10)(jsdom@27.4.0)(vite@8.0.1(@types/node@24.9.1)(esbuild@0.25.11)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2)): - dependencies: - '@vitest/expect': 4.1.0 - '@vitest/mocker': 4.1.0(vite@8.0.1(@types/node@24.9.1)(esbuild@0.25.11)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2)) - '@vitest/pretty-format': 4.1.0 - '@vitest/runner': 4.1.0 - '@vitest/snapshot': 4.1.0 - '@vitest/spy': 4.1.0 - '@vitest/utils': 4.1.0 - es-module-lexer: 2.0.0 - expect-type: 1.3.0 - magic-string: 0.30.21 - obug: 2.1.1 - pathe: 2.0.3 - picomatch: 4.0.3 - std-env: 4.0.0 - tinybench: 2.9.0 - tinyexec: 1.0.2 - tinyglobby: 0.2.15 - tinyrainbow: 3.0.3 - vite: 8.0.1(@types/node@24.9.1)(esbuild@0.25.11)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2) - why-is-node-running: 2.3.0 - optionalDependencies: - '@types/node': 24.9.1 - happy-dom: 20.0.10 - jsdom: 27.4.0 - transitivePeerDependencies: - - msw - vitest@4.1.0(@types/node@24.9.1)(happy-dom@20.0.10)(jsdom@27.4.0)(vite@8.0.1(@types/node@24.9.1)(esbuild@0.27.3)(jiti@2.6.1)(sass@1.70.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.2)): dependencies: '@vitest/expect': 4.1.0 @@ -22431,8 +22375,6 @@ snapshots: yaml@1.10.2: {} - yaml@2.8.1: {} - yaml@2.8.2: {} yargs-parser@20.2.9: {} From 504eb4add66bb7d4e0ffea16d23813ceae63e76f Mon Sep 17 00:00:00 2001 From: Miodec Date: Wed, 25 Mar 2026 23:16:07 +0100 Subject: [PATCH 3/4] refactor: use fa object type in config metadata also add key to the object --- frontend/__tests__/commandline/util.spec.ts | 14 +- frontend/src/ts/commandline/util.ts | 4 +- frontend/src/ts/config/metadata.ts | 295 +++++++++++++------- 3 files changed, 212 insertions(+), 101 deletions(-) diff --git a/frontend/__tests__/commandline/util.spec.ts b/frontend/__tests__/commandline/util.spec.ts index 0cab39f0e3b6..5f209a1bdefa 100644 --- a/frontend/__tests__/commandline/util.spec.ts +++ b/frontend/__tests__/commandline/util.spec.ts @@ -153,7 +153,9 @@ describe("CommandlineUtils", () => { }, }, configMeta: { - icon: "icon", + fa: { + icon: "fa-keyboard", + }, }, schema, }); @@ -173,8 +175,10 @@ describe("CommandlineUtils", () => { defaultValue: expect.anything(), alias: "alias", input: true, - icon: "icon", + icon: "fa-keyboard", exec: expect.anything(), + hover: undefined, + configValue: undefined, inputValueConvert: Number, validation: expect.anything(), }); @@ -198,7 +202,9 @@ describe("CommandlineUtils", () => { }, }, configMeta: { - icon: "icon", + fa: { + icon: "fa-keyboard", + }, }, schema, }); @@ -210,7 +216,7 @@ describe("CommandlineUtils", () => { display: "custom test...", alias: "alias", input: true, - icon: "icon", + icon: "fa-keyboard", }), ); }); diff --git a/frontend/src/ts/commandline/util.ts b/frontend/src/ts/commandline/util.ts index ec65be67ff1f..2bc0451ea613 100644 --- a/frontend/src/ts/commandline/util.ts +++ b/frontend/src/ts/commandline/util.ts @@ -136,7 +136,7 @@ function buildCommandWithSubgroup( return { id: `change${capitalizeFirstLetter(key)}`, display: display, - icon: configMeta?.icon ?? "fa-cog", + icon: configMeta?.fa?.icon ?? "fa-cog", subgroup: { title: display, configKey: key, @@ -230,7 +230,7 @@ function buildInputCommand({ display: displayString, alias: inputProps?.alias ?? undefined, input: true, - icon: configMeta.icon ?? "fa-cog", + icon: configMeta?.fa?.icon ?? "fa-cog", //@ts-expect-error this is fine exec: ({ input }): void => { diff --git a/frontend/src/ts/config/metadata.ts b/frontend/src/ts/config/metadata.ts index 4a5f62f5c2a6..d9d868710de9 100644 --- a/frontend/src/ts/config/metadata.ts +++ b/frontend/src/ts/config/metadata.ts @@ -9,6 +9,7 @@ import * as ConfigSchemas from "@monkeytype/schemas/configs"; import { roundTo1 } from "@monkeytype/util/numbers"; import { capitalizeFirstLetter } from "../utils/strings"; import { getDefaultConfig } from "../constants/default-config"; +import { FaObject } from "../types/font-awesome"; // type SetBlock = { // [K in keyof ConfigSchemas.Config]?: ConfigSchemas.Config[K][]; // }; @@ -18,6 +19,11 @@ import { getDefaultConfig } from "../constants/default-config"; // }; export type ConfigMetadata = { + /** + * The config key that this metadata is for + */ + key: K; + /** * Optional display string for the config key. */ @@ -28,9 +34,9 @@ export type ConfigMetadata = { triggerResize?: true; /** - * Icon to display in the commandline and settings + * Fa object (icon) */ - icon: string; + fa: FaObject; // commandline?: { // displayValues?: ConfigSchemas.Config[K] extends string | number | symbol @@ -97,7 +103,10 @@ export type ConfigMetadataObject = { export const configMetadata: ConfigMetadataObject = { // test punctuation: { - icon: "fa-at", + key: "punctuation", + fa: { + icon: "fa-at", + }, changeRequiresRestart: true, group: "test", overrideValue: ({ value, currentConfig }) => { @@ -108,7 +117,10 @@ export const configMetadata: ConfigMetadataObject = { }, }, numbers: { - icon: "fa-hashtag", + key: "numbers", + fa: { + icon: "fa-hashtag", + }, changeRequiresRestart: true, group: "test", overrideValue: ({ value, currentConfig }) => { @@ -119,7 +131,8 @@ export const configMetadata: ConfigMetadataObject = { }, }, words: { - icon: "fa-font", + key: "words", + fa: { icon: "fa-font" }, displayString: "word count", changeRequiresRestart: true, group: "test", @@ -133,7 +146,8 @@ export const configMetadata: ConfigMetadataObject = { }, }, time: { - icon: "fa-clock", + key: "time", + fa: { icon: "fa-clock" }, changeRequiresRestart: true, displayString: "time", group: "test", @@ -147,7 +161,8 @@ export const configMetadata: ConfigMetadataObject = { }, }, mode: { - icon: "fa-bars", + key: "mode", + fa: { icon: "fa-bars" }, changeRequiresRestart: true, group: "test", overrideConfig: ({ value }) => { @@ -166,7 +181,8 @@ export const configMetadata: ConfigMetadataObject = { }, }, quoteLength: { - icon: "fa-quote-right", + key: "quoteLength", + fa: { icon: "fa-quote-right" }, displayString: "quote length", changeRequiresRestart: true, group: "test", @@ -180,13 +196,15 @@ export const configMetadata: ConfigMetadataObject = { }, }, language: { - icon: "fa-language", + key: "language", + fa: { icon: "fa-language" }, displayString: "language", changeRequiresRestart: true, group: "test", }, burstHeatmap: { - icon: "fa-fire", + key: "burstHeatmap", + fa: { icon: "fa-fire" }, displayString: "word burst heatmap", changeRequiresRestart: false, group: "test", @@ -194,54 +212,63 @@ export const configMetadata: ConfigMetadataObject = { // behavior difficulty: { - icon: "fa-star", + key: "difficulty", + fa: { icon: "fa-star" }, changeRequiresRestart: true, group: "behavior", }, quickRestart: { - icon: "fa-redo-alt", + key: "quickRestart", + fa: { icon: "fa-redo-alt" }, displayString: "quick restart", changeRequiresRestart: false, group: "behavior", }, repeatQuotes: { - icon: "fa-sync-alt", + key: "repeatQuotes", + fa: { icon: "fa-sync-alt" }, displayString: "repeat quotes", changeRequiresRestart: false, group: "behavior", }, resultSaving: { - icon: "fa-save", + key: "resultSaving", + fa: { icon: "fa-save" }, displayString: "result saving", changeRequiresRestart: false, group: "behavior", }, blindMode: { - icon: "fa-eye-slash", + key: "blindMode", + fa: { icon: "fa-eye-slash" }, displayString: "blind mode", changeRequiresRestart: false, group: "behavior", }, alwaysShowWordsHistory: { - icon: "fa-align-left", + key: "alwaysShowWordsHistory", + fa: { icon: "fa-align-left" }, displayString: "always show words history", changeRequiresRestart: false, group: "behavior", }, singleListCommandLine: { - icon: "fa-list", + key: "singleListCommandLine", + fa: { icon: "fa-list" }, displayString: "single list command line", changeRequiresRestart: false, group: "behavior", }, minWpm: { - icon: "fa-bomb", + key: "minWpm", + fa: { icon: "fa-bomb" }, displayString: "min speed", changeRequiresRestart: true, group: "behavior", }, minWpmCustomSpeed: { - icon: "fa-bomb", + key: "minWpmCustomSpeed", + fa: { icon: "fa-bomb" }, displayString: "min speed custom", changeRequiresRestart: true, group: "behavior", @@ -255,13 +282,15 @@ export const configMetadata: ConfigMetadataObject = { }, }, minAcc: { - icon: "fa-bomb", + key: "minAcc", + fa: { icon: "fa-bomb" }, displayString: "min accuracy", changeRequiresRestart: true, group: "behavior", }, minAccCustom: { - icon: "fa-bomb", + key: "minAccCustom", + fa: { icon: "fa-bomb" }, displayString: "min accuracy custom", changeRequiresRestart: true, group: "behavior", @@ -275,25 +304,29 @@ export const configMetadata: ConfigMetadataObject = { }, }, minBurst: { - icon: "fa-bomb", + key: "minBurst", + fa: { icon: "fa-bomb" }, displayString: "min word burst", changeRequiresRestart: true, group: "behavior", }, minBurstCustomSpeed: { - icon: "fa-bomb", + key: "minBurstCustomSpeed", + fa: { icon: "fa-bomb" }, displayString: "min word burst custom speed", changeRequiresRestart: true, group: "behavior", }, britishEnglish: { - icon: "fa-language", + key: "britishEnglish", + fa: { icon: "fa-language" }, displayString: "british english", changeRequiresRestart: true, group: "behavior", }, funbox: { - icon: "fa-gamepad", + key: "funbox", + fa: { icon: "fa-gamepad" }, changeRequiresRestart: true, group: "behavior", isBlocked: ({ value, currentConfig }) => { @@ -320,7 +353,8 @@ export const configMetadata: ConfigMetadataObject = { }, }, customLayoutfluid: { - icon: "fa-tint", + key: "customLayoutfluid", + fa: { icon: "fa-tint" }, displayString: "custom layoutfluid", changeRequiresRestart: true, group: "behavior", @@ -329,7 +363,8 @@ export const configMetadata: ConfigMetadataObject = { }, }, customPolyglot: { - icon: "fa-language", + key: "customPolyglot", + fa: { icon: "fa-language" }, displayString: "custom polyglot", changeRequiresRestart: false, group: "behavior", @@ -340,7 +375,8 @@ export const configMetadata: ConfigMetadataObject = { // input freedomMode: { - icon: "fa-feather-alt", + key: "freedomMode", + fa: { icon: "fa-feather-alt" }, changeRequiresRestart: false, displayString: "freedom mode", group: "input", @@ -354,19 +390,22 @@ export const configMetadata: ConfigMetadataObject = { }, }, strictSpace: { - icon: "fa-minus", + key: "strictSpace", + fa: { icon: "fa-minus" }, displayString: "strict space", changeRequiresRestart: true, group: "input", }, oppositeShiftMode: { - icon: "fa-exchange-alt", + key: "oppositeShiftMode", + fa: { icon: "fa-exchange-alt" }, displayString: "opposite shift mode", changeRequiresRestart: false, group: "input", }, stopOnError: { - icon: "fa-hand-paper", + key: "stopOnError", + fa: { icon: "fa-hand-paper" }, displayString: "stop on error", changeRequiresRestart: true, group: "input", @@ -380,7 +419,8 @@ export const configMetadata: ConfigMetadataObject = { }, }, confidenceMode: { - icon: "fa-backspace", + key: "confidenceMode", + fa: { icon: "fa-backspace" }, displayString: "confidence mode", changeRequiresRestart: false, group: "input", @@ -395,43 +435,50 @@ export const configMetadata: ConfigMetadataObject = { }, }, quickEnd: { - icon: "fa-step-forward", + key: "quickEnd", + fa: { icon: "fa-step-forward" }, displayString: "quick end", changeRequiresRestart: false, group: "input", }, indicateTypos: { - icon: "fa-exclamation", + key: "indicateTypos", + fa: { icon: "fa-exclamation" }, displayString: "indicate typos", changeRequiresRestart: false, group: "input", }, compositionDisplay: { - icon: "fa-language", + key: "compositionDisplay", + fa: { icon: "fa-language" }, displayString: "composition display", changeRequiresRestart: false, group: "input", }, hideExtraLetters: { - icon: "fa-eye-slash", + key: "hideExtraLetters", + fa: { icon: "fa-eye-slash" }, displayString: "hide extra letters", changeRequiresRestart: false, group: "input", }, lazyMode: { - icon: "fa-couch", + key: "lazyMode", + fa: { icon: "fa-couch" }, displayString: "lazy mode", changeRequiresRestart: true, group: "input", }, layout: { - icon: "fa-keyboard", + key: "layout", + fa: { icon: "fa-keyboard" }, displayString: "layout", changeRequiresRestart: true, group: "input", }, codeUnindentOnBackspace: { - icon: "fa-code", + key: "codeUnindentOnBackspace", + fa: { icon: "fa-code" }, displayString: "code unindent on backspace", changeRequiresRestart: true, group: "input", @@ -439,25 +486,29 @@ export const configMetadata: ConfigMetadataObject = { // sound soundVolume: { - icon: "fa-volume-down", + key: "soundVolume", + fa: { icon: "fa-volume-down" }, displayString: "sound volume", changeRequiresRestart: false, group: "sound", }, playSoundOnClick: { - icon: "fa-volume-up", + key: "playSoundOnClick", + fa: { icon: "fa-volume-up" }, displayString: "play sound on click", changeRequiresRestart: false, group: "sound", }, playSoundOnError: { - icon: "fa-volume-mute", + key: "playSoundOnError", + fa: { icon: "fa-volume-mute" }, displayString: "play sound on error", changeRequiresRestart: false, group: "sound", }, playTimeWarning: { - icon: "fa-exclamation-triangle", + key: "playTimeWarning", + fa: { icon: "fa-exclamation-triangle" }, displayString: "play time warning", changeRequiresRestart: false, group: "sound", @@ -465,19 +516,22 @@ export const configMetadata: ConfigMetadataObject = { // caret smoothCaret: { - icon: "fa-i-cursor", + key: "smoothCaret", + fa: { icon: "fa-i-cursor" }, displayString: "smooth caret", changeRequiresRestart: false, group: "caret", }, caretStyle: { - icon: "fa-i-cursor", + key: "caretStyle", + fa: { icon: "fa-i-cursor" }, displayString: "caret style", changeRequiresRestart: false, group: "caret", }, paceCaret: { - icon: "fa-i-cursor", + key: "paceCaret", + fa: { icon: "fa-i-cursor" }, displayString: "pace caret", changeRequiresRestart: false, group: "caret", @@ -494,7 +548,8 @@ export const configMetadata: ConfigMetadataObject = { }, }, paceCaretCustomSpeed: { - icon: "fa-i-cursor", + key: "paceCaretCustomSpeed", + fa: { icon: "fa-i-cursor" }, displayString: "pace caret custom speed", changeRequiresRestart: false, group: "caret", @@ -508,13 +563,15 @@ export const configMetadata: ConfigMetadataObject = { }, }, paceCaretStyle: { - icon: "fa-i-cursor", + key: "paceCaretStyle", + fa: { icon: "fa-i-cursor" }, displayString: "pace caret style", changeRequiresRestart: false, group: "caret", }, repeatedPace: { - icon: "fa-i-cursor", + key: "repeatedPace", + fa: { icon: "fa-i-cursor" }, displayString: "repeated pace", changeRequiresRestart: false, group: "caret", @@ -522,55 +579,64 @@ export const configMetadata: ConfigMetadataObject = { // appearance timerStyle: { - icon: "fa-chart-pie", + key: "timerStyle", + fa: { icon: "fa-chart-pie" }, displayString: "live progress style", changeRequiresRestart: false, group: "appearance", }, liveSpeedStyle: { - icon: "fa-tachometer-alt", + key: "liveSpeedStyle", + fa: { icon: "fa-tachometer-alt" }, displayString: "live speed style", changeRequiresRestart: false, group: "appearance", }, liveAccStyle: { - icon: "fa-tachometer-alt", + key: "liveAccStyle", + fa: { icon: "fa-tachometer-alt" }, displayString: "live accuracy style", changeRequiresRestart: false, group: "appearance", }, liveBurstStyle: { - icon: "fa-tachometer-alt", + key: "liveBurstStyle", + fa: { icon: "fa-tachometer-alt" }, displayString: "live word burst style", changeRequiresRestart: false, group: "appearance", }, timerColor: { - icon: "fa-chart-pie", + key: "timerColor", + fa: { icon: "fa-chart-pie" }, displayString: "timer color", changeRequiresRestart: false, group: "appearance", }, timerOpacity: { - icon: "fa-chart-pie", + key: "timerOpacity", + fa: { icon: "fa-chart-pie" }, displayString: "timer opacity", changeRequiresRestart: false, group: "appearance", }, highlightMode: { - icon: "fa-highlighter", + key: "highlightMode", + fa: { icon: "fa-highlighter" }, displayString: "highlight mode", changeRequiresRestart: false, group: "appearance", }, typedEffect: { - icon: "fa-eye", + key: "typedEffect", + fa: { icon: "fa-eye" }, displayString: "typed effect", changeRequiresRestart: false, group: "appearance", }, tapeMode: { - icon: "fa-tape", + key: "tapeMode", + fa: { icon: "fa-tape" }, triggerResize: true, changeRequiresRestart: false, displayString: "tape mode", @@ -585,20 +651,23 @@ export const configMetadata: ConfigMetadataObject = { }, }, tapeMargin: { - icon: "fa-tape", + key: "tapeMargin", + fa: { icon: "fa-tape" }, displayString: "tape margin", triggerResize: true, changeRequiresRestart: false, group: "appearance", }, smoothLineScroll: { - icon: "fa-align-left", + key: "smoothLineScroll", + fa: { icon: "fa-align-left" }, displayString: "smooth line scroll", changeRequiresRestart: false, group: "appearance", }, showAllLines: { - icon: "fa-align-left", + key: "showAllLines", + fa: { icon: "fa-align-left" }, changeRequiresRestart: false, displayString: "show all lines", group: "appearance", @@ -611,51 +680,61 @@ export const configMetadata: ConfigMetadataObject = { }, }, alwaysShowDecimalPlaces: { - icon: "00", + key: "alwaysShowDecimalPlaces", + fa: { + icon: "fa-ellipsis-h", + }, displayString: "always show decimal places", changeRequiresRestart: false, group: "appearance", }, typingSpeedUnit: { - icon: "fa-tachometer-alt", + key: "typingSpeedUnit", + fa: { icon: "fa-tachometer-alt" }, displayString: "typing speed unit", changeRequiresRestart: false, group: "appearance", }, startGraphsAtZero: { - icon: "fa-chart-line", + key: "startGraphsAtZero", + fa: { icon: "fa-chart-line" }, displayString: "start graphs at zero", changeRequiresRestart: false, group: "appearance", }, maxLineWidth: { - icon: "fa-text-width", + key: "maxLineWidth", + fa: { icon: "fa-text-width" }, changeRequiresRestart: false, triggerResize: true, displayString: "max line width", group: "appearance", }, fontSize: { - icon: "fa-font", + key: "fontSize", + fa: { icon: "fa-font" }, changeRequiresRestart: false, triggerResize: true, displayString: "font size", group: "appearance", }, fontFamily: { - icon: "fa-font", + key: "fontFamily", + fa: { icon: "fa-font" }, displayString: "font family", changeRequiresRestart: false, group: "appearance", }, keymapMode: { - icon: "fa-keyboard", + key: "keymapMode", + fa: { icon: "fa-keyboard" }, displayString: "keymap mode", changeRequiresRestart: false, group: "appearance", }, keymapLayout: { - icon: "fa-keyboard", + key: "keymapLayout", + fa: { icon: "fa-keyboard" }, displayString: "keymap layout", changeRequiresRestart: false, group: "appearance", @@ -663,7 +742,8 @@ export const configMetadata: ConfigMetadataObject = { currentConfig.keymapMode === "off" ? { keymapMode: "static" } : {}, }, keymapStyle: { - icon: "fa-keyboard", + key: "keymapStyle", + fa: { icon: "fa-keyboard" }, displayString: "keymap style", changeRequiresRestart: false, group: "appearance", @@ -671,7 +751,8 @@ export const configMetadata: ConfigMetadataObject = { currentConfig.keymapMode === "off" ? { keymapMode: "static" } : {}, }, keymapLegendStyle: { - icon: "fa-keyboard", + key: "keymapLegendStyle", + fa: { icon: "fa-keyboard" }, displayString: "keymap legend style", changeRequiresRestart: false, group: "appearance", @@ -679,7 +760,8 @@ export const configMetadata: ConfigMetadataObject = { currentConfig.keymapMode === "off" ? { keymapMode: "static" } : {}, }, keymapShowTopRow: { - icon: "fa-keyboard", + key: "keymapShowTopRow", + fa: { icon: "fa-keyboard" }, displayString: "keymap show top row", changeRequiresRestart: false, group: "appearance", @@ -687,7 +769,8 @@ export const configMetadata: ConfigMetadataObject = { currentConfig.keymapMode === "off" ? { keymapMode: "static" } : {}, }, keymapSize: { - icon: "fa-keyboard", + key: "keymapSize", + fa: { icon: "fa-keyboard" }, triggerResize: true, changeRequiresRestart: false, displayString: "keymap size", @@ -703,19 +786,22 @@ export const configMetadata: ConfigMetadataObject = { // theme flipTestColors: { - icon: "fa-adjust", + key: "flipTestColors", + fa: { icon: "fa-adjust" }, displayString: "flip test colors", changeRequiresRestart: false, group: "theme", }, colorfulMode: { - icon: "fa-fill-drip", + key: "colorfulMode", + fa: { icon: "fa-fill-drip" }, displayString: "colorful mode", changeRequiresRestart: false, group: "theme", }, customBackground: { - icon: "fa-link", + key: "customBackground", + fa: { icon: "fa-link" }, displayString: "URL background", changeRequiresRestart: false, group: "theme", @@ -724,37 +810,43 @@ export const configMetadata: ConfigMetadataObject = { }, }, customBackgroundSize: { - icon: "fa-image", + key: "customBackgroundSize", + fa: { icon: "fa-image" }, displayString: "custom background size", changeRequiresRestart: false, group: "theme", }, customBackgroundFilter: { - icon: "fa-image", + key: "customBackgroundFilter", + fa: { icon: "fa-image" }, displayString: "custom background filter", changeRequiresRestart: false, group: "theme", }, autoSwitchTheme: { - icon: "fa-palette", + key: "autoSwitchTheme", + fa: { icon: "fa-palette" }, displayString: "auto switch theme", changeRequiresRestart: false, group: "theme", }, themeLight: { - icon: "fa-palette", + key: "themeLight", + fa: { icon: "fa-palette" }, displayString: "theme light", changeRequiresRestart: false, group: "theme", }, themeDark: { - icon: "fa-palette", + key: "themeDark", + fa: { icon: "fa-palette" }, displayString: "theme dark", changeRequiresRestart: false, group: "theme", }, randomTheme: { - icon: "fa-palette", + key: "randomTheme", + fa: { icon: "fa-palette" }, changeRequiresRestart: false, displayString: "random theme", group: "theme", @@ -784,13 +876,15 @@ export const configMetadata: ConfigMetadataObject = { }, }, favThemes: { - icon: "fa-palette", + key: "favThemes", + fa: { icon: "fa-palette" }, displayString: "favorite themes", changeRequiresRestart: false, group: "theme", }, theme: { - icon: "fa-palette", + key: "theme", + fa: { icon: "fa-palette" }, changeRequiresRestart: false, group: "theme", overrideConfig: () => { @@ -800,13 +894,15 @@ export const configMetadata: ConfigMetadataObject = { }, }, customTheme: { - icon: "fa-palette", + key: "customTheme", + fa: { icon: "fa-palette" }, displayString: "custom theme", changeRequiresRestart: false, group: "theme", }, customThemeColors: { - icon: "fa-palette", + key: "customThemeColors", + fa: { icon: "fa-palette" }, displayString: "custom theme colors", changeRequiresRestart: false, group: "theme", @@ -822,31 +918,36 @@ export const configMetadata: ConfigMetadataObject = { // hide elements showKeyTips: { - icon: "fa-question", + key: "showKeyTips", + fa: { icon: "fa-question" }, displayString: "show key tips", changeRequiresRestart: false, group: "hideElements", }, showOutOfFocusWarning: { - icon: "fa-exclamation", + key: "showOutOfFocusWarning", + fa: { icon: "fa-exclamation" }, displayString: "show out of focus warning", changeRequiresRestart: false, group: "hideElements", }, capsLockWarning: { - icon: "fa-exclamation-triangle", + key: "capsLockWarning", + fa: { icon: "fa-exclamation-triangle" }, displayString: "caps lock warning", changeRequiresRestart: false, group: "hideElements", }, showAverage: { - icon: "fa-chart-bar", + key: "showAverage", + fa: { icon: "fa-chart-bar" }, displayString: "show average", changeRequiresRestart: false, group: "hideElements", }, showPb: { - icon: "fa-crown", + key: "showPb", + fa: { icon: "fa-crown" }, displayString: "show personal best", changeRequiresRestart: false, group: "hideElements", @@ -854,7 +955,8 @@ export const configMetadata: ConfigMetadataObject = { // other (hidden) accountChart: { - icon: "fa-chart-line", + key: "accountChart", + fa: { icon: "fa-chart-line" }, displayString: "account chart", changeRequiresRestart: false, group: "hidden", @@ -869,13 +971,15 @@ export const configMetadata: ConfigMetadataObject = { }, }, monkey: { - icon: "fa-egg", + key: "monkey", + fa: { icon: "fa-egg" }, displayString: "monkey", changeRequiresRestart: false, group: "hidden", }, monkeyPowerLevel: { - icon: "fa-egg", + key: "monkeyPowerLevel", + fa: { icon: "fa-egg" }, displayString: "monkey power level", changeRequiresRestart: false, group: "hidden", @@ -883,7 +987,8 @@ export const configMetadata: ConfigMetadataObject = { // ads ads: { - icon: "fa-ad", + key: "ads", + fa: { icon: "fa-ad" }, changeRequiresRestart: false, group: "ads", overrideValue: ({ value }) => { From 608a1028817c19520f9ec8c82d6a3382f1f006e6 Mon Sep 17 00:00:00 2001 From: Miodec Date: Wed, 25 Mar 2026 23:30:24 +0100 Subject: [PATCH 4/4] refactor: add options metadata to config meta also use it in testconfig.tsx --- .../ts/components/pages/test/TestConfig.tsx | 44 +++++++++---------- frontend/src/ts/config/metadata.ts | 29 ++++++++++++ 2 files changed, 50 insertions(+), 23 deletions(-) diff --git a/frontend/src/ts/components/pages/test/TestConfig.tsx b/frontend/src/ts/components/pages/test/TestConfig.tsx index e179d2fe73b8..9f3627c17484 100644 --- a/frontend/src/ts/components/pages/test/TestConfig.tsx +++ b/frontend/src/ts/components/pages/test/TestConfig.tsx @@ -1,5 +1,6 @@ import { ComponentProps, For, JSXElement, Show } from "solid-js"; +import { configMetadata } from "../../../config/metadata"; import { setConfig, setQuoteLengthAll } from "../../../config/setters"; import { getConfig } from "../../../config/store"; import { restartTestEvent } from "../../../events/test"; @@ -8,7 +9,7 @@ import { useRefWithUtils } from "../../../hooks/useRefWithUtils"; import { isLoggedIn } from "../../../states/core"; import { showModal } from "../../../states/modals"; import { getResultVisible, getFocus } from "../../../states/test"; -import { FaSolidIcon } from "../../../types/font-awesome"; +import { FaObject } from "../../../types/font-awesome"; import { areUnsortedArraysEqual } from "../../../utils/arrays"; import { cn } from "../../../utils/cn"; import { Anime, AnimeShow } from "../../common/anime"; @@ -59,7 +60,7 @@ export function TestConfig(): JSXElement { } function TCButton(props: { - icon: FaSolidIcon; + fa: FaObject; text: string; active?: boolean; disabled?: boolean; @@ -69,7 +70,7 @@ function TCButton(props: {