External/oott
1
0
Fork 0
mirror of https://github.com/rzuasti/oott.git synced 2026-07-08 19:21:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add "go to last page" and page count to notifications and devices lists

Browse Source 
The list endpoints now return a total count alongside the page so the
front-end can show how many pages exist and offer a last-page jump.

Backend: add count(is_new) and count_devices(...) (sharing a WHERE-builder
with list_devices so page and count can't drift), wrap both list responses
in {items, total_count} structs, and register them with utoipa.

Front-end: parse the wrapper shape (dropping the fetch-one-extra trick),
add a Last-page button and a responsive "Page X of Y" / "X / Y" label to
the shared PaginationBar, and track the total in both lists. Notifications
re-sync the count on every fetch and decrement it locally on mark-read/
unread removals so the count stays accurate without a re-fetch.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
rzuasti
2026-06-05 21:09:25 -04:00
co-authored by Claude Opus 4.8
parent 3cb104e364
commit 844d7d189c
21 changed files with 765 additions and 275 deletions
Download Patch File Download Diff File Expand all files Collapse all files
TODO.md
+1 -1
View File
@@ -27,7 +27,7 @@
- [ ] Review the whole codebase for dead code, duplication and simplicity
- [x] In the devices list, add an order by type (in the wide version it should be over the icon on the left of the list)
- [ ] How expensive it is to get the total number of pages and implement a go to last page
- [x] How expensive it is to get the total number of pages and implement a go to last page
- [x] Mobile - Device details - Chart buttons not fully visible, replace with combo only for narrow devices
## Improve engine
backend/src/db/devices.rs
+168 -45
View File
@@ -30,6 +30,53 @@ fn resolve_sort_direction(sort_order: Option<&str>) -> &'static str {
}
}
// Builds the shared `WHERE` clause (and its bound parameters) used by both
// `list_devices` and `count_devices`, so the page and its total count always
// apply the exact same filters. The returned clause starts with "WHERE 1=1" so
// callers can append further SQL (ordering, paging) unconditionally.
fn build_device_filters(
is_registered: Option<bool>,
last_seen_from: Option<DateTime<Utc>>,
last_seen_to: Option<DateTime<Utc>>,
owner: Option<String>,
device_type: Option<String>,
vendor: Option<String>,
) -> (String, Vec<rusqlite::types::Value>) {
let mut clause = "WHERE 1=1 ".to_string();
let mut params: Vec<rusqlite::types::Value> = Vec::new();
if let Some(is_registered) = is_registered {
debug!("Adding filter is_registered={}", is_registered);
clause.push_str("AND is_registered=? ");
params.push(is_registered.into());
};
if let Some(last_seen_from) = last_seen_from {
debug!("Adding filter last_seen>={}", last_seen_from.to_rfc3339());
clause.push_str("AND last_seen>=? ");
params.push(last_seen_from.to_rfc3339().into());
};
if let Some(last_seen_to) = last_seen_to {
debug!("Adding filter last_seen<={}", last_seen_to.to_rfc3339());
clause.push_str("AND last_seen<=? ");
params.push(last_seen_to.to_rfc3339().into());
};
if let Some(owner) = owner {
debug!("Adding filter owner={}", owner);
clause.push_str("AND owner LIKE ? ");
params.push(format!("%{}%", owner).into());
};
if let Some(device_type) = device_type {
debug!("Adding filter device_type={}", device_type);
clause.push_str("AND device_type=? ");
params.push(device_type.into());
}
if let Some(vendor) = vendor {
debug!("Adding filter vendor={}", vendor);
clause.push_str("AND vendor=? ");
params.push(vendor.into());
}
(clause, params)
}
#[allow(clippy::too_many_arguments)]
pub fn list_devices(
is_registered: Option<bool>,
@@ -47,38 +94,18 @@ pub fn list_devices(
let conn = db::get_db_connection();
// Prepare SQL and parameters
let mut sql_statement = "SELECT mac_address, ipv4_address, vendor, last_seen, is_registered, owner, device_type, name FROM devices WHERE 1=1 ".to_string();
let mut params: Vec<rusqlite::types::Value> = Vec::new();
if let Some(is_registered) = is_registered {
debug!("Adding filter is_registered={}", is_registered);
sql_statement.push_str("AND is_registered=? ");
params.push(is_registered.into());
};
if let Some(last_seen_from) = last_seen_from {
debug!("Adding filter last_seen>={}", last_seen_from.to_rfc3339());
sql_statement.push_str("AND last_seen>=? ");
params.push(last_seen_from.to_rfc3339().into());
};
if let Some(last_seen_to) = last_seen_to {
debug!("Adding filter last_seen<={}", last_seen_to.to_rfc3339());
sql_statement.push_str("AND last_seen<=? ");
params.push(last_seen_to.to_rfc3339().into());
};
if let Some(owner) = owner {
debug!("Adding filter owner={}", owner);
sql_statement.push_str("AND owner LIKE ? ");
params.push(format!("%{}%", owner).into());
};
if let Some(device_type) = device_type {
debug!("Adding filter device_type={}", device_type);
sql_statement.push_str("AND device_type=? ");
params.push(device_type.into());
}
if let Some(vendor) = vendor {
debug!("Adding filter vendor={}", vendor);
sql_statement.push_str("AND vendor=? ");
params.push(vendor.into());
}
let (filters, mut params) = build_device_filters(
is_registered,
last_seen_from,
last_seen_to,
owner,
device_type,
vendor,
);
let mut sql_statement = format!(
"SELECT mac_address, ipv4_address, vendor, last_seen, is_registered, owner, device_type, name FROM devices {}",
filters
);
// List order — both column and direction are validated against a whitelist so user input
// is never interpolated raw. A secondary `mac_address ASC` keeps paging deterministic when
@@ -122,6 +149,38 @@ pub fn list_devices(
Ok(devices)
}
// Counts the devices matching the given filters, ignoring paging. Used to report
// the total number of pages alongside a `list_devices` page.
pub fn count_devices(
is_registered: Option<bool>,
last_seen_from: Option<DateTime<Utc>>,
last_seen_to: Option<DateTime<Utc>>,
owner: Option<String>,
device_type: Option<String>,
vendor: Option<String>,
) -> Result<i64, DbError> {
debug!("Counting devices");
let conn = db::get_db_connection();
let (filters, params) = build_device_filters(
is_registered,
last_seen_from,
last_seen_to,
owner,
device_type,
vendor,
);
let sql_statement = format!("SELECT COUNT(*) FROM devices {}", filters);
let count: i64 = conn.query_row(
sql_statement.as_str(),
params_from_iter(params.iter()),
|row| row.get(0),
)?;
Ok(count)
}
// Read device from its MAC address
pub fn read(mac_address: String) -> Option<Device> {
let conn = db::get_db_connection();
@@ -368,7 +427,8 @@ mod tests {
assert!(devices.len() >= 3, "There should be at least 3 devices");
// Validate 1 device data
let device = devices
.iter().find(|item| item.mac_address == "bb:bb:bb:bb:bb:bb")
.iter()
.find(|item| item.mac_address == "bb:bb:bb:bb:bb:bb")
.unwrap();
validate_device(
@@ -386,9 +446,19 @@ mod tests {
);
// List registered devices
let devices: Vec<Device> =
list_devices(Some(true), None, None, None, None, None, None, None, None, None)
.unwrap();
let devices: Vec<Device> = list_devices(
Some(true),
None,
None,
None,
None,
None,
None,
None,
None,
None,
)
.unwrap();
assert!(
devices.len() >= 2,
@@ -397,22 +467,22 @@ mod tests {
// Device aa:aa:aa:aa:aa:aa should not be present
assert!(
devices
.iter().find(|item| item.mac_address == "aa:aa:aa:aa:aa:aa")
.iter()
.find(|item| item.mac_address == "aa:aa:aa:aa:aa:aa")
.is_none(),
"Device aa:aa:aa:aa:aa:aa should not be present"
);
// All devices should be registered
assert!(
devices
.iter().find(|item| !item.is_registered)
.is_none(),
devices.iter().find(|item| !item.is_registered).is_none(),
"There should not be any non-registered devices"
);
// Validate 1 device
let device = devices
.iter().find(|item| item.mac_address == "bb:bb:bb:bb:bb:bb")
.iter()
.find(|item| item.mac_address == "bb:bb:bb:bb:bb:bb")
.unwrap();
validate_device(
@@ -479,7 +549,8 @@ mod tests {
assert!(!devices.is_empty(), "There should be at least one device");
assert!(
devices
.iter().find(|item| item.mac_address == "bb:bb:bb:bb:bb:bb")
.iter()
.find(|item| item.mac_address == "bb:bb:bb:bb:bb:bb")
.is_some(),
"Device bb:bb:bb:bb:bb:bb should be present"
);
@@ -526,7 +597,10 @@ mod tests {
let macs_desc: Vec<&str> = by_mac_desc.iter().map(|d| d.mac_address.as_str()).collect();
let mut sorted_macs_desc = macs_desc.clone();
sorted_macs_desc.sort_by(|a, b| b.cmp(a));
assert_eq!(macs_desc, sorted_macs_desc, "mac_address desc should be sorted reversed");
assert_eq!(
macs_desc, sorted_macs_desc,
"mac_address desc should be sorted reversed"
);
// Sort by owner ascending — empty-string owners (unregistered) come first lexically.
let by_owner_asc = list_devices(
@@ -561,9 +635,13 @@ mod tests {
None,
)
.unwrap();
let default_sorted = list_devices(None, None, None, None, None, None, None, None, None, None).unwrap();
let default_sorted =
list_devices(None, None, None, None, None, None, None, None, None, None).unwrap();
let invalid_macs: Vec<&str> = invalid.iter().map(|d| d.mac_address.as_str()).collect();
let default_macs: Vec<&str> = default_sorted.iter().map(|d| d.mac_address.as_str()).collect();
let default_macs: Vec<&str> = default_sorted
.iter()
.map(|d| d.mac_address.as_str())
.collect();
assert_eq!(
invalid_macs, default_macs,
"invalid sort_by must fall back to the default ordering"
@@ -618,6 +696,51 @@ mod tests {
);
}
#[tokio::test]
async fn test_count_devices() {
tests_common::setup().await;
// Count must match an unpaginated list, independent of paging, for both
// no filter and a representative filter combination.
let total = count_devices(None, None, None, None, None, None).unwrap();
assert_eq!(
total,
list_devices(None, None, None, None, None, None, None, None, None, None)
.unwrap()
.len() as i64,
"Count of all devices should match the unpaginated list length"
);
// Paging the list must not change the count.
let total_paged = count_devices(None, None, None, None, None, None).unwrap();
assert_eq!(total_paged, total, "Count should ignore paging");
// Filtered count matches the filtered unpaginated list.
let registered = count_devices(Some(true), None, None, None, None, None).unwrap();
assert_eq!(
registered,
list_devices(
Some(true),
None,
None,
None,
None,
None,
None,
None,
None,
None,
)
.unwrap()
.len() as i64,
"Count of registered devices should match the filtered list length"
);
assert!(
registered <= total,
"Filtered count should not exceed the total"
);
}
#[tokio::test]
async fn test_seen() {
tests_common::setup().await;
backend/src/db/notifications.rs
+72 -11
View File
@@ -62,6 +62,30 @@ pub fn list(
Ok(notifications)
}
// Counts the notifications matching the given filter, ignoring paging. Used to
// report the total number of pages alongside a `list` page.
pub fn count(is_new: Option<bool>) -> Result<i64, DbError> {
debug!("Counting notifications");
let conn = db::get_db_connection();
let mut sql_statement = "SELECT COUNT(*) FROM notifications WHERE 1=1".to_string();
let mut params: Vec<rusqlite::types::Value> = Vec::new();
if let Some(is_new) = is_new {
debug!("Adding filter is_new={}", is_new);
sql_statement.push_str(" AND is_new=?");
params.push(is_new.into());
}
let count: i64 = conn.query_row(
sql_statement.as_str(),
params_from_iter(params.iter()),
|row| row.get(0),
)?;
Ok(count)
}
pub fn insert(notification: Notification) -> Result<i64, DbError> {
let conn = db::get_db_connection();
let mac_address = notification.mac_address.as_deref().map(normalize_mac);
@@ -360,10 +384,7 @@ mod tests {
NotificationType::DeviceOnlineAfterTime,
"Wrong notification type (should be DeviceOnlineAfterTime)"
);
assert!(
inserted_notification.is_new,
"Notification should be new"
);
assert!(inserted_notification.is_new, "Notification should be new");
assert_eq!(
inserted_notification.created_on, created_on,
"Wrong created_on (should be ${created_on})"
@@ -502,10 +523,7 @@ mod tests {
NotificationType::DeviceOnlineAfterTime,
"Wrong notification type (should be DeviceOnlineAfterTime)"
);
assert!(
inserted_notification.is_new,
"Notification should be new"
);
assert!(inserted_notification.is_new, "Notification should be new");
assert_eq!(
inserted_notification.created_on, created_on,
"Wrong created_on (should be ${created_on})"
@@ -576,7 +594,8 @@ mod tests {
// Check date of notification 1
let notification1 = notifications
.iter().find(|notification| notification.id == 1)
.iter()
.find(|notification| notification.id == 1)
.unwrap();
// 2026-01-03 14:13:12 - UTC
@@ -588,7 +607,8 @@ mod tests {
// Check title of notification 3
let notification3 = notifications
.iter().find(|notification| notification.id == 3)
.iter()
.find(|notification| notification.id == 3)
.unwrap();
assert_eq!(
@@ -599,7 +619,8 @@ mod tests {
// Check body of notification 5
let notification5 = notifications
.iter().find(|notification| notification.id == 5)
.iter()
.find(|notification| notification.id == 5)
.unwrap();
assert_eq!(
@@ -648,4 +669,44 @@ mod tests {
"Second page should have at least 1 notification"
);
}
#[tokio::test]
async fn test_count() {
tests_common::setup().await;
// The count must match an unpaginated list for each filter.
let all = count(None).unwrap();
assert_eq!(
all,
list(None, None, None).unwrap().len() as i64,
"Count of all notifications should match the unpaginated list length"
);
let new = count(Some(true)).unwrap();
assert_eq!(
new,
list(Some(true), None, None).unwrap().len() as i64,
"Count of new notifications should match the unpaginated list length"
);
let old = count(Some(false)).unwrap();
assert_eq!(
old,
list(Some(false), None, None).unwrap().len() as i64,
"Count of old notifications should match the unpaginated list length"
);
// New + old must add up to the total, and the count must be independent
// of paging.
assert_eq!(
new + old,
all,
"New and old counts should add up to the total"
);
assert_eq!(
count(Some(true)).unwrap(),
new,
"Count should ignore paging parameters"
);
}
}
backend/src/model/devices.rs
+8
View File
@@ -28,6 +28,14 @@ pub struct Device {
pub name: Option<String>,
}
// A page of devices plus the total number of devices matching the request's
// filters, so the front-end can show how many pages exist.
#[derive(Clone, Serialize, Deserialize, ToSchema)]
pub struct DeviceListResponse {
pub items: Vec<Device>,
pub total_count: i64,
}
impl Device {
pub fn new(
mac_address: String,
backend/src/model/notifications.rs
+8
View File
@@ -18,6 +18,14 @@ pub struct Notification {
pub mac_address: Option<String>,
}
// A page of notifications plus the total number of notifications matching the
// request's filters, so the front-end can show how many pages exist.
#[derive(Clone, Serialize, Deserialize, ToSchema)]
pub struct NotificationListResponse {
pub items: Vec<Notification>,
pub total_count: i64,
}
impl Notification {
pub fn new(
created_on: DateTime<Utc>,
backend/src/web_server.rs
+4 -2
View File
@@ -2,8 +2,8 @@ use std::error::Error;
use std::path::{Path, PathBuf};
use crate::model::device_events::{DeviceEvent, DeviceEventScanner, DeviceEventType};
use crate::model::devices::{Device, DeviceSummary};
use crate::model::notifications::{Notification, NotificationType};
use crate::model::devices::{Device, DeviceListResponse, DeviceSummary};
use crate::model::notifications::{Notification, NotificationListResponse, NotificationType};
use crate::settings::get_settings;
use crate::web_server::devices::{RegisterDevicePayload, UpdateDevicePayload};
use crate::web_server::scanner_status::{
@@ -66,8 +66,10 @@ pub mod utils;
),
components(schemas(
Device,
DeviceListResponse,
DeviceSummary,
Notification,
NotificationListResponse,
NotificationType,
RegisterDevicePayload,
UpdateDevicePayload,
backend/src/web_server/devices.rs
+29 -12
View File
@@ -10,7 +10,7 @@ use utoipa::ToSchema;
use crate::{
db,
model::devices::{Device, DeviceSummary},
model::devices::{Device, DeviceListResponse, DeviceSummary},
};
use crate::web_server::utils;
@@ -32,14 +32,14 @@ use crate::web_server::utils;
("page_limit" = Option<i64>, Query, description = "Maximum number of results to return"),
),
responses(
(status = 200, description = "List of devices", body = Vec<Device>),
(status = 200, description = "List of devices", body = DeviceListResponse),
(status = 500, description = "Internal server error"),
),
security(("bearer_auth" = []))
)]
pub async fn list(
Query(params): Query<HashMap<String, String>>,
) -> Result<Json<Vec<Device>>, StatusCode> {
) -> Result<Json<DeviceListResponse>, StatusCode> {
let is_registered: Option<bool> = utils::parse_parameter_bool(&params, "is_registered");
let last_seen_from: Option<DateTime<Utc>> =
utils::parse_parameter_date(&params, "last_seen_from");
@@ -52,24 +52,41 @@ pub async fn list(
let page_offset: Option<i64> = utils::parse_parameter_int(&params, "page_offset");
let page_limit: Option<i64> = utils::parse_parameter_int(&params, "page_limit");
match db::devices::list_devices(
let items = match db::devices::list_devices(
is_registered,
last_seen_from,
last_seen_to,
owner.clone(),
device_type.clone(),
vendor.clone(),
sort_by,
sort_order,
page_offset,
page_limit,
) {
Ok(value) => value,
Err(err) => {
error!("Error listing devices: {}", err);
return Err(StatusCode::INTERNAL_SERVER_ERROR);
}
};
let total_count = match db::devices::count_devices(
is_registered,
last_seen_from,
last_seen_to,
owner,
device_type,
vendor,
sort_by,
sort_order,
page_offset,
page_limit,
) {
Ok(value) => Ok(Json(value)),
Ok(value) => value,
Err(err) => {
error!("Error listing devices: {}", err);
Err(StatusCode::INTERNAL_SERVER_ERROR)
error!("Error counting devices: {}", err);
return Err(StatusCode::INTERNAL_SERVER_ERROR);
}
}
};
Ok(Json(DeviceListResponse { items, total_count }))
}
#[utoipa::path(
backend/src/web_server/notifications.rs
+21 -7
View File
@@ -8,7 +8,11 @@ use axum::{
};
use log::error;
use crate::{db, model::notifications::Notification, web_server::utils};
use crate::{
db,
model::notifications::{Notification, NotificationListResponse},
web_server::utils,
};
#[utoipa::path(
get,
@@ -118,23 +122,33 @@ pub async fn mark_all_as_old() -> impl IntoResponse {
("page_limit" = Option<i64>, Query, description = "Maximum number of results to return"),
),
responses(
(status = 200, description = "List of notifications", body = Vec<Notification>),
(status = 200, description = "List of notifications", body = NotificationListResponse),
(status = 500, description = "Internal server error"),
),
security(("bearer_auth" = []))
)]
pub async fn list(
Query(params): Query<HashMap<String, String>>,
) -> Result<Json<Vec<Notification>>, StatusCode> {
) -> Result<Json<NotificationListResponse>, StatusCode> {
let is_new: Option<bool> = utils::parse_parameter_bool(&params, "is_new");
let page_offset: Option<i64> = utils::parse_parameter_int(&params, "page_offset");
let page_limit: Option<i64> = utils::parse_parameter_int(&params, "page_limit");
match db::notifications::list(is_new, page_offset, page_limit) {
Ok(value) => Ok(Json(value)),
let items = match db::notifications::list(is_new, page_offset, page_limit) {
Ok(value) => value,
Err(err) => {
error!("Error listing notifications: {}", err);
Err(StatusCode::INTERNAL_SERVER_ERROR)
return Err(StatusCode::INTERNAL_SERVER_ERROR);
}
}
};
let total_count = match db::notifications::count(is_new) {
Ok(value) => value,
Err(err) => {
error!("Error counting notifications: {}", err);
return Err(StatusCode::INTERNAL_SERVER_ERROR);
}
};
Ok(Json(NotificationListResponse { items, total_count }))
}
frontend/lib/devices/device_list.dart
+7 -4
View File
@@ -46,7 +46,9 @@ class _DeviceListState extends State<DeviceList> with RouteAware {
bool _sortAscending = false;
int _currentPage = 0;
bool _hasNextPage = false;
// Total devices matching the current filters, used to show how many pages
// exist and to offer "go to last page".
int _totalCount = 0;
bool _didInitialFetch = false;
CancelToken? _fetchToken;
final ScrollController _scrollController = ScrollController();
@@ -54,6 +56,7 @@ class _DeviceListState extends State<DeviceList> with RouteAware {
int get _pageSize => MediaQuery.sizeOf(context).width < Breakpoints.medium
? _phonePageSize
: _widePageSize;
int get _totalPages => (_totalCount / _pageSize).ceil().clamp(1, 1 << 30);
@override
void initState() {
@@ -145,7 +148,7 @@ class _DeviceListState extends State<DeviceList> with RouteAware {
if (!mounted || token != _fetchToken) return;
setState(() {
_currentPage = page;
_hasNextPage = result.hasNextPage;
_totalCount = result.totalCount;
_devices = result.items;
_isLoading = false;
_isPaging = false;
@@ -349,11 +352,11 @@ class _DeviceListState extends State<DeviceList> with RouteAware {
separatorBuilder: (_, _) =>
isWide ? const Divider(height: 1) : const SizedBox.shrink(),
),
if (_currentPage > 0 || _hasNextPage)
if (_currentPage > 0 || _totalPages > 1)
SliverToBoxAdapter(
child: PaginationBar(
currentPage: _currentPage,
hasNextPage: _hasNextPage,
totalPages: _totalPages,
isLoading: _isPaging,
onPageChanged: (page) =>
_fetchPage(page, scrollToTop: true, paging: true),
frontend/lib/home/notifications_list.dart
+15 -7
View File
@@ -73,7 +73,10 @@ class _NotificationsListState extends State<NotificationsList>
int get _pageSize => MediaQuery.sizeOf(context).width < Breakpoints.medium
? _phonePageSize
: _widePageSize;
bool _hasNextPage = false;
// Total notifications matching the current filter, used to show how many pages
// exist and to offer "go to last page".
int _totalCount = 0;
int get _totalPages => (_totalCount / _pageSize).ceil().clamp(1, 1 << 30);
String? _error;
CancelToken? _fetchToken;
final ScrollController _scrollController = ScrollController();
@@ -189,7 +192,7 @@ class _NotificationsListState extends State<NotificationsList>
// without setState here; _reconcile schedules the rebuild itself so it
// can defer swapping in the empty state until exit animations finish.
_currentPage = page;
_hasNextPage = result.hasNextPage;
_totalCount = result.totalCount;
_isLoading = false;
_isPaging = false;
_reconcile(result.items);
@@ -200,7 +203,7 @@ class _NotificationsListState extends State<NotificationsList>
setState(() {
_listKey = GlobalKey();
_currentPage = page;
_hasNextPage = result.hasNextPage;
_totalCount = result.totalCount;
_items = result.items;
_isLoading = false;
_isPaging = false;
@@ -293,10 +296,15 @@ class _NotificationsListState extends State<NotificationsList>
);
}
/// Removes an item in response to a card action, then refreshes the
/// surrounding chrome (header button, pagination, empty state).
/// Removes an item in response to a card action (swipe or mark read/unread
/// that drops it from the current filter), then refreshes the surrounding
/// chrome (header button, pagination, empty state). The total is decremented
/// locally so the page count stays accurate without re-fetching; background
/// refreshes re-sync it from the backend. Removals driven by [_reconcile] use
/// [_removeItem] directly so they don't double-count against a fresh total.
void _removeAndSettle(int id, {required bool animated}) {
_removeItem(id, animated: animated);
if (_totalCount > 0) _totalCount--;
_afterStructuralChange();
}
@@ -436,11 +444,11 @@ class _NotificationsListState extends State<NotificationsList>
}
return [
_buildNotificationSliver(),
if (_currentPage > 0 || _hasNextPage)
if (_currentPage > 0 || _totalPages > 1)
SliverToBoxAdapter(
child: PaginationBar(
currentPage: _currentPage,
hasNextPage: _hasNextPage,
totalPages: _totalPages,
isLoading: _isPaging,
onPageChanged: (page) =>
_fetchPage(page, scrollToTop: true, paging: true),
frontend/lib/utils/api/oott_api_devices.dart
+3 -4
View File
@@ -5,7 +5,7 @@ extension DeviceApi on BackendAPI {
Future<Device> getDevice(String macAddress) =>
_getModel('/devices/$macAddress', Device.fromJson);
Future<({List<Device> items, bool hasNextPage})> listDevices({
Future<({List<Device> items, int totalCount})> listDevices({
bool? isRegistered,
String? owner,
DeviceType? deviceType,
@@ -28,7 +28,7 @@ extension DeviceApi on BackendAPI {
params['sort_order'] = sortAscending ? 'asc' : 'desc';
}
params['page_offset'] = page * perPage;
params['page_limit'] = perPage + 1;
params['page_limit'] = perPage;
final response = await _dio.get(
'/devices',
@@ -37,9 +37,8 @@ extension DeviceApi on BackendAPI {
);
return _paginate(
response.data as List,
response.data as Map<String, dynamic>,
(item) => Device.fromJson(item as Map<String, dynamic>),
perPage,
);
}
frontend/lib/utils/api/oott_api_notifications.dart
+3 -4
View File
@@ -14,7 +14,7 @@ extension NotificationApi on BackendAPI {
await _dio.post('/notifications/mark_all_as_old');
}
Future<({List<Notification> items, bool hasNextPage})> listNotifications(
Future<({List<Notification> items, int totalCount})> listNotifications(
bool? isNew, {
int page = 0,
int perPage = 5,
@@ -25,15 +25,14 @@ extension NotificationApi on BackendAPI {
queryParameters: {
'is_new': isNew ?? '',
'page_offset': page * perPage,
'page_limit': perPage + 1,
'page_limit': perPage,
},
cancelToken: cancelToken,
);
return _paginate(
response.data as List<dynamic>,
response.data as Map<String, dynamic>,
(item) => Notification.fromJson(item),
perPage,
);
}
}
frontend/lib/utils/oott_api.dart
+8 -12
View File
@@ -87,19 +87,15 @@ class BackendAPI {
return fromJson(response.data as Map<String, dynamic>);
}
/// Splits a "fetch one extra item" page into its items and a [hasNextPage]
/// flag. Callers request `perPage + 1` items so a full extra item signals
/// that another page exists.
({List<T> items, bool hasNextPage}) _paginate<T>(
List<dynamic> data,
/// Decodes a paged list response of the shape `{items: [...], total_count: N}`
/// into the page's items and the total number of rows matching the request's
/// filters. The total lets callers report how many pages exist and offer a
/// "go to last page" control.
({List<T> items, int totalCount}) _paginate<T>(
Map<String, dynamic> data,
T Function(dynamic) fromItem,
int perPage,
) {
final results = data.map(fromItem).toList();
final hasNextPage = results.length > perPage;
return (
items: hasNextPage ? results.take(perPage).toList() : results,
hasNextPage: hasNextPage,
);
final items = (data['items'] as List<dynamic>).map(fromItem).toList();
return (items: items, totalCount: data['total_count'] as int);
}
}
frontend/lib/widgets/pagination_bar.dart
+19 -7
View File
@@ -1,23 +1,32 @@
import 'package:flutter/material.dart';
import '../theme/dimens.dart';
class PaginationBar extends StatelessWidget {
const PaginationBar({
super.key,
required this.currentPage,
required this.hasNextPage,
required this.totalPages,
required this.isLoading,
required this.onPageChanged,
});
final int currentPage;
final bool hasNextPage;
final int totalPages;
final bool isLoading;
final ValueChanged<int> onPageChanged;
@override
Widget build(BuildContext context) {
final lastPage = totalPages - 1;
final canGoBack = currentPage > 0 && !isLoading;
final canGoForward = hasNextPage && !isLoading;
final canGoForward = currentPage < lastPage && !isLoading;
// Phones don't have room for the verbose label, so they get the compact
// "X / Y" form; wider layouts spell it out.
final isWide = MediaQuery.sizeOf(context).width >= Breakpoints.medium;
final label = isWide
? 'Page ${currentPage + 1} of $totalPages'
: '${currentPage + 1} / $totalPages';
// While a page change is in flight the buttons disable so the tap reads as
// registered and double-taps are blocked; the progress cue itself is drawn
// by the app shell at the bottom of the page body.
@@ -39,10 +48,7 @@ class PaginationBar extends StatelessWidget {
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Text(
'Page ${currentPage + 1}',
style: Theme.of(context).textTheme.bodyMedium,
),
child: Text(label, style: Theme.of(context).textTheme.bodyMedium),
),
IconButton.outlined(
onPressed: canGoForward
@@ -51,6 +57,12 @@ class PaginationBar extends StatelessWidget {
icon: const Icon(Icons.chevron_right),
tooltip: 'Next page',
),
const SizedBox(width: 8),
IconButton.outlined(
onPressed: canGoForward ? () => onPageChanged(lastPage) : null,
icon: const Icon(Icons.last_page),
tooltip: 'Last page',
),
],
),
);
frontend/test/api/devices_api_test.dart
+47 -45
View File
@@ -35,60 +35,62 @@ void main() {
expect(summary.totalRegistered, 7);
});
test('listDevices sends filter + pagination params and trims extra item',
() async {
adapter.onGet(
'/devices',
(server) => server.reply(200, [
deviceJson(macAddress: '00:00:00:00:00:01'),
deviceJson(macAddress: '00:00:00:00:00:02'),
deviceJson(macAddress: '00:00:00:00:00:03'),
]),
queryParameters: {
'is_registered': false,
'device_type': 'laptop',
'sort_by': 'last_seen',
'sort_order': 'asc',
'page_offset': 0,
'page_limit': 3,
},
);
test(
'listDevices sends filter + pagination params and reports the total',
() async {
adapter.onGet(
'/devices',
(server) => server.reply(
200,
pagedListJson([
deviceJson(macAddress: '00:00:00:00:00:01'),
deviceJson(macAddress: '00:00:00:00:00:02'),
], totalCount: 12),
),
queryParameters: {
'is_registered': false,
'device_type': 'laptop',
'sort_by': 'last_seen',
'sort_order': 'asc',
'page_offset': 0,
'page_limit': 2,
},
);
final result = await BackendAPI.instance.listDevices(
isRegistered: false,
deviceType: DeviceType.laptop,
sortBy: 'last_seen',
sortAscending: true,
page: 0,
perPage: 2,
);
final result = await BackendAPI.instance.listDevices(
isRegistered: false,
deviceType: DeviceType.laptop,
sortBy: 'last_seen',
sortAscending: true,
page: 0,
perPage: 2,
);
expect(result.items, hasLength(2));
expect(result.hasNextPage, isTrue);
});
expect(result.items, hasLength(2));
expect(result.totalCount, 12);
},
);
test('listDevices reports no next page when fewer than perPage+1 returned',
() async {
adapter.onGet(
'/devices',
(server) => server.reply(200, [deviceJson()]),
);
test(
'listDevices reports the total when a single page is returned',
() async {
adapter.onGet(
'/devices',
(server) => server.reply(200, pagedListJson([deviceJson()])),
);
final result = await BackendAPI.instance.listDevices(perPage: 2);
final result = await BackendAPI.instance.listDevices(perPage: 2);
expect(result.items, hasLength(1));
expect(result.hasNextPage, isFalse);
});
expect(result.items, hasLength(1));
expect(result.totalCount, 1);
},
);
test('listDevices maps the unknown device type to an empty filter', () async {
adapter.onGet(
'/devices',
(server) => server.reply(200, <dynamic>[]),
queryParameters: {
'device_type': '',
'page_offset': 0,
'page_limit': 11,
},
(server) => server.reply(200, pagedListJson([])),
queryParameters: {'device_type': '', 'page_offset': 0, 'page_limit': 10},
);
final result = await BackendAPI.instance.listDevices(
frontend/test/api/notifications_api_test.dart
+41 -46
View File
@@ -13,10 +13,7 @@ void main() {
});
test('markNotificationAsRead GETs the notification path', () async {
adapter.onGet(
'/notifications/7',
(server) => server.reply(200, null),
);
adapter.onGet('/notifications/7', (server) => server.reply(200, null));
await BackendAPI.instance.markNotificationAsRead(7);
});
@@ -39,51 +36,49 @@ void main() {
await BackendAPI.instance.markAllNotificationsAsRead();
});
test('listNotifications sends is_new + pagination and trims extra item',
() async {
adapter.onGet(
'/notifications',
(server) => server.reply(200, [
notificationJson(id: 1),
notificationJson(id: 2),
notificationJson(id: 3),
]),
queryParameters: {
'is_new': true,
'page_offset': 0,
'page_limit': 3,
},
);
test(
'listNotifications sends is_new + pagination and reports the total',
() async {
adapter.onGet(
'/notifications',
(server) => server.reply(
200,
pagedListJson([
notificationJson(id: 1),
notificationJson(id: 2),
], totalCount: 9),
),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 2},
);
final result = await BackendAPI.instance.listNotifications(
true,
page: 0,
perPage: 2,
);
final result = await BackendAPI.instance.listNotifications(
true,
page: 0,
perPage: 2,
);
expect(result.items, hasLength(2));
expect(result.hasNextPage, isTrue);
});
expect(result.items, hasLength(2));
expect(result.totalCount, 9);
},
);
test('listNotifications maps a null filter to an empty is_new param',
() async {
adapter.onGet(
'/notifications',
(server) => server.reply(200, <dynamic>[]),
queryParameters: {
'is_new': '',
'page_offset': 10,
'page_limit': 6,
},
);
test(
'listNotifications maps a null filter to an empty is_new param',
() async {
adapter.onGet(
'/notifications',
(server) => server.reply(200, pagedListJson([])),
queryParameters: {'is_new': '', 'page_offset': 10, 'page_limit': 5},
);
final result = await BackendAPI.instance.listNotifications(
null,
page: 2,
perPage: 5,
);
final result = await BackendAPI.instance.listNotifications(
null,
page: 2,
perPage: 5,
);
expect(result.items, isEmpty);
expect(result.hasNextPage, isFalse);
});
expect(result.items, isEmpty);
expect(result.totalCount, 0);
},
);
}
frontend/test/helpers/fixtures.dart
+8
View File
@@ -74,6 +74,14 @@ Map<String, dynamic> notificationJson({
'mac_address': macAddress,
};
/// Wraps a page of items in the paged-list response shape the list endpoints
/// return: `{items: [...], total_count: N}`. [totalCount] defaults to the page
/// length, so single-page stubs stay terse; pass it to simulate more pages.
Map<String, dynamic> pagedListJson(
List<Map<String, dynamic>> items, {
int? totalCount,
}) => {'items': items, 'total_count': totalCount ?? items.length};
/// Shape shared by the ARP and SNMP scanners (run-on-interval scanners).
Map<String, dynamic> intervalScannerJson({
bool isRunning = false,
frontend/test/widget/device_list_test.dart
+87 -23
View File
@@ -18,10 +18,13 @@ void main() {
testWidgets('renders device rows after loading', (tester) async {
adapter.onGet(
'/devices',
(server) => server.reply(200, [
deviceJson(macAddress: '00:00:00:00:00:01', owner: 'alice'),
deviceJson(macAddress: '00:00:00:00:00:02', owner: 'bob'),
]),
(server) => server.reply(
200,
pagedListJson([
deviceJson(macAddress: '00:00:00:00:00:01', owner: 'alice'),
deviceJson(macAddress: '00:00:00:00:00:02', owner: 'bob'),
]),
),
);
await pumpScreen(tester, const DeviceList());
@@ -35,7 +38,7 @@ void main() {
testWidgets('shows the empty message when there are no devices', (
tester,
) async {
adapter.onGet('/devices', (server) => server.reply(200, <dynamic>[]));
adapter.onGet('/devices', (server) => server.reply(200, pagedListJson([])));
await pumpScreen(tester, const DeviceList());
await pumpUntilFound(tester, find.text('No unregistered devices'));
@@ -63,16 +66,19 @@ void main() {
testWidgets('changing pages scrolls back to the top of the list', (
tester,
) async {
// 11 devices: a full page of 10 plus one, so the pagination bar appears.
// A total of 11 across two pages of 10, so the pagination bar appears.
adapter.onGet(
'/devices',
(server) => server.reply(
200,
List.generate(
11,
(i) => deviceJson(
macAddress: '00:00:00:00:00:${i.toString().padLeft(2, '0')}',
pagedListJson(
List.generate(
10,
(i) => deviceJson(
macAddress: '00:00:00:00:00:${i.toString().padLeft(2, '0')}',
),
),
totalCount: 11,
),
),
);
@@ -107,29 +113,34 @@ void main() {
// Default ordering (last_seen, desc) returns two devices.
adapter.onGet(
'/devices',
(server) => server.reply(200, [
deviceJson(macAddress: '00:00:00:00:00:01'),
deviceJson(macAddress: '00:00:00:00:00:02'),
]),
(server) => server.reply(
200,
pagedListJson([
deviceJson(macAddress: '00:00:00:00:00:01'),
deviceJson(macAddress: '00:00:00:00:00:02'),
]),
),
queryParameters: {
'is_registered': false,
'sort_by': 'last_seen',
'sort_order': 'desc',
'page_offset': 0,
'page_limit': 11,
'page_limit': 10,
},
);
// Sorting by device type (asc) returns a single, distinguishable device.
adapter.onGet(
'/devices',
(server) =>
server.reply(200, [deviceJson(macAddress: '00:00:00:00:00:03')]),
(server) => server.reply(
200,
pagedListJson([deviceJson(macAddress: '00:00:00:00:00:03')]),
),
queryParameters: {
'is_registered': false,
'sort_by': 'device_type',
'sort_order': 'asc',
'page_offset': 0,
'page_limit': 11,
'page_limit': 10,
},
);
@@ -138,9 +149,11 @@ void main() {
expect(find.byType(DeviceRowWide), findsNWidgets(2));
await tester.tap(find.byTooltip('Sort by device type'));
for (var i = 0;
i < 40 && find.byType(DeviceRowWide).evaluate().length != 1;
i++) {
for (
var i = 0;
i < 40 && find.byType(DeviceRowWide).evaluate().length != 1;
i++
) {
await tester.pump(const Duration(milliseconds: 10));
}
expect(find.byType(DeviceRowWide), findsOneWidget);
@@ -149,7 +162,10 @@ void main() {
});
testWidgets('the sort sheet offers ordering by device type', (tester) async {
adapter.onGet('/devices', (server) => server.reply(200, [deviceJson()]));
adapter.onGet(
'/devices',
(server) => server.reply(200, pagedListJson([deviceJson()])),
);
// A phone-width viewport so the compact layout with the sort button shows.
await pumpScreen(tester, const DeviceList(), size: const Size(500, 900));
@@ -169,7 +185,10 @@ void main() {
final devices = <Map<String, dynamic>>[
deviceJson(macAddress: '00:00:00:00:00:01'),
];
adapter.onGet('/devices', (server) => server.reply(200, devices));
adapter.onGet(
'/devices',
(server) => server.reply(200, pagedListJson(devices)),
);
await pumpScreen(tester, const DeviceList());
await pumpUntilFound(tester, find.byType(DeviceRowWide));
@@ -188,4 +207,49 @@ void main() {
await tearDownTree(tester);
});
testWidgets('the last-page button jumps to the final page', (tester) async {
// Wide viewport → page size 10. A total of 25 spans three pages.
List<Map<String, dynamic>> page(int first, int count) => List.generate(
count,
(i) => deviceJson(
macAddress: '00:00:00:00:00:${(first + i).toString().padLeft(2, '0')}',
),
);
adapter.onGet(
'/devices',
(server) => server.reply(200, pagedListJson(page(0, 10), totalCount: 25)),
queryParameters: {
'is_registered': false,
'sort_by': 'last_seen',
'sort_order': 'desc',
'page_offset': 0,
'page_limit': 10,
},
);
adapter.onGet(
'/devices',
(server) => server.reply(200, pagedListJson(page(20, 5), totalCount: 25)),
queryParameters: {
'is_registered': false,
'sort_by': 'last_seen',
'sort_order': 'desc',
'page_offset': 20,
'page_limit': 10,
},
);
// A tall viewport so the full page of rows and the pagination bar are all
// on screen at once (no scrolling needed to reach the last-page button).
await pumpScreen(tester, const DeviceList(), size: const Size(900, 2000));
await pumpUntilFound(tester, find.byType(DeviceRowWide));
expect(find.text('Page 1 of 3'), findsOneWidget);
await tester.tap(find.byTooltip('Last page'));
await pumpUntilFound(tester, find.text('Page 3 of 3'));
expect(find.text('Page 3 of 3'), findsOneWidget);
await tearDownTree(tester);
});
}
frontend/test/widget/home_screen_test.dart
+7 -5
View File
@@ -17,9 +17,10 @@ void main() {
void stubHomeEndpoints() {
adapter.onGet(
'/notifications',
(server) => server.reply(200, [
notificationJson(id: 1, title: 'New device found'),
]),
(server) => server.reply(
200,
pagedListJson([notificationJson(id: 1, title: 'New device found')]),
),
);
adapter.onGet(
'/devices/summary',
@@ -47,8 +48,9 @@ void main() {
);
}
testWidgets('shows notifications, the device summary and scanner statuses',
(tester) async {
testWidgets('shows notifications, the device summary and scanner statuses', (
tester,
) async {
stubHomeEndpoints();
// Below the 700px breakpoint the home screen uses its single-column layout,
frontend/test/widget/notifications_list_test.dart
+130 -35
View File
@@ -20,11 +20,14 @@ void main() {
(tester) async {
adapter.onGet(
'/notifications',
(server) => server.reply(200, [
notificationJson(id: 1, title: 'First', body: 'First body'),
notificationJson(id: 2, title: 'Second', body: 'Second body'),
]),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 6},
(server) => server.reply(
200,
pagedListJson([
notificationJson(id: 1, title: 'First', body: 'First body'),
notificationJson(id: 2, title: 'Second', body: 'Second body'),
]),
),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
);
adapter.onGet('/notifications/1', (server) => server.reply(200, null));
@@ -64,20 +67,20 @@ void main() {
addTearDown(tester.view.resetPhysicalSize);
// The 400px-wide viewport above is a phone, so the list uses the smaller
// phone page size of 4 (requesting page_limit 5 to detect a next page).
// phone page size of 4. A total of 8 spans two pages.
List<Map<String, dynamic>> page(int firstId) => List.generate(
5,
4,
(i) => notificationJson(id: firstId + i, title: 'Item ${firstId + i}'),
);
adapter.onGet(
'/notifications',
(server) => server.reply(200, page(1)),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
(server) => server.reply(200, pagedListJson(page(1), totalCount: 8)),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 4},
);
adapter.onGet(
'/notifications',
(server) => server.reply(200, page(6)),
queryParameters: {'is_new': true, 'page_offset': 4, 'page_limit': 5},
(server) => server.reply(200, pagedListJson(page(5), totalCount: 8)),
queryParameters: {'is_new': true, 'page_offset': 4, 'page_limit': 4},
);
await tester.pumpWidget(
@@ -100,10 +103,11 @@ void main() {
await tester.pumpAndSettle();
expect(position().pixels, greaterThan(0));
// Advance a page: the list should jump back to the top.
// Advance a page: the list should jump back to the top, showing page two's
// first item (id 5).
await tester.tap(find.byTooltip('Next page'));
await tester.pumpAndSettle();
expect(find.textContaining('Item 7'), findsWidgets);
expect(find.textContaining('Item 5'), findsWidgets);
expect(position().pixels, 0);
await tester.pumpWidget(const SizedBox());
@@ -121,8 +125,8 @@ void main() {
];
adapter.onGet(
'/notifications',
(server) => server.reply(200, items),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
(server) => server.reply(200, pagedListJson(items)),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 4},
);
await tester.pumpWidget(
@@ -156,11 +160,14 @@ void main() {
) async {
adapter.onGet(
'/notifications',
(server) => server.reply(200, [
notificationJson(id: 1, title: 'First'),
notificationJson(id: 2, title: 'Second'),
]),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 6},
(server) => server.reply(
200,
pagedListJson([
notificationJson(id: 1, title: 'First'),
notificationJson(id: 2, title: 'Second'),
]),
),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
);
adapter.onGet('/notifications/1', (server) => server.reply(200, null));
@@ -208,8 +215,8 @@ void main() {
];
adapter.onGet(
'/notifications',
(server) => server.reply(200, items),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
(server) => server.reply(200, pagedListJson(items)),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 4},
);
await tester.pumpWidget(
@@ -262,8 +269,8 @@ void main() {
];
adapter.onGet(
'/notifications',
(server) => server.reply(200, items),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
(server) => server.reply(200, pagedListJson(items)),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 4},
);
await tester.pumpWidget(
@@ -295,13 +302,19 @@ void main() {
) async {
adapter.onGet(
'/notifications',
(server) => server.reply(200, [notificationJson(id: 1, title: 'Kept')]),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 6},
(server) => server.reply(
200,
pagedListJson([notificationJson(id: 1, title: 'Kept')]),
),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
);
adapter.onGet(
'/notifications',
(server) => server.reply(200, [notificationJson(id: 1, title: 'Kept')]),
queryParameters: {'is_new': '', 'page_offset': 0, 'page_limit': 6},
(server) => server.reply(
200,
pagedListJson([notificationJson(id: 1, title: 'Kept')]),
),
queryParameters: {'is_new': '', 'page_offset': 0, 'page_limit': 5},
);
adapter.onGet('/notifications/1', (server) => server.reply(200, null));
@@ -336,16 +349,21 @@ void main() {
) async {
adapter.onGet(
'/notifications',
(server) =>
server.reply(200, [notificationJson(id: 1, title: 'New one')]),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 6},
(server) => server.reply(
200,
pagedListJson([notificationJson(id: 1, title: 'New one')]),
),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
);
adapter.onGet(
'/notifications',
(server) => server.reply(200, [
notificationJson(id: 2, title: 'Old one', isNew: false),
]),
queryParameters: {'is_new': false, 'page_offset': 0, 'page_limit': 6},
(server) => server.reply(
200,
pagedListJson([
notificationJson(id: 2, title: 'Old one', isNew: false),
]),
),
queryParameters: {'is_new': false, 'page_offset': 0, 'page_limit': 5},
);
await tester.pumpWidget(
@@ -365,4 +383,81 @@ void main() {
await tester.pumpWidget(const SizedBox());
});
testWidgets('the last-page button jumps to the final page', (tester) async {
// Wide default surface → page size 5. A total of 12 spans three pages.
List<Map<String, dynamic>> page(int firstId, int count) => List.generate(
count,
(i) => notificationJson(id: firstId + i, title: 'Item ${firstId + i}'),
);
adapter.onGet(
'/notifications',
(server) => server.reply(200, pagedListJson(page(1, 5), totalCount: 12)),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
);
adapter.onGet(
'/notifications',
(server) => server.reply(200, pagedListJson(page(11, 2), totalCount: 12)),
queryParameters: {'is_new': true, 'page_offset': 10, 'page_limit': 5},
);
await tester.pumpWidget(
MaterialApp(
theme: gruvboxDarkTheme,
home: const Scaffold(body: NotificationsList()),
),
);
await tester.pumpAndSettle();
expect(find.text('Page 1 of 3'), findsOneWidget);
await tester.tap(find.byTooltip('Last page'));
await tester.pumpAndSettle();
expect(find.text('Page 3 of 3'), findsOneWidget);
expect(find.textContaining('Item 11'), findsWidgets);
await tester.pumpWidget(const SizedBox());
});
testWidgets('marking read under "New" decrements the page total', (
tester,
) async {
// Wide default surface → page size 5. A total of 11 spans three pages;
// dropping one locally should leave ten, i.e. two pages.
adapter.onGet(
'/notifications',
(server) => server.reply(
200,
pagedListJson(
List.generate(
5,
(i) => notificationJson(id: i + 1, title: 'Item ${i + 1}'),
),
totalCount: 11,
),
),
queryParameters: {'is_new': true, 'page_offset': 0, 'page_limit': 5},
);
adapter.onGet('/notifications/1', (server) => server.reply(200, null));
await tester.pumpWidget(
MaterialApp(
theme: gruvboxDarkTheme,
home: const Scaffold(body: NotificationsList()),
),
);
await tester.pumpAndSettle();
expect(find.text('Page 1 of 3'), findsOneWidget);
// Mark the first item read; under "New" it leaves the list and the total
// drops by one without a re-fetch.
await tester.tap(find.byType(ListTile).first);
await tester.pumpAndSettle();
await tester.tap(find.text('Mark as read'));
await tester.pumpAndSettle();
expect(find.text('Page 1 of 2'), findsOneWidget);
await tester.pumpWidget(const SizedBox());
});
}
frontend/test/widget/pagination_bar_test.dart
+79 -5
View File
@@ -1,12 +1,16 @@
import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:frontend/theme/dimens.dart';
import 'package:frontend/theme/gruvbox_theme.dart';
import 'package:frontend/widgets/pagination_bar.dart';
void main() {
Widget wrap(Widget child) => MaterialApp(
theme: gruvboxDarkTheme,
home: Scaffold(body: child),
Widget wrap(Widget child, {Size? size}) => MediaQuery(
data: MediaQueryData(size: size ?? const Size(1200, 800)),
child: MaterialApp(
theme: gruvboxDarkTheme,
home: Scaffold(body: child),
),
);
testWidgets('disables every navigation button while loading', (tester) async {
@@ -15,7 +19,7 @@ void main() {
wrap(
PaginationBar(
currentPage: 1,
hasNextPage: true,
totalPages: 3,
isLoading: true,
onPageChanged: (page) => changedTo = page,
),
@@ -25,6 +29,7 @@ void main() {
await tester.tap(find.byTooltip('Next page'));
await tester.tap(find.byTooltip('Previous page'));
await tester.tap(find.byTooltip('First page'));
await tester.tap(find.byTooltip('Last page'));
expect(changedTo, -1);
});
@@ -34,7 +39,7 @@ void main() {
wrap(
PaginationBar(
currentPage: 1,
hasNextPage: true,
totalPages: 3,
isLoading: false,
onPageChanged: (page) => changedTo = page,
),
@@ -47,4 +52,73 @@ void main() {
await tester.tap(find.byTooltip('Previous page'));
expect(changedTo, 0);
});
testWidgets('last-page button jumps to the final page', (tester) async {
var changedTo = -1;
await tester.pumpWidget(
wrap(
PaginationBar(
currentPage: 0,
totalPages: 5,
isLoading: false,
onPageChanged: (page) => changedTo = page,
),
),
);
await tester.tap(find.byTooltip('Last page'));
expect(changedTo, 4);
});
testWidgets('forward buttons disable on the last page', (tester) async {
var changedTo = -1;
await tester.pumpWidget(
wrap(
PaginationBar(
currentPage: 4,
totalPages: 5,
isLoading: false,
onPageChanged: (page) => changedTo = page,
),
),
);
await tester.tap(find.byTooltip('Next page'));
await tester.tap(find.byTooltip('Last page'));
expect(changedTo, -1);
});
testWidgets('spells out the page label on wide layouts', (tester) async {
await tester.pumpWidget(
wrap(
const PaginationBar(
currentPage: 1,
totalPages: 5,
isLoading: false,
onPageChanged: _noop,
),
size: const Size(1200, 800),
),
);
expect(find.text('Page 2 of 5'), findsOneWidget);
});
testWidgets('uses the compact page label on narrow layouts', (tester) async {
await tester.pumpWidget(
wrap(
const PaginationBar(
currentPage: 1,
totalPages: 5,
isLoading: false,
onPageChanged: _noop,
),
size: Size(Breakpoints.medium - 1, 800),
),
);
expect(find.text('2 / 5'), findsOneWidget);
});
}
void _noop(int _) {}