Ocelot-Social/webapp/components/Editor/defaultExtensions.js
Robert Schäfer 52e0361087 Fixing pasteRules for Embeds
Apparently the default pasteRules of tiptap interfere with the
pasteRules of a Link (in our case an Embed node). Consider this example:

https://de.wikipedia.org/wiki/Yin_und_Yang

Depending on some random conditions, tiptap might parse the `_und_` to be
italic because it's wrapped with underscores (markdown syntax). The
result is:

https://de.wikipedia.org/wiki/Yin # link
_und_                             # italic
Yang                              # plain text

So let's remove the default pasteRules of `Bold`, `Strike` and `Italic`
marks respectively to prefer our Embeds. Who is copy+pasting from one
tiptap editor to another tiptap editor anyways?
2019-08-05 17:26:50 +02:00

49 lines
1.2 KiB
JavaScript

import Embed from '~/components/Editor/nodes/Embed.js'
import Link from '~/components/Editor/nodes/Link.js'
import Strike from '~/components/Editor/marks/Strike'
import Italic from '~/components/Editor/marks/Italic'
import Bold from '~/components/Editor/marks/Bold'
import EmbedQuery from '~/graphql/EmbedQuery.js'
import {
Heading,
HardBreak,
Blockquote,
ListItem,
BulletList,
OrderedList,
HorizontalRule,
Placeholder,
Underline,
} from 'tiptap-extensions'
export default function defaultExtensions(component) {
const { placeholder, $t, $apollo } = component
return [
new Heading(),
new HardBreak(),
new Blockquote(),
new BulletList(),
new OrderedList(),
new HorizontalRule(),
new Bold(),
new Italic(),
new Strike(),
new Underline(),
new Link(),
new Heading({ levels: [3, 4] }),
new ListItem(),
new Placeholder({
emptyNodeClass: 'is-empty',
emptyNodeText: placeholder || $t('editor.placeholder'),
}),
new Embed({
onEmbed: async ({ url }) => {
const {
data: { embed },
} = await $apollo.query({ query: EmbedQuery(), variables: { url } })
return embed
},
}),
]
}