import { AppLayout } from '@/Components/Layout/AppLayout';
import { DataTable } from '@/Components/Tables/DataTable';
import { formatCount } from '@/lib/formatters';

type SchoolModule = {
  keyName: string;
  name: string;
  isCore: boolean;
  isSellable: boolean;
  enabled: boolean;
  expiresAt: string;
  price: number;
  uiBehavior: string;
};

type Props = {
  modules: SchoolModule[];
};

export default function SchoolModules({ modules }: Props) {
  const rows = modules.map((module) => [
    module.keyName,
    module.name,
    module.enabled ? 'فعال' : 'غیرفعال',
    module.isCore ? 'اجباری' : `قیمت: ${formatCount(module.price)}`,
    module.expiresAt,
    module.uiBehavior,
  ]);

  return (
    <AppLayout title="ماژول‌های مدرسه">
      <div className="page-stack">
        <section className="panel-card">
          <h2>امکانات فعال این مدرسه</h2>
          <p>هر چیزی که license مدرسه ندارد باید در sidebar، route و API مخفی/مسدود شود.</p>
        </section>
        {rows.length > 0
          ? <DataTable columns={['کد', 'نام', 'وضعیت', 'نوع/قیمت', 'انقضا', 'رفتار UI']} rows={rows} />
          : <section className="panel-card"><h2>هنوز ماژولی تعریف نشده</h2><p>ابتدا seed.sql را وارد کن تا کاتالوگ ماژول‌ها در دیتابیس ساخته شود.</p></section>}
      </div>
    </AppLayout>
  );
}