9e6a8f8231
React 19 bloquea href="javascript:void(0)". SiteHeader: DESCONECTAR ahora enlaza
a /{locale}/log-out (ruta real), el menú hamburguesa y el logo pequeño usan
role/button o href real. PostActions (foro): editar/eliminar pasan a role=button.
Se elimina el logout por fetch del header (lo hace la ruta /log-out).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
134 lines
3.7 KiB
TypeScript
134 lines
3.7 KiB
TypeScript
'use client'
|
|
|
|
import { useState } from 'react'
|
|
import { useTranslations } from 'next-intl'
|
|
import { useRouter } from '@/i18n/navigation'
|
|
import { RichTextArea } from './RichTextArea'
|
|
|
|
export function PostActions({
|
|
postId,
|
|
initialText,
|
|
deleted = false,
|
|
}: {
|
|
postId: number
|
|
initialText: string
|
|
deleted?: boolean
|
|
}) {
|
|
const t = useTranslations('Forum')
|
|
const router = useRouter()
|
|
const [editing, setEditing] = useState(false)
|
|
const [text, setText] = useState(initialText)
|
|
const [busy, setBusy] = useState(false)
|
|
const [error, setError] = useState<string | null>(null)
|
|
|
|
async function save() {
|
|
if (busy || !text.trim()) return
|
|
setBusy(true)
|
|
setError(null)
|
|
try {
|
|
const res = await fetch('/api/forum/post', {
|
|
method: 'PATCH',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
credentials: 'same-origin',
|
|
body: JSON.stringify({ postId, text }),
|
|
})
|
|
const data: { success?: boolean; error?: string } = await res.json()
|
|
if (data.success) {
|
|
setEditing(false)
|
|
router.refresh()
|
|
} else {
|
|
setError(t(data.error === 'tooShort' ? 'tooShort' : data.error === 'topicLocked' ? 'topicLocked' : 'genericError'))
|
|
}
|
|
} catch {
|
|
setError(t('genericError'))
|
|
} finally {
|
|
setBusy(false)
|
|
}
|
|
}
|
|
|
|
async function restore() {
|
|
if (busy) return
|
|
setBusy(true)
|
|
setError(null)
|
|
try {
|
|
const res = await fetch('/api/forum/post', {
|
|
method: 'PUT',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
credentials: 'same-origin',
|
|
body: JSON.stringify({ postId }),
|
|
})
|
|
if ((await res.json()).success) router.refresh()
|
|
else setError(t('genericError'))
|
|
} catch {
|
|
setError(t('genericError'))
|
|
} finally {
|
|
setBusy(false)
|
|
}
|
|
}
|
|
|
|
async function remove() {
|
|
if (busy || !confirm(t('confirmDeletePost'))) return
|
|
setBusy(true)
|
|
setError(null)
|
|
try {
|
|
const res = await fetch('/api/forum/post', {
|
|
method: 'DELETE',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
credentials: 'same-origin',
|
|
body: JSON.stringify({ postId }),
|
|
})
|
|
const data: { success?: boolean } = await res.json()
|
|
if (data.success) router.refresh()
|
|
else setError(t('genericError'))
|
|
} catch {
|
|
setError(t('genericError'))
|
|
} finally {
|
|
setBusy(false)
|
|
}
|
|
}
|
|
|
|
if (editing) {
|
|
return (
|
|
<div className="separate">
|
|
<RichTextArea value={text} onChange={setText} rows={4} />
|
|
<br />
|
|
<button type="button" onClick={save} disabled={busy} className="nw-tool-btn">
|
|
{busy ? t('sending') : t('save')}
|
|
</button>{' '}
|
|
<button
|
|
type="button"
|
|
onClick={() => { setEditing(false); setText(initialText); setError(null) }}
|
|
className="nw-tool-btn"
|
|
>
|
|
{t('cancel')}
|
|
</button>
|
|
{error && <p className="red-info2 small-font">{error}</p>}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
if (deleted) {
|
|
return (
|
|
<div className="separate small-font">
|
|
<button type="button" onClick={restore} disabled={busy} className="nw-tool-btn green-info">
|
|
{t('restore')}
|
|
</button>
|
|
{error && <span className="red-info2"> {error}</span>}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<div className="separate small-font">
|
|
<a role="button" tabIndex={0} onClick={() => setEditing(true)} className="second-brown" style={{ cursor: 'pointer' }}>
|
|
{t('edit')}
|
|
</a>
|
|
{' '}
|
|
<a role="button" tabIndex={0} onClick={() => { if (!busy) remove() }} className="second-brown" style={{ cursor: 'pointer' }}>
|
|
{t('delete')}
|
|
</a>
|
|
{error && <span className="red-info2"> {error}</span>}
|
|
</div>
|
|
)
|
|
}
|