Files
biblical-guide.com/app/api/highlights/route.ts
Andrei fc5d6604ff feat: implement Phase 1 Bible reader improvements (2025 standards)
## 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>
2025-10-10 10:58:12 +00:00

82 lines
2.5 KiB
TypeScript

import { NextRequest, NextResponse } from 'next/server'
import { prisma } from '@/lib/prisma'
import { verifyToken } from '@/lib/auth'
// GET /api/highlights?locale=en - Get all highlights for user
// POST /api/highlights?locale=en - Create new highlight
export async function GET(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 highlights = await prisma.highlight.findMany({
where: { userId: decoded.userId },
orderBy: { createdAt: 'desc' }
})
return NextResponse.json({ success: true, highlights })
} catch (error) {
console.error('Error fetching highlights:', error)
return NextResponse.json({ success: false, error: 'Failed to fetch highlights' }, { status: 500 })
}
}
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 { verseId, color, note, tags } = body
if (!verseId || !color) {
return NextResponse.json({ success: false, error: 'Missing required fields' }, { status: 400 })
}
// Check if highlight already exists
const existingHighlight = await prisma.highlight.findUnique({
where: {
userId_verseId: {
userId: decoded.userId,
verseId
}
}
})
if (existingHighlight) {
return NextResponse.json({ success: false, error: 'Highlight already exists' }, { status: 400 })
}
const highlight = await prisma.highlight.create({
data: {
userId: decoded.userId,
verseId,
color,
note,
tags: tags || []
}
})
return NextResponse.json({ success: true, highlight })
} catch (error) {
console.error('Error creating highlight:', error)
return NextResponse.json({ success: false, error: 'Failed to create highlight' }, { status: 500 })
}
}