import React, { useState } from 'react'; import { Head, router } from '@inertiajs/react'; import AdminLayout from '../../../Layouts/AdminLayout'; import { Megaphone, Plus, Trash2, Send, CheckCircle2, Check, X } from 'lucide-react'; export default function Announcements({ initialAnnouncements }) { const [announcements, setAnnouncements] = useState(initialAnnouncements || []); const [isFormOpen, setIsFormOpen] = useState(false); const [newAnnouncement, setNewAnnouncement] = useState({ title: '', content: '', audience: 'Both' }); const [errors, setErrors] = useState({}); const [toastMessage, setToastMessage] = useState(null); const showToast = (message) => { setToastMessage(message); setTimeout(() => setToastMessage(null), 3000); }; const handleCreate = (e) => { e.preventDefault(); let newErrors = {}; if (!newAnnouncement.title.trim()) newErrors.title = 'Title is required'; if (!newAnnouncement.content.trim()) newErrors.content = 'Content is required'; if (Object.keys(newErrors).length > 0) { setErrors(newErrors); return; } router.post(route('admin.announcements.store'), { title: newAnnouncement.title, content: newAnnouncement.content, type: newAnnouncement.audience === 'Both' ? 'info' : (newAnnouncement.audience === 'Employers' ? 'success' : 'warning') }, { onSuccess: () => { setNewAnnouncement({ title: '', content: '', audience: 'Both' }); setErrors({}); setIsFormOpen(false); showToast('Announcement broadcasted successfully'); setTimeout(() => window.location.reload(), 500); } }); }; const handleApprove = (id) => { router.post(route('admin.announcements.approve', id), {}, { onSuccess: () => { showToast('Announcement approved successfully'); setTimeout(() => window.location.reload(), 500); } }); }; const handleReject = (id) => { router.post(route('admin.announcements.reject', id), {}, { onSuccess: () => { showToast('Announcement rejected successfully'); setTimeout(() => window.location.reload(), 500); } }); }; const handleDelete = (id) => { if (confirm('Are you sure you want to delete this announcement?')) { router.delete(route('admin.announcements.delete', id), { onSuccess: () => { showToast('Announcement deleted'); setTimeout(() => window.location.reload(), 500); } }); } }; return ( {/* Toast Notification */} {toastMessage && (
{toastMessage}
)}

Platform Announcements & Events

Approve user-submitted events or broadcast messages to all users.

{isFormOpen && (

Compose Message

setNewAnnouncement({ ...newAnnouncement, title: e.target.value })} className={`w-full px-4 py-2.5 rounded-xl border ${errors.title ? 'border-red-500' : 'border-slate-300'} text-sm focus:ring-2 focus:ring-[#185FA5]/20 focus:border-[#185FA5] outline-none transition-all`} placeholder="Enter announcement title..." /> {errors.title &&

{errors.title}

}
{errors.content &&

{errors.content}

}
)}
{announcements.length === 0 ? (

No announcements published yet.

) : ( announcements.map((ann) => (

{ann.title}

Type: {ann.type} Status: {ann.status}

{ann.content}

Posted by: {ann.posted_by} ({ann.organization}) • Published: {ann.created_at}
{ann.status === 'pending' && ( <> )}
)) )}
); }