Implement comprehensive rich text editing capabilities using Tiptap editor with full formatting toolbar and functionality. Features: - Bold, italic, underline, strikethrough text formatting - Highlight text with yellow marker - Bullet and numbered lists - Heading styles (H2, H3) - Text alignment (left, center, right) - Undo/redo support - Clear formatting option - Intuitive toolbar with icons and tooltips - Responsive font size support Technical changes: - Added Tiptap dependencies to package.json (@tiptap/vue-3, starter-kit, extensions) - Created RichTextEditor component with full toolbar and formatting options - Integrated editor into sermon notes section replacing textarea - Updated download API to convert HTML to formatted plain text - Updated email API to handle HTML content properly - Notes now stored as HTML with rich formatting preserved The editor provides a professional writing experience with all standard formatting tools while maintaining automatic save functionality and seamless integration with email/download features. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
107 lines
2.6 KiB
TypeScript
107 lines
2.6 KiB
TypeScript
import { getSermonNote, getSermonBySlug, getUserByUsername, getDatabase } from '~/server/utils/database'
|
|
import { getSessionUsername } from '~/server/utils/auth'
|
|
import { sendSermonNotesEmail } from '~/server/utils/email'
|
|
|
|
export default defineEventHandler(async (event) => {
|
|
const username = await getSessionUsername(event)
|
|
|
|
if (!username) {
|
|
throw createError({
|
|
statusCode: 401,
|
|
message: 'Unauthorized'
|
|
})
|
|
}
|
|
|
|
const sermonId = parseInt(event.context.params?.sermonId || '')
|
|
|
|
if (!sermonId) {
|
|
throw createError({
|
|
statusCode: 400,
|
|
message: 'Invalid sermon ID'
|
|
})
|
|
}
|
|
|
|
// Get user info
|
|
const user = getUserByUsername(username)
|
|
if (!user || !user.email) {
|
|
throw createError({
|
|
statusCode: 400,
|
|
message: 'User email not found'
|
|
})
|
|
}
|
|
|
|
// Get sermon info
|
|
const db = getDatabase()
|
|
const sermon = db.prepare('SELECT * FROM sermons WHERE id = ?').get(sermonId) as any
|
|
|
|
if (!sermon) {
|
|
throw createError({
|
|
statusCode: 404,
|
|
message: 'Sermon not found'
|
|
})
|
|
}
|
|
|
|
// Get user's notes (already stored as HTML from rich text editor)
|
|
const noteRecord = getSermonNote(user.id!, sermonId)
|
|
const userNotes = noteRecord?.notes || '<p>No notes taken</p>'
|
|
|
|
// Format bible references for HTML email
|
|
let bibleReferencesText = ''
|
|
try {
|
|
const refs = JSON.parse(sermon.bible_references)
|
|
bibleReferencesText = refs.map((ref: any) =>
|
|
`<div style="margin-bottom: 15px;">
|
|
<div style="font-weight: bold; margin-bottom: 5px;">${ref.reference} (${ref.version})</div>
|
|
<div>${ref.text}</div>
|
|
</div>`
|
|
).join('')
|
|
} catch {
|
|
bibleReferencesText = sermon.bible_references
|
|
}
|
|
|
|
// Format date
|
|
const formatDate = (dateString: string) => {
|
|
const date = new Date(dateString + 'T00:00:00')
|
|
return date.toLocaleDateString('en-US', {
|
|
year: 'numeric',
|
|
month: 'long',
|
|
day: 'numeric'
|
|
})
|
|
}
|
|
|
|
const dates = [sermon.date]
|
|
if (sermon.dates) {
|
|
try {
|
|
const additionalDates = JSON.parse(sermon.dates)
|
|
dates.push(...additionalDates)
|
|
} catch {}
|
|
}
|
|
const sermonDate = dates.map(formatDate).join(' - ')
|
|
|
|
// Send email
|
|
try {
|
|
await sendSermonNotesEmail(
|
|
user.email,
|
|
user.first_name || user.username,
|
|
sermon.title,
|
|
sermonDate,
|
|
bibleReferencesText,
|
|
sermon.personal_appliance,
|
|
sermon.pastors_challenge,
|
|
userNotes,
|
|
event
|
|
)
|
|
|
|
return {
|
|
success: true,
|
|
message: 'Notes emailed successfully'
|
|
}
|
|
} catch (error) {
|
|
console.error('Failed to send email:', error)
|
|
throw createError({
|
|
statusCode: 500,
|
|
message: 'Failed to send email'
|
|
})
|
|
}
|
|
})
|