feat: add total hits count (#73)

Author: bitnimble

.claude/bash-redirects.json

@@ -10,7 +10,8 @@
         "Bash(bun tsc *)",
         "Bash(bun prettier *)",
         "Bash(bunx prettier *)",
-        "Bash(tsc *)"
+        "Bash(tsc *)",
+        "Bash(./node_modules/.bin/tsc *)"
       ],
       "reason": "Use bun lint, bun typecheck, or bun format instead of invoking tools directly."
     },

src/app/api/fake_api.ts

@@ -46,11 +46,11 @@ export class FakeApi implements Api {
 
   async findMaps(): Promise<FindMapsResponse> {
     await delay();
-    return { success: true, maps: fakeMaps };
+    return { success: true, maps: fakeMaps, totalCount: fakeMaps.length };
   }
   async searchMaps(_req: SearchMapsRequest): Promise<FindMapsResponse> {
     await delay();
-    return { success: true, maps: fakeMaps };
+    return { success: true, maps: fakeMaps, totalCount: fakeMaps.length };
   }
   async getMap(id: string): Promise<GetMapResponse> {
     await delay(1000);

src/app/api/maps/route.ts

@@ -59,5 +59,5 @@ export async function GET(req: NextRequest): Promise<NextResponse> {
       errorMessage: 'Could not retrieve map: ' + joinErrors(result),
     });
   }
-  return send({ success: true, maps: result.value });
+  return send({ success: true, maps: result.value.maps, totalCount: result.value.totalCount });
 }

src/app/map_list_presenter.ts

@@ -19,6 +19,7 @@ export class MapListStore {
   @observable accessor selectedMaps = new Map<string, true>();
   @observable accessor lastSelectedMapIndex: number | undefined = undefined;
   @observable accessor maps: PDMap[] | undefined = undefined;
+  @observable accessor totalCount: number | undefined = undefined;
   @observable accessor hasMore = true;
   @observable accessor loadingMore = false;
 
@@ -151,7 +152,10 @@ export class MapListPresenter {
       }
     }
     const sort = this.getTableSortParams();
