add WR-only filter to player times list

src/api/offstylesApi.ts

@@ -104,6 +104,7 @@ class OffstylesApi extends Api {
         break;
       case 'player':
         params.append("steamid", filter.scope.steamid);
+        if (filter.scope.wr !== undefined) params.append("wr", filter.scope.wr.toString());
         break;
       case 'globals':
         if (filter.scope.recent) params.append("recent", "true");

src/components/MapDetails.vue

@@ -36,7 +36,7 @@
     };
   });
 
-  const filterChanged = async (name: 'style' | 'sort' | 'best' | 'has_replay' | 'invalidated', value: string | number | boolean | undefined) => {
+  const filterChanged = async (name: 'style' | 'sort' | 'best' | 'has_replay' | 'wr' | 'invalidated', value: string | number | boolean | undefined) => {
     await router.replace({ query: urlParams.updateMany({ [name]: value }) });
   };
 

src/components/PlayerDetails.vue

@@ -50,6 +50,7 @@
       sort: (q.sort as SortOrder) || 'Newest',
       best: q.best !== undefined ? q.best === 'true' : true,
       hasReplay: q.has_replay === 'true',
+      wr: q.wr === 'true',
       invalidated: q.invalidated !== undefined ? q.invalidated === 'true' : undefined,
     };
   });
@@ -212,7 +213,7 @@
     }
   };
 
-  const filterChanged = async (name: 'style' | 'sort' | 'best' | 'has_replay' | 'invalidated', value: string | number | boolean | undefined) => {
+  const filterChanged = async (name: 'style' | 'sort' | 'best' | 'has_replay' | 'wr' | 'invalidated', value: string | number | boolean | undefined) => {
     await router.replace({ query: urlParams.updateMany({ [name]: value }) });
   };
 
@@ -283,6 +284,8 @@
       :sort="currentFilter.sort"
       :best="currentFilter.best"
       :hasReplay="currentFilter.hasReplay"
+      :wr="currentFilter.wr"
+      :showWr="true"
       :invalidated="currentFilter.invalidated"
       :styleOptions="playerStyleOptions"
       @filter-Changed="filterChanged"

src/components/TimesFilterBar.vue

@@ -9,7 +9,7 @@
   import { useModerationStore } from '@/stores/moderation';
 
   type InvalidatedChoice = 'hide' | 'mix' | 'only';
-  type FilterKey = 'style' | 'sort' | 'best' | 'has_replay' | 'invalidated';
+  type FilterKey = 'style' | 'sort' | 'best' | 'has_replay' | 'wr' | 'invalidated';
 
   const SORT_OPTIONS: SortOrder[] = ['Fastest', 'Slowest', 'Newest', 'Oldest'];
   const INVALIDATED_OPTIONS: { value: InvalidatedChoice, label: string }[] = [
@@ -23,6 +23,8 @@
     sort: SortOrder,
     best: boolean,
     hasReplay: boolean,
+    wr?: boolean,
+    showWr?: boolean,
     invalidated: boolean | undefined,
     styleOptions: number[],
   }>();
@@ -62,6 +64,11 @@
     emit('filter-Changed', 'has_replay', checked ? true : undefined);
   };
 
+  const wrChanged = (event: Event) => {
+    const checked = (event.target as HTMLInputElement).checked;
+    emit('filter-Changed', 'wr', checked ? true : undefined);
+  };
+
   const invalidatedChanged = (value: InvalidatedChoice) => {
     const mapped = value === 'hide' ? undefined : value === 'only';
     emit('filter-Changed', 'invalidated', mapped);
@@ -116,6 +123,11 @@
       <span>Has replay</span>
     </label>
 
+    <label v-if="props.showWr" class="flex items-center gap-2 cursor-pointer">
+      <input type="checkbox" :checked="!!props.wr" @change="wrChanged">
+      <span>Only show WR times</span>
+    </label>
+
     <Listbox
       v-if="moderationStore.canInvalidateTimes.value"
       :model-value="invalidatedValue"

src/types/TimesFilter.ts

@@ -2,7 +2,7 @@ export type SortOrder = 'Fastest' | 'Slowest' | 'Newest' | 'Oldest';
 
 export type TimesScope =
   | { kind: 'map'; map: string }
-  | { kind: 'player'; steamid: string }
+  | { kind: 'player'; steamid: string; wr?: boolean }
   | { kind: 'globals'; wr?: boolean; recent?: boolean };
 
 export interface TimesFilter {

src/utils/timesFilterFromQuery.ts

@@ -60,7 +60,8 @@ const forPlayer = function(
   defaults: FilterDefaults,
   canSeeInvalidated: boolean,
 ): TimesFilter {
-  return { ...baseFilter({ query, defaults, canSeeInvalidated }), scope: { kind: 'player', steamid } };
+  const wr = query.wr === 'true' ? true : undefined;
+  return { ...baseFilter({ query, defaults, canSeeInvalidated }), scope: { kind: 'player', steamid, wr } };
 };
 
 const forGlobals = function(