Skip to content

Add searchable/filterable publications archive - #32

Open
acmiyaguchi wants to merge 1 commit into
mainfrom
feat/publication-search
Open

Add searchable/filterable publications archive#32
acmiyaguchi wants to merge 1 commit into
mainfrom
feat/publication-search

Conversation

@acmiyaguchi

Copy link
Copy Markdown
Contributor

Summary

Closes #22. Adds a client-side search and filter UI to the publications page using a Svelte web component + Fuse.js.

  • <pub-search> web component built with Vite + Svelte, compiled to a single JS bundle
  • Fuse.js fuzzy search across title, authors, abstract, keywords, and venue
  • Year and venue dropdown filters with AND logic
  • Static fallback — without JS, the existing publication list renders as before
  • Docker pipeline updated — Node.js 22 added to the image; npm run build runs automatically before Hugo
  • 15 Playwright e2e tests covering search, filters, combined state, empty results, and dropdown population

Architecture

Hugo (static)                    Vite + Svelte (interactive)
─────────────                    ──────────────────────────
publications.html                ui/src/PubSearch.svelte
  ├─ JSON data blob                ├─ search input
  ├─ static <ul> fallback          ├─ year/venue dropdowns
  ├─ <pub-search> element          ├─ Fuse.js fuzzy search
  └─ JSON-LD (always in DOM)       └─ filtered results list

Hugo emits publication metadata as a JSON blob. The web component reads it, builds a Fuse.js index, and renders the interactive UI. The built JS (assets/js/pub-search.js) is gitignored — Hugo's asset pipeline handles minify + fingerprint at build time.

Test plan

  • cd ui && npm install && npm run build generates assets/js/pub-search.js
  • docker compose up --build serves the page with interactive search
  • Fuzzy search works (e.g. "BirdCLEF" finds the correct paper)
  • Year/venue filters narrow results correctly
  • Combined search + filter works
  • "No publications match" shown for zero results
  • Clearing search restores full list
  • Static fallback visible when JS disabled
  • Dark/light mode styling adapts via CSS variables
  • All 15 Playwright tests pass

Implements issue #22: a Svelte web component (<pub-search>) that provides
fuzzy text search via Fuse.js, year/venue dropdown filters, and expandable
abstracts for the publications page.

Architecture:
- ui/ directory with Vite + Svelte builds to assets/js/pub-search.js
- Hugo partial emits publication data as JSON for the component
- Static publication list preserved as no-JS fallback
- Dockerfile updated with Node.js for the build pipeline
- 15 Playwright e2e tests covering search, filters, and edge cases
@cloudflare-workers-and-pages

Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
dsgt-arc 63064df Commit Preview URL

Branch Preview URL
Apr 17 2026, 07:32 AM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Publications: add searchable/filterable archive with abstract discovery

1 participant