feat(cms): admin quick-search across all content (MITHOME-120)
CI Pipeline with Test Management / 🧪 Run Tests & Generate Reports (push) Canceled after 0s
Test Reporting & Gherkin Analysis / 🧪 Run Tests & Generate Reports (push) Canceled after 0s
CI Pipeline with Test Management / 🐳 Docker Integration Tests (push) Canceled after 0s
CI Pipeline with Test Management / 🏗️ Build Docker Image (push) Canceled after 0s
CI Pipeline with Test Management / 📊 Generate Test Summary (push) Canceled after 0s
Test Reporting & Gherkin Analysis / 📊 Analyze Test Coverage (push) Canceled after 0s
Test Reporting & Gherkin Analysis / 🔄 Sync with Linear (push) Canceled after 0s
Test Reporting & Gherkin Analysis / ⚡ Performance Monitoring (push) Canceled after 0s

Adds a search box to the top of every Payload admin page
(admin.components.header) that searches by text across every field of
every Global and Collection, in both locales — something Payload has
no built-in equivalent for: collection list views only search their
own title/slug fields, and Globals have no list view at all.

Implementation is deliberately client-side and index-free rather than
@payloadcms/plugin-search (a server-side search collection kept in
sync via hooks): this project's entire content is 5 Globals + 2 small
Collections, so a plugin-managed search index would be disproportionate
maintenance for the actual data volume — the same reasoning already
applied to the logo editor (MITHOME-118). On first use, the component
fetches every Global/Collection doc in both locales via the existing
REST API (same-origin, admin session cookie), recursively flattens
every field to (path, value) pairs client-side, and filters by
case-insensitive substring as the user types. Each result links
straight to the right edit view (global or collection/id).

New: src/components/admin/QuickSearch.tsx. Registered via
payload.config.ts admin.components.header, which required a
generate:importmap run — the useful gotcha this surfaced: Payload
resolves component paths against admin.importMap.baseDir, which
defaults to process.cwd() (the proto/ the CLI is run from), not
dirname(payload.config.ts) — so the path needed to be
'./src/components/admin/QuickSearch#QuickSearch', not
'./components/admin/QuickSearch#QuickSearch'. Documented inline.

Verified live in the browser (not just tsc/lint): search finds matches
in both a Global (Home hero.cta.secondary.text / services description)
and a Collection (Partners name/url), shows source + field path +
locale + a snippet per result, clicking a result navigates to the
correct edit view, and the search state persists across client-side
admin navigation since the header component doesn't remount. Zero
console errors in a fresh tab. Full gate green: tsc, lint, unit tests
(51 passed), production build.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Do Siki
2026-09-12 00:03:13 +02:00
co-authored by Claude Sonnet 5
parent 3f72d714df
commit 74e40329a0
3 changed files with 293 additions and 0 deletions
+11
View File
@@ -14,6 +14,9 @@
* MITHOME-110: lokalizáció bekapcsolva (hu alapértelmezett, en). A mezőnkénti
* `localized: true` retrofit a Globals/LegalPages configokon külön ticket
* (MITHOME-111/112) — ez a ticket csak magát a mechanizmust kapcsolja be.
* MITHOME-120: admin gyorskeresés (QuickSearch) az admin.components.header
* slotba regisztrálva — teljes szöveges keresés minden Global/Collection
* mezőjében, mindkét locale-ban.
*/
import path from 'path'
import { fileURLToPath } from 'url'
@@ -40,6 +43,14 @@ export default buildConfig({
// jelszó-politika: MITHOME-90 (src/collections/Users.ts).
admin: {
user: Users.slug,
components: {
// MITHOME-120: gyorskeresés minden admin oldal tetején.
// WHY 'src/...' és nem './components/...': a Payload komponens-útvonal
// az admin.importMap.baseDir-hez relatív, ami alapértelmezésben
// process.cwd() (a `generate:importmap` a proto/ mappából fut, NEM a
// payload.config.ts mappájából).
header: ['./src/components/admin/QuickSearch#QuickSearch'],
},
},
editor: lexicalEditor(),