@girardmedia/bootspring 1.2.0 → 2.0.3

package/skills/patterns/search/filtering.md

@@ -1,329 +0,0 @@
-# Filtering and Sorting Patterns
-
-Patterns for filtering and sorting data.
-
-## URL-Based Filters
-
-```typescript
-// lib/filters.ts
-import { Prisma } from '@prisma/client'
-
-interface FilterParams {
-  category?: string
-  minPrice?: string
-  maxPrice?: string
-  status?: string
-  sort?: string
-  order?: 'asc' | 'desc'
-  page?: string
-  limit?: string
-}
-
-export function buildProductFilters(params: FilterParams) {
-  const where: Prisma.ProductWhereInput = {}
-
-  if (params.category) {
-    where.categoryId = params.category
-  }
-
-  if (params.minPrice || params.maxPrice) {
-    where.price = {}
-    if (params.minPrice) {
-      where.price.gte = parseFloat(params.minPrice)
-    }
-    if (params.maxPrice) {
-      where.price.lte = parseFloat(params.maxPrice)
-    }
-  }
-
-  if (params.status) {
-    where.status = params.status
-  }
-
-  const orderBy: Prisma.ProductOrderByWithRelationInput = {}
-  const sortField = params.sort || 'createdAt'
-  const sortOrder = params.order || 'desc'
-  orderBy[sortField as keyof typeof orderBy] = sortOrder
-
-  const page = parseInt(params.page ?? '1')
-  const limit = parseInt(params.limit ?? '10')
-
-  return {
-    where,
-    orderBy,
-    skip: (page - 1) * limit,
-    take: limit
-  }
-}
-```
-
-## Filter API Route
-
-```typescript
-// app/api/products/route.ts
-import { buildProductFilters } from '@/lib/filters'
-
-export async function GET(request: Request) {
-  const { searchParams } = new URL(request.url)
-
-  const params = {
-    category: searchParams.get('category') ?? undefined,
-    minPrice: searchParams.get('minPrice') ?? undefined,
-    maxPrice: searchParams.get('maxPrice') ?? undefined,
-    status: searchParams.get('status') ?? undefined,
-    sort: searchParams.get('sort') ?? undefined,
-    order: searchParams.get('order') as 'asc' | 'desc' ?? undefined,
-    page: searchParams.get('page') ?? undefined,
-    limit: searchParams.get('limit') ?? undefined
-  }
-
-  const { where, orderBy, skip, take } = buildProductFilters(params)
-
-  const [products, total] = await Promise.all([
-    prisma.product.findMany({
-      where,
-      orderBy,
-      skip,
-      take,
-      include: { category: true }
-    }),
-    prisma.product.count({ where })
-  ])
-
-  return Response.json({
-    products,
-    pagination: {
-      page: parseInt(params.page ?? '1'),
-      limit: take,
-      total,
-      totalPages: Math.ceil(total / take)
-    }
-  })
-}
-```
-
-## Filter UI Component
-
-```tsx
-// components/ProductFilters.tsx
-'use client'
-
-import { useRouter, useSearchParams, usePathname } from 'next/navigation'
-import { useState, useCallback } from 'react'
-
-interface Category {
-  id: string
-  name: string
-}
-
-export function ProductFilters({ categories }: { categories: Category[] }) {
-  const router = useRouter()
-  const pathname = usePathname()
-  const searchParams = useSearchParams()
-
-  const createQueryString = useCallback(
-    (updates: Record<string, string | null>) => {
-      const params = new URLSearchParams(searchParams)
-
-      Object.entries(updates).forEach(([key, value]) => {
-        if (value === null) {
-          params.delete(key)
-        } else {
-          params.set(key, value)
-        }
-      })
-
-      // Reset to page 1 when filters change
-      if (!updates.page) {
-        params.set('page', '1')
-      }
-
-      return params.toString()
-    },
-    [searchParams]
-  )
-
-  const updateFilters = (updates: Record<string, string | null>) => {
-    router.push(`${pathname}?${createQueryString(updates)}`)
-  }
-
-  return (
-    <div className="space-y-6">
-      {/* Category filter */}
-      <div>
-        <h3 className="font-medium">Category</h3>
-        <div className="mt-2 space-y-2">
-          {categories.map(category => (
-            <label key={category.id} className="flex items-center gap-2">
-              <input
-                type="radio"
-                name="category"
-                checked={searchParams.get('category') === category.id}
-                onChange={() => updateFilters({ category: category.id })}
-              />
-              {category.name}
-            </label>
-          ))}
-          <button
-            onClick={() => updateFilters({ category: null })}
-            className="text-sm text-blue-600"
-          >
-            Clear
-          </button>
-        </div>
-      </div>
-
-      {/* Price range */}
-      <div>
-        <h3 className="font-medium">Price Range</h3>
-        <div className="mt-2 flex gap-2">
-          <input
-            type="number"
-            placeholder="Min"
-            defaultValue={searchParams.get('minPrice') ?? ''}
-            onBlur={(e) => updateFilters({ minPrice: e.target.value || null })}
-            className="w-24 rounded border px-2 py-1"
-          />
-          <input
-            type="number"
-            placeholder="Max"
-            defaultValue={searchParams.get('maxPrice') ?? ''}
-            onBlur={(e) => updateFilters({ maxPrice: e.target.value || null })}
-            className="w-24 rounded border px-2 py-1"
-          />
-        </div>
-      </div>
-
-      {/* Sort */}
-      <div>
-        <h3 className="font-medium">Sort By</h3>
-        <select
-          value={`${searchParams.get('sort') ?? 'createdAt'}-${searchParams.get('order') ?? 'desc'}`}
-          onChange={(e) => {
-            const [sort, order] = e.target.value.split('-')
-            updateFilters({ sort, order })
-          }}
-          className="mt-2 w-full rounded border px-3 py-2"
-        >
-          <option value="createdAt-desc">Newest</option>
-          <option value="createdAt-asc">Oldest</option>
-          <option value="price-asc">Price: Low to High</option>
-          <option value="price-desc">Price: High to Low</option>
-          <option value="name-asc">Name: A-Z</option>
-          <option value="name-desc">Name: Z-A</option>
-        </select>
-      </div>
-
-      {/* Clear all */}
-      <button
-        onClick={() => router.push(pathname)}
-        className="w-full rounded border py-2 hover:bg-gray-50"
-      >
-        Clear All Filters
-      </button>
-    </div>
-  )
-}
-```
-
-## Active Filters Display
-
-```tsx
-// components/ActiveFilters.tsx
-'use client'
-
-import { useSearchParams, useRouter, usePathname } from 'next/navigation'
-import { X } from 'lucide-react'
-
-export function ActiveFilters() {
-  const searchParams = useSearchParams()
-  const router = useRouter()
-  const pathname = usePathname()
-
-  const filters = Array.from(searchParams.entries()).filter(
-    ([key]) => !['page', 'limit'].includes(key)
-  )
-
-  if (filters.length === 0) return null
-
-  const removeFilter = (key: string) => {
-    const params = new URLSearchParams(searchParams)
-    params.delete(key)
-    router.push(`${pathname}?${params.toString()}`)
-  }
-
-  return (
-    <div className="flex flex-wrap gap-2">
-      {filters.map(([key, value]) => (
-        <span
-          key={key}
-          className="inline-flex items-center gap-1 rounded-full bg-gray-100 px-3 py-1 text-sm"
-        >
-          {key}: {value}
-          <button onClick={() => removeFilter(key)}>
-            <X className="h-3 w-3" />
-          </button>
-        </span>
-      ))}
-    </div>
-  )
-}
-```
-
-## Multi-Select Filter
-
-```tsx
-// components/TagFilter.tsx
-'use client'
-
-import { useSearchParams, useRouter, usePathname } from 'next/navigation'
-
-export function TagFilter({ tags }: { tags: string[] }) {
-  const searchParams = useSearchParams()
-  const router = useRouter()
-  const pathname = usePathname()
-
-  const selectedTags = searchParams.getAll('tag')
-
-  const toggleTag = (tag: string) => {
-    const params = new URLSearchParams(searchParams)
-    const current = params.getAll('tag')
-
-    params.delete('tag')
-
-    if (current.includes(tag)) {
-      current.filter(t => t !== tag).forEach(t => params.append('tag', t))
-    } else {
-      current.forEach(t => params.append('tag', t))
-      params.append('tag', tag)
-    }
-
-    router.push(`${pathname}?${params.toString()}`)
-  }
-
-  return (
-    <div className="flex flex-wrap gap-2">
-      {tags.map(tag => (
-        <button
-          key={tag}
-          onClick={() => toggleTag(tag)}
-          className={`rounded-full px-3 py-1 text-sm ${
-            selectedTags.includes(tag)
-              ? 'bg-blue-600 text-white'
-              : 'bg-gray-100 hover:bg-gray-200'
-          }`}
-        >
-          {tag}
-        </button>
-      ))}
-    </div>
-  )
-}
-```
-
-## When to Use
-
-- E-commerce listings
-- Search results
-- Admin dashboards
-- Data tables

