From 349a6f25a06def299b8a9c0cbd92f09436261384 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Eder=20S=C3=A1nchez?= <eder@katachi.mx>
Date: Tue, 2 Jun 2026 13:16:45 -0600
Subject: [PATCH 1/2] fix(admin): extend server-side content search to picker
 and MCP

The core server-side content search (?q=) landed via #1226. Extend it to
two surfaces that still post-filtered in memory:

- ContentPickerModal now pushes its search box to the server (search
  option -> ?q=), so it finds entries anywhere in a large collection
  instead of only the rows already loaded. Uses keepPreviousData to
  avoid flashing to empty between keystrokes and keeps load-more
  available while searching.
- MCP content_list gains a q parameter, so agents search server-side
  rather than post-filtering a page of results.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .changeset/content-picker-mcp-search.md       |  6 ++++
 .../src/components/ContentPickerModal.tsx     | 28 ++++++++++++-------
 packages/core/src/astro/types.ts              |  1 +
 packages/core/src/mcp/server.ts               |  7 +++++
 .../integration/mcp/content-misc.test.ts      | 19 +++++++++++++
 5 files changed, 51 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/content-picker-mcp-search.md

diff --git a/.changeset/content-picker-mcp-search.md b/.changeset/content-picker-mcp-search.md
new file mode 100644
index 000000000..39f808970
--- /dev/null
+++ b/.changeset/content-picker-mcp-search.md
@@ -0,0 +1,6 @@
+---
+"emdash": patch
+"@emdash-cms/admin": patch
+---
+
+Extend the new server-side content search (`?q=`) to two more surfaces. The `ContentPickerModal` (used when linking content from the editor) now pushes its search box to the server instead of filtering only the items already loaded, so it can find entries anywhere in a large collection; it uses `keepPreviousData` so the list doesn't flash to empty between keystrokes and keeps load-more available while searching. The MCP `content_list` tool also gains a `q` parameter, so agents can search a collection server-side instead of post-filtering a page of results.
diff --git a/packages/admin/src/components/ContentPickerModal.tsx b/packages/admin/src/components/ContentPickerModal.tsx
index 99f6a5406..f994ea69b 100644
--- a/packages/admin/src/components/ContentPickerModal.tsx
+++ b/packages/admin/src/components/ContentPickerModal.tsx
@@ -8,7 +8,7 @@
 import { Button, Dialog, Input, Loader, Select } from "@cloudflare/kumo";
 import { useLingui } from "@lingui/react/macro";
 import { MagnifyingGlass, FolderOpen, X } from "@phosphor-icons/react";
-import { useQuery } from "@tanstack/react-query";
+import { keepPreviousData, useQuery } from "@tanstack/react-query";
 import * as React from "react";
 
 import { fetchCollections, fetchContentList, getDraftStatus } from "../lib/api";
@@ -55,13 +55,21 @@ export function ContentPickerModal({ open, onOpenChange, onSelect }: ContentPick
 		}
 	}, [collections, selectedCollection]);
 
+	// Push search to the server so the picker can find items across the
+	// entire collection, not just whatever has already been scrolled into
+	// view. Falls back to no-search when the box is empty.
+	const searchParam = debouncedSearch.trim() || undefined;
 	const { data: contentResult, isLoading: contentLoading } = useQuery({
-		queryKey: ["content-picker", selectedCollection, { limit: 50 }],
-		queryFn: () => fetchContentList(selectedCollection, { limit: 50 }),
+		queryKey: ["content-picker", selectedCollection, { limit: 50, search: searchParam }],
+		queryFn: () => fetchContentList(selectedCollection, { limit: 50, search: searchParam }),
 		enabled: open && !!selectedCollection,
+		// Keep the previous page's rows visible while the debounced search
+		// refetches, so the list doesn't flash to empty between keystrokes.
+		placeholderData: keepPreviousData,
 	});
 
