'use client' import { useEffect, useMemo, useState } from 'react' import type { FormEvent, ReactNode } from 'react' import { BarChart3, ChevronRight, CircleHelp, FileText, LayoutDashboard, Mail, Menu, Settings, ShieldCheck, Users, X } from 'lucide-react' import { djangoUrl } from '@/lib/site-content' import type { DashboardData } from '@/components/admin-dashboard' import { DashboardToast, type DashboardToastMessage } from '@/components/dashboard-toast' import { DashboardLogoutButton, DashboardProfileMenu } from '@/components/dashboard-profile-menu' export type ManagementField = { name: string label: string type: string required: boolean helpText: string choices: Array<{ value: string; label: string }> initial: string | string[] | boolean | null } export type ManagementData = { kind: string label?: string singular?: string fields?: ManagementField[] values?: Record items?: Array> sections?: Array<{ key: string; label: string; count: number; canChange: boolean; canDelete?: boolean; items: Array> }> canAdd?: boolean canChange?: boolean canDelete?: boolean } const iconFor = (key: string) => { if (key === 'dashboard') return LayoutDashboard if (key === 'messages') return Mail if (key === 'requests') return FileText if (key === 'users') return Users if (key === 'settings') return Settings if (key === 'faqs') return CircleHelp return BarChart3 } function currentArea(path: string[]) { return path[0] === 'content' ? path[1] || '' : path[0] || '' } function pageTitle(path: string[], data: ManagementData | null) { if (data?.label) return data.label if (path[0] === 'content') return ({ news: 'News', projects: 'Projects', faqs: 'Questions & answers', partners: 'Partners' } as Record)[path[1]] || 'Content' if (path[0] === 'messages') return 'Public messages' if (path[0] === 'requests') return 'Requests' if (path[0] === 'users') return 'Users' if (path[0] === 'settings') return 'Settings' return 'Dashboard' } function apiUrl(resource: string) { return djangoUrl('/api/dashboard/manage/' + resource + '/') } async function dashboardFetch(resource: string, init: RequestInit = {}) { const method = (init.method || 'GET').toUpperCase() const headers = new Headers(init.headers) headers.set('Accept', 'application/json') if (method !== 'GET' && method !== 'HEAD') { const csrfResponse = await fetch(djangoUrl('/csrf/'), { credentials: 'include', cache: 'no-store' }) if (!csrfResponse.ok) throw new Error('Unable to prepare the dashboard action. Refresh the page and try again.') const csrfPayload = await csrfResponse.json() as { csrfToken?: string } if (!csrfPayload.csrfToken) throw new Error('The dashboard security token is missing. Refresh the page and try again.') headers.set('X-CSRFToken', csrfPayload.csrfToken) } if (!(typeof FormData !== 'undefined' && init.body instanceof FormData)) headers.set('Content-Type', 'application/json') const response = await fetch(apiUrl(resource), { ...init, headers, credentials: 'include', cache: 'no-store' }) const payload = await response.json().catch(() => ({})) if (!response.ok) { const error = new Error(typeof payload.detail === 'string' ? payload.detail : 'The dashboard request failed.') as Error & { fieldErrors?: Record } error.fieldErrors = payload.errors throw error } return payload } function DeleteAction({ resource, id, label, onError }: { resource: string; id: string | number; label: string; onError: (message: string) => void }) { const [deleting, setDeleting] = useState(false) const remove = async () => { if (deleting || !window.confirm('Delete this ' + label + '?')) return setDeleting(true) try { await dashboardFetch(resource + '/' + id, { method: 'DELETE' }) window.location.reload() } catch (reason) { onError(reason instanceof Error ? reason.message : 'Unable to delete this ' + label + '.') setDeleting(false) } } return } function DashboardChrome({ data, path, title, toast, onCloseToast, children }: { data: DashboardData; path: string[]; title: string; toast: DashboardToastMessage | null; onCloseToast: () => void; children: ReactNode }) { const [menuOpen, setMenuOpen] = useState(false) const selected = currentArea(path) return
{menuOpen &&

RG Admin Panel

{title}

{children}
RG Admin Panel - Permission-aware dashboard
} function FormPanel({ resource, data, onSaved, onError }: { resource: string; data: ManagementData; onSaved: () => void; onError: (message: string) => void }) { const fields = data.fields || [] const initialValues = data.values || Object.fromEntries(fields.map((field) => [field.name, field.initial ?? (field.type === 'checkbox' ? false : '')])) const [values, setValues] = useState>(initialValues) const [fieldErrors, setFieldErrors] = useState>({}) const [saving, setSaving] = useState(false) useEffect(() => setValues(initialValues), [data]) const update = (name: string, value: any) => setValues((current) => ({ ...current, [name]: value })) const submit = async (event: FormEvent) => { event.preventDefault() setSaving(true) setFieldErrors({}) const formData = new FormData() fields.forEach((field) => { const value = values[field.name] if (field.type === 'checkbox') formData.append(field.name, value ? 'on' : '') else if (Array.isArray(value)) value.forEach((item) => formData.append(field.name, String(item))) else if (value !== undefined && value !== null) formData.append(field.name, String(value)) }) event.currentTarget.querySelectorAll('input[type=file]').forEach((input) => { if (input.files?.[0]) formData.set(input.name, input.files[0]) }) try { await dashboardFetch(resource, { method: 'POST', body: formData }) onSaved() } catch (reason) { const message = reason instanceof Error ? reason.message : 'Unable to save this form.' onError(message) setFieldErrors((reason as Error & { fieldErrors?: Record }).fieldErrors || {}) } finally { setSaving(false) } } return
{fields.map((field) => { const value = values[field.name] ?? '' if (field.type === 'checkbox') return if (field.type === 'select') return if (field.type === 'file') return return