import { Head, router } from '@inertiajs/react'; import { useState } from 'react'; import AdminLayout from '@/Layouts/AdminLayout'; import Card from '@/Components/UI/Card'; import Badge from '@/Components/UI/Badge'; interface BankCourse { id: number; title: string; theme: string; description: string | null; } export default function Index({ courses, themes, filters, programmes, }: { courses: BankCourse[]; themes: string[]; filters: { theme?: string; search?: string }; programmes: { id: number; title: string }[]; }) { const [selected, setSelected] = useState>({}); const applyFilter = (key: string, value: string) => { router.get(route('admin.course-bank.index'), { ...filters, [key]: value || undefined }, { preserveState: true, replace: true, }); }; const promote = (course: BankCourse) => { const programmeId = selected[course.id]; if (!programmeId) { alert('Choose a Programme to promote this course into.'); return; } router.post(route('admin.course-bank.promote', course.id), { programme_id: programmeId }); }; return (

Reserved Course Bank

{courses.length} previously developed courses preserved for future Institutes or Programme expansion. Promote a course into an active Programme without data loss.

{ if (e.key === 'Enter') { applyFilter('search', (e.target as HTMLInputElement).value); } }} className="rounded border-outline-variant text-sm" />

{courses.map((course) => (

{course.theme}

{course.title}

))} {courses.length === 0 && (

No banked courses match these filters.

)}

); }