feat: Add search bar to highlights page (#2155)

* feat: Add search bar to All highlights page

This commit adds a search bar to the "All highlights page" that allows users to search their highlights by text content or notes.

Changes:
- Added search method to Highlight model with SQL LIKE query on text and note fields
- Added search endpoint to highlights router with pagination support
- Updated AllHighlights component to include search input with debouncing
- Search input includes clear button and search icon
- Maintains existing infinite scroll pagination for search results

Technical details:
- Uses SQL ilike for case-insensitive search
- 300ms debounce to reduce API calls
- Conditionally uses search or getAll endpoint based on search query

* fix db query

* small fixes

---------

Co-authored-by: Claude <noreply@anthropic.com>

1 files changed, 22 insertions, 0 deletions

diff --git a/packages/trpc/routers/highlights.ts b/packages/trpc/routers/highlights.ts
index 65d99880..7338077a 100644
--- a/packages/trpc/routers/highlights.ts
+++ b/packages/trpc/routers/highlights.ts
@@ -7,6 +7,7 @@ import {
   zNewHighlightSchema,
   zUpdateHighlightSchema,
 } from "@karakeep/shared/types/highlights";
+import { zCursorV2 } from "@karakeep/shared/types/pagination";
 
 import { authedProcedure, router } from "../index";
 import { Highlight } from "../models/highlights";
@@ -51,6 +52,27 @@ export const highlightsAppRouter = router({
         nextCursor: result.nextCursor,
       };
     }),
+  search: authedProcedure
+    .input(
+      z.object({
+        text: z.string(),
+        cursor: zCursorV2.nullish(),
+        limit: z.number().optional().default(DEFAULT_NUM_HIGHLIGHTS_PER_PAGE),
+      }),
+    )
+    .output(zGetAllHighlightsResponseSchema)
+    .query(async ({ input, ctx }) => {
+      const result = await Highlight.search(
+        ctx,
+        input.text,
+        input.cursor,
+        input.limit,
+      );
+      return {
+        highlights: result.highlights.map((h) => h.asPublicHighlight()),
+        nextCursor: result.nextCursor,
+      };
+    }),
   delete: authedProcedure
     .input(z.object({ highlightId: z.string() }))
     .output(zHighlightSchema)