import React, { useState } from 'react'; import { Head, router } from '@inertiajs/react'; import AdminLayout from '@/Layouts/AdminLayout'; import { Plus, Search, Edit2, Trash2, HelpCircle, Info } from 'lucide-react'; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '@/components/ui/table'; import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, } from "@/components/ui/dialog"; export default function FaqsIndex({ faqs }) { const [searchTerm, setSearchTerm] = useState(''); const [isDialogOpen, setIsDialogOpen] = useState(false); const [editingFaq, setEditingFaq] = useState(null); const [questionText, setQuestionText] = useState(''); const [answerText, setAnswerText] = useState(''); const [isPublished, setIsPublished] = useState(true); const [error, setError] = useState(''); const handleOpenAdd = () => { setEditingFaq(null); setQuestionText(''); setAnswerText(''); setIsPublished(true); setError(''); setIsDialogOpen(true); }; const handleOpenEdit = (faq) => { setEditingFaq(faq); setQuestionText(faq.question); setAnswerText(faq.answer); setIsPublished(faq.is_published); setError(''); setIsDialogOpen(true); }; const handleSubmit = (e) => { e.preventDefault(); if (!questionText.trim()) { setError('Question is required.'); return; } if (!answerText.trim()) { setError('Answer is required.'); return; } const payload = { question: questionText.trim(), answer: answerText.trim(), is_published: isPublished }; if (editingFaq) { router.post(`/admin/faqs/${editingFaq.id}`, payload, { onSuccess: () => { setIsDialogOpen(false); }, onError: (err) => { setError(Object.values(err)[0] || 'Failed to update FAQ.'); } }); } else { router.post('/admin/faqs', payload, { onSuccess: () => { setIsDialogOpen(false); }, onError: (err) => { setError(Object.values(err)[0] || 'Failed to add FAQ.'); } }); } }; const handleDelete = (id) => { if (confirm('Are you sure you want to delete this FAQ?')) { router.delete(`/admin/faqs/${id}`); } }; const filteredFaqs = faqs.filter(faq => faq.question.toLowerCase().includes(searchTerm.toLowerCase()) || faq.answer.toLowerCase().includes(searchTerm.toLowerCase()) ); return (

{/* Header Actions */}

setSearchTerm(e.target.value)} className="w-full pl-10 pr-4 py-2.5 bg-white border border-slate-200 rounded-xl text-sm font-medium focus:ring-4 focus:ring-teal-500/10 outline-none transition-all" />

{/* FAQs Card */}

Frequently Asked Questions

Manage support & compliance FAQs displayed to users

Question & Answer Status Action {filteredFaqs.length > 0 ? ( filteredFaqs.map((faq) => (

{faq.question.trim().endsWith('?') ? faq.question.trim() : faq.question.trim() + '?'}

{faq.answer}

{faq.is_published ? 'Published' : 'Draft'}

)) ) : ( No FAQs found. Add one to get started! )}

Tip: Draft FAQs will not be visible on user-facing support panels. Publish them to make them active.

{/* FAQ Add/Edit Modal */}