1 files changed, 60 insertions, 0 deletions
diff --git a/app/assets/javascripts/content_editor/services/create_editor.js b/app/assets/javascripts/content_editor/services/create_editor.js
new file mode 100644
index 00000000000..128d332b0a2
--- /dev/null
+++ b/app/assets/javascripts/content_editor/services/create_editor.js
@@ -0,0 +1,60 @@
+import { isFunction, isString } from 'lodash';
+import { Editor } from 'tiptap';
+import {
+  Bold,
+  Italic,
+  Code,
+  Link,
+  Image,
+  Heading,
+  Blockquote,
+  HorizontalRule,
+  BulletList,
+  OrderedList,
+  ListItem,
+} from 'tiptap-extensions';
+import { PROVIDE_SERIALIZER_OR_RENDERER_ERROR } from '../constants';
+import CodeBlockHighlight from '../extensions/code_block_highlight';
+import createMarkdownSerializer from './markdown_serializer';
+
+const createEditor = async ({ content, renderMarkdown, serializer: customSerializer } = {}) => {
+  if (!customSerializer && !isFunction(renderMarkdown)) {
+    throw new Error(PROVIDE_SERIALIZER_OR_RENDERER_ERROR);
+  }
+
+  const editor = new Editor({
+    extensions: [
+      new Bold(),
+      new Italic(),
+      new Code(),
+      new Link(),
+      new Image(),
+      new Heading({ levels: [1, 2, 3, 4, 5, 6] }),
+      new Blockquote(),
+      new HorizontalRule(),
+      new BulletList(),
+      new ListItem(),
+      new OrderedList(),
+      new CodeBlockHighlight(),
+    ],
+  });
+  const serializer = customSerializer || createMarkdownSerializer({ render: renderMarkdown });
+
+  editor.setSerializedContent = async (serializedContent) => {
+    editor.setContent(
+      await serializer.deserialize({ schema: editor.schema, content: serializedContent }),
+    );
+  };
+
+  editor.getSerializedContent = () => {
+    return serializer.serialize({ schema: editor.schema, content: editor.getJSON() });
+  };
+
+  if (isString(content)) {
+    await editor.setSerializedContent(content);
+  }
+
+  return editor;
+};
+
+export default createEditor;