Filters that display but do not narrow the list, or that OR across types instead of AND, return products that violate the shopper's explicit constraints — a $0-$50 selection that still shows $120 items destroys trust on the spot. Users correlate broken filters with a broken store and leave. Faceted navigation that ignores query parameters also generates duplicate-content SEO penalties because every filter URL serves the same full catalog.
Medium because broken filters silently break purchase intent across every category page and erode SEO simultaneously.
Build the where clause conditionally so each active filter narrows the result set with AND semantics, and make sure price bounds use gte/lte rather than OR. Place the logic in src/app/api/products/route.ts:
let query: any = {}
if (categoryFilter) {
query.categories = { some: { id: { in: categoryFilter } } }
}
if (priceMin && priceMax) {
query.price = { gte: priceMin, lte: priceMax }
}
const results = await prisma.product.findMany({ where: query })
ID: ecommerce-catalog.search-discovery.filters-working
Severity: medium
What to look for: Count all filter-related components and API parameters in the codebase: filter UI components (src/components/filters/), URL search parameters handling, and API route query parameter parsing. Enumerate each filter type found: category, price range, brand, color, size, rating, availability. For each filter, check whether the filter logic uses AND semantics (all filters must match) or OR semantics, and whether the filter actually modifies the database query.
Pass criteria: At least 2 filter types are implemented and correctly narrow the product list. Filters use AND semantics across different filter types (category AND price range). Count all filter types and report: "X filter types found: [list]. AND semantics across types: [yes/no]."
Fail criteria: Filters are displayed but do not affect the product list, or filter logic is incorrect (e.g., uses OR instead of AND, inverts the range, or ignores certain filter parameters).
Skip (N/A) when: The project has no filtering functionality — confirmed by finding 0 filter components, no filter URL parameters, and no filter-related query logic.
Cross-reference: For filter URL structure and SEO, the SEO Fundamentals audit covers faceted navigation and canonical URLs.
Cross-reference: For filter accessibility and keyboard navigation, the Accessibility Fundamentals audit covers checkbox groups and form control patterns.
Cross-reference: For filter performance with large catalogs, the Performance Core audit covers query optimization and pagination patterns.
Detail on fail: "Category filter in src/components/filters/CategoryFilter.tsx sends URL param but src/app/api/products/route.ts ignores it — all products returned regardless" or "Price range filter in src/app/api/products/route.ts uses OR logic instead of AND — selecting $0-$50 also shows products over $50"
Remediation: Implement correct filter logic in src/app/api/products/route.ts:
let query = {}
if (categoryFilter) {
query.categories = { some: { id: { in: categoryFilter } } }
}
if (priceMin && priceMax) {
query.price = { gte: priceMin, lte: priceMax }
}
const results = await prisma.product.findMany({ where: query })