feat: add show personal best

you can now view the pb for
current test settings right above
the test words, before starting the test

Author: Miodec

frontend/src/ts/commandline/commandline-metadata.ts

@@ -703,6 +703,12 @@ export const commandlineConfigMetadata: CommandlineConfigMetadataObject = {
       options: "fromSchema",
     },
   },
+  showPb: {
+    subgroup: {
+      options: "fromSchema",
+    },
+    alias: "pb",
+  },
   monkeyPowerLevel: {
     alias: "powermode",
     isVisible: false,

frontend/src/ts/commandline/lists.ts

@@ -52,6 +52,7 @@ const confidenceModeCommand = buildCommandForConfigKey("confidenceMode");
 const lazyModeCommand = buildCommandForConfigKey("lazyMode");
 const layoutCommand = buildCommandForConfigKey("layout");
 const showAverageCommand = buildCommandForConfigKey("showAverage");
+const showPbCommand = buildCommandForConfigKey("showPb");
 const keymapLayoutCommand = buildCommandForConfigKey("keymapLayout");
 const customThemeCommand = buildCommandForConfigKey("customTheme");
 const adsCommand = buildCommandForConfigKey("ads");
@@ -216,6 +217,7 @@ export const commands: CommandsSubgroup = {
       "showOutOfFocusWarning",
       "capsLockWarning",
       showAverageCommand,
+      showPbCommand,
       "monkeyPowerLevel",
       "monkey"
     ),
@@ -377,6 +379,7 @@ const lists = {
   lazyMode: lazyModeCommand.subgroup,
   paceCaretMode: paceCaretCommand.subgroup,
   showAverage: showAverageCommand.subgroup,
+  showPb: showPbCommand.subgroup,
   minWpm: minSpeedCommand.subgroup,
   minAcc: minAccCommand.subgroup,
   minBurst: MinBurstCommands[0]?.subgroup,

frontend/src/ts/config-metadata.ts

@@ -742,6 +742,11 @@ export const configMetadata: ConfigMetadataObject = {
     displayString: "show average",
     changeRequiresRestart: false,
   },
+  showPb: {
+    icon: "fa-crown",
+    displayString: "show personal best",
+    changeRequiresRestart: false,
+  },
 
   // other (hidden)
   accountChart: {

frontend/src/ts/constants/default-config.ts

@@ -97,6 +97,7 @@ const obj: Config = {
   britishEnglish: false,
   lazyMode: false,
   showAverage: "off",
+  showPb: false,
   tapeMode: "off",
   tapeMargin: 50,
   maxLineWidth: 0,

frontend/src/ts/elements/modes-notice.ts

@@ -9,8 +9,8 @@ import { isAuthenticated } from "../firebase";
 import * as CustomTextState from "../states/custom-text-name";
 import { getLanguageDisplayString } from "../utils/strings";
 import Format from "../utils/format";
-import { getActiveFunboxNames } from "../test/funbox/list";
-import { escapeHTML } from "../utils/misc";
+import { getActiveFunboxes, getActiveFunboxNames } from "../test/funbox/list";
+import { escapeHTML, getMode2 } from "../utils/misc";
 
 ConfigEvent.subscribe((eventKey) => {
   const configKeys: ConfigEvent.ConfigEventKey[] = [
@@ -26,6 +26,7 @@ ConfigEvent.subscribe((eventKey) => {
     "confidenceMode",
     "layout",
     "showAverage",
+    "showPb",
     "typingSpeedUnit",
     "quickRestart",
     "customPolyglot",
@@ -191,6 +192,36 @@ export async function update(): Promise<void> {
     }
   }
 
+  if (Config.showPb) {
+    if (!isAuthenticated()) {
+      return;
+    }
+    const mode2 = getMode2(Config, TestWords.currentQuote);
+    const pb = await DB.getLocalPB(
+      Config.mode,
+      mode2,
+      Config.punctuation,
+      Config.numbers,
+      Config.language,
+      Config.difficulty,
+      Config.lazyMode,
+      getActiveFunboxes()
+    );
+
+    let str = "no pb";
+
+    if (pb !== undefined) {
+      str = `${Format.typingSpeed(pb.wpm, {
+        showDecimalPlaces: true,
+        suffix: ` ${Config.typingSpeedUnit}`,
+      })} ${pb?.acc}% acc`;
+    }
+
+    $(".pageTest #testModesNotice").append(
+      `<button class="textButton" commands="showPb"><i class="fas fa-crown"></i>${str}</button>`
+    );
+  }
+
   if (Config.minWpm !== "off") {
     $(".pageTest #testModesNotice").append(
       `<button class="textButton" commands="minWpm"><i class="fas fa-bomb"></i>min ${Format.typingSpeed(
@@ -277,15 +308,3 @@ export async function update(): Promise<void> {
     }
   } catch {}
 }
-
-if (import.meta.hot !== undefined) {
-  import.meta.hot.dispose(() => {
-    //
-  });
-  import.meta.hot.accept(() => {
-    //
-  });
-  import.meta.hot.on("vite:afterUpdate", () => {
-    void update();
-  });
-}

packages/schemas/src/configs.ts

@@ -229,6 +229,9 @@ export type MinimumBurst = z.infer<typeof MinimumBurstSchema>;
 export const ShowAverageSchema = z.enum(["off", "speed", "acc", "both"]);
 export type ShowAverage = z.infer<typeof ShowAverageSchema>;
 
+export const ShowPbSchema = z.boolean();
+export type ShowPb = z.infer<typeof ShowPbSchema>;
+
 export const ColorHexValueSchema = z.string().regex(/^#([\da-f]{3}){1,2}$/i);
 export type ColorHexValue = z.infer<typeof ColorHexValueSchema>;
 
@@ -461,6 +464,7 @@ export const ConfigSchema = z
     showOutOfFocusWarning: z.boolean(),
     capsLockWarning: z.boolean(),
     showAverage: ShowAverageSchema,
+    showPb: ShowPbSchema,
 
     // other (hidden)
     accountChart: AccountChartSchema,
@@ -596,6 +600,7 @@ export const ConfigGroupsLiteral = {
   showOutOfFocusWarning: "hideElements",
   capsLockWarning: "hideElements",
   showAverage: "hideElements",
+  showPb: "hideElements",
 
   //other
   accountChart: "hidden",