Pagination component
(totalRows int, config *PaginationConfig, onPageChange func(int), onPageSizeChange func(int))
| 460 | |
| 461 | // Pagination component |
| 462 | func renderPagination(totalRows int, config *PaginationConfig, onPageChange func(int), onPageSizeChange func(int)) any { |
| 463 | totalPages := (totalRows + config.PageSize - 1) / config.PageSize |
| 464 | currentPage := config.CurrentPage |
| 465 | |
| 466 | return vdom.H("div", map[string]any{ |
| 467 | "className": "flex items-center justify-between mt-4 px-4 py-3 bg-gray-800 rounded-lg", |
| 468 | }, |
| 469 | // Page size selector |
| 470 | vdom.H("div", map[string]any{ |
| 471 | "className": "flex items-center gap-2", |
| 472 | }, |
| 473 | vdom.H("span", map[string]any{ |
| 474 | "className": "text-sm text-gray-400", |
| 475 | }, "Show"), |
| 476 | vdom.H("select", map[string]any{ |
| 477 | "className": "bg-gray-700 text-white rounded px-2 py-1 text-sm focus:outline-none focus:ring-1 focus:ring-blue-500 focus:bg-gray-600 mx-1", |
| 478 | "value": strconv.Itoa(config.PageSize), |
| 479 | "onChange": func(e vdom.VDomEvent) { |
| 480 | if size, err := strconv.Atoi(e.TargetValue); err == nil { |
| 481 | onPageSizeChange(size) |
| 482 | } |
| 483 | }, |
| 484 | }, |
| 485 | vdom.H("option", map[string]any{"value": "10"}, "10"), |
| 486 | vdom.H("option", map[string]any{"value": "25"}, "25"), |
| 487 | vdom.H("option", map[string]any{"value": "50"}, "50"), |
| 488 | vdom.H("option", map[string]any{"value": "100"}, "100"), |
| 489 | ), |
| 490 | vdom.H("span", map[string]any{ |
| 491 | "className": "text-sm text-gray-400", |
| 492 | }, "entries"), |
| 493 | ), |
| 494 | |
| 495 | // Page info |
| 496 | vdom.H("span", map[string]any{ |
| 497 | "className": "text-sm text-gray-400", |
| 498 | }, fmt.Sprintf("Showing %d-%d of %d", |
| 499 | currentPage*config.PageSize+1, |
| 500 | vdom.Ternary(currentPage*config.PageSize+config.PageSize > totalRows, |
| 501 | totalRows, |
| 502 | currentPage*config.PageSize+config.PageSize), |
| 503 | totalRows, |
| 504 | )), |
| 505 | |
| 506 | // Page controls |
| 507 | vdom.H("div", map[string]any{ |
| 508 | "className": "flex items-center gap-3", |
| 509 | }, |
| 510 | vdom.H("button", map[string]any{ |
| 511 | "className": vdom.Classes( |
| 512 | "px-3 py-1.5 rounded text-sm transition-colors", |
| 513 | vdom.IfElse(currentPage > 0, |
| 514 | "bg-blue-600 hover:bg-blue-700 text-white cursor-pointer", |
| 515 | "bg-gray-600 text-gray-500"), |
| 516 | ), |
| 517 | "disabled": currentPage <= 0, |
| 518 | "onClick": func() { |
| 519 | if currentPage > 0 { |
no test coverage detected