-    runInAction(() => (this.store.maps = undefined));
+    runInAction(() => {
+      this.store.maps = undefined;
+      this.store.totalCount = undefined;
+    });
     const resp = await this.api.searchMaps({
       query: this.store.query,
       limit: SEARCH_LIMIT,
@@ -162,6 +166,7 @@ export class MapListPresenter {
     if (resp.success) {
       runInAction(() => {
         this.store.maps = resp.maps;
+        this.store.totalCount = resp.totalCount;
         this.store.hasMore = resp.maps.length >= SEARCH_LIMIT;
       });
     }

src/app/search.tsx

@@ -10,6 +10,7 @@ import { encodeFilter } from 'schema/map_filter';
 import { Button } from 'ui/base/button/button';
 import { filterIcon } from 'ui/base/icons/filter_icon';
 import { searchIcon } from 'ui/base/icons/search_icon';
+import { T } from 'ui/base/text/text';
 import { Textbox } from 'ui/base/textbox/textbox';
 import styles from './search.module.css';
 
@@ -83,6 +84,11 @@ export const Search = observer((props: { store: MapListStore; presenter: MapList
       </div>
       {!store.filtersExpanded && <ActiveFilterPills store={store} onSearch={onSearch} />}
       {store.filtersExpanded && <FilterBuilder store={store} onSearch={onSearch} />}
+      {store.totalCount != null && (
+        <T.Tiny color="grey" display="block">
+          {store.totalCount} {store.totalCount === 1 ? 'map' : 'maps'}
+        </T.Tiny>
+      )}
     </div>
   );
 });

src/schema/maps.ts

@@ -78,6 +78,8 @@ export type DeleteMapResponse = z.infer<typeof DeleteMapResponse>;
 /* GET findMaps */
 export const FindMapsSuccess = ApiSuccess.extend({
   maps: z.array(PDMap),
+  // Total number of maps matching the query, ignoring pagination.
+  totalCount: z.number(),
 });
 export type FindMapsSuccess = z.infer<typeof FindMapsSuccess>;
 

src/services/maps/maps_repo.ts

@@ -157,7 +157,7 @@ export class MapsRepo {
     offset: number;
     limit: number;
     filter?: FilterNode;
-  }): PromisedResult<PDMap[], DbError> {
+  }): PromisedResult<{ maps: PDMap[]; totalCount: number }, DbError> {
     const { user, query, offset, limit, sort, sortDirection, filter } = searchOptions;
     const response = await this.searchIndex.search(query, {
       offset,
@@ -176,7 +176,13 @@ export class MapsRepo {
     }
 
     const maps = new Map(mapsResult.value.map((m) => [m.id, m]));
-    return { success: true, value: searchResults.map((m) => maps.get(m.id)).filter(exists) };
+    return {
+      success: true,
+      value: {
+        maps: searchResults.map((m) => maps.get(m.id)).filter(exists),
+        totalCount: response.totalCount,
+      },
+    };
   }
 
   async getMap(mapId: string, userId?: string): PromisedResult<PDMap, GetMapError> {

src/services/maps/tests/maps_repo.test.ts

@@ -40,7 +40,7 @@ describe('maps repo', () => {
       limit: 5,
     });
     expect(result.success).toBe(true);
-    const ids = (result as Extract<typeof result, { success: true }>).value.map((m) => m.id);
+    const ids = (result as Extract<typeof result, { success: true }>).value.maps.map((m) => m.id);
     expect(ids.includes('3')).toBe(false);
   });
 

src/services/maps/tests/maps_repo_filters.test.ts

@@ -41,7 +41,7 @@ async function searchIds(filter: FilterNode, query = '') {
   if (!result.success) {
     throw new Error('searchMaps failed');
   }
-  return result.value.map((m) => m.id).sort();
+  return result.value.maps.map((m) => m.id).sort();
 }
 
 describe('maps repo search filters', () => {
@@ -192,6 +192,25 @@ describe('maps repo search filters', () => {
     expect(ids).toEqual(['200']);
   });
 
+  it('reports the full match count regardless of the page limit', async () => {
+    for (const id of ['600', '601', '602']) {
+      await insertMap({ id, artist: 'CountTest' });
+    }
+    const { mapsRepo } = await getServerContext();
+    const result = await mapsRepo.searchMaps({
+      query: '',
+      offset: 0,
+      limit: 2,
+      filter: { type: 'cmp', field: 'artist', op: 'contains', value: 'CountTest' },
+    });
+    if (!result.success) {
+      throw new Error('searchMaps failed');
+    }
+    // The page is capped at the limit, but totalCount counts all matching maps.
+    expect(result.value.maps).toHaveLength(2);
+    expect(result.value.totalCount).toBe(3);
+  });
+
   describe('LIKE-wildcard escaping', () => {
     it('treats % in a contains value literally', async () => {
       await insertMap({ id: '300', description: '100% complete' });

src/services/search/postgres.ts

@@ -48,15 +48,15 @@ export class PostgresIndex implements SearchIndex {
     }
 
     let results;
+    let totalCount: number;
     const queryMostRecent = () => {
-      return db
-        .select(
-          'maps',
-          db.conditions.and(
-            { visibility: MapVisibility.PUBLIC },
-            ...(filter ? [compileFilter(filter)] : [])
-          ),
-          {
+      const conditions = db.conditions.and(
+        { visibility: MapVisibility.PUBLIC },
+        ...(filter ? [compileFilter(filter)] : [])
+      );
+      return Promise.all([
+        db
+          .select('maps', conditions, {
             columns: ['id'],
             lateral: sortLateral,
             order: sortOrder ?? {
@@ -65,20 +65,21 @@ export class PostgresIndex implements SearchIndex {
             },
             limit,
             offset,
-          }
-        )
-        .run(pool);
+          })
+          .run(pool),
+        db.count('maps', conditions).run(pool),
+      ]);
     };
 
     if (query.trim() === '') {
-      results = await queryMostRecent();
+      [results, totalCount] = await queryMostRecent();
     } else {
       const [{ tsquery }] = await db.sql<
         db.Parameter,
         [{ tsquery: string }]
       >`select websearch_to_tsquery('english', ${db.param(query)})::text as tsquery`.run(pool);
       if (tsquery.trim() === '') {
-        results = await queryMostRecent();
+        [results, totalCount] = await queryMostRecent();
       } else {
         const tsqueryPartial = db.sql<maps.SQL, string>`(${db.param(tsquery)} || ':*')::tsquery`;
 
@@ -91,15 +92,14 @@ export class PostgresIndex implements SearchIndex {
         const ftsMatch = db.sql<maps.SQL, boolean>`${'fts'} @@ ${tsqueryPartial}`;
         const rank = db.sql<maps.SQL, number>`ts_rank_cd(${'fts'}, ${tsqueryPartial})`;
 
-        results = await db
-          .select(
-            'maps',
-            db.conditions.and(
-              { visibility: MapVisibility.PUBLIC },
-              db.sql`(${exactMatch} OR ${ftsMatch})`,
-              ...(filter ? [compileFilter(filter)] : [])
-            ),
-            {
+        const conditions = db.conditions.and(
+          { visibility: MapVisibility.PUBLIC },
+          db.sql`(${exactMatch} OR ${ftsMatch})`,
+          ...(filter ? [compileFilter(filter)] : [])
+        );
+        [results, totalCount] = await Promise.all([
+          db
+            .select('maps', conditions, {
               columns: ['id'],
               lateral: sortLateral,
               order: sortOrder ?? [
@@ -112,14 +112,16 @@ export class PostgresIndex implements SearchIndex {
                 rank,
                 exactMatch,
               },
-            }
-          )
-          .run(pool);
+            })
+            .run(pool),
+          db.count('maps', conditions).run(pool),
+        ]);
       }
     }
 
     return {
       hits: results.map((r) => ({ id: r.id })),
+      totalCount,
     };
   }