import 'package:flutter/material.dart';

// A simple data class for report items
class ReportItem {
  final IconData icon;
  final String label;
  final String route;
  final String formCode; // Added for clarity in the UI

  const ReportItem({
    required this.icon,
    required this.label,
    required this.route,
    required this.formCode,
  });
}

class MarineManualReportHomePage extends StatelessWidget {
  const MarineManualReportHomePage({super.key});

  // Updated list to include all reports
  final List<ReportItem> _reports = const [
    ReportItem(
      icon: Icons.warning_amber_rounded,
      label: "Notification of Pollution Event",
      formCode: "F-MM07",
      route: '/marine/manual/report/npe',
    ),
    ReportItem(
      icon: Icons.biotech_rounded,
      label: "Sonde Calibration",
      formCode: "F-MM02",
      route: '/marine/manual/report/calibration',
    ),
    ReportItem(
      icon: Icons.checklist_rtl_rounded,
      label: "Pre-Departure & Safety Checklist",
      formCode: "F-MM03",
      route: '/marine/manual/report/pre-departure',
    ),
    ReportItem(
      icon: Icons.build_circle_outlined,
      label: "Equipment Maintenance",
      formCode: "F-MM01",
      route: '/marine/manual/report/maintenance',
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Marine Manual Reports"),
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(24.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              "Select a Report to Create",
              style: Theme.of(context).textTheme.headlineSmall?.copyWith(
                fontWeight: FontWeight.bold,
              ),
            ),
            const SizedBox(height: 24),
            GridView.builder(
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 2,
                crossAxisSpacing: 16.0,
                mainAxisSpacing: 16.0,
                childAspectRatio: 1.2, // Adjusted for better text fit
              ),
              itemCount: _reports.length,
              itemBuilder: (context, index) {
                final report = _reports[index];
                return _buildReportCard(context, report);
              },
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildReportCard(BuildContext context, ReportItem report) {
    return InkWell(
      onTap: () {
        Navigator.pushNamed(context, report.route);
      },
      borderRadius: BorderRadius.circular(12),
      child: Card(
        elevation: 4,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(12),
          side: const BorderSide(color: Colors.white24, width: 1),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Icon(report.icon, size: 40, color: Theme.of(context).colorScheme.secondary),
            const SizedBox(height: 12),
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 8.0),
              child: Text(
                report.label,
                style: Theme.of(context).textTheme.titleMedium,
                textAlign: TextAlign.center,
                maxLines: 2,
                overflow: TextOverflow.ellipsis,
              ),
            ),
            const SizedBox(height: 4),
            Text(
              report.formCode, // Displaying the form code
              style: Theme.of(context).textTheme.bodySmall?.copyWith(color: Colors.grey[400]),
            ),
          ],
        ),
      ),
    );
  }
}