feat: add equality operators, make history screen paginated, random performance updates
This commit is contained in:
@@ -1,12 +1,9 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:kooltab2/views/widgets/closed_tab_card.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../app/router.dart';
|
||||
import '../models/closed_tab.dart';
|
||||
import '../models/closed_tab_item.dart';
|
||||
import '../viewmodels/history_view_model.dart';
|
||||
|
||||
class HistoryScreenView extends StatefulWidget {
|
||||
@@ -17,10 +14,14 @@ class HistoryScreenView extends StatefulWidget {
|
||||
}
|
||||
|
||||
class _HistoryScreenViewState extends State<HistoryScreenView> with RouteAware {
|
||||
final _scrollController = ScrollController();
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
|
||||
_scrollController.addListener(_onScroll);
|
||||
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||
context.read<HistoryViewModel>().load();
|
||||
});
|
||||
@@ -34,16 +35,23 @@ class _HistoryScreenViewState extends State<HistoryScreenView> with RouteAware {
|
||||
|
||||
@override
|
||||
void didPopNext() {
|
||||
// Called when you come back to this screen
|
||||
context.read<HistoryViewModel>().load();
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
routeObserver.unsubscribe(this);
|
||||
_scrollController.removeListener(_onScroll);
|
||||
_scrollController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
void _onScroll() {
|
||||
if (_scrollController.position.extentAfter < 300) {
|
||||
context.read<HistoryViewModel>().loadMore();
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final viewModel = context.watch<HistoryViewModel>();
|
||||
@@ -53,9 +61,7 @@ class _HistoryScreenViewState extends State<HistoryScreenView> with RouteAware {
|
||||
title: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: () {
|
||||
context.go('/bar');
|
||||
},
|
||||
onPressed: () => context.go('/bar'),
|
||||
icon: const Icon(Icons.arrow_back),
|
||||
),
|
||||
const SizedBox(width: 5),
|
||||
@@ -108,23 +114,51 @@ class _HistoryScreenViewState extends State<HistoryScreenView> with RouteAware {
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(20, 16, 20, 8),
|
||||
child: TextField(
|
||||
onChanged: viewModel.search,
|
||||
decoration: const InputDecoration(
|
||||
hintText: 'Search by name…',
|
||||
prefixIcon: Icon(Icons.search_rounded, size: 20),
|
||||
isDense: true,
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: TextField(
|
||||
onChanged: viewModel.search,
|
||||
decoration: const InputDecoration(
|
||||
hintText: 'Search by name…',
|
||||
prefixIcon: Icon(Icons.search_rounded, size: 20),
|
||||
isDense: true,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
_CustomerDropdown(
|
||||
customerNames: viewModel.customerNames,
|
||||
selectedCustomer: viewModel.selectedCustomer,
|
||||
onSelected: viewModel.filterByCustomer,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: viewModel.closedTabs.isEmpty
|
||||
? _EmptyState()
|
||||
: ListView.separated(
|
||||
controller: _scrollController,
|
||||
padding: const EdgeInsets.fromLTRB(20, 8, 20, 20),
|
||||
itemCount: viewModel.closedTabs.length,
|
||||
separatorBuilder: (_, _) => const SizedBox(height: 10),
|
||||
itemCount: viewModel.closedTabs.length +
|
||||
(viewModel.hasMore || viewModel.isLoadingMore
|
||||
? 1
|
||||
: 0),
|
||||
separatorBuilder: (_, _) =>
|
||||
const SizedBox(height: 10),
|
||||
itemBuilder: (context, index) {
|
||||
if (index == viewModel.closedTabs.length) {
|
||||
return const Padding(
|
||||
padding: EdgeInsets.symmetric(vertical: 24),
|
||||
child: Center(
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2.5,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
final closedTab = viewModel.closedTabs[index];
|
||||
|
||||
return ClosedTabCard(closedTab: closedTab);
|
||||
@@ -139,6 +173,126 @@ class _HistoryScreenViewState extends State<HistoryScreenView> with RouteAware {
|
||||
}
|
||||
}
|
||||
|
||||
class _CustomerDropdown extends StatelessWidget {
|
||||
static const _allSentinel = r'$__all__$';
|
||||
|
||||
final List<String> customerNames;
|
||||
final String? selectedCustomer;
|
||||
final ValueChanged<String?> onSelected;
|
||||
|
||||
const _CustomerDropdown({
|
||||
required this.customerNames,
|
||||
required this.selectedCustomer,
|
||||
required this.onSelected,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final scheme = Theme.of(context).colorScheme;
|
||||
final isFiltered = selectedCustomer != null;
|
||||
|
||||
return PopupMenuButton<String>(
|
||||
onSelected: (value) {
|
||||
onSelected(value == _allSentinel ? null : value);
|
||||
},
|
||||
offset: const Offset(0, 44),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(14)),
|
||||
color: Theme.of(context).cardTheme.color ?? scheme.surface,
|
||||
itemBuilder: (context) => [
|
||||
PopupMenuItem<String>(
|
||||
value: _allSentinel,
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(
|
||||
isFiltered
|
||||
? Icons.people_outline
|
||||
: Icons.people_rounded,
|
||||
size: 18,
|
||||
color: isFiltered
|
||||
? null
|
||||
: scheme.primary,
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Text(
|
||||
'All customers',
|
||||
style: TextStyle(
|
||||
fontWeight: isFiltered ? FontWeight.w400 : FontWeight.w700,
|
||||
color: isFiltered ? null : scheme.primary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
if (customerNames.isNotEmpty)
|
||||
const PopupMenuDivider(height: 1),
|
||||
...customerNames.map(
|
||||
(name) => PopupMenuItem<String>(
|
||||
value: name,
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(
|
||||
name == selectedCustomer
|
||||
? Icons.person_rounded
|
||||
: Icons.person_outline_rounded,
|
||||
size: 18,
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Text(name, overflow: TextOverflow.ellipsis),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 14),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
border: Border.all(color: scheme.onSurface.withValues(alpha: 0.12)),
|
||||
color: isFiltered
|
||||
? scheme.primary.withValues(alpha: 0.08)
|
||||
: null,
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(
|
||||
Icons.person_rounded,
|
||||
size: 18,
|
||||
color: isFiltered
|
||||
? scheme.primary
|
||||
: scheme.onSurface.withValues(alpha: 0.5),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
Flexible(
|
||||
child: Text(
|
||||
selectedCustomer ?? 'Customer',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: 13,
|
||||
color: isFiltered
|
||||
? scheme.primary
|
||||
: scheme.onSurface.withValues(alpha: 0.5),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Icon(
|
||||
Icons.arrow_drop_down_rounded,
|
||||
size: 18,
|
||||
color: isFiltered
|
||||
? scheme.primary
|
||||
: scheme.onSurface.withValues(alpha: 0.5),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _EmptyState extends StatelessWidget {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
@@ -174,4 +328,4 @@ class _EmptyState extends StatelessWidget {
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user