{#snippet filterFormContent()}
Status
Any
Ongoing
Completed
Genres (all must match)
{#each allGenres as g (g.id)} {@const on = selectedGenres.some((x) => x.id === g.id)}
toggleGenre(g)} data-testid={`genre-filter-${g.name}`} > {g.name}
{/each}
Tags (all must match)
{#if selectedTags.length > 0}
{#each selectedTags as t (t.id)}
removeTag(t)} removeLabel={`Remove tag ${t.name}`} testid={`tag-filter-chip-${t.name}`} /> {/each}
{/if}
0} aria-autocomplete="list" aria-activedescendant={tagSuggestHighlight >= 0 ? `${tagSuggestListId}-opt-${tagSuggestHighlight}` : undefined} data-testid="tag-filter-input" /> {#if tagSuggestions.length > 0}
{#each tagSuggestions as s, i (s.id)}
(tagSuggestHighlight = i)} onclick={() => pickTag(s)} data-testid={`tag-filter-suggestion-${s.name}`} >
{s.name}
{/each}
{/if}
{#if activeFilterCount > 0}
Clear filters
{/if} {/snippet}
Mangas
Page search
(filtersOpen = !filtersOpen)} aria-expanded={filtersOpen} aria-controls="filters-panel" data-testid="filters-toggle" >
Filters
{#if activeFilterCount > 0}
{activeFilterCount}
{/if}
(sortSheetOpen = true)} data-testid="sort-chip" >
{sortLabel}
{#if activeFilterCount > 0}
{#if statusFilter}
{/if} {#each selectedGenres as g (g.id)}
toggleGenre(g)} removeLabel={`Remove genre ${g.name}`} testid={`active-filter-genre-${g.name}`} /> {/each} {#each selectedTags as t (t.id)}
removeTag(t)} removeLabel={`Remove tag ${t.name}`} testid={`active-filter-tag-${t.name}`} /> {/each}
{/if} {#if filtersOpen && !isMobileViewport}
{@render filterFormContent()}
{/if}
Sort
Recent
Title (A→Z)
(filtersOpen = false)} testid="filter-sheet" > {@render filterFormContent()}
(sortSheetOpen = false)} testid="sort-sheet" >
pickSort('recent')} />
Recent
pickSort('title')} />
Title (A→Z)
{#if loading}
Loading…
{:else if error}
{error}
{:else if mangas.length === 0}
No mangas yet.
Upload one
.
{:else} {#if total !== null}
Showing {rangeStart}–{rangeEnd} of {total}
{/if}
{#each mangas as m (m.id)}
{/each}
{/if}