import AppLayout from '@/layouts/app-layout' import { Button } from '@/components/ui/button' import { PaginatedData, type BreadcrumbItem } from '@/types' import { Head, Link, router, usePage } from '@inertiajs/react' import { Plus } from 'lucide-react' import { DataTable } from '@/components/DataTable' import Pagination from '@/components/Pagination' import FlashToast from '@/components/FlashToast' import { columns } from './columns' import { NewsEvent } from '@/types/admin/NewsEvent' import { create, index } from '@/routes/admin/news-event' import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs' interface Category { label: string; value: string; } interface Props { newsEvents: PaginatedData categories: Category[] } const breadcrumbs: BreadcrumbItem[] = [ { title: 'News & Events', href: index().url, }, ] export default function Index({ newsEvents, categories }: Props) { FlashToast() const { url } = usePage() const params = new URLSearchParams(url.split('?')[1]) const currentType = params.get('type') ?? 'all' const handleTabChange = (value: string) => { router.get( index().url, { type: value === 'all' ? undefined : value, }, { preserveScroll: true, preserveState: true, replace: true, } ) } return (

News & Events

Manage news & events here.

{/* Tabs */} All {categories.map((category) => ( {category.label} ))} {/* Data Table */}
) }