feat: add public condition search filters
Quality / test (push) Canceled after 0s

Add public condition lookup options, condition filtering, and stable price/recent sorting with URL-backed catalog controls.
This commit is contained in:
2026-09-09 02:06:15 -04:00
parent f4e4685ecc
commit 6dd138260b
8 changed files with 52 additions and 10 deletions
@@ -4,4 +4,8 @@ export async function registerPublicLookupRoutes(app, options) {
app.get('/public/lookups/categories', async () => ({ app.get('/public/lookups/categories', async () => ({
data: await catalogLookupRepository.listCategories(), data: await catalogLookupRepository.listCategories(),
})); }));
app.get('/public/lookups/conditions', async () => ({
data: (await catalogLookupRepository.listConditions()).map(({ id, name, code }) => ({ id, name, code })),
}));
} }
@@ -48,6 +48,7 @@ export function createListingRepository(db) {
const { const {
text = '', text = '',
category, category,
conditionId,
minPriceMinor, minPriceMinor,
maxPriceMinor, maxPriceMinor,
page = 1, page = 1,
@@ -68,6 +69,10 @@ export function createListingRepository(db) {
conditions.push(eq(products.categoryId, category)); conditions.push(eq(products.categoryId, category));
} }
if (typeof conditionId === 'string' && conditionId.trim().length > 0) {
conditions.push(eq(inventoryItems.conditionId, conditionId));
}
if (typeof minPriceMinor === 'number') { if (typeof minPriceMinor === 'number') {
conditions.push(sql`listings.asking_price_minor >= ${minPriceMinor}`); conditions.push(sql`listings.asking_price_minor >= ${minPriceMinor}`);
} }
@@ -18,6 +18,7 @@ export function normalizeSearchQuery(value) {
export function createSearchQuery({ export function createSearchQuery({
query = '', query = '',
category, category,
conditionId,
minPriceMinor, minPriceMinor,
maxPriceMinor, maxPriceMinor,
page = 1, page = 1,
@@ -58,6 +59,7 @@ export function createSearchQuery({
return { return {
text, text,
...(typeof category === 'string' && category.trim().length > 0 ? { category: category.trim() } : {}), ...(typeof category === 'string' && category.trim().length > 0 ? { category: category.trim() } : {}),
...(typeof conditionId === 'string' && conditionId.trim().length > 0 ? { conditionId: conditionId.trim() } : {}),
...(typeof minPriceMinor === 'number' ? { minPriceMinor } : {}), ...(typeof minPriceMinor === 'number' ? { minPriceMinor } : {}),
...(typeof maxPriceMinor === 'number' ? { maxPriceMinor } : {}), ...(typeof maxPriceMinor === 'number' ? { maxPriceMinor } : {}),
page, page,
@@ -27,6 +27,7 @@ export async function registerPublicSearchRoutes(app, options) {
const filters = { const filters = {
query: request.query.query, query: request.query.query,
category: request.query.category, category: request.query.category,
conditionId: request.query.conditionId,
minPriceMinor: coerceNumber(request.query.minPriceMinor, 'minPriceMinor', undefined), minPriceMinor: coerceNumber(request.query.minPriceMinor, 'minPriceMinor', undefined),
maxPriceMinor: coerceNumber(request.query.maxPriceMinor, 'maxPriceMinor', undefined), maxPriceMinor: coerceNumber(request.query.maxPriceMinor, 'maxPriceMinor', undefined),
page: coerceNumber(request.query.page, 'page', 1), page: coerceNumber(request.query.page, 'page', 1),
@@ -11,6 +11,7 @@ test('returns public search results with pagination metadata', async (testContex
assert.equal(filters.limit, 5); assert.equal(filters.limit, 5);
assert.equal(filters.includeSold, true); assert.equal(filters.includeSold, true);
assert.equal(filters.sort, 'price_low'); assert.equal(filters.sort, 'price_low');
assert.equal(filters.conditionId, 'condition-1');
return { return {
items: [{ id: 'listing-1', status: 'CLOSED' }], items: [{ id: 'listing-1', status: 'CLOSED' }],
pagination: { page: 2, limit: 5, total: 6, totalPages: 2 }, pagination: { page: 2, limit: 5, total: 6, totalPages: 2 },
@@ -22,7 +23,7 @@ test('returns public search results with pagination metadata', async (testContex
const response = await app.inject({ const response = await app.inject({
method: 'GET', method: 'GET',
url: '/api/v1/public/search?query=charizard&page=2&limit=5&includeSold=true&sort=price_low', url: '/api/v1/public/search?query=charizard&page=2&limit=5&includeSold=true&sort=price_low&conditionId=condition-1',
}); });
assert.equal(response.statusCode, 200); assert.equal(response.statusCode, 200);
@@ -59,4 +60,17 @@ test('returns active public category options', async (testContext) => {
const response = await app.inject({ method: 'GET', url: '/api/v1/public/lookups/categories' }); const response = await app.inject({ method: 'GET', url: '/api/v1/public/lookups/categories' });
assert.equal(response.statusCode, 200); assert.equal(response.statusCode, 200);
assert.deepEqual(response.json().data, [{ id: 'category-1', name: 'Trading Cards' }]); assert.deepEqual(response.json().data, [{ id: 'category-1', name: 'Trading Cards' }]);
});
test('returns public condition options without category internals', async (testContext) => {
const app = buildApp({
catalogLookupRepository: {
async listConditions() { return [{ id: 'condition-1', name: 'Near Mint', code: 'NM', categoryId: 'private-category' }]; },
},
});
testContext.after(() => app.close());
const response = await app.inject({ method: 'GET', url: '/api/v1/public/lookups/conditions' });
assert.equal(response.statusCode, 200);
assert.deepEqual(response.json().data, [{ id: 'condition-1', name: 'Near Mint', code: 'NM' }]);
}); });
+5 -4
View File
@@ -2,9 +2,10 @@ import { ref, watch } from 'vue';
import { searchCatalog } from '@/services/catalog-service.js'; import { searchCatalog } from '@/services/catalog-service.js';
export function useCatalogSearch({ initialQuery = '', initialCategory = '', initialMinPriceMinor, initialMaxPriceMinor, initialSort = 'recent', initialPage = 1 } = {}) { export function useCatalogSearch({ initialQuery = '', initialCategory = '', initialConditionId = '', initialMinPriceMinor, initialMaxPriceMinor, initialSort = 'recent', initialPage = 1 } = {}) {
const query = ref(initialQuery); const query = ref(initialQuery);
const category = ref(initialCategory); const category = ref(initialCategory);
const conditionId = ref(initialConditionId);
const minPriceMinor = ref(initialMinPriceMinor); const minPriceMinor = ref(initialMinPriceMinor);
const maxPriceMinor = ref(initialMaxPriceMinor); const maxPriceMinor = ref(initialMaxPriceMinor);
const sort = ref(initialSort); const sort = ref(initialSort);
@@ -20,7 +21,7 @@ export function useCatalogSearch({ initialQuery = '', initialCategory = '', init
error.value = null; error.value = null;
try { try {
const nextResult = await searchCatalog({ query: query.value, category: category.value, minPriceMinor: minPriceMinor.value, maxPriceMinor: maxPriceMinor.value, sort: sort.value, page: page.value }); const nextResult = await searchCatalog({ query: query.value, category: category.value, conditionId: conditionId.value, minPriceMinor: minPriceMinor.value, maxPriceMinor: maxPriceMinor.value, sort: sort.value, page: page.value });
if (currentRequestId === requestId) result.value = nextResult; if (currentRequestId === requestId) result.value = nextResult;
} catch (requestError) { } catch (requestError) {
if (currentRequestId === requestId) error.value = requestError; if (currentRequestId === requestId) error.value = requestError;
@@ -29,7 +30,7 @@ export function useCatalogSearch({ initialQuery = '', initialCategory = '', init
} }
} }
watch([query, category, minPriceMinor, maxPriceMinor, sort], () => { watch([query, category, conditionId, minPriceMinor, maxPriceMinor, sort], () => {
if (page.value !== 1) page.value = 1; if (page.value !== 1) page.value = 1;
else load(); else load();
}); });
@@ -41,5 +42,5 @@ export function useCatalogSearch({ initialQuery = '', initialCategory = '', init
} }
} }
return { query, category, minPriceMinor, maxPriceMinor, sort, page, result, isLoading, error, load, goToPage }; return { query, category, conditionId, minPriceMinor, maxPriceMinor, sort, page, result, isLoading, error, load, goToPage };
} }
+12 -4
View File
@@ -3,15 +3,17 @@ import { onMounted, ref, watch } from 'vue';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import { useCatalogSearch } from '@/composables/useCatalogSearch.js'; import { useCatalogSearch } from '@/composables/useCatalogSearch.js';
import { listPublicCategories } from '@/services/catalog-service.js'; import { listPublicCategories, listPublicConditions } from '@/services/catalog-service.js';
import ListingCard from '@/components/molecules/ListingCard.vue'; import ListingCard from '@/components/molecules/ListingCard.vue';
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
const categories = ref([]); const categories = ref([]);
const { query, category, minPriceMinor, maxPriceMinor, sort, page, result, isLoading, error, load, goToPage } = useCatalogSearch({ const conditions = ref([]);
const { query, category, conditionId, minPriceMinor, maxPriceMinor, sort, page, result, isLoading, error, load, goToPage } = useCatalogSearch({
initialQuery: typeof route.query.q === 'string' ? route.query.q : '', initialQuery: typeof route.query.q === 'string' ? route.query.q : '',
initialCategory: typeof route.query.category === 'string' ? route.query.category : '', initialCategory: typeof route.query.category === 'string' ? route.query.category : '',
initialConditionId: typeof route.query.conditionId === 'string' ? route.query.conditionId : '',
initialMinPriceMinor: Number.parseInt(route.query.min, 10) || undefined, initialMinPriceMinor: Number.parseInt(route.query.min, 10) || undefined,
initialMaxPriceMinor: Number.parseInt(route.query.max, 10) || undefined, initialMaxPriceMinor: Number.parseInt(route.query.max, 10) || undefined,
initialSort: typeof route.query.sort === 'string' ? route.query.sort : 'recent', initialSort: typeof route.query.sort === 'string' ? route.query.sort : 'recent',
@@ -19,14 +21,19 @@ const { query, category, minPriceMinor, maxPriceMinor, sort, page, result, isLoa
}); });
onMounted(async () => { onMounted(async () => {
await Promise.all([load(), listPublicCategories().then((items) => { categories.value = items; }).catch(() => {})]); await Promise.all([
load(),
listPublicCategories().then((items) => { categories.value = items; }).catch(() => {}),
listPublicConditions().then((items) => { conditions.value = items; }).catch(() => {}),
]);
}); });
watch([query, category, minPriceMinor, maxPriceMinor, sort, page], ([nextQuery, nextCategory, nextMin, nextMax, nextSort, nextPage]) => { watch([query, category, conditionId, minPriceMinor, maxPriceMinor, sort, page], ([nextQuery, nextCategory, nextCondition, nextMin, nextMax, nextSort, nextPage]) => {
router.replace({ router.replace({
query: { query: {
...(nextQuery ? { q: nextQuery } : {}), ...(nextQuery ? { q: nextQuery } : {}),
...(nextCategory ? { category: nextCategory } : {}), ...(nextCategory ? { category: nextCategory } : {}),
...(nextCondition ? { conditionId: nextCondition } : {}),
...(typeof nextMin === 'number' ? { min: String(nextMin) } : {}), ...(typeof nextMin === 'number' ? { min: String(nextMin) } : {}),
...(typeof nextMax === 'number' ? { max: String(nextMax) } : {}), ...(typeof nextMax === 'number' ? { max: String(nextMax) } : {}),
...(nextSort !== 'recent' ? { sort: nextSort } : {}), ...(nextSort !== 'recent' ? { sort: nextSort } : {}),
@@ -48,6 +55,7 @@ watch([query, category, minPriceMinor, maxPriceMinor, sort, page], ([nextQuery,
</label> </label>
<div class="catalog-filters"> <div class="catalog-filters">
<label>Category <select v-model="category"><option value="">All categories</option><option v-for="item in categories" :key="item.id" :value="item.id">{{ item.name }}</option></select></label> <label>Category <select v-model="category"><option value="">All categories</option><option v-for="item in categories" :key="item.id" :value="item.id">{{ item.name }}</option></select></label>
<label>Condition <select v-model="conditionId"><option value="">All conditions</option><option v-for="item in conditions" :key="item.id" :value="item.id">{{ item.name }} ({{ item.code }})</option></select></label>
<label>Min price (cents) <input v-model.number="minPriceMinor" type="number" min="0" /></label> <label>Min price (cents) <input v-model.number="minPriceMinor" type="number" min="0" /></label>
<label>Max price (cents) <input v-model.number="maxPriceMinor" type="number" min="0" /></label> <label>Max price (cents) <input v-model.number="maxPriceMinor" type="number" min="0" /></label>
<label>Sort <select v-model="sort"><option value="recent">Recently added</option><option value="price_low">Price: low to high</option><option value="price_high">Price: high to low</option></select></label> <label>Sort <select v-model="sort"><option value="recent">Recently added</option><option value="price_low">Price: low to high</option><option value="price_high">Price: high to low</option></select></label>
+8 -1
View File
@@ -1,9 +1,10 @@
const apiBaseUrl = import.meta.env?.VITE_API_BASE_URL ?? '/api/v1'; const apiBaseUrl = import.meta.env?.VITE_API_BASE_URL ?? '/api/v1';
export async function searchCatalog({ query = '', category = '', minPriceMinor, maxPriceMinor, sort = 'recent', page = 1, limit = 20 } = {}) { export async function searchCatalog({ query = '', category = '', conditionId = '', minPriceMinor, maxPriceMinor, sort = 'recent', page = 1, limit = 20 } = {}) {
const params = new URLSearchParams({ query, page: String(page), limit: String(limit) }); const params = new URLSearchParams({ query, page: String(page), limit: String(limit) });
if (sort !== 'recent') params.set('sort', sort); if (sort !== 'recent') params.set('sort', sort);
if (category) params.set('category', category); if (category) params.set('category', category);
if (conditionId) params.set('conditionId', conditionId);
if (typeof minPriceMinor === 'number') params.set('minPriceMinor', String(minPriceMinor)); if (typeof minPriceMinor === 'number') params.set('minPriceMinor', String(minPriceMinor));
if (typeof maxPriceMinor === 'number') params.set('maxPriceMinor', String(maxPriceMinor)); if (typeof maxPriceMinor === 'number') params.set('maxPriceMinor', String(maxPriceMinor));
const response = await fetch(`${apiBaseUrl}/public/search?${params}`); const response = await fetch(`${apiBaseUrl}/public/search?${params}`);
@@ -22,6 +23,12 @@ export async function listPublicCategories() {
return (await response.json()).data; return (await response.json()).data;
} }
export async function listPublicConditions() {
const response = await fetch(`${apiBaseUrl}/public/lookups/conditions`);
if (!response.ok) throw new Error('Conditions are unavailable.');
return (await response.json()).data;
}
export async function getPublicListing(id) { export async function getPublicListing(id) {
const response = await fetch(`${apiBaseUrl}/public/listings/${encodeURIComponent(id)}`); const response = await fetch(`${apiBaseUrl}/public/listings/${encodeURIComponent(id)}`);