diff --git a/lib/pangea/activity_suggestions/activity_suggestions_area.dart b/lib/pangea/activity_suggestions/activity_suggestions_area.dart index 9cefb2d02..4b25f0b51 100644 --- a/lib/pangea/activity_suggestions/activity_suggestions_area.dart +++ b/lib/pangea/activity_suggestions/activity_suggestions_area.dart @@ -4,6 +4,8 @@ import 'package:flutter/material.dart'; import 'package:collection/collection.dart'; +import 'package:flutter_gen/gen_l10n/l10n.dart'; +import 'package:go_router/go_router.dart'; import 'package:fluffychat/config/themes.dart'; import 'package:fluffychat/pangea/activity_planner/activity_plan_model.dart'; @@ -19,7 +21,6 @@ import 'package:fluffychat/widgets/matrix.dart'; class ActivitySuggestionsArea extends StatefulWidget { const ActivitySuggestionsArea({super.key}); - @override ActivitySuggestionsAreaState createState() => ActivitySuggestionsAreaState(); } @@ -39,7 +40,6 @@ class ActivitySuggestionsAreaState extends State { final List _activityItems = []; final ScrollController _scrollController = ScrollController(); - final double cardHeight = 235.0; final double cardPadding = 8.0; double get cardWidth => FluffyThemes.isColumnMode(context) ? 225.0 : 160.0; @@ -49,14 +49,11 @@ class ActivitySuggestionsAreaState extends State { final double scrollOffset = FluffyThemes.isColumnMode(context) ? index * cardWidth - (viewportDimension / 2) + (cardWidth / 2) : (index + 1) * (cardHeight + 8.0); - final maxScrollExtent = _scrollController.position.maxScrollExtent; final safeOffset = scrollOffset.clamp(0.0, maxScrollExtent); - if (safeOffset == _scrollController.offset) { return; } - _scrollController.animateTo( safeOffset, duration: FluffyThemes.animationDuration, @@ -64,6 +61,21 @@ class ActivitySuggestionsAreaState extends State { ); } + void _scrollToNextItem(AxisDirection direction) { + final currentOffset = _scrollController.offset; + final scrollAmount = + FluffyThemes.isColumnMode(context) ? cardWidth : cardHeight; + + _scrollController.animateTo( + (direction == AxisDirection.left + ? currentOffset - scrollAmount + : currentOffset + scrollAmount) + .clamp(0.0, _scrollController.position.maxScrollExtent), + duration: FluffyThemes.animationDuration, + curve: FluffyThemes.animationCurve, + ); + } + Future _setActivityItems() async { final ActivityPlanRequest request = ActivityPlanRequest( topic: "", @@ -123,12 +135,99 @@ class ActivitySuggestionsAreaState extends State { vertical: 16.0, horizontal: FluffyThemes.isColumnMode(context) ? 16.0 : 0.0, ), - child: SingleChildScrollView( - controller: _scrollController, - child: Wrap( - children: cards, - ), - ), + height: FluffyThemes.isColumnMode(context) + ? cardHeight + 2 * cardPadding + 16.0 + : null, + child: FluffyThemes.isColumnMode(context) + ? Stack( + alignment: Alignment.center, + children: [ + // Main content + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 45.0, + ), // Space for buttons + child: ListView( + controller: _scrollController, + scrollDirection: Axis.horizontal, + padding: const EdgeInsets.symmetric(vertical: 4.0), + children: cards, + ), + ), + + // Left button + Positioned( + left: 0, + top: cardHeight / 2 - 20.0, + child: Container( + decoration: BoxDecoration( + color: Theme.of(context) + .cardColor + .withAlpha((0.8 * 255).toInt()), + borderRadius: BorderRadius.circular(25), + ), + child: IconButton( + icon: const Icon(Icons.chevron_left), + onPressed: () => _scrollToNextItem(AxisDirection.left), + iconSize: 24.0, + padding: const EdgeInsets.all(8.0), + constraints: const BoxConstraints(), + ), + ), + ), + + // Right button + Positioned( + right: 0, + top: cardHeight / 2 - 20.0, + child: Container( + decoration: BoxDecoration( + color: Theme.of(context) + .cardColor + .withAlpha((0.8 * 255).toInt()), + borderRadius: BorderRadius.circular(25), + ), + child: IconButton( + icon: const Icon(Icons.chevron_right), + onPressed: () => _scrollToNextItem(AxisDirection.right), + iconSize: 24.0, + padding: const EdgeInsets.all(8.0), + constraints: const BoxConstraints(), + ), + ), + ), + + // Create Chat button + Positioned( + right: 0, + top: cardHeight / 2 + 30.0, + child: Container( + decoration: BoxDecoration( + color: Theme.of(context) + .primaryColor + .withAlpha((0.9 * 255).toInt()), + borderRadius: BorderRadius.circular(25), + ), + child: IconButton( + icon: const Icon(Icons.add_comment, color: Colors.white), + tooltip: L10n.of(context).createOwnChat, + onPressed: () => context.go('/rooms/newgroup'), + iconSize: 24.0, + padding: const EdgeInsets.all(8.0), + constraints: const BoxConstraints(), + ), + ), + ), + ], + ) + : SingleChildScrollView( + controller: _scrollController, + child: Wrap( + spacing: 8.0, + runSpacing: 8.0, + children: cards, + ), + ), ); } }