import React from 'react' import { Head, router, Link } from '@inertiajs/react' import AdminLayout from '../../../Layouts/AdminLayout' function formatDateTime(value) { if (!value) return '—' const date = new Date(value) if (Number.isNaN(date.getTime())) return '—' return new Intl.DateTimeFormat('en', { dateStyle: 'medium', timeStyle: 'short' }).format(date) } function StatCard({ label, value }) { return (

{label}

{Number(value || 0).toLocaleString()}

) } export default function StaffApplicationsIndex({ title, items, stats, filters, topics, endpoints }) { const [state, setState] = React.useState(filters || { q: '', topic: 'all' }) React.useEffect(() => { setState(filters || { q: '', topic: 'all' }) }, [filters]) function update(key, value) { setState((current) => ({ ...current, [key]: value })) } function applyFilters(event) { event.preventDefault() router.get(endpoints.index, state, { preserveState: true, replace: true, preserveScroll: true }) } const rows = items?.data || [] return (

Moderation surface

Staff Applications

Review staff and contact submissions in the same moderation workspace as the rest of Skinbase.

Page {items?.current_page || 1} / {items?.last_page || 1} {Number(items?.total || 0).toLocaleString()} submissions

{rows.length === 0 ? ( ) : rows.map((item) => ( ))}

Received	Topic	Name	Email	Role	Action
No staff applications matched the current filters.
{formatDateTime(item.created_at)}	{String(item.topic \|\| 'contact').replaceAll('_', ' ')}	{item.name}	{item.email}	{item.role \|\| '—'}	View

{(items?.prev_page_url || items?.next_page_url) ? (

Showing page {items?.current_page || 1} of {items?.last_page || 1}

{items?.prev_page_url ? ( ) : null} {items?.next_page_url ? ( ) : null}

) : null} ) }