This repository has been archived by the owner on Sep 11, 2024. It is now read-only.
Initial support for editing messages #2952
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
react messes up the DOM sometimes because of, I assume, not being aware of the changes to the real DOM by contenteditable.
componentWillReceiveProps doesn't run after mount, and is deprecated as well. Update state after both on componentDidMount and componentDidUpdate
also move part creation out of model, into partcreator, which can then also contain dependencies for creating the auto completer.
and transforms the text less
e.g. pills, they get deleted when any character of them is removed later on we also shouldn't allow the caret to be set inside of them
this way rendering is centralized and we can better rerender from interaction in the autocompleter (we didn't have access to caret before)
close autocomplete, and also replace with plain text part. also remove leftover logging
instead of end of current part
instead of having the same logic twice
bwindels
force-pushed
the
bwindels/message-edit-editor
branch
from
d7fd481
to
0b18ff5
Compare
|
Build seems to be failing because olm can't be fetched. Someone is looking at this ftr. |
so we can have fallback content in the regular content for clients that don't support edits. Note that we're not reading m.new_content yet as it's going to be a bit of a headache to change this. So for now just sending the edit in both the normal content and the m.new_content subfield, so all events out there already are well-formed
turt2live
approved these changes
May 14, 2019
| } | ||
|
|
||
| onTab() { | ||
| //forceCompletion here? |
There was a problem hiding this comment.
Indeed. This is not fully featured yet, but I want to get this in front of people testing it sooner rather than later.
| case "@": { | ||
| const displayName = completion.completion; | ||
| const userId = completion.completionId; | ||
| return new UserPillPart(userId, displayName); |
There was a problem hiding this comment.
Indeed, not supported yet.
jryans
reviewed
May 15, 2019
This was referenced May 29, 2019
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Initial support for editing messages. Includes a new editor (that still needs some improvements) for editing. No formatting/markdown support yet (e.g. formatting is lost upon save).
Reviewer: The commit history is a bit convoluted, so would recommend to review all changes at once. Let me know if this is too big, and I can restructure the commits.
element-hq/element-web#9487
element-hq/element-web#9481
element-hq/element-web#9575
Accompanying js-sdk PR: matrix-org/matrix-js-sdk#913
A few words about how the new editor works:
On
inputevents, the contents of the<div contenteditable>gets converted to a string. (textnodes are concatenated and block elements are turned into \n). Then we find out where the caret is in this string.With these two pieces of information, the editor model is updated. It will first diff the new text value with the previous, to learn where text has been added and removed. The editor model is a list of parts that represent different formatting, restrictions, etc ... for inline elements. The diff is then applied to the parts, and after this is done, the model calculates where the caret should be now.
After this the model is reapplied to the DOM of the contenteditable element and the caret is repositioned. This has the advantage of being a catch-all for every kind of interaction that causes an input event, and also not relying in keyboard events. Hence, this should work better with IME input methods, etc..