import TableFilter from '@/components/table/table-filter'; import TableFooter from '@/components/table/table-footer'; import TableHeader from '@/components/table/table-header'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Table, TableBody, TableCell, TableRow } from '@/components/ui/table'; import DashboardLayout from '@/layouts/dashboard/layout'; import { SharedData } from '@/types/global'; import { Head, Link, usePage } from '@inertiajs/react'; import { SortingState, flexRender, getCoreRowModel, getFilteredRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table'; import { Archive, BookOpen, Edit, Eye, Plus } from 'lucide-react'; import * as React from 'react'; import { ReactNode } from 'react'; import TableColumn from './partials/table-columns'; interface BlogsPageProps extends SharedData { blogs: Pagination; categories: BlogCategory[]; statuses: Record; statistics: { total: number; published: number; draft: number; archived: number; popular: number; }; } const BlogsIndex = () => { const { props } = usePage(); const { blogs, statistics, translate } = props; const { dashboard, frontend } = translate; const [sorting, setSorting] = React.useState([]); const table = useReactTable({ data: blogs.data, columns: TableColumn(props.translate), onSortingChange: setSorting, getCoreRowModel: getCoreRowModel(), getSortedRowModel: getSortedRowModel(), getFilteredRowModel: getFilteredRowModel(), state: { sorting }, }); return ( <>

{/* Header */}

{dashboard.blog}

{/* Statistics Cards */}

{dashboard.total_blogs}

{statistics.total}

{dashboard.published}

{statistics.published}

{dashboard.draft}

{statistics.draft}

{dashboard.archived}

{statistics.archived}

{/* Blogs Table */} {table.getRowModel().rows?.length ? ( table.getRowModel().rows.map((row) => ( {row.getVisibleCells().map((cell) => ( {flexRender(cell.column.columnDef.cell, cell.getContext())} ))} )) ) : ( {frontend.no_results} )}

); }; BlogsIndex.layout = (page: ReactNode) => ; export default BlogsIndex;