Foro: editor rico ligero (barra de formato) en respuestas, temas y edición

- components/RichTextArea.tsx: barra de formato (negrita, cursiva, subrayado, tachado,
  enlace, cita, lista, código) que envuelve la selección del textarea en HTML;
  el HTML se sanea en el servidor con cleanPostHtml. Sin dependencias pesadas
  (evita CKEditor y no rompe el pipeline de saneado).
- Cableado en ReplyForm, NewTopicForm y PostActions (edición).
- i18n es/en: namespace Editor.

Verificado: build OK, /forum y home 200.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-13 01:03:38 +00:00
parent 7c1cd195ff
commit 72fdead9f3
6 changed files with 121 additions and 4 deletions
+2 -1
View File
@@ -3,6 +3,7 @@
import { useState } from 'react'
import { useTranslations } from 'next-intl'
import { useRouter } from '@/i18n/navigation'
import { RichTextArea } from './RichTextArea'
export function PostActions({ postId, initialText }: { postId: number; initialText: string }) {
const t = useTranslations('Forum')
@@ -61,7 +62,7 @@ export function PostActions({ postId, initialText }: { postId: number; initialTe
if (editing) {
return (
<div className="mt-3 space-y-2">
<textarea value={text} onChange={(e) => setText(e.target.value)} rows={4} className="nw-input" />
<RichTextArea value={text} onChange={setText} rows={4} />
<div className="flex gap-2">
<button type="button" onClick={save} disabled={busy} className="nw-btn text-sm disabled:opacity-60">
{busy ? t('sending') : t('save')}