-	// Sync initial page into accumulated items
+	// Sync initial page into accumulated items. The query re-runs when the
+	// debounced search changes, so we reset the accumulator each time.
 	React.useEffect(() => {
 		if (contentResult) {
 			setAllItems(contentResult.items);
@@ -76,6 +84,7 @@ export function ContentPickerModal({ open, onOpenChange, onSelect }: ContentPick
 			const result = await fetchContentList(selectedCollection, {
 				limit: 50,
 				cursor: nextCursor,
+				search: searchParam,
 			});
 			setAllItems((prev) => [...prev, ...result.items]);
 			setNextCursor(result.nextCursor);
@@ -84,11 +93,8 @@ export function ContentPickerModal({ open, onOpenChange, onSelect }: ContentPick
 		}
 	};
 
-	const filteredItems = React.useMemo(() => {
-		if (!debouncedSearch) return allItems;
-		const query = debouncedSearch.toLowerCase();
-		return allItems.filter((item) => getItemTitle(item).toLowerCase().includes(query));
-	}, [allItems, debouncedSearch]);
+	// Items arrive pre-filtered from the server; alias for readability.
+	const filteredItems = allItems;
 
 	// Reset state when modal opens or collection changes
 	React.useEffect(() => {
@@ -220,7 +226,9 @@ export function ContentPickerModal({ open, onOpenChange, onSelect }: ContentPick
 									</button>
 								);
 							})}
-							{nextCursor && !searchQuery && (
+							{/* Search is server-side and paginated, so results can span
+							    multiple pages too — keep load-more available while searching. */}
+							{nextCursor && (
 								<div className="pt-2 text-center">
 									<Button
 										variant="outline"
diff --git a/packages/core/src/astro/types.ts b/packages/core/src/astro/types.ts
index 3a2f51a8d..228bbd862 100644
--- a/packages/core/src/astro/types.ts
+++ b/packages/core/src/astro/types.ts
@@ -233,6 +233,7 @@ export interface EmDashHandlers {
 			orderBy?: string;
 			order?: "asc" | "desc";
 			locale?: string;
+			q?: string;
 		},
 	) => Promise<HandlerResponse>;
 
diff --git a/packages/core/src/mcp/server.ts b/packages/core/src/mcp/server.ts
index e099a9867..e796dc869 100644
--- a/packages/core/src/mcp/server.ts
+++ b/packages/core/src/mcp/server.ts
@@ -460,6 +460,12 @@ export function createMcpServer(): McpServer {
 					.string()
 					.optional()
 					.describe("Filter by locale (e.g. 'en', 'fr'). Only relevant when i18n is enabled."),
+				q: z
+					.string()
+					.trim()
+					.max(200)
+					.optional()
+					.describe("Case-insensitive substring search across title, name, and slug."),
 			}),
 			annotations: { readOnlyHint: true },
 		},
@@ -477,6 +483,7 @@ export function createMcpServer(): McpServer {
 					orderBy: args.orderBy,
 					order: args.order,
 					locale: args.locale,
+					q: args.q,
 				}),
 			);
 		},
diff --git a/packages/core/tests/integration/mcp/content-misc.test.ts b/packages/core/tests/integration/mcp/content-misc.test.ts
index 2e36e69a9..2ec53bb30 100644
--- a/packages/core/tests/integration/mcp/content-misc.test.ts
+++ b/packages/core/tests/integration/mcp/content-misc.test.ts
@@ -463,6 +463,25 @@ describe("soft-delete visibility", () => {
 		expect(items).toHaveLength(1);
 		expect(items[0]?.id).toBe(extractJson<{ item: { id: string } }>(b).item.id);
 	});
