maybe fix last10Average

Author: fehmer

frontend/src/ts/collections/results.ts

@@ -33,8 +33,11 @@ import {
   reconcileLocalTagPB,
   saveLocalTagPB,
   __nonReactive as tagsNonReactive,
+  useActiveTagsLiveQuery,
 } from "./tags";
 import { applyIdWorkaround } from "./utils/misc";
+import { getConfig } from "../config/store";
+import { getMode2 } from "../utils/misc";
 
 export type ResultsQueryState = {
   difficulty: SnapshotResult<Mode>["difficulty"][];
@@ -550,14 +553,29 @@ export type CurrentSettingsFilter = {
 };
 
 // oxlint-disable-next-line typescript/explicit-function-return-type
-export function useUserAverage10LiveQuery(options: CurrentSettingsFilter) {
+export function useUserAverage10LiveQuery() {
+  const tags = useActiveTagsLiveQuery();
+
   return useLiveQuery((q) =>
     q
       .from({
         //we use sub-query to filter first and then aggregate
-        last10: buildSettingsResultsQuery(options, {
-          tagIds: tagsNonReactive.getActiveTags().map((it) => it._id),
-        })
+        last10: q
+          .from({ r: resultsCollection })
+          .where(({ r }) => eq(r.mode, getConfig.mode))
+          .where(({ r }) => eq(r.mode2, getMode2(getConfig, null))) //TODO read the current quote without creating a circle
+          .where(({ r }) => eq(r.punctuation, getConfig.punctuation))
+          .where(({ r }) => eq(r.numbers, getConfig.numbers))
+          .where(({ r }) => eq(r.language, getConfig.language))
+          .where(({ r }) => eq(r.difficulty, getConfig.difficulty))
+          .where(({ r }) => eq(r.lazyMode, getConfig.lazyMode))
+          .where(({ r }) =>
+            or(
+              false,
+              tags().length === 0,
+              ...tags().map((it) => inArray(it._id, r.tags)),
+            ),
+          )
           .orderBy(({ r }) => r.timestamp, "desc")
           .limit(10),
       })

frontend/src/ts/components/test/modes-notice/Last10Average.tsx

@@ -1,45 +1,54 @@
 import { createMemo, JSXElement, Show } from "solid-js";
 
+import { useUserAverage10LiveQuery } from "../../../collections/results";
 import { getConfig } from "../../../config/store";
 import {
   isAuthenticated,
   showCommandLineForConfig,
 } from "../../../states/core";
 import { Formatting } from "../../../utils/format";
+import AsyncContent from "../../common/AsyncContent";
 import { Button } from "../../common/Button";
 
 export function Last10Average(): JSXElement {
-  const _format = createMemo(() => new Formatting(getConfig));
+  const format = createMemo(() => new Formatting(getConfig));
+  const last10 = useUserAverage10LiveQuery();
 
   return (
     <Show when={isAuthenticated() && getConfig.showAverage !== "off"}>
-      average
-      <Button
-        variant="text"
-        fa={{ icon: "fa-chart-bar" }}
-        onClick={() => showCommandLineForConfig("showAverage")}
-      >
-        avg:
-        {/*}
-        <Show
-          when={
-            getConfig.showAverage === "speed" ||
-            getConfig.showAverage === "both"
-          }
-        >
-          <span>
-            {format().typingSpeed(last10()?.wpm)} {getConfig.typingSpeedUnit}
-          </span>
-        </Show>
-        <Show
-          when={
-            getConfig.showAverage === "acc" || getConfig.showAverage === "both"
-          }
-        >
-          <span>{format().accuracy(last10()?.acc)} acc</span>
-        </Show>
-        {*/}
-      </Button>
+      <AsyncContent collections={{ last10 }}>
+        {({ last10Data }) => (
+          <Show when={last10Data().length > 0}>
+            <Button
+              variant="text"
+              fa={{ icon: "fa-chart-bar" }}
+              onClick={() => showCommandLineForConfig("showAverage")}
+            >
+              <Show
+                when={
+                  getConfig.showAverage === "speed" ||
+                  getConfig.showAverage === "both"
+                }
+              >
+                <span>
+                  {format().typingSpeed(last10Data()?.at(0)?.wpm ?? 0)}{" "}
+                  {getConfig.typingSpeedUnit}
+                </span>
+              </Show>
+              <Show
+                when={
+                  getConfig.showAverage === "acc" ||
+                  getConfig.showAverage === "both"
+                }
+              >
+                <span>
+                  {format().accuracy(last10Data()?.at(0)?.acc ?? 0)} acc
+                </span>
+              </Show>
+            </Button>
+          </Show>
+        )}
+      </AsyncContent>
     </Show>
   );
 }

frontend/src/ts/components/test/modes-notice/TestModesNotice.tsx

@@ -23,6 +23,7 @@ import {
 import { Button } from "../../common/Button";
 import { Fa } from "../../common/Fa";
 import { Kbd } from "../../common/Kbd";
+import { Last10Average } from "./Last10Average";
 
 export function TestModesNotice() {
   return (
@@ -37,6 +38,7 @@ export function TestModesNotice() {
       <Difficulty />
       <BlindMode />
       <LazyMode />
+      <Last10Average />
       {/* pace caret */}
       {/* average */}
       {/* pb */}