Inna/NightSpire
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Admin del foro: gestionar traducción EN de categorías y foros

Browse Source 
Los formularios de crear categoría/foro aceptan nombre/descripción en inglés, y
se añade EDICIÓN en línea de categorías (name, name_en, order) y foros (name,
name_en, description, description_en). lib/admin-forum: createCategory/createForum
con EN + updateCategory/updateForum; rutas PUT en category/[id] y forum/[id].
Claves Admin nuevas (nombre/descripción EN). Verificado: listado con EN + update
round-trip; PUT protegido (403 sin admin).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Inna Hoover Brown
2026-07-14 19:55:54 +00:00
parent cc6c76859c
commit 85c5c995ee
8 changed files with 209 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web-next/app/api/admin/forum/[id]/route.ts
+18 -1
View File
@@ -1,6 +1,6 @@
import { getSession } from '@/lib/session'
import { isAdmin } from '@/lib/admin'
import { deleteForum, setForumVisibility } from '@/lib/admin-forum'
import { deleteForum, setForumVisibility, updateForum } from '@/lib/admin-forum'
export async function DELETE(_request: Request, { params }: { params: Promise<{ id: string }> }) {
const session = await getSession()
@@ -19,3 +19,20 @@ export async function PATCH(request: Request, { params }: { params: Promise<{ id
await setForumVisibility(Number(id), b.visibility !== false)
return Response.json({ success: true })
}
export async function PUT(request: Request, { params }: { params: Promise<{ id: string }> }) {
const session = await getSession()
if (!(await isAdmin(session))) return Response.json({ success: false, error: 'forbidden' }, { status: 403 })
const { id } = await params
let b: Record<string, unknown> = {}
try { b = await request.json() } catch { return Response.json({ success: false, error: 'invalidRequest' }, { status: 400 }) }
const name = String(b.name ?? '').trim()
const nameEn = String(b.nameEn ?? '').trim() || null
const description = String(b.description ?? '').trim()
const descriptionEn = String(b.descriptionEn ?? '').trim() || null
const order = Number(b.order) || 0
const visibility = b.visibility === false ? 0 : 1
if (!name) return Response.json({ success: false, error: 'emptyError' })
await updateForum(Number(id), name, nameEn, description, descriptionEn, order, visibility)
return Response.json({ success: true })
}
web-next/app/api/admin/forum/category/[id]/route.ts
+15 -1
View File
@@ -1,6 +1,6 @@
import { getSession } from '@/lib/session'
import { isAdmin } from '@/lib/admin'
import { deleteCategory } from '@/lib/admin-forum'
import { deleteCategory, updateCategory } from '@/lib/admin-forum'
export async function DELETE(_request: Request, { params }: { params: Promise<{ id: string }> }) {
const session = await getSession()
@@ -9,3 +9,17 @@ export async function DELETE(_request: Request, { params }: { params: Promise<{
const ok = await deleteCategory(Number(id))
return Response.json({ success: ok, error: ok ? undefined : 'categoryNotEmpty' })
}
export async function PUT(request: Request, { params }: { params: Promise<{ id: string }> }) {
const session = await getSession()
if (!(await isAdmin(session))) return Response.json({ success: false, error: 'forbidden' }, { status: 403 })
const { id } = await params
let b: Record<string, unknown> = {}
try { b = await request.json() } catch { return Response.json({ success: false, error: 'invalidRequest' }, { status: 400 }) }
const name = String(b.name ?? '').trim()
const nameEn = String(b.nameEn ?? '').trim() || null
const order = Number(b.order) || 0
if (!name) return Response.json({ success: false, error: 'emptyError' })
await updateCategory(Number(id), name, nameEn, order)
return Response.json({ success: true })
}
web-next/app/api/admin/forum/category/route.ts
+2 -1
View File
@@ -8,8 +8,9 @@ export async function POST(request: Request) {
let b: Record<string, unknown> = {}
try { b = await request.json() } catch { return Response.json({ success: false, error: 'invalidRequest' }, { status: 400 }) }
const name = String(b.name ?? '').trim()
const nameEn = String(b.nameEn ?? '').trim() || null
const order = Number(b.order) || 0
if (!name) return Response.json({ success: false, error: 'emptyError' })
const id = await createCategory(name, order)
const id = await createCategory(name, nameEn, order)
return Response.json({ success: true, id })
}
web-next/app/api/admin/forum/route.ts
+3 -1
View File
@@ -9,10 +9,12 @@ export async function POST(request: Request) {
try { b = await request.json() } catch { return Response.json({ success: false, error: 'invalidRequest' }, { status: 400 }) }
const categoryId = Number(b.categoryId)
const name = String(b.name ?? '').trim()
const nameEn = String(b.nameEn ?? '').trim() || null
const description = String(b.description ?? '').trim()
const descriptionEn = String(b.descriptionEn ?? '').trim() || null
const order = Number(b.order) || 0
const visibility = b.visibility === false ? 0 : 1
if (!categoryId || !name) return Response.json({ success: false, error: 'emptyError' })
const id = await createForum(categoryId, name, description, order, visibility)
const id = await createForum(categoryId, name, nameEn, description, descriptionEn, order, visibility)
return Response.json({ success: true, id })
}
web-next/components/AdminForumManager.tsx
+121 -42
View File
@@ -11,13 +11,15 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
const t = useTranslations('Admin')
const router = useRouter()
const [busy, setBusy] = useState(false)
const [catForm, setCatForm] = useState({ name: '', order: '0' })
const [forumForm, setForumForm] = useState<Record<number, { name: string; description: string; order: string }>>({})
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)
function ff(catId: number) {
return forumForm[catId] ?? { name: '', description: '', order: '0' }
return forumForm[catId] ?? { name: '', nameEn: '', description: '', descriptionEn: '', order: '0' }
}
function setFF(catId: number, patch: Partial<{ name: string; description: string; order: string }>) {
function setFF(catId: number, patch: Partial<{ name: string; nameEn: string; description: string; descriptionEn: string; order: string }>) {
setForumForm((s) => ({ ...s, [catId]: { ...ff(catId), ...patch } }))
}
@@ -48,14 +50,19 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
<form
onSubmit={(e) => {
e.preventDefault()
if (catForm.name.trim()) call('/api/admin/forum/category', 'POST', { name: catForm.name, order: Number(catForm.order) }).then((ok) => ok && setCatForm({ name: '', order: '0' }))
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' }),
)
}}
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')} />
<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 />
@@ -64,18 +71,46 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
{initial.map(({ category, forums }) => (
<div key={category.id} className="inline-div" style={{ display: 'block' }}>
<div className="title-content-h3">
<h3 className="big-font">
{category.name} <span className="third-brown small-font">#{category.order}</span>{' '}
{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 type="number" value={editCat.order} onChange={(e) => setEditCat({ ...editCat, order: e.target.value })} />
<button
onClick={() => confirm(t('confirmDelete')) && call(`/api/admin/forum/category/${category.id}`, 'DELETE')}
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))
}
disabled={busy}
className="nw-tool-btn red-info2"
className="nw-tool-btn"
>
{t('delete')}
</button>
</h3>
</div>
{t('save')}
</button>{' '}
<button onClick={() => setEditCat(null)} className="nw-tool-btn">{t('cancel')}</button>
</div>
) : (
<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>{' '}
<button
onClick={() => setEditCat({ id: category.id, name: category.name, nameEn: category.name_en, order: String(category.order) })}
disabled={busy}
className="nw-tool-btn"
>
{t('edit')}
</button>{' '}
<button
onClick={() => confirm(t('confirmDelete')) && call(`/api/admin/forum/category/${category.id}`, 'DELETE')}
disabled={busy}
className="nw-tool-btn red-info2"
>
{t('delete')}
</button>
</h3>
</div>
)}
{/* Foros de la categoría */}
<table className="max-center-table">
@@ -85,31 +120,68 @@ export function AdminForumManager({ initial }: { initial: Group[] }) {
<td className="second-brown centered">{t('noForums')}</td>
</tr>
)}
{forums.map((f) => (
<tr key={f.id} className="team-center-table-tr">
<td className="lefted separate">
<span className="yellow-info">{f.name}</span>{' '}
{f.visibility === 0 && <span className="red-info2 small-font">({t('hidden')})</span>}
{f.description && <p className="third-brown small-font">{f.description}</p>}
</td>
<td className="real-info-box no-wrap-td">
<button
onClick={() => call(`/api/admin/forum/${f.id}`, 'PATCH', { visibility: f.visibility === 0 })}
disabled={busy}
className="nw-tool-btn"
>
{f.visibility === 0 ? t('show') : t('hide')}
</button>{' '}
<button
onClick={() => confirm(t('confirmDelete')) && call(`/api/admin/forum/${f.id}`, 'DELETE')}
disabled={busy}
className="nw-tool-btn red-info2"
>
{t('delete')}
</button>
</td>
</tr>
))}
{forums.map((f) =>
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')} />
<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))
}
disabled={busy}
className="nw-tool-btn"
>
{t('save')}
</button>{' '}
<button onClick={() => setEditForum(null)} className="nw-tool-btn">{t('cancel')}</button>
</td>
</tr>
) : (
<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>}
{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 })}
disabled={busy}
className="nw-tool-btn"
>
{t('edit')}
</button>{' '}
<button
onClick={() => call(`/api/admin/forum/${f.id}`, 'PATCH', { visibility: f.visibility === 0 })}
disabled={busy}
className="nw-tool-btn"
>
{f.visibility === 0 ? t('show') : t('hide')}
</button>{' '}
<button
onClick={() => confirm(t('confirmDelete')) && call(`/api/admin/forum/${f.id}`, 'DELETE')}
disabled={busy}
className="nw-tool-btn red-info2"
>
{t('delete')}
</button>
</td>
</tr>
),
)}
</tbody>
</table>
@@ -119,14 +191,21 @@ 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, description: v.description, order: Number(v.order) }).then(
(ok) => ok && setFF(category.id, { name: '', description: '', order: '0' }),
)
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' }))
}}
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')} />
<button type="submit" disabled={busy}>{t('addForum')}</button>
</form>
</div>
web-next/lib/admin-forum.ts
+40 -9
View File
@@ -4,6 +4,7 @@ import { db, DB } from './db'
export interface AdminCategory {
id: number
name: string
name_en: string
order: number
}
@@ -11,7 +12,9 @@ export interface AdminForum {
id: number
category_id: number
name: string
name_en: string
description: string
description_en: string
order: number
visibility: number
}
@@ -21,34 +24,45 @@ export async function listCategoriesWithForums(): Promise<
{ category: AdminCategory; forums: AdminForum[] }[]
> {
const [cats] = await db(DB.web).query<RowDataPacket[]>(
'SELECT id, name, `order` FROM forum_categories ORDER BY `order`, id',
'SELECT id, name, name_en, `order` FROM forum_categories ORDER BY `order`, id',
)
const [forums] = await db(DB.web).query<RowDataPacket[]>(
'SELECT id, category_id, name, description, `order`, visibility FROM forums WHERE deleted = 0 ORDER BY `order`, id',
'SELECT id, category_id, name, name_en, description, description_en, `order`, visibility FROM forums WHERE deleted = 0 ORDER BY `order`, id',
)
return cats.map((c) => ({
category: { id: c.id, name: c.name, order: c.order },
category: { id: c.id, name: c.name, name_en: c.name_en || '', order: c.order },
forums: forums
.filter((f) => f.category_id === c.id)
.map((f) => ({
id: f.id,
category_id: f.category_id,
name: f.name,
name_en: f.name_en || '',
description: f.description,
description_en: f.description_en || '',
order: f.order,
visibility: f.visibility,
})),
}))
}
export async function createCategory(name: string, order: number): Promise<number> {
export async function createCategory(name: string, nameEn: string | null, order: number): Promise<number> {
const [res] = await db(DB.web).query<ResultSetHeader>(
'INSERT INTO forum_categories (name, `order`, created_at) VALUES (?, ?, NOW())',
[name, order],
'INSERT INTO forum_categories (name, name_en, `order`, created_at) VALUES (?, ?, ?, NOW())',
[name, nameEn || null, order],
)
return res.insertId
}
export async function updateCategory(id: number, name: string, nameEn: string | null, order: number): Promise<void> {
await db(DB.web).query('UPDATE forum_categories SET name = ?, name_en = ?, `order` = ? WHERE id = ?', [
name,
nameEn || null,
order,
id,
])
}
/** Borra una categoría solo si no tiene foros (no borrados). */
export async function deleteCategory(id: number): Promise<boolean> {
const [f] = await db(DB.web).query<RowDataPacket[]>(
@@ -63,18 +77,35 @@ export async function deleteCategory(id: number): Promise<boolean> {
export async function createForum(
categoryId: number,
name: string,
nameEn: string | null,
description: string,
descriptionEn: string | null,
order: number,
visibility: number,
): Promise<number> {
const [res] = await db(DB.web).query<ResultSetHeader>(
'INSERT INTO forums (category_id, name, description, `order`, type, visibility, deleted, created_at, updated_at) ' +
'VALUES (?, ?, ?, ?, 0, ?, 0, NOW(), NOW())',
[categoryId, name, description, order, visibility ? 1 : 0],
'INSERT INTO forums (category_id, name, name_en, description, description_en, `order`, type, visibility, deleted, created_at, updated_at) ' +
'VALUES (?, ?, ?, ?, ?, ?, 0, ?, 0, NOW(), NOW())',
[categoryId, name, nameEn || null, description, descriptionEn || null, order, visibility ? 1 : 0],
)
return res.insertId
}
export async function updateForum(
id: number,
name: string,
nameEn: string | null,
description: string,
descriptionEn: string | null,
order: number,
visibility: number,
): Promise<void> {
await db(DB.web).query(
'UPDATE forums SET name = ?, name_en = ?, description = ?, description_en = ?, `order` = ?, visibility = ?, updated_at = NOW() WHERE id = ?',
[name, nameEn || null, description, descriptionEn || null, order, visibility ? 1 : 0, id],
)
}
/** Borrado lógico de un foro (deleted = 1). */
export async function deleteForum(id: number): Promise<void> {
await db(DB.web).query('UPDATE forums SET deleted = 1 WHERE id = ?', [id])
web-next/messages/en.json
+5 -1
View File
@@ -572,7 +572,11 @@
"edit": "Edit",
"saving": "Saving…",
"cancel": "Cancel",
"newsEnHint": "Leave English empty to fall back to Spanish on the English site."
"newsEnHint": "Leave English empty to fall back to Spanish on the English site.",
"categoryNameEn": "Name (English, optional)",
"forumNameEn": "Forum name (English, optional)",
"forumDescriptionEn": "Description (English, optional)",
"forumEnHint": "Leave English empty to fall back to Spanish on the English site."
},
"Vote": {
"title": "Vote for us",
web-next/messages/es.json
+5 -1
View File
@@ -572,7 +572,11 @@
"edit": "Editar",
"saving": "Guardando…",
"cancel": "Cancelar",
"newsEnHint": "Deja el inglés vacío para usar el español en la web en inglés."
"newsEnHint": "Deja el inglés vacío para usar el español en la web en inglés.",
"categoryNameEn": "Nombre (inglés, opcional)",
"forumNameEn": "Nombre del foro (inglés, opcional)",
"forumDescriptionEn": "Descripción (inglés, opcional)",
"forumEnHint": "Deja el inglés vacío para usar el español en la web en inglés."
},
"Vote": {
"title": "Votar por nosotros",