## Typography Enhancements - Add letter spacing control (0-2px, default 0.5px for WCAG compliance) - Add word spacing control (0-4px, default 0px) - Add paragraph spacing control (1.0-2.5x line height, default 1.8x) - Add max line length control (50-100ch, default 75ch for optimal readability) - Apply WCAG 2.1 SC 1.4.12 text spacing recommendations ## Multi-Color Highlighting System - Implement 7-color highlight palette (yellow, green, blue, purple, orange, pink, red) - Theme-aware highlight colors (light/dark/sepia modes) - Persistent visual highlights with database storage - Color picker UI with current highlight indicator - Support for highlight notes and tags (infrastructure ready) - Bulk highlight loading for performance - Add/update/remove highlight functionality ## Database Schema - Add Highlight model with verse relationship - Support for color, note, tags, and timestamps - Unique constraint per user-verse pair - Proper indexing for performance ## API Routes - POST /api/highlights - Create new highlight - GET /api/highlights - Get all user highlights - POST /api/highlights/bulk - Bulk fetch highlights for verses - PUT /api/highlights/[id] - Update highlight color/note/tags - DELETE /api/highlights/[id] - Remove highlight ## UI Improvements - Enhanced settings dialog with new typography controls - Highlight color picker menu - Verse menu updated with highlight option - Visual feedback for highlighted verses - Remove highlight button in color picker Note: Database migration pending - run `npx prisma db push` to apply schema 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
45 lines
1.5 KiB
TypeScript
45 lines
1.5 KiB
TypeScript
import { NextRequest, NextResponse } from 'next/server'
|
|
import { prisma } from '@/lib/prisma'
|
|
import { verifyToken } from '@/lib/auth'
|
|
|
|
// POST /api/highlights/bulk?locale=en - Get highlights for multiple verses
|
|
export async function POST(req: NextRequest) {
|
|
try {
|
|
const authHeader = req.headers.get('authorization')
|
|
if (!authHeader) {
|
|
return NextResponse.json({ success: false, error: 'Unauthorized' }, { status: 401 })
|
|
}
|
|
|
|
const token = authHeader.replace('Bearer ', '')
|
|
const decoded = await verifyToken(token)
|
|
if (!decoded) {
|
|
return NextResponse.json({ success: false, error: 'Invalid token' }, { status: 401 })
|
|
}
|
|
|
|
const body = await req.json()
|
|
const { verseIds } = body
|
|
|
|
if (!Array.isArray(verseIds)) {
|
|
return NextResponse.json({ success: false, error: 'verseIds must be an array' }, { status: 400 })
|
|
}
|
|
|
|
const highlights = await prisma.highlight.findMany({
|
|
where: {
|
|
userId: decoded.userId,
|
|
verseId: { in: verseIds }
|
|
}
|
|
})
|
|
|
|
// Convert array to object keyed by verseId for easier lookup
|
|
const highlightsMap: { [key: string]: any } = {}
|
|
highlights.forEach(highlight => {
|
|
highlightsMap[highlight.verseId] = highlight
|
|
})
|
|
|
|
return NextResponse.json({ success: true, highlights: highlightsMap })
|
|
} catch (error) {
|
|
console.error('Error fetching highlights:', error)
|
|
return NextResponse.json({ success: false, error: 'Failed to fetch highlights' }, { status: 500 })
|
|
}
|
|
}
|