fix: render issue of nested list (#838)

* fix: render issue of nested list * fix: table board doesn't show in readonly mode * fix: ci tests
AppFlowy-IO · Jul 4, 2024 · 8b9ccf8 · 8b9ccf8
1 parent f6ee2fc
commit 8b9ccf8
Show file tree

Hide file tree

Showing 24 changed files with 222 additions and 71 deletions.
diff --git a/example/lib/pages/markdown/markdown_code_block_parser.dart b/example/lib/pages/markdown/markdown_code_block_parser.dart
@@ -8,9 +8,10 @@ class MarkdownCodeBlockParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/lib/src/editor/block_component/table_block_component/table_action_handler.dart b/lib/src/editor/block_component/table_block_component/table_action_handler.dart
@@ -1,7 +1,8 @@
-import 'package:flutter/material.dart';
+import 'dart:math' as math;
+
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:appflowy_editor/src/editor/block_component/table_block_component/table_action_menu.dart';
-import 'dart:math' as math;
+import 'package:flutter/material.dart';
 
 class TableActionHandler extends StatefulWidget {
   const TableActionHandler({

diff --git a/lib/src/editor/block_component/table_block_component/table_block_component.dart b/lib/src/editor/block_component/table_block_component/table_block_component.dart
@@ -36,7 +36,7 @@ class TableStyle {
   final Color borderHoverColor;
 
   const TableStyle({
-    this.colWidth = 80,
+    this.colWidth = 160,
     this.rowHeight = 40,
     this.colMinimumWidth = 40,
     this.borderWidth = 2,
@@ -50,7 +50,7 @@ class TableStyle {
 class TableDefaults {
   const TableDefaults._();
 
-  static double colWidth = 80.0;
+  static double colWidth = 160.0;
 
   static double rowHeight = 40.0;
 

diff --git a/lib/src/editor/block_component/table_block_component/table_col.dart b/lib/src/editor/block_component/table_block_component/table_col.dart
@@ -133,7 +133,11 @@ class _TableColState extends State<TableCol> {
         }
 
         final transaction = widget.editorState.transaction;
-        widget.tableNode.updateRowHeight(row, transaction: transaction);
+        widget.tableNode.updateRowHeight(
+          row,
+          editorState: widget.editorState,
+          transaction: transaction,
+        );
         if (transaction.operations.isNotEmpty) {
           transaction.afterSelection = transaction.beforeSelection;
           widget.editorState.apply(transaction);

diff --git a/lib/src/editor/block_component/table_block_component/table_col_border.dart b/lib/src/editor/block_component/table_block_component/table_col_border.dart
@@ -64,14 +64,17 @@ class _TableColBorderState extends State<TableColBorder> {
         },
         onHorizontalDragUpdate: (DragUpdateDetails details) {
           final colWidth = widget.tableNode.getColWidth(widget.colIdx);
-          widget.tableNode
-              .setColWidth(widget.colIdx, colWidth + details.delta.dx);
+          widget.tableNode.setColWidth(
+            widget.colIdx,
+            colWidth + details.delta.dx,
+          );
         },
         child: Container(
           key: _borderKey,
           width: widget.tableNode.config.borderWidth,
-          height: context
-              .select((Node n) => n.attributes[TableBlockKeys.colsHeight]),
+          height: context.select(
+            (Node n) => n.attributes[TableBlockKeys.colsHeight],
+          ),
           color: _borderHovering || _borderDragging
               ? widget.borderHoverColor
               : widget.borderColor,
@@ -83,8 +86,9 @@ class _TableColBorderState extends State<TableColBorder> {
   Container buildFixedBorder(BuildContext context) {
     return Container(
       width: widget.tableNode.config.borderWidth,
-      height:
-          context.select((Node n) => n.attributes[TableBlockKeys.colsHeight]),
+      height: context.select(
+        (Node n) => n.attributes[TableBlockKeys.colsHeight],
+      ),
       color: Colors.grey,
     );
   }

diff --git a/lib/src/editor/block_component/table_block_component/table_node.dart b/lib/src/editor/block_component/table_block_component/table_node.dart
@@ -168,6 +168,7 @@ class TableNode {
 
   void updateRowHeight(
     int row, {
+    EditorState? editorState,
     Transaction? transaction,
   }) {
     // The extra 8 is because of paragraph padding
@@ -192,6 +193,9 @@ class TableNode {
     if (node.attributes[TableBlockKeys.colsHeight] != colsHeight) {
       if (transaction != null) {
         transaction.updateNode(node, {TableBlockKeys.colsHeight: colsHeight});
+        if (editorState != null && editorState.editable != true) {
+          node.updateAttributes({TableBlockKeys.colsHeight: colsHeight});
+        }
       } else {
         node.updateAttributes({TableBlockKeys.colsHeight: colsHeight});
       }

diff --git a/lib/src/plugins/markdown/decoder/document_markdown_decoder.dart b/lib/src/plugins/markdown/decoder/document_markdown_decoder.dart
@@ -47,7 +47,6 @@ class DocumentMarkdownDecoder extends Converter<String, Document> {
       nodes = parser.transform(
         mdNode,
         markdownElementParsers,
-        MarkdownListType.unknown,
       );
 
       if (nodes.isNotEmpty) {

diff --git a/lib/src/plugins/markdown/decoder/parser/custom_markdown_node_parser.dart b/lib/src/plugins/markdown/decoder/parser/custom_markdown_node_parser.dart
@@ -6,7 +6,8 @@ abstract class CustomMarkdownParser {
 
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  );
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  });
 }
diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_block_quote_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_block_quote_parser.dart
@@ -7,9 +7,10 @@ class MarkdownBlockQuoteParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_divider_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_divider_parser.dart
@@ -7,9 +7,10 @@ class MarkdownDividerParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_heading_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_heading_parser.dart
@@ -9,9 +9,10 @@ class MarkdownHeadingParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_image_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_image_parser.dart
@@ -7,9 +7,10 @@ class MarkdownImageParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_ordered_list_item_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_ordered_list_item_parser.dart
@@ -8,9 +8,10 @@ class MarkdownOrderedListItemParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }
@@ -25,7 +26,7 @@ class MarkdownOrderedListItemParserV2 extends CustomMarkdownParser {
     int sliceIndex = -1;
     if (element.children != null) {
       for (final child in element.children!.reversed) {
-        if (child is md.Element) {
+        if (child is md.Element && (child.tag == 'ol' || child.tag == 'ul')) {
           ec.add(child);
         } else {
           break;
@@ -42,13 +43,15 @@ class MarkdownOrderedListItemParserV2 extends CustomMarkdownParser {
 
     return [
       numberedListNode(
+        number: startNumber,
         delta: deltaDecoder.convertNodes(
           deltaNodes,
         ),
         children: parseElementChildren(
           ec.reversed.toList(),
           parsers,
           listType: MarkdownListType.ordered,
+          startNumber: startNumber,
         ),
       ),
     ];

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_ordered_list_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_ordered_list_parser.dart
@@ -7,9 +7,10 @@ class MarkdownOrderedListParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }
@@ -18,11 +19,14 @@ class MarkdownOrderedListParserV2 extends CustomMarkdownParser {
       return [];
     }
 
+    final startNumber = element.attributes['start'];
+
     // flatten the list
     return parseElementChildren(
       element.children,
       parsers,
       listType: MarkdownListType.ordered,
+      startNumber: startNumber != null ? int.tryParse(startNumber) : null,
     );
   }
 }
diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_paragraph_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_paragraph_parser.dart
@@ -7,9 +7,10 @@ class MarkdownParagraphParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_parser_extension.dart b/lib/src/plugins/markdown/decoder/parser/markdown_parser_extension.dart
@@ -11,6 +11,8 @@ List<Node> parseElementChildren(
   List<md.Node>? elementChildren,
   List<CustomMarkdownParser> parsers, {
   MarkdownListType listType = MarkdownListType.unknown,
+  // in case of ordered list, the start number of the list items may not start from 1
+  int? startNumber,
 }) {
   final List<Node> children = [];
 
@@ -23,7 +25,8 @@ List<Node> parseElementChildren(
       final nodes = parser.transform(
         child,
         parsers,
-        listType,
+        listType: listType,
+        startNumber: startNumber,
       );
 
       if (nodes.isNotEmpty) {

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_table_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_table_parser.dart
@@ -8,9 +8,10 @@ class MarkdownTableListParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_todo_list_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_todo_list_parser.dart
@@ -7,9 +7,10 @@ class MarkdownTodoListParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_unordered_list_item_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_unordered_list_item_parser.dart
@@ -8,9 +8,10 @@ class MarkdownUnorderedListItemParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }
@@ -25,7 +26,7 @@ class MarkdownUnorderedListItemParserV2 extends CustomMarkdownParser {
     int sliceIndex = -1;
     if (element.children != null) {
       for (final child in element.children!.reversed) {
-        if (child is md.Element) {
+        if (child is md.Element && (child.tag == 'ol' || child.tag == 'ul')) {
           ec.add(child);
         } else {
           break;

diff --git a/lib/src/plugins/markdown/decoder/parser/markdown_unordered_list_parser.dart b/lib/src/plugins/markdown/decoder/parser/markdown_unordered_list_parser.dart
@@ -7,9 +7,10 @@ class MarkdownUnorderedListParserV2 extends CustomMarkdownParser {
   @override
   List<Node> transform(
     md.Node element,
-    List<CustomMarkdownParser> parsers,
-    MarkdownListType listType,
-  ) {
+    List<CustomMarkdownParser> parsers, {
+    MarkdownListType listType = MarkdownListType.unknown,
+    int? startNumber,
+  }) {
     if (element is! md.Element) {
       return [];
     }

diff --git a/test/new/block_component/table_block_component/table_view_test.dart b/test/new/block_component/table_block_component/table_view_test.dart
@@ -41,10 +41,10 @@ void main() async {
       tableNode.updateRowHeight(0, transaction: transaction);
       await editor.editorState.apply(transaction);
 
-      expect(tableNode.getRowHeight(0) != row0beforeHeight, true);
+      expect(tableNode.getRowHeight(0) != row0beforeHeight, false);
       expect(tableNode.getRowHeight(0), cell10.children.first.rect.height + 8);
       expect(tableNode.getRowHeight(1), row1beforeHeight);
-      expect(tableNode.getRowHeight(1) < tableNode.getRowHeight(0), true);
+      expect(tableNode.getRowHeight(1) < tableNode.getRowHeight(0), false);
       await editor.dispose();
     });
 
@@ -75,7 +75,7 @@ void main() async {
       tableNode.updateRowHeight(0, transaction: transaction);
       await editor.editorState.apply(transaction);
 
-      expect(tableNode.getRowHeight(0) != row0beforeHeight, true);
+      expect(tableNode.getRowHeight(0) != row0beforeHeight, false);
       expect(tableNode.getRowHeight(0), cell10.children.first.rect.height + 8);
 
       transaction = editor.editorState.transaction;