diff --git a/frontend/app_flowy/lib/workspace/application/grid/grid_header_bloc.dart b/frontend/app_flowy/lib/workspace/application/grid/grid_header_bloc.dart
index 90007ba8c2..2473bc607f 100644
--- a/frontend/app_flowy/lib/workspace/application/grid/grid_header_bloc.dart
+++ b/frontend/app_flowy/lib/workspace/application/grid/grid_header_bloc.dart
@@ -27,14 +27,26 @@ class GridHeaderBloc extends Bloc<GridHeaderEvent, GridHeaderState> {
             emit(state.copyWith(fields: value.fields));
           },
           moveField: (_MoveField value) async {
-            final result = await _fieldService.moveField(value.field.id, value.fromIndex, value.toIndex);
-            result.fold((l) {}, (err) => Log.error(err));
+            await _moveField(value, emit);
           },
         );
       },
     );
   }
 
+  Future<void> _moveField(_MoveField value, Emitter<GridHeaderState> emit) async {
+    final fields = List<Field>.from(state.fields);
+    fields.insert(value.toIndex, fields.removeAt(value.fromIndex));
+    emit(state.copyWith(fields: fields));
+
+    final result = await _fieldService.moveField(
+      value.field.id,
+      value.fromIndex,
+      value.toIndex,
+    );
+    result.fold((l) {}, (err) => Log.error(err));
+  }
+
   Future<void> _startListening() async {
     fieldCache.addListener(
       onChanged: (fields) => add(GridHeaderEvent.didReceiveFieldUpdate(fields)),
diff --git a/frontend/app_flowy/lib/workspace/application/menu/menu_view_section_bloc.dart b/frontend/app_flowy/lib/workspace/application/menu/menu_view_section_bloc.dart
index 10f4058a97..c74472aa5d 100644
--- a/frontend/app_flowy/lib/workspace/application/menu/menu_view_section_bloc.dart
+++ b/frontend/app_flowy/lib/workspace/application/menu/menu_view_section_bloc.dart
@@ -32,7 +32,7 @@ class ViewSectionBloc extends Bloc<ViewSectionEvent, ViewSectionState> {
           emit(state.copyWith(views: value.views));
         },
         moveView: (_MoveView value) async {
-          await _moveView(value);
+          _moveView(value, emit);
         },
       );
     });
@@ -59,9 +59,13 @@ class ViewSectionBloc extends Bloc<ViewSectionEvent, ViewSectionState> {
     }
   }
 
-  Future<void> _moveView(_MoveView value) async {
+  Future<void> _moveView(_MoveView value, Emitter<ViewSectionState> emit) async {
     if (value.fromIndex < state.views.length) {
       final viewId = state.views[value.fromIndex].id;
+      final views = List<View>.from(state.views);
+      views.insert(value.toIndex, views.removeAt(value.fromIndex));
+      emit(state.copyWith(views: views));
+
       final result = await _appService.moveView(
         viewId: viewId,
         fromIndex: value.fromIndex,