chore: revert reorder rows in grid (#2533) (#2669)

This reverts commit f8f0599.

Author: appflowy

frontend/appflowy_flutter/assets/translations/en.json

@@ -109,7 +109,6 @@
     "openAsPage": "Open as a Page",
     "addNewRow": "Add a new row",
     "openMenu": "Click to open menu",
-    "dragRow": "Long press to reorder the row",
     "viewDataBase": "View database",
     "referencePage": "This {name} is referenced"
   },

frontend/appflowy_flutter/lib/plugins/database_view/application/database_controller.dart

@@ -175,28 +175,18 @@ class DatabaseController {
     );
   }
 
-  Future<Either<Unit, FlowyError>> moveGroupRow({
+  Future<Either<Unit, FlowyError>> moveRow({
     required RowPB fromRow,
     required String groupId,
     RowPB? toRow,
   }) {
-    return _databaseViewBackendSvc.moveGroupRow(
+    return _databaseViewBackendSvc.moveRow(
       fromRowId: fromRow.id,
       toGroupId: groupId,
       toRowId: toRow?.id,
     );
   }
 
-  Future<Either<Unit, FlowyError>> moveRow({
-    required RowPB fromRow,
-    required RowPB toRow,
-  }) {
-    return _databaseViewBackendSvc.moveRow(
-      fromRowId: fromRow.id,
-      toRowId: toRow.id,
-    );
-  }
-
   Future<Either<Unit, FlowyError>> moveGroup({
     required String fromGroupId,
     required String toGroupId,

frontend/appflowy_flutter/lib/plugins/database_view/application/database_view_service.dart

@@ -44,7 +44,7 @@ class DatabaseViewBackendService {
     return DatabaseEventCreateRow(payload).send();
   }
 
-  Future<Either<Unit, FlowyError>> moveGroupRow({
+  Future<Either<Unit, FlowyError>> moveRow({
     required String fromRowId,
     required String toGroupId,
     String? toRowId,
@@ -61,18 +61,6 @@ class DatabaseViewBackendService {
     return DatabaseEventMoveGroupRow(payload).send();
   }
 
-  Future<Either<Unit, FlowyError>> moveRow({
-    required String fromRowId,
-    required String toRowId,
-  }) {
-    var payload = MoveRowPayloadPB.create()
-      ..viewId = viewId
-      ..fromRowId = fromRowId
-      ..toRowId = toRowId;
-
-    return DatabaseEventMoveRow(payload).send();
-  }
-
   Future<Either<Unit, FlowyError>> moveGroup({
     required String fromGroupId,
     required String toGroupId,

frontend/appflowy_flutter/lib/plugins/database_view/application/row/row_cache.dart

@@ -29,7 +29,7 @@ abstract class RowCacheDelegate {
 class RowCache {
   final String viewId;
 
-  /// _rows contains the current block's rows
+  /// _rows containers the current block's rows
   /// Use List to reverse the order of the GridRow.
   final RowList _rowList = RowList();
 

frontend/appflowy_flutter/lib/plugins/database_view/board/application/board_bloc.dart

@@ -53,7 +53,7 @@ class BoardBloc extends Bloc<BoardEvent, BoardState> {
         final fromRow = groupControllers[groupId]?.rowAtIndex(fromIndex);
         final toRow = groupControllers[groupId]?.rowAtIndex(toIndex);
         if (fromRow != null) {
-          _databaseController.moveGroupRow(
+          _databaseController.moveRow(
             fromRow: fromRow,
             toRow: toRow,
             groupId: groupId,
@@ -69,7 +69,7 @@ class BoardBloc extends Bloc<BoardEvent, BoardState> {
         final fromRow = groupControllers[fromGroupId]?.rowAtIndex(fromIndex);
         final toRow = groupControllers[toGroupId]?.rowAtIndex(toIndex);
         if (fromRow != null) {
-          _databaseController.moveGroupRow(
+          _databaseController.moveRow(
             fromRow: fromRow,
             toRow: toRow,
             groupId: toGroupId,

frontend/appflowy_flutter/lib/plugins/database_view/grid/application/grid_bloc.dart

@@ -35,17 +35,6 @@ class GridBloc extends Bloc<GridEvent, GridState> {
             );
             await rowService.deleteRow(rowInfo.rowPB.id);
           },
-          moveRow: (int from, int to) {
-            final List<RowInfo> rows = [...state.rowInfos];
-
-            final fromRow = rows[from].rowPB;
-            final toRow = rows[to].rowPB;
-
-            rows.insert(to, rows.removeAt(from));
-            emit(state.copyWith(rowInfos: rows));
-
-            databaseController.moveRow(fromRow: fromRow, toRow: toRow);
-          },
           didReceiveGridUpdate: (grid) {
             emit(state.copyWith(grid: Some(grid)));
           },
@@ -121,7 +110,6 @@ class GridEvent with _$GridEvent {
   const factory GridEvent.initial() = InitialGrid;
   const factory GridEvent.createRow() = _CreateRow;
   const factory GridEvent.deleteRow(RowInfo rowInfo) = _DeleteRow;
-  const factory GridEvent.moveRow(int from, int to) = _MoveRow;
   const factory GridEvent.didReceiveRowUpdate(
     List<RowInfo> rows,
     RowsChangedReason listState,

frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/grid_page.dart

@@ -91,6 +91,21 @@ class _GridPageState extends State<GridPage> {
       ),
     );
   }
+
+  @override
+  void dispose() {
+    super.dispose();
+  }
+
+  @override
+  void deactivate() {
+    super.deactivate();
+  }
+
+  @override
+  void didUpdateWidget(covariant GridPage oldWidget) {
+    super.didUpdateWidget(oldWidget);
+  }
 }
 
 class FlowyGrid extends StatefulWidget {
@@ -104,12 +119,12 @@ class _FlowyGridState extends State<FlowyGrid> {
   final _scrollController = GridScrollController(
     scrollGroupController: LinkedScrollControllerGroup(),
   );
-  late final ScrollController headerScrollController;
+  late ScrollController headerScrollController;
 
   @override
   void initState() {
-    super.initState();
     headerScrollController = _scrollController.linkHorizontalController();
+    super.initState();
   }
 
   @override
@@ -201,78 +216,49 @@ class _GridRowsState extends State<_GridRows> {
 
   @override
   Widget build(BuildContext context) {
-    return Builder(
-      builder: (context) {
-        final filterState = context.watch<GridFilterMenuBloc>().state;
-        final sortState = context.watch<SortMenuBloc>().state;
-
-        return BlocConsumer<GridBloc, GridState>(
-          listenWhen: (previous, current) => previous.reason != current.reason,
-          listener: (context, state) {
-            state.reason.whenOrNull(
-              insert: (item) {
-                _key.currentState?.insertItem(item.index);
-              },
-              delete: (item) {
-                _key.currentState?.removeItem(
-                  item.index,
-                  (context, animation) => _renderRow(
-                    context,
-                    item.rowInfo,
-                    animation: animation,
-                  ),
-                );
-              },
+    return BlocConsumer<GridBloc, GridState>(
+      listenWhen: (previous, current) => previous.reason != current.reason,
+      listener: (context, state) {
+        state.reason.whenOrNull(
+          insert: (item) {
+            _key.currentState?.insertItem(item.index);
+          },
+          delete: (item) {
+            _key.currentState?.removeItem(
+              item.index,
+              (context, animation) =>
+                  _renderRow(context, item.rowInfo, animation),
             );
           },
-          buildWhen: (previous, current) {
-            return current.reason.maybeWhen(
+          reorderSingleRow: (reorderRow, rowInfo) {
+            // _key.currentState?.removeItem(
+            //   reorderRow.oldIndex,
+            //   (context, animation) => _renderRow(context, rowInfo, animation),
+            // );
+            // _key.currentState?.insertItem(reorderRow.newIndex);
+          },
+        );
+      },
+      buildWhen: (previous, current) {
+        return current.reason.whenOrNull(
               reorderRows: () => true,
               reorderSingleRow: (reorderRow, rowInfo) => true,
-              delete: (item) => true,
-              insert: (item) => true,
-              orElse: () => false,
-            );
-          },
-          builder: (context, state) {
-            final rowInfos = context.watch<GridBloc>().state.rowInfos;
-
-            return SliverFillRemaining(
-              child: ReorderableListView.builder(
-                key: _key,
-                buildDefaultDragHandles: false,
-                proxyDecorator: (child, index, animation) => Material(
-                  color: Colors.white.withOpacity(.1),
-                  child: Opacity(
-                    opacity: .5,
-                    child: child,
-                  ),
-                ),
-                onReorder: (fromIndex, newIndex) {
-                  final toIndex =
-                      newIndex > fromIndex ? newIndex - 1 : newIndex;
-
-                  if (fromIndex == toIndex) {
-                    return;
-                  }
-
-                  context
-                      .read<GridBloc>()
-                      .add(GridEvent.moveRow(fromIndex, toIndex));
-                },
-                itemCount: rowInfos.length,
-                itemBuilder: (BuildContext context, int index) {
-                  final RowInfo rowInfo = rowInfos[index];
-                  return _renderRow(
-                    context,
-                    rowInfo,
-                    index: index,
-                    isSortEnabled: sortState.sortInfos.isNotEmpty,
-                    isFilterEnabled: filterState.filters.isNotEmpty,
-                  );
-                },
-              ),
-            );
+            ) ??
+            false;
+      },
+      builder: (context, state) {
+        return SliverAnimatedList(
+          key: _key,
+          initialItemCount: context.read<GridBloc>().state.rowInfos.length,
+          itemBuilder:
+              (BuildContext context, int index, Animation<double> animation) {
+            final rowInfos = context.read<GridBloc>().state.rowInfos;
+            if (index >= rowInfos.length) {
+              return const SizedBox();
+            } else {
+              final RowInfo rowInfo = rowInfos[index];
+              return _renderRow(context, rowInfo, animation);
+            }
           },
         );
       },
@@ -281,19 +267,16 @@ class _GridRowsState extends State<_GridRows> {
 
   Widget _renderRow(
     BuildContext context,
-    RowInfo rowInfo, {
-    int? index,
-    bool isSortEnabled = false,
-    bool isFilterEnabled = false,
-    Animation<double>? animation,
-  }) {
+    RowInfo rowInfo,
+    Animation<double> animation,
+  ) {
     final rowCache = context.read<GridBloc>().getRowCache(
           rowInfo.rowPB.blockId,
           rowInfo.rowPB.id,
         );
 
     /// Return placeholder widget if the rowCache is null.
-    if (rowCache == null) return const SizedBox.shrink();
+    if (rowCache == null) return const SizedBox();
 
     final fieldController =
         context.read<GridBloc>().databaseController.fieldController;
@@ -303,32 +286,24 @@ class _GridRowsState extends State<_GridRows> {
       rowCache: rowCache,
     );
 
-    final child = GridRow(
-      key: ValueKey(rowInfo.rowPB.id),
-      index: index,
-      isDraggable: !isSortEnabled && !isFilterEnabled,
-      rowInfo: rowInfo,
-      dataController: dataController,
-      cellBuilder: GridCellBuilder(cellCache: dataController.cellCache),
-      openDetailPage: (context, cellBuilder) {
-        _openRowDetailPage(
-          context,
-          rowInfo,
-          fieldController,
-          rowCache,
-          cellBuilder,
-        );
-      },
+    return SizeTransition(
+      sizeFactor: animation,
+      child: GridRow(
+        rowInfo: rowInfo,
+        dataController: dataController,
+        cellBuilder: GridCellBuilder(cellCache: dataController.cellCache),
+        openDetailPage: (context, cellBuilder) {
+          _openRowDetailPage(
+            context,
+            rowInfo,
+            fieldController,
+            rowCache,
+            cellBuilder,
+          );
+        },
+        key: ValueKey(rowInfo.rowPB.id),
+      ),
     );
-
-    if (animation != null) {
-      return SizeTransition(
-        sizeFactor: animation,
-        child: child,
-      );
-    }
-
-    return child;
   }
 
   void _openRowDetailPage(