Merge pull request #914 from AppFlowy-IO/fix/card_animation

Fix/card animation

frontend/app_flowy/lib/plugins/board/presentation/card/board_checkbox_cell.dart

@@ -36,19 +36,18 @@ class _BoardCheckboxCellState extends State<BoardCheckboxCell> {
     return BlocProvider.value(
       value: _cellBloc,
       child: BlocBuilder<BoardCheckboxCellBloc, BoardCheckboxCellState>(
+        buildWhen: (previous, current) =>
+            previous.isSelected != current.isSelected,
         builder: (context, state) {
           final icon = state.isSelected
               ? svgWidget('editor/editor_check')
               : svgWidget('editor/editor_uncheck');
-          return Padding(
-            padding: EdgeInsets.zero,
-            child: Align(
-              alignment: Alignment.centerLeft,
-              child: FlowyIconButton(
-                iconPadding: EdgeInsets.zero,
-                icon: icon,
-                width: 20,
-              ),
+          return Align(
+            alignment: Alignment.centerLeft,
+            child: FlowyIconButton(
+              iconPadding: EdgeInsets.zero,
+              icon: icon,
+              width: 20,
             ),
           );
         },

frontend/app_flowy/lib/plugins/board/presentation/card/board_date_cell.dart

@@ -5,8 +5,6 @@ import 'package:flowy_infra_ui/style_widget/text.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
-import 'define.dart';
-
 class BoardDateCell extends StatefulWidget {
   final String groupId;
   final GridCellControllerBuilder cellControllerBuilder;
@@ -39,21 +37,17 @@ class _BoardDateCellState extends State<BoardDateCell> {
     return BlocProvider.value(
       value: _cellBloc,
       child: BlocBuilder<BoardDateCellBloc, BoardDateCellState>(
+        buildWhen: (previous, current) => previous.dateStr != current.dateStr,
         builder: (context, state) {
           if (state.dateStr.isEmpty) {
             return const SizedBox();
           } else {
             return Align(
               alignment: Alignment.centerLeft,
-              child: Padding(
-                padding: EdgeInsets.symmetric(
-                  vertical: BoardSizes.cardCellVPadding,
-                ),
-                child: FlowyText.regular(
-                  state.dateStr,
-                  fontSize: 13,
-                  color: context.read<AppTheme>().shader3,
-                ),
+              child: FlowyText.regular(
+                state.dateStr,
+                fontSize: 13,
+                color: context.read<AppTheme>().shader3,
               ),
             );
           }

frontend/app_flowy/lib/plugins/board/presentation/card/board_number_cell.dart

@@ -4,8 +4,6 @@ import 'package:flowy_infra_ui/style_widget/text.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
-import 'define.dart';
-
 class BoardNumberCell extends StatefulWidget {
   final String groupId;
   final GridCellControllerBuilder cellControllerBuilder;
@@ -38,19 +36,16 @@ class _BoardNumberCellState extends State<BoardNumberCell> {
     return BlocProvider.value(
       value: _cellBloc,
       child: BlocBuilder<BoardNumberCellBloc, BoardNumberCellState>(
+        buildWhen: (previous, current) => previous.content != current.content,
         builder: (context, state) {
           if (state.content.isEmpty) {
             return const SizedBox();
           } else {
-            return Padding(
-              padding:
-                  EdgeInsets.symmetric(vertical: BoardSizes.cardCellVPadding),
-              child: Align(
-                alignment: Alignment.centerLeft,
-                child: FlowyText.medium(
-                  state.content,
-                  fontSize: 14,
-                ),
+            return Align(
+              alignment: Alignment.centerLeft,
+              child: FlowyText.medium(
+                state.content,
+                fontSize: 14,
               ),
             );
           }

frontend/app_flowy/lib/plugins/board/presentation/card/board_select_option_cell.dart

@@ -4,8 +4,6 @@ import 'package:app_flowy/plugins/grid/presentation/widgets/cell/select_option_c
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
-import 'define.dart';
-
 class BoardSelectOptionCell extends StatefulWidget {
   final String groupId;
   final GridCellControllerBuilder cellControllerBuilder;
@@ -37,6 +35,8 @@ class _BoardSelectOptionCellState extends State<BoardSelectOptionCell> {
     return BlocProvider.value(
       value: _cellBloc,
       child: BlocBuilder<BoardSelectOptionCellBloc, BoardSelectOptionCellState>(
+        buildWhen: (previous, current) =>
+            previous.selectedOptions != current.selectedOptions,
         builder: (context, state) {
           if (state.selectedOptions
               .where((element) => element.id == widget.groupId)
@@ -51,13 +51,10 @@ class _BoardSelectOptionCellState extends State<BoardSelectOptionCell> {
                   ),
                 )
                 .toList();
-            return Padding(
-              padding: EdgeInsets.only(top: BoardSizes.cardCellVPadding),
-              child: Align(
-                alignment: Alignment.centerLeft,
-                child: AbsorbPointer(
-                  child: Wrap(children: children, spacing: 4, runSpacing: 2),
-                ),
+            return Align(
+              alignment: Alignment.centerLeft,
+              child: AbsorbPointer(
+                child: Wrap(children: children, spacing: 4, runSpacing: 2),
               ),
             );
           }

frontend/app_flowy/lib/plugins/board/presentation/card/board_text_cell.dart

@@ -4,8 +4,6 @@ import 'package:flowy_infra_ui/style_widget/text.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
-import 'define.dart';
-
 class BoardTextCell extends StatefulWidget {
   final String groupId;
   final GridCellControllerBuilder cellControllerBuilder;
@@ -37,20 +35,16 @@ class _BoardTextCellState extends State<BoardTextCell> {
     return BlocProvider.value(
       value: _cellBloc,
       child: BlocBuilder<BoardTextCellBloc, BoardTextCellState>(
+        buildWhen: (previous, current) => previous.content != current.content,
         builder: (context, state) {
           if (state.content.isEmpty) {
             return const SizedBox();
           } else {
             return Align(
               alignment: Alignment.centerLeft,
-              child: Padding(
-                padding: EdgeInsets.symmetric(
-                  vertical: BoardSizes.cardCellVPadding,
-                ),
-                child: ConstrainedBox(
-                  constraints: const BoxConstraints(maxHeight: 120),
-                  child: FlowyText.medium(state.content, fontSize: 14),
-                ),
+              child: ConstrainedBox(
+                constraints: const BoxConstraints(maxHeight: 120),
+                child: FlowyText.medium(state.content, fontSize: 14),
               ),
             );
           }

frontend/app_flowy/lib/plugins/board/presentation/card/board_url_cell.dart

@@ -4,8 +4,6 @@ import 'package:flowy_infra/theme.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
-import 'define.dart';
-
 class BoardUrlCell extends StatefulWidget {
   final String groupId;
   final GridCellControllerBuilder cellControllerBuilder;
@@ -38,24 +36,21 @@ class _BoardUrlCellState extends State<BoardUrlCell> {
     return BlocProvider.value(
       value: _cellBloc,
       child: BlocBuilder<BoardURLCellBloc, BoardURLCellState>(
+        buildWhen: (previous, current) => previous.content != current.content,
         builder: (context, state) {
           if (state.content.isEmpty) {
             return const SizedBox();
           } else {
-            return Padding(
-              padding:
-                  EdgeInsets.symmetric(vertical: BoardSizes.cardCellVPadding),
-              child: Align(
-                alignment: Alignment.centerLeft,
-                child: RichText(
-                  textAlign: TextAlign.left,
-                  text: TextSpan(
-                    text: state.content,
-                    style: TextStyle(
-                      color: theme.main2,
-                      fontSize: 14,
-                      decoration: TextDecoration.underline,
-                    ),
+            return Align(
+              alignment: Alignment.centerLeft,
+              child: RichText(
+                textAlign: TextAlign.left,
+                text: TextSpan(
+                  text: state.content,
+                  style: TextStyle(
+                    color: theme.main2,
+                    fontSize: 14,
+                    decoration: TextDecoration.underline,
                   ),
                 ),
               ),

frontend/app_flowy/lib/plugins/board/presentation/card/card.dart

@@ -75,7 +75,7 @@ class _BoardCardState extends State<BoardCard> {
       (cellId) {
         final child = widget.cellBuilder.buildCell(widget.groupId, cellId);
         return Padding(
-          padding: const EdgeInsets.symmetric(horizontal: 6),
+          padding: const EdgeInsets.only(left: 4, right: 4, top: 6),
           child: child,
         );
       },

frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_column/board_column_data.dart

@@ -121,6 +121,10 @@ class AFBoardColumnDataController extends ChangeNotifier with EquatableMixin {
       columnData._items.add(newItem);
       Log.debug('[$AFBoardColumnDataController] $columnData add $newItem');
     } else {
+      if (index >= columnData._items.length) {
+        return;
+      }
+
       final removedItem = columnData._items.removeAt(index);
       columnData._items.insert(index, newItem);
       Log.debug(

frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_target.dart

@@ -140,7 +140,7 @@ class _ReorderDragTargetState<T extends DragTargetData>
           widget.insertAnimationController,
           widget.deleteAnimationController,
         ) ??
-        LongPressDraggable<DragTargetData>(
+        Draggable<DragTargetData>(
           maxSimultaneousDrags: 1,
           data: widget.dragTargetData,
           ignoringFeedbackSemantics: false,