Foro: reemplazar el foro anterior por el port del foro estilo FusionCMS
Se sustituye por completo el foro anterior de Next (que estaba vacío: 0 temas, 0 posts) por una adaptación del foro PHP de FusionCMS que tenía el usuario, con su estructura, sus imágenes y su estética, llevadas a Next. BASE DE DATOS (acore_web), esquema idéntico al original (sql/forum_fusion.sql): forum_categories(id, order, name) forum_forums(id, category, order, name, description, icon, colortitle, type) forum_topics(id, forum, name, sticky, locked, deleted, created) forum_posts(id, topic, poster, text, time, deleted) Se hizo DROP de las tablas antiguas (forums, forum_categories, forum_topics, forum_posts) y CREATE de estas, con el seed original (News/Reports/General, foros con icono, clases con color, subforos por idioma con bandera). Única diferencia con el dump: forum_topics.created, que faltaba y usan las vistas, y el recorte del salto de línea final en los nombres de clase. Los temas no guardan autor ni última actividad: se derivan del primer/último post, como en el original. `poster` es el AccountID de acore_auth; el nombre se resuelve al render (username sin el sufijo #N de Battle.net). El texto se guarda como HTML saneado con nh3 (no BBCode) para encajar con el editor. EDITOR: TinyMCE community self-hosted (licenseKey gpl), servido desde /tinymce (scripts/copy-tinymce.mjs en postinstall; public/tinymce en .gitignore por ser artefacto). El HTML se sanea SIEMPRE en el servidor. PÁGINAS (app/[locale]/forum): índice con los 3 tipos de foro (fila normal, tarjeta de clase tipo 1, tarjeta de idioma tipo 2), subforo, tema, crear y editar. La lógica de forum.js (crear/responder/editar/moderar) se portó a fetch + los avisos del sitio, sin jQuery/SweetAlert, y la moderación pasa por POST (no GET). CSS: forum.css adaptado al tema (app/forum.css), rutas de imagen a /forum, dorado alineado al acento del sitio (#d79602), y se aportan .nice_button/.main-wide/ .pagination que no estaban en theme.css. ADMIN: lib/admin-forum.ts, sus rutas y AdminForumManager reescritos al esquema nuevo (categoría, icono, color, tipo, orden; sin _en/visibility). Se eliminan /forum/search y /forum/user (no existen en el foro nuevo) y los componentes que quedaban huérfanos (ForumSearchBox, PostActions, TopicModBar, NewTopicForm). i18n ES/EN completado (next-intl). Verificado en producción: el índice renderiza en es/en con categorías, clases, banderas e iconos; los assets y TinyMCE sirven 200; crear tema y responder guardan las filas con el esquema correcto y las páginas las muestran (autor resuelto, HTML saneado). Datos de prueba borrados: el foro arranca vacío. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -6,22 +6,29 @@ import { useRouter } from '@/i18n/navigation'
|
||||
import type { AdminCategory, AdminForum } from '@/lib/admin-forum'
|
||||
|
||||
type Group = { category: AdminCategory; forums: AdminForum[] }
|
||||
type ForumFields = {
|
||||
name: string
|
||||
description: string
|
||||
icon: string
|
||||
colortitle: string
|
||||
type: string
|
||||
order: string
|
||||
}
|
||||
|
||||
const EMPTY_FORUM: ForumFields = { name: '', description: '', icon: '', colortitle: '', type: '0', order: '0' }
|
||||
|
||||
export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
const t = useTranslations('Admin')
|
||||
const router = useRouter()
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [catForm, setCatForm] = useState({ name: '', nameEn: '', order: '0' })
|
||||
const [forumForm, setForumForm] = useState<Record<number, { name: string; nameEn: string; description: string; descriptionEn: string; order: string }>>({})
|
||||
const [editCat, setEditCat] = useState<{ id: number; name: string; nameEn: string; order: string } | null>(null)
|
||||
const [editForum, setEditForum] = useState<{ id: number; name: string; nameEn: string; description: string; descriptionEn: string; order: string; visibility: number } | null>(null)
|
||||
const [catForm, setCatForm] = useState({ name: '', order: '0' })
|
||||
const [forumForm, setForumForm] = useState<Record<number, ForumFields>>({})
|
||||
const [editCat, setEditCat] = useState<{ id: number; name: string; order: string } | null>(null)
|
||||
const [editForum, setEditForum] = useState<(ForumFields & { id: number }) | null>(null)
|
||||
|
||||
function ff(catId: number) {
|
||||
return forumForm[catId] ?? { name: '', nameEn: '', description: '', descriptionEn: '', order: '0' }
|
||||
}
|
||||
function setFF(catId: number, patch: Partial<{ name: string; nameEn: string; description: string; descriptionEn: string; order: string }>) {
|
||||
const ff = (catId: number) => forumForm[catId] ?? EMPTY_FORUM
|
||||
const setFF = (catId: number, patch: Partial<ForumFields>) =>
|
||||
setForumForm((s) => ({ ...s, [catId]: { ...ff(catId), ...patch } }))
|
||||
}
|
||||
|
||||
async function call(url: string, method: string, body?: unknown): Promise<boolean> {
|
||||
setBusy(true)
|
||||
@@ -38,12 +45,46 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
return true
|
||||
}
|
||||
if (d.error === 'categoryNotEmpty') alert(t('categoryNotEmpty'))
|
||||
else if (d.error === 'forumNotEmpty') alert(t('forumNotEmpty'))
|
||||
return false
|
||||
} finally {
|
||||
setBusy(false)
|
||||
}
|
||||
}
|
||||
|
||||
const forumBody = (v: ForumFields, category: number) => ({
|
||||
category,
|
||||
name: v.name,
|
||||
description: v.description,
|
||||
icon: v.icon,
|
||||
colortitle: v.colortitle,
|
||||
type: Number(v.type),
|
||||
order: Number(v.order),
|
||||
})
|
||||
|
||||
function ForumEditFields({
|
||||
v,
|
||||
onChange,
|
||||
}: {
|
||||
v: ForumFields
|
||||
onChange: (patch: Partial<ForumFields>) => void
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<input value={v.name} onChange={(e) => onChange({ name: e.target.value })} placeholder={t('forumName')} maxLength={45} />
|
||||
<input value={v.description} onChange={(e) => onChange({ description: e.target.value })} placeholder={t('forumDescription')} />
|
||||
<select value={v.type} onChange={(e) => onChange({ type: e.target.value })}>
|
||||
<option value="0">{t('forumTypeNormal')}</option>
|
||||
<option value="1">{t('forumTypeClass')}</option>
|
||||
<option value="2">{t('forumTypeFlag')}</option>
|
||||
</select>
|
||||
<input value={v.icon} onChange={(e) => onChange({ icon: e.target.value })} placeholder={t('forumIcon')} />
|
||||
<input value={v.colortitle} onChange={(e) => onChange({ colortitle: e.target.value })} placeholder={t('forumColor')} />
|
||||
<input type="number" value={v.order} onChange={(e) => onChange({ order: e.target.value })} placeholder={t('order')} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
{/* Alta de categoría */}
|
||||
@@ -51,18 +92,16 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault()
|
||||
if (catForm.name.trim())
|
||||
call('/api/admin/forum/category', 'POST', { name: catForm.name, nameEn: catForm.nameEn, order: Number(catForm.order) }).then(
|
||||
(ok) => ok && setCatForm({ name: '', nameEn: '', order: '0' }),
|
||||
call('/api/admin/forum/category', 'POST', { name: catForm.name, order: Number(catForm.order) }).then(
|
||||
(ok) => ok && setCatForm({ name: '', order: '0' }),
|
||||
)
|
||||
}}
|
||||
className="admin-form info-box-light separate2"
|
||||
>
|
||||
<span className="second-brown">{t('newCategory')}</span>
|
||||
<input value={catForm.name} onChange={(e) => setCatForm({ ...catForm, name: e.target.value })} placeholder={t('categoryName')} />
|
||||
<input value={catForm.nameEn} onChange={(e) => setCatForm({ ...catForm, nameEn: e.target.value })} placeholder={t('categoryNameEn')} />
|
||||
<input value={catForm.name} onChange={(e) => setCatForm({ ...catForm, name: e.target.value })} placeholder={t('categoryName')} maxLength={45} />
|
||||
<span className="second-brown">{t('order')}</span>
|
||||
<input type="number" value={catForm.order} onChange={(e) => setCatForm({ ...catForm, order: e.target.value })} />
|
||||
<p className="third-brown small-font">{t('forumEnHint')}</p>
|
||||
<button type="submit" disabled={busy}>{t('create')}</button>
|
||||
</form>
|
||||
<br />
|
||||
@@ -73,13 +112,12 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
<div key={category.id} className="inline-div" style={{ display: 'block' }}>
|
||||
{editCat?.id === category.id ? (
|
||||
<div className="admin-form separate2">
|
||||
<input value={editCat.name} onChange={(e) => setEditCat({ ...editCat, name: e.target.value })} placeholder={t('categoryName')} />
|
||||
<input value={editCat.nameEn} onChange={(e) => setEditCat({ ...editCat, nameEn: e.target.value })} placeholder={t('categoryNameEn')} />
|
||||
<input value={editCat.name} onChange={(e) => setEditCat({ ...editCat, name: e.target.value })} placeholder={t('categoryName')} maxLength={45} />
|
||||
<input type="number" value={editCat.order} onChange={(e) => setEditCat({ ...editCat, order: e.target.value })} />
|
||||
<button
|
||||
onClick={() =>
|
||||
editCat.name.trim() &&
|
||||
call(`/api/admin/forum/category/${category.id}`, 'PUT', { name: editCat.name, nameEn: editCat.nameEn, order: Number(editCat.order) }).then((ok) => ok && setEditCat(null))
|
||||
call(`/api/admin/forum/category/${category.id}`, 'PUT', { name: editCat.name, order: Number(editCat.order) }).then((ok) => ok && setEditCat(null))
|
||||
}
|
||||
disabled={busy}
|
||||
className="ns-tool-btn"
|
||||
@@ -91,11 +129,9 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
) : (
|
||||
<div className="title-content-h3">
|
||||
<h3 className="big-font">
|
||||
{category.name}
|
||||
{category.name_en && <span className="third-brown small-font"> · EN: {category.name_en}</span>}{' '}
|
||||
<span className="third-brown small-font">#{category.order}</span>{' '}
|
||||
{category.name} <span className="third-brown small-font">#{category.order}</span>{' '}
|
||||
<button
|
||||
onClick={() => setEditCat({ id: category.id, name: category.name, nameEn: category.name_en, order: String(category.order) })}
|
||||
onClick={() => setEditCat({ id: category.id, name: category.name, order: String(category.order) })}
|
||||
disabled={busy}
|
||||
className="ns-tool-btn"
|
||||
>
|
||||
@@ -112,7 +148,6 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Foros de la categoría */}
|
||||
<table className="max-center-table">
|
||||
<tbody>
|
||||
{forums.length === 0 && (
|
||||
@@ -124,21 +159,11 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
editForum?.id === f.id ? (
|
||||
<tr key={f.id} className="team-center-table-tr">
|
||||
<td className="lefted separate" colSpan={2}>
|
||||
<input value={editForum.name} onChange={(e) => setEditForum({ ...editForum, name: e.target.value })} placeholder={t('forumName')} maxLength={45} />
|
||||
<input value={editForum.nameEn} onChange={(e) => setEditForum({ ...editForum, nameEn: e.target.value })} placeholder={t('forumNameEn')} maxLength={45} />
|
||||
<input value={editForum.description} onChange={(e) => setEditForum({ ...editForum, description: e.target.value })} placeholder={t('forumDescription')} />
|
||||
<input value={editForum.descriptionEn} onChange={(e) => setEditForum({ ...editForum, descriptionEn: e.target.value })} placeholder={t('forumDescriptionEn')} />
|
||||
<ForumEditFields v={editForum} onChange={(patch) => setEditForum({ ...editForum, ...patch })} />
|
||||
<button
|
||||
onClick={() =>
|
||||
editForum.name.trim() &&
|
||||
call(`/api/admin/forum/${f.id}`, 'PUT', {
|
||||
name: editForum.name,
|
||||
nameEn: editForum.nameEn,
|
||||
description: editForum.description,
|
||||
descriptionEn: editForum.descriptionEn,
|
||||
order: Number(editForum.order),
|
||||
visibility: editForum.visibility !== 0,
|
||||
}).then((ok) => ok && setEditForum(null))
|
||||
call(`/api/admin/forum/${f.id}`, 'PUT', forumBody(editForum, category.id)).then((ok) => ok && setEditForum(null))
|
||||
}
|
||||
disabled={busy}
|
||||
className="ns-tool-btn"
|
||||
@@ -152,25 +177,29 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
<tr key={f.id} className="team-center-table-tr">
|
||||
<td className="lefted separate">
|
||||
<span className="yellow-info">{f.name}</span>{' '}
|
||||
{f.name_en && <span className="third-brown small-font">· EN: {f.name_en}</span>}{' '}
|
||||
{f.visibility === 0 && <span className="red-info2 small-font">({t('hidden')})</span>}
|
||||
<span className="third-brown small-font">
|
||||
· {t('forumType')}: {f.type} · #{f.order}
|
||||
</span>
|
||||
{f.description && <p className="third-brown small-font">{f.description}</p>}
|
||||
</td>
|
||||
<td className="real-info-box no-wrap-td">
|
||||
<button
|
||||
onClick={() => setEditForum({ id: f.id, name: f.name, nameEn: f.name_en, description: f.description, descriptionEn: f.description_en, order: String(f.order), visibility: f.visibility })}
|
||||
onClick={() =>
|
||||
setEditForum({
|
||||
id: f.id,
|
||||
name: f.name,
|
||||
description: f.description,
|
||||
icon: f.icon ?? '',
|
||||
colortitle: f.colortitle ?? '',
|
||||
type: String(f.type),
|
||||
order: String(f.order),
|
||||
})
|
||||
}
|
||||
disabled={busy}
|
||||
className="ns-tool-btn"
|
||||
>
|
||||
{t('edit')}
|
||||
</button>{' '}
|
||||
<button
|
||||
onClick={() => call(`/api/admin/forum/${f.id}`, 'PATCH', { visibility: f.visibility === 0 })}
|
||||
disabled={busy}
|
||||
className="ns-tool-btn"
|
||||
>
|
||||
{f.visibility === 0 ? t('show') : t('hide')}
|
||||
</button>{' '}
|
||||
<button
|
||||
onClick={() => confirm(t('confirmDelete')) && call(`/api/admin/forum/${f.id}`, 'DELETE')}
|
||||
disabled={busy}
|
||||
@@ -191,21 +220,13 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
|
||||
e.preventDefault()
|
||||
const v = ff(category.id)
|
||||
if (v.name.trim())
|
||||
call('/api/admin/forum', 'POST', {
|
||||
categoryId: category.id,
|
||||
name: v.name,
|
||||
nameEn: v.nameEn,
|
||||
description: v.description,
|
||||
descriptionEn: v.descriptionEn,
|
||||
order: Number(v.order),
|
||||
}).then((ok) => ok && setFF(category.id, { name: '', nameEn: '', description: '', descriptionEn: '', order: '0' }))
|
||||
call('/api/admin/forum', 'POST', forumBody(v, category.id)).then(
|
||||
(ok) => ok && setFF(category.id, EMPTY_FORUM),
|
||||
)
|
||||
}}
|
||||
className="admin-form separate"
|
||||
>
|
||||
<input value={ff(category.id).name} onChange={(e) => setFF(category.id, { name: e.target.value })} placeholder={t('forumName')} maxLength={45} />
|
||||
<input value={ff(category.id).nameEn} onChange={(e) => setFF(category.id, { nameEn: e.target.value })} placeholder={t('forumNameEn')} maxLength={45} />
|
||||
<input value={ff(category.id).description} onChange={(e) => setFF(category.id, { description: e.target.value })} placeholder={t('forumDescription')} />
|
||||
<input value={ff(category.id).descriptionEn} onChange={(e) => setFF(category.id, { descriptionEn: e.target.value })} placeholder={t('forumDescriptionEn')} />
|
||||
<ForumEditFields v={ff(category.id)} onChange={(patch) => setFF(category.id, patch)} />
|
||||
<button type="submit" disabled={busy}>{t('addForum')}</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user