demostf/frontend
1
0
Fork 0
mirror of https://codeberg.org/demostf/frontend.git synced 2026-06-03 18:24:12 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

filter clear

Browse source
This commit is contained in:
Robin Appelman 2023-04-16 13:32:28 +02:00
commit 28782ff609
6 changed files with 77 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

30
script/filterbar.tsx
View file

@ -16,6 +16,8 @@ export const FilterBar = ({maps, api, onChange}: FilterBarProps) => {
const playerOptions = createAsyncOptions(search => api.searchPlayer(search));
const playerFormat = player => player.name;
const [initialMode, setInitialMode] = createSignal("", {equals: false});
const [initialMap, setInitialMap] = createSignal("", {equals: false});
const [filterSet, setFilterSet] = createSignal({
mode: "",
@ -28,18 +30,40 @@ export const FilterBar = ({maps, api, onChange}: FilterBarProps) => {
<Select class="mode" onChange={mode => setFilterSet({
...filterSet(),
mode
})} placeholder="All Types" {...modes} />
})} initialValue={initialMode()} placeholder="All Types" {...modes} />
<Reset reset={() => {
setInitialMode("");
onChange({
...filterSet(),
mode: "",
});
}}/>
<Select class="maps" onChange={map => setFilterSet({
...filterSet(),
map
})} placeholder="All Maps" {...mapOptions} />
})} initialValue={initialMap()} placeholder="All Maps" {...mapOptions} />
<Reset reset={() => {
setInitialMap("");
console.log({
...filterSet(),
map: "",
});
onChange({
...filterSet(),
map: "",
});
}}/>
<Select class="players" onChange={players => setFilterSet({
...filterSet(),
players
})} multiple placeholder="All Players" format={playerFormat} {...playerOptions} />
})} multiple placeholder="All Players" format={playerFormat} {...playerOptions} />
</div>;
}
export const Reset = ({reset}) => {
return <button onMouseDown={reset} class="reset">X</button>;
}
export interface FilterSet {
mode: string,
map: string,