Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: delete key functionality #272

Merged
merged 7 commits into from
Jul 7, 2023

Conversation

MayurSMahajan
Copy link
Contributor

Solves: #335 and partially solves: #2888

Added functionalities:

  • Delete the right character in the text.
  • Delete a selected node.
  • At the end of the line, pressing delete merges the next line into the current line.
  • At the end of the line, pressing delete merges the next list node or checkbox node.

@codecov
Copy link

codecov bot commented Jul 1, 2023

Codecov Report

Merging #272 (0e53201) into main (46158d9) will increase coverage by 0.06%.
The diff coverage is 86.95%.

@@            Coverage Diff             @@
##             main     #272      +/-   ##
==========================================
+ Coverage   70.30%   70.36%   +0.06%     
==========================================
  Files         238      239       +1     
  Lines        9893     9935      +42     
==========================================
+ Hits         6955     6991      +36     
- Misses       2938     2944       +6     
Impacted Files Coverage Δ
lib/src/core/document/text_delta.dart 95.10% <ø> (ø)
lib/src/extensions/node_extensions.dart 90.00% <66.66%> (-6.08%) ⬇️
...rtcuts/command_shortcut_events/delete_command.dart 93.75% <93.75%> (ø)
...tor/block_component/standard_block_components.dart 100.00% <100.00%> (ø)
...ts/command_shortcut_events/select_all_command.dart 93.75% <100.00%> (ø)

}

final position = selection.start;
final node = editorState.getNodeAtPath(position.path);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

final delta = node?.delta;
if (node == null || delta == null) { return }

// use `delta` here  instead of `node.delta!`

return KeyEventResult.ignored;
}
//TODO(Lucas): add logic for merging a bulletList or numberedList item.
if (nextNode.next == null && nextNode.children.isEmpty) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why did you use nextNode.next here?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you list all the cases so that I can implement it more effectively?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I wrote this because in the backspace_command.dart we check the children and next node of a node when we want to append that node to the previous node. I guess it is a bit confusing. I tried to basically duplicate the behavior of the backspace_command.dart.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In backspace handler, when we are at the start of a line and we press backspace, we want the current line to merge with the previous line.
Eg:
Welcome to AppFlowy
|Welcome to AppFlowy
->
Welcome to AppFlowy | Welcome to AppFlowy

In delete handler, when we are at the end of a line and we press a delete, we want the next line to merge with the current line.

Eg:
Welcome to AppFlowy|
Welcome to AppFlowy
->
Welcome to AppFlowy | Welcome to AppFlowy

Comment on lines +118 to +128
// Before
// Welcome to AppFlowy Editor 🔥!|
// Welcome to AppFlowy Editor 🔥!
// After
// Welcome to AppFlowy Editor 🔥!|Welcome to AppFlowy Editor 🔥!
//
// test('''Delete the collapsed selection's next node when cursor is at end
// and current node contains a delta
// and the next node is the child of the current node''', () async {
// final document = Document.blank().addParagraph(
// initialText: text,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why comment out this code?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is the only functionality that needs to be implemented, I have commented this test, because the functionality is not yet implemented. We will just have to un-comment it and modify it a little bit in the future.

@LucasXu0
Copy link
Collaborator

LucasXu0 commented Jul 3, 2023

@MayurSMahajan Nice try! Can you list all the cases that related to delete key?

For example,

  1. collapsed selection
    1. at the begin, ...
    2. at the middle, ...
    3. at the end, ...
  2. non collapsed selection, ...

@MayurSMahajan
Copy link
Contributor Author

@LucasXu0 Here are the cases for the delete key:

Collapsed Selection:

  1. at the begin and middle, delete the right character, implemented

  2. at the end, (needs to be implemented)

  • if the next node is TextNode: merge the next node in the current text node
  • if the next node is a bullet list or checkbox, anything that has some text then, remove the bullet point/checkbox and just merge the text into the current text node.
  • if the next node doesn't have any text, then ignore
  • if the current node is not a text node then also ignore it.

Non-Collapsed Selection:

Just delete the selection entirely, implemented

@LucasXu0
Copy link
Collaborator

LucasXu0 commented Jul 3, 2023

@LucasXu0 Here are the cases for the delete key:

Collapsed Selection:

  1. at the begin and middle, delete the right character, implemented
  2. at the end, (needs to be implemented)
  • if the next node is TextNode: merge the next node in the current text node
  • if the next node is a bullet list or checkbox, anything that has some text then, remove the bullet point/checkbox and just merge the text into the current text node.
  • if the next node doesn't have any text, then ignore
  • if the current node is not a text node then also ignore it.

Non-Collapsed Selection:

Just delete the selection entirely, implemented

Very clear. So do you need me to implement the missing part?

@MayurSMahajan
Copy link
Contributor Author

Yes, I can't wrap my head around it 😅, I guess if you can do it, that would be great.

@LucasXu0 LucasXu0 merged commit 3f7c9fe into AppFlowy-IO:main Jul 7, 2023
@MayurSMahajan MayurSMahajan deleted the fr_delete_key_335 branch March 28, 2024 15:13
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants