import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

class PaginationControls extends StatelessWidget {
  final int currentPage;
  final int itemsPerPage;
  final int totalItems;
  final Function(int) onPageChanged;
  final Function(int) onItemsPerPageChanged;

  const PaginationControls({
    Key? key,
    required this.currentPage,
    required this.itemsPerPage,
    required this.totalItems,
    required this.onPageChanged,
    required this.onItemsPerPageChanged,
  }) : super(key: key);

  List<int> _visiblePages(int totalPages, int currentPage) {
    const int maxVisible = 5; // Show up to 5 visible pages
    if (totalPages <= maxVisible) {
      return List<int>.generate(totalPages, (i) => i + 1);
    }

    // Near the start
    if (currentPage <= 3) {
      return [1, 2, 3, -1, totalPages]; // -1 means ellipsis (...)
    }

    // Near the end
    if (currentPage >= totalPages - 2) {
      return [1, -1, totalPages - 2, totalPages - 1, totalPages];
    }

    // Middle pages
    return [
      1,
      -1,
      currentPage - 1,
      currentPage,
      currentPage + 1,
      -1,
      totalPages,
    ];
  }

  @override
  Widget build(BuildContext context) {
    final int totalPages = (totalItems / itemsPerPage).ceil();
    final List<int> pages = _visiblePages(totalPages, currentPage);

    return Container(
      // color: Colors.yellow.shade100,
      height: 30,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        mainAxisSize: MainAxisSize.min,
        children: [
          // Dropdown for rows per page
          DropdownButton<int>(
            value: itemsPerPage,
            items: [5, 10, 15, 20, 50].map((int value) {
              return DropdownMenuItem<int>(
                value: value,
                child: Text('$value', style: GoogleFonts.inter(fontSize: 12)),
              );
            }).toList(),
            onChanged: (newValue) {
              if (newValue != null) {
                onItemsPerPageChanged(newValue);
                onPageChanged(1);
              }
            },
          ),

          // Previous Button
          IconButton(
            onPressed: currentPage > 1
                ? () => onPageChanged(currentPage - 1)
                : null,
            icon: const Icon(Icons.chevron_left, size: 18),
          ),

          // Page buttons with ellipsis
          for (final i in pages)
            if (i == -1)
              const Padding(
                padding: EdgeInsets.symmetric(horizontal: 2),
                child: Text("..."),
              )
            else
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 2),
                child: ElevatedButton(
                  style: ElevatedButton.styleFrom(
                    backgroundColor: currentPage == i
                        ? const Color(0xFFD4F8F3)
                        : const Color(0xFFEDF6F5),
                    foregroundColor: currentPage == i
                        ? Colors.black
                        : Colors.grey,
                    minimumSize: const Size(26, 26),
                    padding: EdgeInsets.zero,
                  ),
                  onPressed: () => onPageChanged(i),
                  child: Text(i.toString()),
                ),
              ),

          // Next Button
          IconButton(
            onPressed: currentPage < totalPages
                ? () => onPageChanged(currentPage + 1)
                : null,
            icon: const Icon(Icons.chevron_right, size: 18),
          ),
        ],
      ),
    );
  }
}

// class PaginationControls extends StatelessWidget {
//   final int currentPage;
//   final int itemsPerPage;
//   final int totalItems;
//   final Function(int) onPageChanged;
//   final Function(int) onItemsPerPageChanged;
//
//   // final Color? activeColor;
//
//   const PaginationControls({
//     Key? key,
//     required this.currentPage,
//     required this.itemsPerPage,
//     required this.totalItems,
//     required this.onPageChanged,
//     required this.onItemsPerPageChanged,
//     // this.activeColor = Colors.blue, // fallback if no color given
//   }) : super(key: key);
//
//   @override
//   Widget build(BuildContext context) {
//     final int totalPages = (totalItems / itemsPerPage).ceil();
//
//     return Row(
//       mainAxisAlignment: MainAxisAlignment.end,
//       children: [
//         // Dropdown for rows per page
//         DropdownButton<int>(
//           value: itemsPerPage,
//           items: [5, 10, 15, 20, 50].map((int value) {
//             return DropdownMenuItem<int>(
//               value: value,
//               child: Text('$value', style: GoogleFonts.poppins(fontSize: 15)),
//             );
//           }).toList(),
//           onChanged: (newValue) {
//             if (newValue != null) {
//               onItemsPerPageChanged(newValue);
//               onPageChanged(1); // reset to page 1 when rows change
//             }
//           },
//         ),
//
//         // Previous button
//         IconButton(
//           onPressed: currentPage > 1
//               ? () => onPageChanged(currentPage - 1)
//               : null,
//           icon: Icon(Icons.arrow_back),
//         ),
//
//         // Page buttons
//         for (int i = 1; i <= totalPages; i++)
//           Padding(
//             padding: const EdgeInsets.symmetric(horizontal: 4),
//             child: ElevatedButton(
//               style: ElevatedButton.styleFrom(
//                 backgroundColor: currentPage == i
//                     ? Color(0xFFD4F8F3)
//                     : Color(0xFFEDF6F5),
//                 foregroundColor: currentPage == i ? Colors.black : Colors.grey,
//                 minimumSize: const Size(36, 36),
//                 padding: EdgeInsets.zero,
//               ),
//               onPressed: () => onPageChanged(i),
//               child: Text(i.toString()),
//             ),
//           ),
//
//         // Next button
//         IconButton(
//           onPressed: currentPage < totalPages
//               ? () => onPageChanged(currentPage + 1)
//               : null,
//           icon: Icon(Icons.arrow_forward),
//         ),
//       ],
//     );
//   }
//   // Widget build(BuildContext context) {
//   //   // int totalPages = (totalItems / itemsPerPage).ceil();
//   //   final int totalPages = (widget.totalItems / widget.itemsPerPage).ceil();
//   //
//   //   return Row(
//   //     mainAxisAlignment: MainAxisAlignment.end,
//   //     children: [
//   //       DropdownButton<int>(
//   //         value: itemsPerPage,
//   //         items: [5, 10, 15, 20, 50].map((int value) {
//   //           return DropdownMenuItem<int>(
//   //             value: value,
//   //             child: Text(' $value ', style: GoogleFonts.poppins(fontSize: 15)),
//   //           );
//   //         }).toList(),
//   //         onChanged: (newValue) {
//   //           setState(() {
//   //             itemsPerPage = newValue!;
//   //             currentPage = 1; // Reset to first page when rows per page changes
//   //           });
//   //         },
//   //       ),
//   //       IconButton(
//   //         onPressed: currentPage > 1
//   //             ? () {
//   //                 setState(() {
//   //                   currentPage--;
//   //                 });
//   //               }
//   //             : null,
//   //         icon: Icon(Icons.chevron_left),
//   //       ),
//   //       for (int i = 1; i <= (totalItems / itemsPerPage).ceil(); i++)
//   //         Padding(
//   //           padding: const EdgeInsets.symmetric(horizontal: 4),
//   //           child: ElevatedButton(
//   //             style: ElevatedButton.styleFrom(
//   //               backgroundColor: _currentPage == i
//   //                   ? Color(0xFF00A6A6)
//   //                   : Colors.grey[300],
//   //               foregroundColor: _currentPage == i
//   //                   ? Colors.white
//   //                   : Colors.black,
//   //               minimumSize: Size(36, 36),
//   //               padding: EdgeInsets.zero,
//   //             ),
//   //             onPressed: () {
//   //               setState(() {
//   //                 _currentPage = i;
//   //               });
//   //             },
//   //             child: Text(i.toString()),
//   //           ),
//   //         ),
//   //       IconButton(
//   //         onPressed: currentPage < (totalItems / itemsPerPage).ceil()
//   //             ? () {
//   //                 setState(() {
//   //                   currentPage++;
//   //                 });
//   //               }
//   //             : null,
//   //         icon: Icon(Icons.chevron_right),
//   //       ),
//   //     ],
//   //     // children: [
//   //     //   DropdownButton<int>(
//   //     //     value: itemsPerPage,
//   //     //     items: [10, 20, 50, 100]
//   //     //         .map(
//   //     //           (value) => DropdownMenuItem<int>(
//   //     //             value: value,
//   //     //             child: Text(
//   //     //               '$value',
//   //     //               style: TextStyle(fontSize: 12, fontFamily: "Inter"),
//   //     //             ),
//   //     //           ),
//   //     //         )
//   //     //         .toList(),
//   //     //     onChanged: (value) {
//   //     //       if (value != null) {
//   //     //         onItemsPerPageChanged(value);
//   //     //       }
//   //     //     },
//   //     //     style: TextStyle(
//   //     //       fontSize: 12,
//   //     //       color: Colors.black,
//   //     //       fontFamily: "Inter",
//   //     //     ),
//   //     //     underline: SizedBox(),
//   //     //     iconSize: 16,
//   //     //   ),
//   //     //   SizedBox(width: 16),
//   //     //   IconButton(
//   //     //     icon: Icon(Icons.arrow_back, size: 18),
//   //     //     onPressed: currentPage > 0
//   //     //         ? () => onPageChanged(currentPage - 1)
//   //     //         : null,
//   //     //   ),
//   //     //
//   //     //   SingleChildScrollView(
//   //     //     scrollDirection: Axis.horizontal,
//   //     //     child: Row(children: _buildPageButtons()),
//   //     //   ),
//   //     //
//   //     //   IconButton(
//   //     //     icon: Icon(Icons.arrow_forward, size: 18),
//   //     //     onPressed: (currentPage + 1) * itemsPerPage < totalItems
//   //     //         ? () => onPageChanged(currentPage + 1)
//   //     //         : null,
//   //     //   ),
//   //     // ],
//   //   );
//   // }
//
//   List<Widget> _buildPageButtons() {
//     final int totalPages = (totalItems / itemsPerPage).ceil();
//     List<Widget> buttons = [];
//
//     // Always show first page
//     buttons.add(_buildPageButton(0));
//
//     // Add left ellipsis if needed
//     if (currentPage > 2) {
//       buttons.add(_buildEllipsis());
//     }
//
//     // Add previous, current, next page if in range
//     for (int i = currentPage - 1; i <= currentPage + 1; i++) {
//       if (i > 0 && i < totalPages - 1) {
//         buttons.add(_buildPageButton(i));
//       }
//     }
//
//     // Add right ellipsis if needed
//     if (currentPage < totalPages - 3) {
//       buttons.add(_buildEllipsis());
//     }
//
//     // Always show last page
//     if (totalPages > 1) {
//       buttons.add(_buildPageButton(totalPages - 1));
//     }
//
//     return buttons;
//   }
//
//   Widget _buildPageButton(int pageIndex) {
//     return Padding(
//       padding: const EdgeInsets.symmetric(horizontal: 4),
//       child: ElevatedButton(
//         onPressed: () => onPageChanged(pageIndex),
//         style: ElevatedButton.styleFrom(
//           backgroundColor: currentPage == pageIndex
//               ? Color(0xFFD4F8F3)
//               : Color(0xFFEDF6F5),
//
//           foregroundColor: currentPage == pageIndex
//               ? Colors.black
//               : Colors.grey,
//           minimumSize: Size(36, 36),
//           padding: EdgeInsets.zero,
//         ),
//         child: Text('${pageIndex + 1}'),
//       ),
//     );
//   }
//
//   Widget _buildEllipsis() {
//     return Padding(
//       padding: const EdgeInsets.symmetric(horizontal: 6),
//       child: Text('...', style: TextStyle(fontSize: 16)),
//     );
//   }
// }