Refactor player handling: replace player arrays with IDs, implement PlayerSelector component
This commit is contained in:
@@ -11,10 +11,10 @@
|
||||
import { Input } from "@components/ui/input";
|
||||
import { Popover, PopoverContent, PopoverTrigger } from "@components/ui/popover";
|
||||
import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "@components/ui/command";
|
||||
import { players } from "@components/stores/stores";
|
||||
import { Check } from "lucide-svelte";
|
||||
import { cn } from "@components/utils";
|
||||
import DateTimePicker from "@components/ui/datetime-picker/DateTimePicker.svelte";
|
||||
import PlayerSelector from "@components/ui/PlayerSelector.svelte";
|
||||
|
||||
let debounceTimer: NodeJS.Timeout;
|
||||
const debounce = <T,>(value: T, func: (value: T) => void) => {
|
||||
@@ -27,11 +27,11 @@
|
||||
let actionText = $state("");
|
||||
let serverText = $state("");
|
||||
let fullText = $state("");
|
||||
let actors = $state<string[]>([]);
|
||||
let actors = $state<number[]>([]);
|
||||
let actionTypes = $state<string[]>([]);
|
||||
let timeGreater = $state<ZonedDateTime>(now("Europe/Berlin").subtract({ months: 1 }));
|
||||
let timeLess = $state<ZonedDateTime>(now("Europe/Berlin"));
|
||||
let serverOwner = $state<string[]>([]);
|
||||
let serverOwner = $state<number[]>([]);
|
||||
let velocity = $state(false);
|
||||
let sorting = $state("DESC");
|
||||
|
||||
@@ -118,56 +118,12 @@
|
||||
</SelectContent>
|
||||
</Select>
|
||||
|
||||
<Popover>
|
||||
<PopoverTrigger>
|
||||
<Button variant="outline" class="mr-2 {actors && 'text-muted-foreground'}">Spieler Filter ({actors.length})</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent class="p-0">
|
||||
<Command shouldFilter={false}>
|
||||
<CommandInput bind:value={playerSearch} placeholder="Search players..." />
|
||||
<CommandList>
|
||||
<CommandEmpty>No Players found :(</CommandEmpty>
|
||||
<CommandGroup heading="Players">
|
||||
{#each $players.filter((v) => v.name.toLowerCase().includes(playerSearch.toLowerCase())).filter((v, i) => i < 50) as player (player.uuid)}
|
||||
<CommandItem
|
||||
value={player.name}
|
||||
onSelect={() => (actors = actors.includes(player.uuid) ? actors.filter((v) => v !== player.uuid) : [...actors, player.uuid])}
|
||||
keywords={[player.uuid]}
|
||||
>
|
||||
<Check class={cn("mr-2 size-4", !actors.includes(player.uuid) && "text-transparent")} />
|
||||
{player.name}
|
||||
</CommandItem>
|
||||
{/each}
|
||||
</CommandGroup>
|
||||
</CommandList>
|
||||
</Command>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
<Popover>
|
||||
<PopoverTrigger>
|
||||
<Button variant="outline" class="mr-2 {serverOwner && 'text-muted-foreground'}">Server Owner ({serverOwner.length})</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent class="p-0">
|
||||
<Command shouldFilter={false}>
|
||||
<CommandInput bind:value={ownerSearch} placeholder="Search players..." />
|
||||
<CommandList>
|
||||
<CommandEmpty>No Players found :(</CommandEmpty>
|
||||
<CommandGroup heading="Players">
|
||||
{#each $players.filter((v) => v.name.toLowerCase().includes(ownerSearch.toLowerCase())).filter((v, i) => i < 50) as player (player.uuid)}
|
||||
<CommandItem
|
||||
value={player.name}
|
||||
onSelect={() => (serverOwner = serverOwner.includes(player.uuid) ? serverOwner.filter((v) => v !== player.uuid) : [...serverOwner, player.uuid])}
|
||||
keywords={[player.uuid]}
|
||||
>
|
||||
<Check class={cn("mr-2 size-4", !serverOwner.includes(player.uuid) && "text-transparent")} />
|
||||
{player.name}
|
||||
</CommandItem>
|
||||
{/each}
|
||||
</CommandGroup>
|
||||
</CommandList>
|
||||
</Command>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
<div class="mr-2">
|
||||
<PlayerSelector bind:value={actors} multiple placeholder="Spieler Filter" />
|
||||
</div>
|
||||
<div class="mr-2">
|
||||
<PlayerSelector bind:value={serverOwner} multiple placeholder="Server Owner" />
|
||||
</div>
|
||||
<div class="mr-2">
|
||||
<DateTimePicker bind:value={timeGreater} />
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user