diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/database/board/widgets/group_card_header.dart b/frontend/appflowy_flutter/lib/mobile/presentation/database/board/widgets/group_card_header.dart
index 105eb9588d..b5bfbea08b 100644
--- a/frontend/appflowy_flutter/lib/mobile/presentation/database/board/widgets/group_card_header.dart
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/database/board/widgets/group_card_header.dart
@@ -85,6 +85,11 @@ class _GroupCardHeaderState extends State<GroupCardHeader> {
                 ),
             maxLines: 1,
             style: titleTextStyle,
+            onTapOutside: (_) => context.read<BoardBloc>().add(
+                  // group header switch from TextField to Text
+                  // group name won't be changed
+                  BoardEvent.endEditingHeader(widget.groupData.id, null),
+                ),
           );
         }
 
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/board/application/board_bloc.dart b/frontend/appflowy_flutter/lib/plugins/database_view/board/application/board_bloc.dart
index 118909b527..a0bb0138b0 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/board/application/board_bloc.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/board/application/board_bloc.dart
@@ -211,7 +211,7 @@ class BoardBloc extends Bloc<BoardEvent, BoardState> {
               state.copyWith(isEditingHeader: true, editingHeaderId: groupId),
             );
           },
-          endEditingHeader: (String groupId, String groupName) async {
+          endEditingHeader: (String groupId, String? groupName) async {
             await groupBackendSvc.updateGroup(
               fieldId: groupControllers.values.first.group.fieldId,
               groupId: groupId,
@@ -505,7 +505,7 @@ class BoardEvent with _$BoardEvent {
   const factory BoardEvent.createGroup(String name) = _CreateGroup;
   const factory BoardEvent.startEditingHeader(String groupId) =
       _StartEditingHeader;
-  const factory BoardEvent.endEditingHeader(String groupId, String groupName) =
+  const factory BoardEvent.endEditingHeader(String groupId, String? groupName) =
       _EndEditingHeader;
   const factory BoardEvent.didCreateRow(
     GroupPB group,