Cursorcursorintermediate
Add Full-Text Search to Next.js (Cursor Prompt)
Cursor prompt to add Supabase full-text search with tsvector columns and RPC search functions.
What you'll get
Full-text search with Supabase tsvector, RPC function, and a Cmd+K command palette component.
The Prompt
Add full-text search to this Next.js app using Supabase PostgreSQL text search.
FILES TO CREATE:
- supabase/migrations/add_search.sql — Migration for tsvector columns and search function
- src/lib/search.ts — Search utility functions
- src/app/api/search/route.ts — Search API endpoint
- src/components/search/SearchCommand.tsx — Command palette component (Cmd+K)
MIGRATION SQL:
1. Add a tsvector column "search_vector" to each searchable table.
2. Create a trigger that auto-updates search_vector on INSERT/UPDATE using to_tsvector('english', coalesce(title,'') || ' ' || coalesce(content,'')).
3. Create a GIN index on search_vector for fast queries.
4. Create an RPC function "search_content" that accepts a query string, converts it with plainto_tsquery, searches across tables, and returns ranked results with ts_rank.
COMPONENT:
- SearchCommand renders a dialog triggered by Cmd+K or a search icon.
- Debounce input at 300ms.
- Call the search API and display results grouped by type.
- Support keyboard navigation (arrow keys, Enter, Escape).
- Show recent searches from localStorage.
DO NOT:
- Install external search services (Algolia, Elasticsearch)
- Modify existing table structures beyond adding search_vector column
- Change existing page layouts
ENVIRONMENT VARIABLES:
- No additional variables needed (uses existing Supabase connection)Replace these variables
| Variable | Replace with |
|---|---|
| [SEARCHABLE_TABLES] | Tables and columns to enable search on |
Tips for best results
Use plainto_tsquery for user input (handles spaces naturally) instead of to_tsquery which requires boolean operators.
The GIN index is essential for performance — without it, search queries will do full table scans.
Follow-up prompts
Add semantic search
Add AI-powered semantic search using pgvector. Generate embeddings with OpenAI and store as vector columns for similarity search.