fix: cards slide laggy (#62)

VGVentures · Dec 1, 2023 · 075dae2 · 075dae2
1 parent be2c7e1
commit 075dae2
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 15 deletions.
diff --git a/lib/home/bloc/home_state.dart b/lib/home/bloc/home_state.dart
@@ -87,6 +87,9 @@ class HomeState extends Equatable {
       status == Status.resultsToSourceAnswers ||
       status == Status.seeSourceAnswers ||
       status == Status.sourceAnswersBackToResults;
+  bool get isMovingToSeeSourceAnswers =>
+      status == Status.resultsToSourceAnswers ||
+      status == Status.seeSourceAnswers;
   bool get isSeeSourceAnswersVisible => status == Status.seeSourceAnswers;
   bool get isDashVisible => [
         Status.welcome,

diff --git a/lib/home/widgets/results_view.dart b/lib/home/widgets/results_view.dart
@@ -13,6 +13,8 @@ enum ResultsAnimationPhase {
 
 const _searchBarTopPadding = 90.0;
 const _questionBoxHeight = 84.0;
+const _cardEnterDuration = Duration(seconds: 2);
+const _cardExpandDuration = Duration(milliseconds: 800);
 
 class ResultsView extends StatefulWidget {
   const ResultsView({super.key});
@@ -67,9 +69,15 @@ class _ResultsView extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final state = context.watch<HomeBloc>().state;
+
+    final response =
+        context.select((HomeBloc bloc) => bloc.state.vertexResponse);
+
     return LayoutBuilder(
       builder: (context, constraints) {
         return Stack(
+          fit: StackFit.expand,
           children: [
             BlueContainer(constraints: constraints),
             const Positioned(
@@ -80,6 +88,12 @@ class _ResultsView extends StatelessWidget {
                 child: SearchBoxView(),
               ),
             ),
+            if (state.isMovingToSeeSourceAnswers)
+              Positioned(
+                top: _questionBoxHeight + _searchBarTopPadding + 32,
+                right: 100,
+                child: CarouselView(documents: response.documents),
+              ),
           ],
         );
       },
@@ -185,7 +199,7 @@ class BlueContainerState extends State<BlueContainer>
 
     enterTransitionController = AnimationController(
       vsync: this,
-      duration: const Duration(seconds: 2),
+      duration: _cardEnterDuration,
     )..addStatusListener((status) {
         if (status == AnimationStatus.completed) {
           context.read<HomeBloc>().add(const Results());
@@ -194,7 +208,7 @@ class BlueContainerState extends State<BlueContainer>
 
     exitTransitionController = AnimationController(
       vsync: this,
-      duration: const Duration(milliseconds: 800),
+      duration: _cardExpandDuration,
     )..addStatusListener((status) {
         final state = context.read<HomeBloc>().state;
 
@@ -322,12 +336,12 @@ class _AiResponseState extends State<_AiResponse>
 
     enterTransitionController = AnimationController(
       vsync: this,
-      duration: const Duration(seconds: 2),
+      duration: _cardEnterDuration,
     );
 
     exitTransitionController = AnimationController(
       vsync: this,
-      duration: const Duration(milliseconds: 800),
+      duration: _cardExpandDuration,
     );
   }
 
@@ -357,9 +371,6 @@ class _AiResponseState extends State<_AiResponse>
   Widget build(BuildContext context) {
     final state = context.watch<HomeBloc>().state;
 
-    final response =
-        context.select((HomeBloc bloc) => bloc.state.vertexResponse);
-
     return AnimatedBuilder(
       animation: _leftPaddingExitOut,
       builder: (context, child) => Padding(
@@ -388,7 +399,7 @@ class _AiResponseState extends State<_AiResponse>
                       state.status == Status.sourceAnswersBackToResults)
                     const Expanded(child: SummaryView())
                   else
-                    const SummaryView(),
+                    const Flexible(child: SummaryView()),
                   Padding(
                     padding: const EdgeInsets.only(top: 16),
                     child: SizedBox(
@@ -421,11 +432,6 @@ class _AiResponseState extends State<_AiResponse>
                 ],
               ),
             ),
-            if (state.isSeeSourceAnswersVisible) ...[
-              Expanded(
-                child: CarouselView(documents: response.documents),
-              ),
-            ],
           ],
         ),
       ),

diff --git a/test/home/widgets/results_view_test.dart b/test/home/widgets/results_view_test.dart
@@ -158,13 +158,18 @@ void main() {
         whenListen(
           homeBloc,
           controller.stream,
-          initialState: const HomeState(),
+          initialState: const HomeState(vertexResponse: response),
         );
 
         await tester.pumpApp(bootstrap());
         await tester.pumpAndSettle();
 
-        controller.add(const HomeState(status: Status.resultsToSourceAnswers));
+        controller.add(
+          const HomeState(
+            vertexResponse: response,
+            status: Status.resultsToSourceAnswers,
+          ),
+        );
         await tester.pumpAndSettle();
 
         verify(() => homeBloc.add(SeeResultsSourceAnswers())).called(1);