Plan-B/ionic-planb-logistic-app-flutter
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

checkpoint

Browse Source
This commit is contained in:
Mathias Beaulieu-Duncan
2025-11-25 17:05:08 -05:00
parent bbcd6d9bf7
commit d46ac9dc14
17 changed files with 705 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/components/collapsible_routes_sidebar.dart
+39 -38
View File
@@ -1,14 +1,16 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../models/delivery_route.dart';
import '../theme/spacing_system.dart';
import '../theme/size_system.dart';
import '../theme/animation_system.dart';
import '../theme/color_system.dart';
import '../utils/breakpoints.dart';
import '../providers/providers.dart';
import 'route_list_item.dart';
class CollapsibleRoutesSidebar extends StatefulWidget {
class CollapsibleRoutesSidebar extends ConsumerStatefulWidget {
final List<DeliveryRoute> routes;
final DeliveryRoute? selectedRoute;
final ValueChanged<DeliveryRoute> onRouteSelected;
@@ -21,14 +23,13 @@ class CollapsibleRoutesSidebar extends StatefulWidget {
});
@override
State<CollapsibleRoutesSidebar> createState() =>
ConsumerState<CollapsibleRoutesSidebar> createState() =>
_CollapsibleRoutesSidebarState();
}
class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
class _CollapsibleRoutesSidebarState extends ConsumerState<CollapsibleRoutesSidebar>
with SingleTickerProviderStateMixin {
late AnimationController _animationController;
bool _isExpanded = true;
@override
void initState() {
@@ -37,9 +38,15 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
duration: const Duration(milliseconds: 300),
vsync: this,
);
if (_isExpanded) {
_animationController.forward();
}
// Set initial animation state based on provider value
WidgetsBinding.instance.addPostFrameCallback((_) {
final isExpanded = ref.read(collapseStateProvider);
if (isExpanded) {
_animationController.forward();
} else {
_animationController.value = 0;
}
});
}
@override
@@ -49,10 +56,11 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
}
void _toggleSidebar() {
setState(() {
_isExpanded = !_isExpanded;
});
if (_isExpanded) {
// Use shared provider state
ref.read(collapseStateProvider.notifier).toggle();
final isExpanded = ref.read(collapseStateProvider);
if (isExpanded) {
_animationController.forward();
} else {
_animationController.reverse();
@@ -63,6 +71,7 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
Widget build(BuildContext context) {
final isMobile = context.isMobile;
final isDarkMode = Theme.of(context).brightness == Brightness.dark;
final isExpanded = ref.watch(collapseStateProvider);
// On mobile, always show as collapsible
if (isMobile) {
@@ -84,19 +93,15 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
if (_isExpanded)
if (isExpanded)
Text(
'Routes',
style: Theme.of(context).textTheme.titleMedium,
style: Theme.of(context).textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.w700,
),
),
IconButton(
icon: AnimatedRotation(
turns: _isExpanded ? 0 : -0.25,
duration: Duration(
milliseconds: AppAnimations.durationFast.inMilliseconds,
),
child: const Icon(Icons.chevron_right),
),
icon: Icon(isExpanded ? Icons.menu_open : Icons.menu),
onPressed: _toggleSidebar,
iconSize: AppSizes.iconMd,
),
@@ -104,18 +109,18 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
),
),
// Collapsible content
if (_isExpanded)
if (isExpanded)
Expanded(
child: _buildRoutesList(context),
child: _buildRoutesList(context, isExpanded),
),
],
),
);
}
// On tablet/desktop, show full sidebar with toggle (expanded: 420px, collapsed: 80px for badge)
// On tablet/desktop, show full sidebar with toggle (expanded: 300px, collapsed: 80px for badge)
return Container(
width: _isExpanded ? 420 : 80,
width: isExpanded ? 300 : 80,
color: isDarkMode ? SvrntyColors.almostBlack : Colors.white,
child: Column(
children: [
@@ -132,13 +137,15 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
),
),
child: Row(
mainAxisAlignment: _isExpanded ? MainAxisAlignment.spaceBetween : MainAxisAlignment.center,
mainAxisAlignment: isExpanded ? MainAxisAlignment.spaceBetween : MainAxisAlignment.center,
children: [
if (_isExpanded)
if (isExpanded)
Expanded(
child: Text(
'Routes',
style: Theme.of(context).textTheme.titleMedium,
style: Theme.of(context).textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.w700,
),
overflow: TextOverflow.ellipsis,
),
),
@@ -146,13 +153,7 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
width: AppSizes.buttonHeightMd,
height: AppSizes.buttonHeightMd,
child: IconButton(
icon: AnimatedRotation(
turns: _isExpanded ? 0 : -0.5,
duration: Duration(
milliseconds: AppAnimations.durationFast.inMilliseconds,
),
child: const Icon(Icons.chevron_right),
),
icon: Icon(isExpanded ? Icons.menu_open : Icons.menu),
onPressed: _toggleSidebar,
iconSize: AppSizes.iconMd,
),
@@ -161,15 +162,15 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
),
),
// Routes list
Expanded(
child: _buildRoutesList(context),
Flexible(
child: _buildRoutesList(context, isExpanded),
),
],
),
);
}
Widget _buildRoutesList(BuildContext context) {
Widget _buildRoutesList(BuildContext context, bool isExpanded) {
return ListView.builder(
padding: const EdgeInsets.only(top: 4, bottom: 8),
physics: const AlwaysScrollableScrollPhysics(),
@@ -183,7 +184,7 @@ class _CollapsibleRoutesSidebarState extends State<CollapsibleRoutesSidebar>
isSelected: isSelected,
onTap: () => widget.onRouteSelected(route),
animationIndex: index,
isCollapsed: !_isExpanded,
isCollapsed: !isExpanded,
);
},
);