5892ccee97
* Revert "Revert "Switch comments/chat to rich text editor (#703)""
This reverts commit 33906adfe4.
* Fix typing after being weird on Android
Issue: character from mention gets deleted. Most weird on Swiftkey:
mention gets duplicated instead of deleting.
See https://github.com/ProseMirror/prosemirror/issues/565
https://bugs.chromium.org/p/chromium/issues/detail?id=612446
The keyboard still closes unexpectedly when you delete :(
* On reply, put space instead of \n after mention
* Remove image upload from placeholder text
- Redundant with image upload button
- Too long on mobile
* fix dependency
31 lines
913 B
TypeScript
31 lines
913 B
TypeScript
import Mention from '@tiptap/extension-mention'
|
|
import {
|
|
mergeAttributes,
|
|
NodeViewWrapper,
|
|
ReactNodeViewRenderer,
|
|
} from '@tiptap/react'
|
|
import clsx from 'clsx'
|
|
import { Linkify } from '../linkify'
|
|
|
|
const name = 'mention-component'
|
|
|
|
const MentionComponent = (props: any) => {
|
|
return (
|
|
<NodeViewWrapper className={clsx(name, 'not-prose text-indigo-700')}>
|
|
<Linkify text={'@' + props.node.attrs.label} />
|
|
</NodeViewWrapper>
|
|
)
|
|
}
|
|
|
|
/**
|
|
* Mention extension that renders React. See:
|
|
* https://tiptap.dev/guide/custom-extensions#extend-existing-extensions
|
|
* https://tiptap.dev/guide/node-views/react#render-a-react-component
|
|
*/
|
|
export const DisplayMention = Mention.extend({
|
|
parseHTML: () => [{ tag: name }],
|
|
renderHTML: ({ HTMLAttributes }) => [name, mergeAttributes(HTMLAttributes)],
|
|
addNodeView: () =>
|
|
ReactNodeViewRenderer(MentionComponent, { className: 'inline-block' }),
|
|
})
|