admin
91 lines
3.0 KiB
TypeScript
91 lines
3.0 KiB
TypeScript
'use client';
|
|
|
|
import { RFAList } from '@/components/rfas/list';
|
|
import { Button } from '@/components/ui/button';
|
|
import Link from 'next/link';
|
|
import { Plus, Loader2 } from 'lucide-react';
|
|
import { useRFAs } from '@/hooks/use-rfa';
|
|
import { useSearchParams } from 'next/navigation';
|
|
import { Pagination } from '@/components/common/pagination';
|
|
import { Suspense } from 'react';
|
|
|
|
function RFAsContent() {
|
|
const searchParams = useSearchParams();
|
|
const page = Number(searchParams.get('page') || '1');
|
|
const statusId = searchParams.get('status') ? Number(searchParams.get('status')!) : undefined;
|
|
const search = searchParams.get('search') || undefined;
|
|
const projectId = searchParams.get('projectId') || undefined; // ADR-019: Pass UUID string directly
|
|
|
|
const revisionStatus = (searchParams.get('revisionStatus') as 'CURRENT' | 'ALL' | 'OLD') || 'CURRENT';
|
|
|
|
const { data, isLoading, isError } = useRFAs({ page, statusId, search, projectId, revisionStatus });
|
|
|
|
return (
|
|
<>
|
|
<div className="mb-4 flex gap-2">
|
|
{/* Simple Filter Buttons using standard Buttons for now, or use a Select if imported */}
|
|
<div className="flex gap-1 bg-muted p-1 rounded-md">
|
|
{['ALL', 'CURRENT', 'OLD'].map((status) => (
|
|
<Link
|
|
key={status}
|
|
href={`?${new URLSearchParams({ ...Object.fromEntries(searchParams.entries()), revisionStatus: status, page: '1' }).toString()}`}
|
|
>
|
|
<Button variant={revisionStatus === status ? 'default' : 'ghost'} size="sm" className="text-xs px-3">
|
|
{status === 'CURRENT' ? 'Latest' : status === 'OLD' ? 'Previous' : 'All'}
|
|
</Button>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
{isLoading ? (
|
|
<div className="flex justify-center py-8">
|
|
<Loader2 className="h-8 w-8 animate-spin" />
|
|
</div>
|
|
) : isError ? (
|
|
<div className="text-red-500 text-center py-8">Failed to load RFAs.</div>
|
|
) : (
|
|
<>
|
|
<RFAList data={data?.data || []} />
|
|
<div className="mt-4">
|
|
<Pagination
|
|
currentPage={data?.meta?.page || 1}
|
|
totalPages={data?.meta?.totalPages || 1}
|
|
total={data?.meta?.total || 0}
|
|
/>
|
|
</div>
|
|
</>
|
|
)}
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default function RFAsPage() {
|
|
return (
|
|
<div className="space-y-6">
|
|
<div className="flex justify-between items-center">
|
|
<div>
|
|
<h1 className="text-3xl font-bold">RFAs (Request for Approval)</h1>
|
|
<p className="text-muted-foreground mt-1">Manage approval requests and submissions</p>
|
|
</div>
|
|
<Link href="/rfas/new">
|
|
<Button>
|
|
<Plus className="mr-2 h-4 w-4" />
|
|
New RFA
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
|
|
<Suspense
|
|
fallback={
|
|
<div className="flex justify-center py-8">
|
|
<Loader2 className="h-8 w-8 animate-spin" />
|
|
</div>
|
|
}
|
|
>
|
|
<RFAsContent />
|
|
</Suspense>
|
|
</div>
|
|
);
|
|
}
|