From f97f1302cf7a0b6628172a2535ce24037c533475 Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Tue, 10 Oct 2023 12:44:22 -0500 Subject: [PATCH] fix added space on commit --- .../composer/text-input/web/Tags/plugin.tsx | 20 ++++++++++++++----- .../com/composer/text-input/web/Tags/view.tsx | 19 +++++++++++++++--- 2 files changed, 31 insertions(+), 8 deletions(-) diff --git a/src/view/com/composer/text-input/web/Tags/plugin.tsx b/src/view/com/composer/text-input/web/Tags/plugin.tsx index 93d365ff15..ba2bebea5b 100644 --- a/src/view/com/composer/text-input/web/Tags/plugin.tsx +++ b/src/view/com/composer/text-input/web/Tags/plugin.tsx @@ -27,6 +27,8 @@ export const Tags = Node.create({ allowSpaces: true, pluginKey: TagsPluginKey, command: ({editor, range, props}) => { + const {tag, punctuation} = props + // increase range.to by one when the next node is of type "text" // and starts with a space character const nodeAfter = editor.view.state.selection.$to.nodeAfter @@ -42,11 +44,11 @@ export const Tags = Node.create({ .insertContentAt(range, [ { type: this.name, - attrs: props, + attrs: {id: tag}, }, { type: 'text', - text: ' ', + text: `${punctuation || ''} `, }, ]) .run() @@ -92,8 +94,12 @@ export const Tags = Node.create({ const from = startIndex + match.index + matchedString.indexOf(tag) // `to` should not include ending punctuation - const to = from + tagWithoutPunctuation.length + const to = from + tag.length + console.log({ + from, + to, + }) if ( from < cursorPosition && to >= cursorPosition - punctuationIndexOffset @@ -103,8 +109,12 @@ export const Tags = Node.create({ from, to, }, - // should not include ending punctuation - query: tagWithoutPunctuation.replace(/^#/, ''), + /** + * This is passed to the `items({ query })` method configured in `createTagsAutocomplete`. + * + * TODO This value should follow the rules of our hashtags spec. + */ + query: tag.replace(/^#/, ''), // raw text string text: matchedString, } diff --git a/src/view/com/composer/text-input/web/Tags/view.tsx b/src/view/com/composer/text-input/web/Tags/view.tsx index 0f538b4a43..3d8f511420 100644 --- a/src/view/com/composer/text-input/web/Tags/view.tsx +++ b/src/view/com/composer/text-input/web/Tags/view.tsx @@ -26,6 +26,9 @@ export function createTagsAutocomplete({ autocompleteModel: TagsAutocompleteModel }): Omit { return { + /** + * This `query` param comes from the result of `findSuggestionMatch` + */ async items({query}) { autocompleteModel.setActive(true) await autocompleteModel.search(query) @@ -95,9 +98,19 @@ const Autocomplete = forwardRef( const [selectedIndex, setSelectedIndex] = useState(0) const commit = React.useCallback( - (tag: string) => { - // @ts-ignore we're dealing with strings here not mentions - command({id: tag}) + (query: string) => { + const tag = query.replace(/(\p{P}+)$/gu, '') + const punctuation = query.match(/(\p{P}+)$/gu)?.[0] || '' + /* + * This values here are passed directly to the `command` method + * configured in the `Tags` plugin. + * + * The type error is ignored because we parse the tag and punctuation + * separately above. We could do this in `command` definition, but we + * only want to `commitRecentTag` with the sanitized tag. + */ + // @ts-ignore + command({tag, punctuation}) autocompleteModel.commitRecentTag(tag) }, [command, autocompleteModel],