[pull] master from monkeytypegame:master

frontend/__tests__/components/ui/form/InputField.spec.tsx

@@ -83,12 +83,10 @@ describe("InputField", () => {
     expect(screen.getByRole("textbox")).toBeDisabled();
   });
 
-  it("shows FieldIndicator when showIndicator is true", () => {
+  it("shows FieldIndicator", () => {
     const field = makeField("name");
     field.state.meta.isValidating = true;
-    const { container } = render(() => (
-      <InputField field={() => field} showIndicator />
-    ));
+    const { container } = render(() => <InputField field={() => field} />);
 
     expect(container.querySelector(".fa-circle-notch")).toBeInTheDocument();
   });

frontend/src/html/pages/settings.html

@@ -712,6 +712,16 @@
         <button data-config-value="14">fist fight</button>
         <button data-config-value="15">rubber keys</button>
         <button data-config-value="16">fart</button>
+        <button data-config-value="17">akko lavenders</button>
+        <button data-config-value="18">cherrymx black abs</button>
+        <button data-config-value="19">cherrymx black pbt</button>
+        <button data-config-value="20">cherrymx blue abs</button>
+        <button data-config-value="21">cherrymx blue pbt</button>
+        <button data-config-value="22">cherrymx brown pbt</button>
+        <button data-config-value="23">kalih box white</button>
+        <button data-config-value="24">razer green</button>
+        <button data-config-value="25">tealios v2</button>
+        <button data-config-value="26">trust gxt</button>
       </div>
     </div>
     <div class="section fullWidth" data-config-name="playSoundOnError">

frontend/src/ts/collections/results.ts

@@ -26,9 +26,14 @@ import Ape from "../ape";
 import { SnapshotResult } from "../constants/default-snapshot";
 import { queryClient } from "../queries";
 import { baseKey } from "../queries/utils/keys";
-import { __nonReactive as tagsNonReactive, updateLocalTagPB } from "./tags";
+import {
+  __nonReactive as tagsNonReactive,
+  reconcileLocalTagPB,
+  saveLocalTagPB,
+} from "./tags";
 import { isAuthenticated } from "../states/core";
 import { createEffectOn } from "../hooks/effects";
+import { getLastResult, setLastResult } from "../states/snapshot";
 
 export type ResultsQueryState = {
   difficulty: SnapshotResult<Mode>["difficulty"][];
@@ -224,9 +229,18 @@ const resultsCollection = createCollection(
         throw new Error("Error fetching results:" + response.body.message);
       }
 
-      return response.body.data.map((result) =>
+      const results = response.body.data.map((result) =>
         normalizeResult(result, knownTagIds),
       );
+
+      if (getLastResult() === undefined && results.length > 0) {
+        const lastResult = results.reduce((acc, cur) =>
+          acc === undefined || acc.timestamp < cur.timestamp ? cur : acc,
+        );
+        setLastResult(lastResult);
+      }
+
+      return results;
     },
     queryClient,
     getKey: (it) => it._id,
@@ -278,7 +292,7 @@ const actions = {
         ...newTagIds.filter((tag) => !currentTagIds.includes(tag)),
       ];
       tagsToUpdate.forEach((tag) => {
-        updateLocalTagPB(
+        reconcileLocalTagPB(
           tag,
           result.mode,
           result.mode2,
@@ -312,6 +326,49 @@ const actions = {
 export async function updateTags(
   params: ActionType["updateTags"],
 ): Promise<void> {
+  if (!resultsCollection.isReady()) {
+    // if its not ready yet, send the api request to update the tags
+    const response = await Ape.results.updateTags({
+      body: { resultId: params.resultId, tagIds: params.newTagIds },
+    });
+
+    if (response.status !== 200) {
+      throw new Error(`Failed to update result tag: ${response.body.message}`);
+    }
+
+    const result = getLastResult();
+
+    if (result === undefined) {
+      throw new Error(`Cannot find result with id ${params.resultId}`);
+    }
+
+    if (result._id !== params.resultId) {
+      throw new Error(
+        `Last result id ${result._id} does not match updated result id ${params.resultId}. Call the devs and tell them to fix their ugly code`,
+      );
+    }
+
+    response.body.data.tagPbs.forEach((tag) => {
+      saveLocalTagPB(
+        tag,
+        result.mode,
+        result.mode2,
+        result.punctuation,
+        result.numbers,
+        result.language,
+        result.difficulty,
+        result.lazyMode,
+        result.wpm,
+        result.acc,
+        result.rawWpm,
+        result.consistency,
+      );
+    });
+
+    params.afterUpdate?.({ tagPbs: response.body.data.tagPbs });
+    return;
+  }
+
   const transaction = actions.updateTags(params);
   await transaction.isPersisted.promise;
 }
@@ -500,13 +557,17 @@ export async function getUserAverage10(
   //exit early if there is no user. Don't init the result collection
   if (!isAuthenticated()) return { wpm: 0, acc: 0 };
 
-  const result = await queryOnce(() =>
-    buildSettingsResultsQuery(options, {
-      tagIds: tagsNonReactive.getActiveTags().map((it) => it._id),
-    })
-      .orderBy(({ r }) => r.timestamp, "desc")
-      .limit(10)
-      .select(({ r }) => ({ wpm: avg(r.wpm), acc: avg(r.acc) })),
+  const result = await queryOnce((q) =>
+    q
+      .from({
+        //we use sub-query to filter first and then aggregate
+        last10: buildSettingsResultsQuery(options, {
+          tagIds: tagsNonReactive.getActiveTags().map((it) => it._id),
+        })
+          .orderBy(({ r }) => r.timestamp, "desc")
+          .limit(10),
+      })
+      .select(({ last10 }) => ({ wpm: avg(last10.wpm), acc: avg(last10.acc) })),
   );
 
   return result.length === 1 && result[0] !== undefined

frontend/src/ts/collections/tags.ts

@@ -396,7 +396,7 @@ export function saveLocalTagPB<M extends Mode>(
   tagsCollection.utils.writeUpdate(tag);
 }
 
-export function updateLocalTagPB<M extends Mode>(
+export function reconcileLocalTagPB<M extends Mode>(
   tagId: string,
   mode: M,
   mode2: Mode2<M>,

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

@@ -393,6 +393,16 @@ export const commandlineConfigMetadata: CommandlineConfigMetadataObject = {
           "14": "fist fight",
           "15": "rubber keys",
           "16": "fart",
+          "17": "akko lavenders",
+          "18": "cherrymx black abs",
+          "19": "cherrymx black pbt",
+          "20": "cherrymx blue abs",
+          "21": "cherrymx blue pbt",
+          "22": "cherrymx brown pbt",
+          "23": "kalih box white",
+          "24": "razer green",
+          "25": "tealios v2",
+          "26": "trust gxt",
         };
         return map[value];
       },

frontend/src/ts/components/pages/login/Register.tsx

@@ -166,7 +166,6 @@ export function Register(): JSXElement {
             <InputField
               field={field}
               placeholder="username"
-              showIndicator
               autocomplete="new-username"
               disabled={!getLoginPageInputsEnabled()}
             />
@@ -187,7 +186,6 @@ export function Register(): JSXElement {
             <InputField
               field={field}
               placeholder="email"
-              showIndicator
               autocomplete="new-email"
               disabled={!getLoginPageInputsEnabled()}
               onFocus={() => {
@@ -214,7 +212,6 @@ export function Register(): JSXElement {
           children={(field) => (
             <InputField
               field={field}
-              showIndicator
               autocomplete="verify-email"
               placeholder="verify email"
               disabled={!getLoginPageInputsEnabled()}
@@ -238,7 +235,6 @@ export function Register(): JSXElement {
             <InputField
               field={field}
               placeholder="password"
-              showIndicator
               autocomplete="new-password"
               type="password"
               disabled={!getLoginPageInputsEnabled()}
@@ -256,7 +252,6 @@ export function Register(): JSXElement {
           children={(field) => (
             <InputField
               field={field}
-              showIndicator
               placeholder="verify password"
               autocomplete="verify-password"
               type="password"

frontend/src/ts/components/pages/profile/ProfileSearchPage.tsx

@@ -86,7 +86,6 @@ export function ProfileSearchPage(): JSXElement {
                   <InputField
                     field={field}
                     placeholder="username"
-                    showIndicator
                     autocomplete="new-username"
                     disabled={!isEditable()}
                   />

frontend/src/ts/components/ui/form/InputField.tsx

@@ -7,7 +7,6 @@
 export function InputField(props: {
   field: Accessor<AnyFieldApi>;
   placeholder?: string;
-  showIndicator?: boolean;
   autocomplete?: string;
   type?: string;
   disabled?: boolean;
@@ -24,7 +23,7 @@
           "rounded border-none bg-sub-alt p-[0.5em] text-em-base leading-[1.25em] caret-main outline-none",
           "focus-visible:shadow-[0_0_0_0.1rem_var(--bg-color),0_0_0_0.2rem_var(--text-color)]",
           "autofill-fix",
-          props.showIndicator === true ? "pr-[1.85em]" : "",
+          props.field().options.validators ? "pr-[1.85em]" : "",
           props.class,
         )}
         type={props.type ?? "text"}
@@ -40,7 +39,7 @@
         dir={props.dir}
         maxLength={props.maxLength}
       />
-      <Show when={props.showIndicator}>
+      <Show when={props.field().options.validators}>
         <FieldIndicator field={props.field()} />
       </Show>
     </div>

frontend/src/ts/constants/sounds.ts

@@ -17,6 +17,16 @@ export const soundsConfig: SoundConfigType = {
   14: { numberOfSounds: 8 },
   15: { numberOfSounds: 5 },
   16: { numberOfSounds: 8 },
+  17: { numberOfSounds: 10 },
+  18: { numberOfSounds: 10 },
+  19: { numberOfSounds: 10 },
+  20: { numberOfSounds: 10 },
+  21: { numberOfSounds: 10 },
+  22: { numberOfSounds: 10 },
+  23: { numberOfSounds: 10 },
+  24: { numberOfSounds: 10 },
+  25: { numberOfSounds: 10 },
+  26: { numberOfSounds: 10 },
 };
 
 export type ClickSoundConfig = {

frontend/storybook/stories/Form.stories.tsx

@@ -64,7 +64,6 @@ export const withValidation = meta.story({
           children={(field) => (
             <InputField
               field={field}
-              showIndicator
               autocomplete="current-user"
               disabled={!isEditable()}
             />
@@ -79,7 +78,6 @@ export const withValidation = meta.story({
             <InputField
               field={field}
               type="password"
-              showIndicator
               autocomplete="current-password"
               disabled={!isEditable()}
             />

packages/schemas/src/configs.ts

@@ -144,6 +144,16 @@ export const PlaySoundOnClickSchema = z.enum([
   "14",
   "15",
   "16",
+  "17",
+  "18",
+  "19",
+  "20",
+  "21",
+  "22",
+  "23",
+  "24",
+  "25",
+  "26",
 ]);
 export type PlaySoundOnClick = z.infer<typeof PlaySoundOnClickSchema>;