Files
oott/frontend/lib/widgets/pagination_progress.dart
T
rzuastiandClaude Opus 4.8 c949deedb6 Show a page-level progress bar while paginating lists
Changing pages in the notifications or devices list gave no cue that
the next page was loading. Render an indeterminate progress bar at the
shell level, pinned flush against the bottom of the page body (above
the nav bar on phones, the screen bottom on wide layouts), driven by a
shared paginationLoading notifier the lists set while fetching. The
pagination bar keeps disabling its buttons during the fetch.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-04 18:45:08 -04:00

38 lines
1.3 KiB
Dart

import 'package:flutter/material.dart';
/// Shared flag that drives the page-level pagination progress bar. The lists set
/// it while fetching a new page; the app shell renders the bar flush against the
/// bottom of the page body (above the navigation bar on phones, the screen
/// bottom on wider layouts) so the cue sits outside the page's content padding.
final ValueNotifier<bool> paginationLoading = ValueNotifier<bool>(false);
/// Overlays [child] with an indeterminate progress bar pinned to the bottom of
/// the available space, shown whenever [paginationLoading] is set. The bar is
/// full width and flush with the bottom edge, so it reads as a page-level cue
/// rather than part of the scrolling content.
class PaginationProgressOverlay extends StatelessWidget {
const PaginationProgressOverlay({super.key, required this.child});
final Widget child;
@override
Widget build(BuildContext context) {
return Stack(
children: [
child,
Positioned(
left: 0,
right: 0,
bottom: 0,
child: ValueListenableBuilder<bool>(
valueListenable: paginationLoading,
builder: (context, loading, _) => loading
? const LinearProgressIndicator(minHeight: 4)
: const SizedBox.shrink(),
),
),
],
);
}
}