diff --git a/src/components/GameFilters.astro b/src/components/GameFilters.astro
new file mode 100644
index 0000000..f5de26d
--- /dev/null
+++ b/src/components/GameFilters.astro
@@ -0,0 +1,124 @@
+---
+import type { Category, Publisher } from '../types/game';
+
+interface Props {
+ categories: Category[];
+ publishers: Publisher[];
+}
+
+const { categories, publishers } = Astro.props;
+---
+
+
+
+
Filter games
+
+
+
+
+
+
+
+
+
diff --git a/src/lib/categories.test.ts b/src/lib/categories.test.ts
new file mode 100644
index 0000000..22f21de
--- /dev/null
+++ b/src/lib/categories.test.ts
@@ -0,0 +1,26 @@
+import { describe, it, expect, beforeEach } from 'vitest';
+import { createTestDatabase } from '../../db/test-helpers';
+import { categories } from '../../db/schema';
+import type { Database } from './db';
+import { getAllCategories } from './categories';
+
+describe('categories data-access helpers', () => {
+ let db: Database;
+
+ beforeEach(async () => {
+ db = await createTestDatabase();
+ });
+
+ it('returns all categories ordered by name', async () => {
+ await db.insert(categories).values({ name: 'Strategy', description: 'cat' });
+ await db.insert(categories).values({ name: 'Arcade', description: 'cat' });
+
+ const all = await getAllCategories(db);
+ expect(all.map((c) => c.name)).toEqual(['Arcade', 'Strategy']);
+ expect(all[0]).toEqual({ id: expect.any(Number), name: 'Arcade' });
+ });
+
+ it('returns an empty array when there are no categories', async () => {
+ expect(await getAllCategories(db)).toEqual([]);
+ });
+});
diff --git a/src/lib/categories.ts b/src/lib/categories.ts
new file mode 100644
index 0000000..6f89a40
--- /dev/null
+++ b/src/lib/categories.ts
@@ -0,0 +1,17 @@
+import { asc } from 'drizzle-orm';
+import type { Category } from '../types/game';
+import { categories } from '../../db/schema';
+import type { Database } from './db';
+
+/**
+ * Returns all categories with their IDs and names, ordered by name.
+ *
+ * @param db - The database connection to query.
+ * @returns The categories' IDs and names.
+ */
+export async function getAllCategories(db: Database): Promise
{
+ return db
+ .select({ id: categories.id, name: categories.name })
+ .from(categories)
+ .orderBy(asc(categories.name));
+}
diff --git a/src/lib/games.test.ts b/src/lib/games.test.ts
index efea6b6..9458bb8 100644
--- a/src/lib/games.test.ts
+++ b/src/lib/games.test.ts
@@ -64,3 +64,101 @@ describe('games data-access helpers', () => {
expect(await getGameById(db, 99999)).toBeNull();
});
});
+
+async function seedFilterableGames(db: Database): Promise<{
+ strategyId: number;
+ puzzleId: number;
+ pubOneId: number;
+ pubTwoId: number;
+}> {
+ const [strategy] = await db
+ .insert(categories)
+ .values({ name: 'Strategy', description: 'cat' })
+ .returning({ id: categories.id });
+ const [puzzle] = await db
+ .insert(categories)
+ .values({ name: 'Puzzle', description: 'cat' })
+ .returning({ id: categories.id });
+ const [pubOne] = await db
+ .insert(publishers)
+ .values({ name: 'Pub One', description: 'pub' })
+ .returning({ id: publishers.id });
+ const [pubTwo] = await db
+ .insert(publishers)
+ .values({ name: 'Pub Two', description: 'pub' })
+ .returning({ id: publishers.id });
+
+ await db.insert(games).values({
+ title: 'Strategy One',
+ description: 'd',
+ starRating: 4,
+ categoryId: strategy.id,
+ publisherId: pubOne.id,
+ });
+ await db.insert(games).values({
+ title: 'Strategy Two',
+ description: 'd',
+ starRating: 4,
+ categoryId: strategy.id,
+ publisherId: pubTwo.id,
+ });
+ await db.insert(games).values({
+ title: 'Puzzle One',
+ description: 'd',
+ starRating: 4,
+ categoryId: puzzle.id,
+ publisherId: pubOne.id,
+ });
+ await db.insert(games).values({
+ title: 'Puzzle Two',
+ description: 'd',
+ starRating: 4,
+ categoryId: puzzle.id,
+ publisherId: pubTwo.id,
+ });
+
+ return { strategyId: strategy.id, puzzleId: puzzle.id, pubOneId: pubOne.id, pubTwoId: pubTwo.id };
+}
+
+describe('getAllGames filtering', () => {
+ let db: Database;
+
+ beforeEach(async () => {
+ db = await createTestDatabase();
+ });
+
+ it('returns all games when no filters are provided', async () => {
+ await seedFilterableGames(db);
+ expect(await getAllGames(db)).toHaveLength(4);
+ });
+
+ it('filters games by a single category', async () => {
+ const { strategyId } = await seedFilterableGames(db);
+ const filtered = await getAllGames(db, { categoryIds: [strategyId] });
+ expect(filtered.map((g) => g.title)).toEqual(['Strategy One', 'Strategy Two']);
+ });
+
+ it('filters games by multiple categories (OR within the group)', async () => {
+ const { strategyId, puzzleId } = await seedFilterableGames(db);
+ const filtered = await getAllGames(db, { categoryIds: [strategyId, puzzleId] });
+ expect(filtered).toHaveLength(4);
+ });
+
+ it('filters games by publisher', async () => {
+ const { pubOneId } = await seedFilterableGames(db);
+ const filtered = await getAllGames(db, { publisherIds: [pubOneId] });
+ expect(filtered.map((g) => g.title)).toEqual(['Puzzle One', 'Strategy One']);
+ });
+
+ it('combines category and publisher filters (AND across groups)', async () => {
+ const { strategyId, pubTwoId } = await seedFilterableGames(db);
+ const filtered = await getAllGames(db, { categoryIds: [strategyId], publisherIds: [pubTwoId] });
+ expect(filtered.map((g) => g.title)).toEqual(['Strategy Two']);
+ });
+
+ it('returns an empty array when no games match the combined filters', async () => {
+ const { puzzleId, pubOneId } = await seedFilterableGames(db);
+ const filtered = await getAllGames(db, { categoryIds: [puzzleId], publisherIds: [pubOneId + 999] });
+ expect(filtered).toEqual([]);
+ });
+});
diff --git a/src/lib/games.ts b/src/lib/games.ts
index 4ed218e..5362cc5 100644
--- a/src/lib/games.ts
+++ b/src/lib/games.ts
@@ -1,8 +1,21 @@
-import { eq, asc } from 'drizzle-orm';
+import { eq, asc, and, inArray, type SQL } from 'drizzle-orm';
import type { Database } from './db';
import { games, categories, publishers } from '../../db/schema';
import type { Game } from '../types/game';
+/** Optional filters for narrowing the game list by category and/or publisher. */
+export interface GameFilters {
+ categoryIds?: number[];
+ publisherIds?: number[];
+}
+
+function buildGameFilterCondition(filters?: GameFilters): SQL | undefined {
+ return and(
+ filters?.categoryIds?.length ? inArray(games.categoryId, filters.categoryIds) : undefined,
+ filters?.publisherIds?.length ? inArray(games.publisherId, filters.publisherIds) : undefined,
+ );
+}
+
const gameSelection = {
id: games.id,
title: games.title,
@@ -50,9 +63,11 @@ function baseGamesQuery(db: Database) {
.leftJoin(publishers, eq(games.publisherId, publishers.id));
}
-/** All games ordered by title. */
-export async function getAllGames(db: Database): Promise {
- const rows = await baseGamesQuery(db).orderBy(asc(games.title));
+/** All games ordered by title, optionally narrowed by category and/or publisher. */
+export async function getAllGames(db: Database, filters?: GameFilters): Promise {
+ const rows = await baseGamesQuery(db)
+ .where(buildGameFilterCondition(filters))
+ .orderBy(asc(games.title));
return rows.map(mapGame);
}
diff --git a/src/lib/publishers.test.ts b/src/lib/publishers.test.ts
new file mode 100644
index 0000000..28b6439
--- /dev/null
+++ b/src/lib/publishers.test.ts
@@ -0,0 +1,26 @@
+import { describe, it, expect, beforeEach } from 'vitest';
+import { createTestDatabase } from '../../db/test-helpers';
+import { publishers } from '../../db/schema';
+import type { Database } from './db';
+import { getAllPublishers } from './publishers';
+
+describe('publishers data-access helpers', () => {
+ let db: Database;
+
+ beforeEach(async () => {
+ db = await createTestDatabase();
+ });
+
+ it('returns all publishers ordered by name', async () => {
+ await db.insert(publishers).values({ name: 'Zed Games', description: 'pub' });
+ await db.insert(publishers).values({ name: 'Acme Games', description: 'pub' });
+
+ const all = await getAllPublishers(db);
+ expect(all.map((p) => p.name)).toEqual(['Acme Games', 'Zed Games']);
+ expect(all[0]).toEqual({ id: expect.any(Number), name: 'Acme Games' });
+ });
+
+ it('returns an empty array when there are no publishers', async () => {
+ expect(await getAllPublishers(db)).toEqual([]);
+ });
+});
diff --git a/src/lib/publishers.ts b/src/lib/publishers.ts
new file mode 100644
index 0000000..c70d65f
--- /dev/null
+++ b/src/lib/publishers.ts
@@ -0,0 +1,17 @@
+import { asc } from 'drizzle-orm';
+import type { Publisher } from '../types/game';
+import { publishers } from '../../db/schema';
+import type { Database } from './db';
+
+/**
+ * Returns all publishers with their IDs and names, ordered by name.
+ *
+ * @param db - The database connection to query.
+ * @returns The publishers' IDs and names.
+ */
+export async function getAllPublishers(db: Database): Promise {
+ return db
+ .select({ id: publishers.id, name: publishers.name })
+ .from(publishers)
+ .orderBy(asc(publishers.name));
+}
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 5ad3cfa..60da4e2 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -3,12 +3,18 @@ import Layout from '../layouts/Layout.astro';
import GameCard from '../components/GameCard.astro';
import PageHero from '../components/PageHero.astro';
import EmptyState from '../components/EmptyState.astro';
+import GameFilters from '../components/GameFilters.astro';
import { getDatabase } from '../lib/db';
import { getAllGames } from '../lib/games';
+import { getAllCategories } from '../lib/categories';
+import { getAllPublishers } from '../lib/publishers';
export const prerender = true;
-const games = await getAllGames(getDatabase());
+const db = getDatabase();
+const games = await getAllGames(db);
+const categories = await getAllCategories(db);
+const publishers = await getAllPublishers(db);
---
@@ -24,10 +30,19 @@ const games = await getAllGames(getDatabase());
{games.length === 0 ? (
) : (
-
- {games.map((game) => )}
-
+ <>
+ {(categories.length > 0 || publishers.length > 0) && (
+
+ )}
+
+ {games.map((game) => )}
+
+
+
+
+
)}
+