From 0e278ddf3f903ba1af6530103088ee9b90ae5ea7 Mon Sep 17 00:00:00 2001
From: Alexandre Moreau <alexandre@deepomatic.com>
Date: Mon, 17 Oct 2022 19:59:44 +0200
Subject: [PATCH 1/2] fix: add overflow ellipsis in FieldCellButton

---
 .../grid/presentation/widgets/header/field_cell.dart   | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
index 80b94762ec..59160565c9 100755
--- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
+++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
@@ -167,10 +167,12 @@ class FieldCellButton extends StatelessWidget {
       onTap: onTap,
       leftIcon: svgWidget(field.fieldType.iconName(), color: theme.iconColor),
       text: FlowyText.medium(
-        field.name,
-        fontSize: 12,
-        maxLines: maxLines,
-      ),
+          Characters(field.name)
+              .replaceAll(Characters(''), Characters('\u{200B}'))
+              .toString(),
+          fontSize: 12,
+          maxLines: maxLines,
+          overflow: TextOverflow.ellipsis),
       margin: GridSize.cellContentInsets,
     );
   }

From 3ee703cd6d5813e08b49b290935eca1fa37586d2 Mon Sep 17 00:00:00 2001
From: Alexandre Moreau <alexandre@deepomatic.com>
Date: Tue, 18 Oct 2022 19:03:26 +0200
Subject: [PATCH 2/2] style: align code and add comment

---
 .../presentation/widgets/header/field_cell.dart | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
index 59160565c9..0ee7462e22 100755
--- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
+++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
@@ -161,18 +161,23 @@ class FieldCellButton extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final theme = context.watch<AppTheme>();
+
+    // Using this technique to have proper text ellipsis
+    // https://github.com/flutter/flutter/issues/18761#issuecomment-812390920
+    final text = Characters(field.name)
+        .replaceAll(Characters(''), Characters('\u{200B}'))
+        .toString();
     return FlowyButton(
       radius: BorderRadius.zero,
       hoverColor: theme.shader6,
       onTap: onTap,
       leftIcon: svgWidget(field.fieldType.iconName(), color: theme.iconColor),
       text: FlowyText.medium(
-          Characters(field.name)
-              .replaceAll(Characters(''), Characters('\u{200B}'))
-              .toString(),
-          fontSize: 12,
-          maxLines: maxLines,
-          overflow: TextOverflow.ellipsis),
+        text,
+        fontSize: 12,
+        maxLines: maxLines,
+        overflow: TextOverflow.ellipsis,
+      ),
       margin: GridSize.cellContentInsets,
     );
   }