ScanlationTemplate
Core Feature

Search & Filters

Powerful search functionality with advanced filtering and sorting options. All filters are URL-based for bookmarking and sharing.

Search Bar

Full-text search with form submission:

  • Search icon positioned inside the input field
  • Submit on Enter key to update URL with query parameter
  • Search across titles, descriptions, authors, and artists
  • Results displayed in responsive grid (30 items per page)

Status Filter

Filter series by publication status:

ongoing

Ongoing

completed

Completed

cancelled

Cancelled

dropped

Dropped

mass-released

Mass Released

coming-soon

Coming Soon

Type Filter

Filter by content type:

ManhwaManhuaMangaWebtoonComic

Sorting Options

Sort results by various criteria:

Latest Chapters

Most recently updated series first

sort=latest
Most Popular

Sorted by view count

sort=popular
Newest Added

Most recently added to the site

sort=newest
Oldest First

Oldest series first

sort=oldest
Most Chapters

Series with most chapters

sort=chapters
A-Z

Alphabetical by title

sort=alphabetical

Genre Tags (Three-State Toggle)

Genres use a three-state toggle system for powerful filtering:

NeutralGenre not filtered
IncludeMust have this genre
ExcludeMust NOT have this genre

Click to include → Click again to exclude → Click again to reset

ActionAdventureComedyDramaFantasyHorrorMysteryRomanceSci-FiSlice of LifeSportsSupernaturalThrillerIsekaiMartial ArtsSchool LifeShounenShoujoSeinenJoseiReincarnationSystemMurimHaremOverpowered

Advanced Filters

Additional filtering options available in the advanced section:

Min Chapters

Only series with at least X chapters

minChapters=
Max Chapters

Only series with at most X chapters

maxChapters=
Created After

Series added after a date

createdAfter=
Created Before

Series added before a date

createdBefore=

URL Parameters

All filter states are reflected in the URL for easy sharing and bookmarking:

# URL Parameter Reference

/search?q=dragon                    # Text search
/search?status=ongoing              # Status filter
/search?type=manhwa                 # Type filter
/search?sort=popular                # Sort order
/search?genres=action,fantasy       # Include genres (comma-separated)
/search?excludeGenres=romance       # Exclude genres
/search?minChapters=50              # Minimum chapters
/search?maxChapters=200             # Maximum chapters
/search?page=2                      # Pagination

# Combined Example
/search?q=solo&type=manhwa&genres=action,system&sort=popular&page=1

Pagination

  • 30 series displayed per page
  • Page number resets when filters change
  • Page state preserved in URL
  • Responsive grid layout (2 columns on mobile, 6 on desktop)

BrowseFilters Component

The main component that handles all search and filter functionality:

// Located at: src/components/search/browse-filters.tsx

// Exports for configuration
export const STATUS_OPTIONS = [...]
export const TYPE_OPTIONS = [...]
export const SORT_OPTIONS = [...]
export const GENRE_OPTIONS = [...]

// Component
export function BrowseFilters({ className }: BrowseFiltersProps)