feat: add guillemet auto-formatting (<< and >>) to the document editor

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/base/format_arrow_character.dart

@@ -10,6 +10,10 @@ const _dashGreater = '→';
 const _hyphen = '-';
 const _emDash = '—'; // This is an em dash — not a single dash - !!
 
+const _leftAngle = '<';
+const _leftGuillemet = '«';
+const _rightGuillemet = '»';
+
 /// format '=' + '>' into an ⇒
 ///
 /// - support
@@ -64,6 +68,46 @@ final CharacterShortcutEvent customFormatDoubleHyphenEmDash =
   ),
 );
 
+/// format two left angle brackets into a left guillemet
+///
+/// '<<' into '«'
+///
+/// - support
+///   - desktop
+///   - mobile
+///   - web
+///
+final CharacterShortcutEvent customFormatDoubleAngleLeftGuillemet =
+    CharacterShortcutEvent(
+  key: 'format double left angle bracket into a left guillemet',
+  character: _leftAngle,
+  handler: (editorState) async => _handleDoubleCharacterReplacement(
+    editorState: editorState,
+    character: _leftAngle,
+    replacement: _leftGuillemet,
+  ),
+);
+
+/// format two right angle brackets into a right guillemet
+///
+/// '>>' into '»'
+///
+/// - support
+///   - desktop
+///   - mobile
+///   - web
+///
+final CharacterShortcutEvent customFormatDoubleAngleRightGuillemet =
+    CharacterShortcutEvent(
+  key: 'format double right angle bracket into a right guillemet',
+  character: _greater,
+  handler: (editorState) async => _handleDoubleCharacterReplacement(
+    editorState: editorState,
+    character: _greater,
+    replacement: _rightGuillemet,
+  ),
+);
+
 /// If [prefixCharacter] is null or empty, [character] is used
 Future<bool> _handleDoubleCharacterReplacement({
   required EditorState editorState,

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/shortcuts/character_shortcuts.dart

@@ -46,6 +46,8 @@ List<CharacterShortcutEvent> buildCharacterShortcutEvents(
     customFormatGreaterEqual,
     customFormatDashGreater,
     customFormatDoubleHyphenEmDash,
+    customFormatDoubleAngleLeftGuillemet,
+    customFormatDoubleAngleRightGuillemet,
 
     customFormatNumberToNumberedList,
     customFormatSignToHeading,

frontend/appflowy_flutter/test/unit_test/document/shortcuts/format_shortcut_test.dart

@@ -99,5 +99,65 @@ void main() {
 
       editorState.dispose();
     });
+
+    test('turn << into «', () async {
+      final document = Document.blank()
+        ..insert([
+          0,
+        ], [
+          paragraphNode(text: '<'),
+        ]);
+
+      final editorState = EditorState(document: document);
+      editorState.selection = Selection.collapsed(
+        Position(path: [0], offset: 1),
+      );
+
+      final result =
+          await customFormatDoubleAngleLeftGuillemet.execute(editorState);
+      expect(result, true);
+
+      expect(editorState.document.root.children.length, 1);
+      final node = editorState.document.root.children[0];
+      expect(node.delta!.toPlainText(), '«');
+
+      // use undo to revert the change
+      undoCommand.execute(editorState);
+      expect(editorState.document.root.children.length, 1);
+      final nodeAfterUndo = editorState.document.root.children[0];
+      expect(nodeAfterUndo.delta!.toPlainText(), '<<');
+
+      editorState.dispose();
+    });
+
+    test('turn >> into »', () async {
+      final document = Document.blank()
+        ..insert([
+          0,
+        ], [
+          paragraphNode(text: '>'),
+        ]);
+
+      final editorState = EditorState(document: document);
+      editorState.selection = Selection.collapsed(
+        Position(path: [0], offset: 1),
+      );
+
+      final result =
+          await customFormatDoubleAngleRightGuillemet.execute(editorState);
+      expect(result, true);
+
+      expect(editorState.document.root.children.length, 1);
+      final node = editorState.document.root.children[0];
+      expect(node.delta!.toPlainText(), '»');
+
+      // use undo to revert the change
+      undoCommand.execute(editorState);
+      expect(editorState.document.root.children.length, 1);
+      final nodeAfterUndo = editorState.document.root.children[0];
+      expect(nodeAfterUndo.delta!.toPlainText(), '>>');
+
+      editorState.dispose();
+    });
   });
 }