+
+	it("content_list filters by the q search parameter", async () => {
+		const apple = await harness.client.callTool({
+			name: "content_create",
+			arguments: { collection: "post", data: { title: "Apple harvest" } },
+		});
+		await harness.client.callTool({
+			name: "content_create",
+			arguments: { collection: "post", data: { title: "Banana bread" } },
+		});
+
+		const list = await harness.client.callTool({
+			name: "content_list",
+			arguments: { collection: "post", q: "apple" },
+		});
+		const items = extractJson<{ items: Array<{ id: string }> }>(list).items;
+		expect(items).toHaveLength(1);
+		expect(items[0]?.id).toBe(extractJson<{ item: { id: string } }>(apple).item.id);
+	});
 });
 
 describe("edit-while-trashed", () => {

From c4cb0e99a6654d8f1ddfbb8d0b5792d471c2b082 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Eder=20S=C3=A1nchez?= <eder@katachi.mx>
Date: Tue, 2 Jun 2026 13:25:26 -0600
Subject: [PATCH 2/2] fix(admin): derive content picker list from query pages

Replace the manual accumulator (allItems/nextCursor mirrored from a
useQuery) with useInfiniteQuery, matching the ContentList pattern. The
accumulator could lose loaded pages on any background refetch (window
focus, cache invalidation) and, with keepPreviousData, could fire
load-more with a stale cursor against a freshly-changed search. Deriving
the list straight from query pages removes both windows; search stays in
the query key so changing it starts a fresh page chain.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../src/components/ContentPickerModal.tsx     | 73 +++++++------------
 1 file changed, 27 insertions(+), 46 deletions(-)

diff --git a/packages/admin/src/components/ContentPickerModal.tsx b/packages/admin/src/components/ContentPickerModal.tsx
index f994ea69b..ee588752a 100644
--- a/packages/admin/src/components/ContentPickerModal.tsx
+++ b/packages/admin/src/components/ContentPickerModal.tsx
@@ -8,7 +8,7 @@
 import { Button, Dialog, Input, Loader, Select } from "@cloudflare/kumo";
 import { useLingui } from "@lingui/react/macro";
 import { MagnifyingGlass, FolderOpen, X } from "@phosphor-icons/react";
-import { keepPreviousData, useQuery } from "@tanstack/react-query";
+import { keepPreviousData, useInfiniteQuery, useQuery } from "@tanstack/react-query";
 import * as React from "react";
 
 import { fetchCollections, fetchContentList, getDraftStatus } from "../lib/api";
@@ -38,9 +38,6 @@ export function ContentPickerModal({ open, onOpenChange, onSelect }: ContentPick
 	const [searchQuery, setSearchQuery] = React.useState("");
 	const debouncedSearch = useDebouncedValue(searchQuery, 300);
 	const [selectedCollection, setSelectedCollection] = React.useState<string>("");
-	const [allItems, setAllItems] = React.useState<ContentItem[]>([]);
-	const [nextCursor, setNextCursor] = React.useState<string | undefined>();
-	const [isLoadingMore, setIsLoadingMore] = React.useState(false);
 
 	const { data: collections = [] } = useQuery({
 		queryKey: ["collections"],
@@ -59,50 +56,38 @@ export function ContentPickerModal({ open, onOpenChange, onSelect }: ContentPick
 	// entire collection, not just whatever has already been scrolled into
 	// view. Falls back to no-search when the box is empty.
 	const searchParam = debouncedSearch.trim() || undefined;
-	const { data: contentResult, isLoading: contentLoading } = useQuery({
+	const {
+		data,
+		isLoading: contentLoading,
+		fetchNextPage,
+		hasNextPage,
+		isFetchingNextPage,
+	} = useInfiniteQuery({
+		// `search` is part of the key, so switching searches starts a fresh
+		// page chain rather than appending to the old query's cursor.
 		queryKey: ["content-picker", selectedCollection, { limit: 50, search: searchParam }],
-		queryFn: () => fetchContentList(selectedCollection, { limit: 50, search: searchParam }),
+		queryFn: ({ pageParam }) =>
+			fetchContentList(selectedCollection, { limit: 50, cursor: pageParam, search: searchParam }),
+		initialPageParam: undefined as string | undefined,
+		getNextPageParam: (lastPage) => lastPage.nextCursor,
 		enabled: open && !!selectedCollection,
-		// Keep the previous page's rows visible while the debounced search
+		// Keep the previous query's pages visible while the debounced search
 		// refetches, so the list doesn't flash to empty between keystrokes.
 		placeholderData: keepPreviousData,
 	});
 
-	// Sync initial page into accumulated items. The query re-runs when the
-	// debounced search changes, so we reset the accumulator each time.
-	React.useEffect(() => {
-		if (contentResult) {
-			setAllItems(contentResult.items);
-			setNextCursor(contentResult.nextCursor);
-		}
-	}, [contentResult]);
-
-	const handleLoadMore = async () => {
-		if (!nextCursor || isLoadingMore) return;
-		setIsLoadingMore(true);
-		try {
-			const result = await fetchContentList(selectedCollection, {
-				limit: 50,
-				cursor: nextCursor,
-				search: searchParam,
-			});
-			setAllItems((prev) => [...prev, ...result.items]);
-			setNextCursor(result.nextCursor);
-		} finally {
-			setIsLoadingMore(false);
-		}
-	};
-
-	// Items arrive pre-filtered from the server; alias for readability.
-	const filteredItems = allItems;
+	// Items arrive pre-filtered and paginated from the server. Deriving the
+	// list straight from the query pages (instead of mirroring into local
+	// state) means a background refetch can't wipe out loaded pages and a
+	// search change can't fetch with a stale cursor.
+	const filteredItems = React.useMemo(() => data?.pages.flatMap((p) => p.items) ?? [], [data]);
 
-	// Reset state when modal opens or collection changes
+	// Reset transient UI state when the modal opens. The query itself resets
+	// via its key, so there's no accumulator to clear here.
 	React.useEffect(() => {
 		if (open) {
 			setSearchQuery("");
 			setSelectedCollection("");
-			setAllItems([]);
-			setNextCursor(undefined);
 		}
 	}, [open]);
 
@@ -153,11 +138,7 @@ export function ContentPickerModal({ open, onOpenChange, onSelect }: ContentPick
 					</div>
 					<Select
 						value={selectedCollection}
-						onValueChange={(v) => {
-							setSelectedCollection(v ?? "");
-							setAllItems([]);
-							setNextCursor(undefined);
-						}}
+						onValueChange={(v) => setSelectedCollection(v ?? "")}
 						items={Object.fromEntries(collections.map((col) => [col.slug, col.label]))}
 						aria-label={t`Collection`}
 					/>
@@ -228,15 +209,15 @@ export function ContentPickerModal({ open, onOpenChange, onSelect }: ContentPick
 							})}
 							{/* Search is server-side and paginated, so results can span
 							    multiple pages too — keep load-more available while searching. */}
-							{nextCursor && (
+							{hasNextPage && (
 								<div className="pt-2 text-center">
 									<Button
 										variant="outline"
 										size="sm"
-										onClick={handleLoadMore}
-										disabled={isLoadingMore}
+										onClick={() => void fetchNextPage()}
+										disabled={isFetchingNextPage}
 									>
-										{isLoadingMore ? (
+										{isFetchingNextPage ? (
 											<>
 												<Loader size="sm" /> {t`Loading...`}
 											</>