From fe23183aef200bfeadf6f89e015c3a078204665a Mon Sep 17 00:00:00 2001
From: Mathias Mogensen <42929161+Xazin@users.noreply.github.com>
Date: Tue, 7 Nov 2023 15:58:22 +0100
Subject: [PATCH] feat: add placeholder to card editor (#3870)

---
 .../lib/plugins/database_view/widgets/row/row_document.dart | 4 ++++
 .../plugins/document/presentation/editor_configuration.dart | 5 ++++-
 .../lib/plugins/document/presentation/editor_page.dart      | 6 ++++++
 frontend/resources/translations/en.json                     | 3 +++
 4 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/row_document.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/row_document.dart
index 9aa9c2c10a..22e8ba0979 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/row_document.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/row_document.dart
@@ -116,6 +116,10 @@ class _RowEditorState extends State<RowEditor> {
                           context: context,
                           padding: const EdgeInsets.symmetric(horizontal: 10),
                         ),
+                        showParagraphPlaceholder: (editorState, node) =>
+                            editorState.document.isEmpty,
+                        placeholderText: (node) =>
+                            LocaleKeys.cardDetails_notesPlaceholder.tr(),
                       ),
                     ),
                   );
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_configuration.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_configuration.dart
index d575aa29aa..5618431420 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_configuration.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_configuration.dart
@@ -11,6 +11,8 @@ Map<String, BlockComponentBuilder> getEditorBuilderMap({
   required EditorStyleCustomizer styleCustomizer,
   List<SelectionMenuItem>? slashMenuItems,
   bool editable = true,
+  ShowPlaceholder? showParagraphPlaceholder,
+  String Function(Node)? placeholderText,
 }) {
   final standardActions = [
     OptionAction.delete,
@@ -29,7 +31,8 @@ Map<String, BlockComponentBuilder> getEditorBuilderMap({
   final customBlockComponentBuilderMap = {
     PageBlockKeys.type: PageBlockComponentBuilder(),
     ParagraphBlockKeys.type: ParagraphBlockComponentBuilder(
-      configuration: configuration,
+      configuration: configuration.copyWith(placeholderText: placeholderText),
+      showPlaceholder: showParagraphPlaceholder,
     ),
     TodoListBlockKeys.type: TodoListBlockComponentBuilder(
       configuration: configuration.copyWith(
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart
index bd774e4669..542ff548ea 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart
@@ -47,6 +47,8 @@ class AppFlowyEditorPage extends StatefulWidget {
     this.scrollController,
     this.autoFocus,
     required this.styleCustomizer,
+    this.showParagraphPlaceholder,
+    this.placeholderText,
   });
 
   final Widget? header;
@@ -55,6 +57,8 @@ class AppFlowyEditorPage extends StatefulWidget {
   final bool shrinkWrap;
   final bool? autoFocus;
   final EditorStyleCustomizer styleCustomizer;
+  final ShowPlaceholder? showParagraphPlaceholder;
+  final String Function(Node)? placeholderText;
 
   @override
   State<AppFlowyEditorPage> createState() => _AppFlowyEditorPageState();
@@ -112,6 +116,8 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
     context: context,
     editorState: widget.editorState,
     styleCustomizer: widget.styleCustomizer,
+    showParagraphPlaceholder: widget.showParagraphPlaceholder,
+    placeholderText: widget.placeholderText,
   );
 
   List<CharacterShortcutEvent> get characterShortcutEvents => [
diff --git a/frontend/resources/translations/en.json b/frontend/resources/translations/en.json
index 786a6048db..852098d8ef 100644
--- a/frontend/resources/translations/en.json
+++ b/frontend/resources/translations/en.json
@@ -1040,5 +1040,8 @@
   "favorite": {
     "noFavorite": "No favorite page",
     "noFavoriteHintText": "Swipe the page to the left to add it to your favorites"
+  },
+  "cardDetails": {
+    "notesPlaceholder": "Enter a / to insert a block, or start typing"
   }
 }