feat: add filtering to all entity list pages

- Tracking configs: filter by name + provider type
- Template configs: filter by name + provider type
- Command configs: filter by name + provider type
- Notification trackers: filter by name + provider
- Command trackers: filter by name + provider
- Targets: filter by name (type filtering already existed)
- Nav badge counts include system-owned entities (user_id=0)
- Shows "no items match filter" vs "no items yet" empty states
This commit is contained in:
2026-03-22 20:22:53 +03:00
parent 63437c1841
commit 7cbba9d3fd
9 changed files with 165 additions and 17 deletions
@@ -24,7 +24,13 @@
return tpl?.name || `#${id}`;
}
let configs = $derived(commandConfigsCache.items);
let allCmdConfigs = $derived(commandConfigsCache.items);
let filterText = $state('');
let filterType = $state('');
let configs = $derived(allCmdConfigs.filter(c =>
(!filterText || c.name.toLowerCase().includes(filterText.toLowerCase())) &&
(!filterType || c.provider_type === filterType)
));
let cmdTemplateConfigs = $derived(commandTemplateConfigsCache.items);
const templateItems = $derived(cmdTemplateConfigs
.filter((c: any) => c.provider_type === form.provider_type)
@@ -229,10 +235,27 @@
</Card>
{/if}
{#if configs.length === 0 && !showForm}
{#if !showForm && allCmdConfigs.length > 0}
<div class="flex items-center gap-2 mb-3">
<input type="text" bind:value={filterText} placeholder={t('common.filterByName')}
class="flex-1 px-3 py-1.5 border border-[var(--color-border)] rounded-md text-sm bg-[var(--color-background)]" />
<select bind:value={filterType}
class="px-3 py-1.5 border border-[var(--color-border)] rounded-md text-sm bg-[var(--color-background)]">
<option value="">{t('common.allTypes')}</option>
<option value="immich">Immich</option>
<option value="gitea">Gitea</option>
</select>
</div>
{/if}
{#if allCmdConfigs.length === 0 && !showForm}
<Card>
<EmptyState icon="mdiConsoleLine" message={t('commandConfig.noConfigs')} />
</Card>
{:else if configs.length === 0 && !showForm}
<Card>
<EmptyState icon="mdiFilterOff" message={t('common.noFilterResults')} />
</Card>
{:else}
<div class="space-y-3 stagger-children">
{#each configs as cfg}