package/skills/patterns/search/fulltext.md

@@ -1,260 +0,0 @@
-# Full-Text Search Patterns
-
-Patterns for implementing search functionality.
-
-## Prisma Full-Text Search
-
-```typescript
-// lib/search.ts
-import { prisma } from '@/lib/db'
-
-// PostgreSQL full-text search
-export async function searchPosts(query: string, options?: {
-  limit?: number
-  offset?: number
-}) {
-  const { limit = 10, offset = 0 } = options ?? {}
-
-  // Convert query to tsquery format
-  const searchQuery = query
-    .trim()
-    .split(/\s+/)
-    .map(term => `${term}:*`)
-    .join(' & ')
-
-  const posts = await prisma.$queryRaw`
-    SELECT
-      id,
-      title,
-      content,
-      ts_rank(
-        to_tsvector('english', title || ' ' || content),
-        to_tsquery('english', ${searchQuery})
-      ) as rank
-    FROM "Post"
-    WHERE to_tsvector('english', title || ' ' || content) @@ to_tsquery('english', ${searchQuery})
-    ORDER BY rank DESC
-    LIMIT ${limit}
-    OFFSET ${offset}
-  `
-
-  return posts
-}
-
-// Prisma native search (preview)
-export async function searchWithPrisma(query: string) {
-  return prisma.post.findMany({
-    where: {
-      OR: [
-        { title: { search: query } },
-        { content: { search: query } }
-      ]
-    },
-    orderBy: {
-      _relevance: {
-        fields: ['title', 'content'],
-        search: query,
-        sort: 'desc'
-      }
-    }
-  })
-}
-```
-
-## Search API Route
-
-```typescript
-// app/api/search/route.ts
-import { searchPosts } from '@/lib/search'
-
-export async function GET(request: Request) {
-  const { searchParams } = new URL(request.url)
-  const query = searchParams.get('q')
-  const page = parseInt(searchParams.get('page') ?? '1')
-  const limit = parseInt(searchParams.get('limit') ?? '10')
-
-  if (!query || query.length < 2) {
-    return Response.json({ results: [] })
-  }
-
-  const offset = (page - 1) * limit
-
-  const results = await searchPosts(query, { limit, offset })
-
-  return Response.json({
-    results,
-    page,
-    limit,
-    query
-  })
-}
-```
-
-## Search Input with Debounce
-
-```tsx
-// components/SearchInput.tsx
-'use client'
-
-import { useState, useCallback } from 'react'
-import { useDebouncedCallback } from 'use-debounce'
-import { useRouter, useSearchParams } from 'next/navigation'
-
-export function SearchInput() {
-  const router = useRouter()
-  const searchParams = useSearchParams()
-  const [query, setQuery] = useState(searchParams.get('q') ?? '')
-
-  const handleSearch = useDebouncedCallback((term: string) => {
-    const params = new URLSearchParams(searchParams)
-
-    if (term) {
-      params.set('q', term)
-    } else {
-      params.delete('q')
-    }
-
-    router.push(`/search?${params.toString()}`)
-  }, 300)
-
-  return (
-    <input
-      type="search"
-      value={query}
-      onChange={(e) => {
-        setQuery(e.target.value)
-        handleSearch(e.target.value)
-      }}
-      placeholder="Search..."
-      className="w-full rounded-lg border px-4 py-2"
-    />
-  )
-}
-```
-
-## Search Results Page
-
-```tsx
-// app/search/page.tsx
-import { searchPosts } from '@/lib/search'
-import { SearchInput } from '@/components/SearchInput'
-
-export default async function SearchPage({
-  searchParams
-}: {
-  searchParams: { q?: string; page?: string }
-}) {
-  const query = searchParams.q ?? ''
-  const page = parseInt(searchParams.page ?? '1')
-
-  const results = query
-    ? await searchPosts(query, { limit: 10, offset: (page - 1) * 10 })
-    : []
-
-  return (
-    <div className="mx-auto max-w-2xl py-8">
-      <SearchInput />
-
-      <div className="mt-8">
-        {query && (
-          <p className="mb-4 text-gray-600">
-            Results for "{query}"
-          </p>
-        )}
-
-        {results.length === 0 && query && (
-          <p className="text-gray-500">No results found</p>
-        )}
-
-        <div className="space-y-4">
-          {results.map((post: any) => (
-            <article key={post.id} className="rounded-lg border p-4">
-              <h2 className="font-semibold">{post.title}</h2>
-              <p className="mt-1 text-gray-600">{post.content.slice(0, 150)}...</p>
-            </article>
-          ))}
-        </div>
-      </div>
-    </div>
-  )
-}
-```
-
-## Algolia Integration
-
-```typescript
-// lib/algolia.ts
-import algoliasearch from 'algoliasearch'
-
-const client = algoliasearch(
-  process.env.ALGOLIA_APP_ID!,
-  process.env.ALGOLIA_ADMIN_KEY!
-)
-
-const index = client.initIndex('posts')
-
-export async function indexPost(post: Post) {
-  await index.saveObject({
-    objectID: post.id,
-    title: post.title,
-    content: post.content,
-    author: post.author.name,
-    createdAt: post.createdAt.getTime()
-  })
-}
-
-export async function removeFromIndex(postId: string) {
-  await index.deleteObject(postId)
-}
-
-export async function searchAlgolia(query: string) {
-  const { hits } = await index.search(query, {
-    hitsPerPage: 10,
-    attributesToHighlight: ['title', 'content']
-  })
-
-  return hits
-}
-
-// Sync on create/update
-async function createPost(data: CreatePostData) {
-  const post = await prisma.post.create({ data })
-  await indexPost(post)
-  return post
-}
-```
-
-## Search Suggestions
-
-```typescript
-// app/api/search/suggestions/route.ts
-export async function GET(request: Request) {
-  const { searchParams } = new URL(request.url)
-  const query = searchParams.get('q')
-
-  if (!query || query.length < 2) {
-    return Response.json({ suggestions: [] })
-  }
-
-  // Get popular searches matching query
-  const suggestions = await prisma.searchQuery.findMany({
-    where: {
-      query: { startsWith: query.toLowerCase() }
-    },
-    orderBy: { count: 'desc' },
-    take: 5,
-    select: { query: true }
-  })
-
-  return Response.json({
-    suggestions: suggestions.map(s => s.query)
-  })
-}
-```
-
-## When to Use
-
-- Content search
-- Product search
-- User search
-- Document search