chore: Editor refactor (#3286)

* cleanup

* add context

* EventEmitter allows removal of toolbar props from extensions

* Move to 'packages' of extensions
Remove EmojiTrigger extension

* types

* iteration

* fix render flashing

* fix: Missing nodes in collection descriptions

app/scenes/Document/components/Editor.tsx

@@ -2,6 +2,7 @@ import { observer } from "mobx-react";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { useRouteMatch } from "react-router-dom";
+import fullPackage from "@shared/editor/packages/full";
 import Document from "~/models/Document";
 import ClickablePadding from "~/components/ClickablePadding";
 import DocumentMetaWithViews from "~/components/DocumentMetaWithViews";
@@ -16,7 +17,7 @@ import {
 import MultiplayerEditor from "./AsyncMultiplayerEditor";
 import EditableTitle from "./EditableTitle";
 
-type Props = EditorProps & {
+type Props = Omit<EditorProps, "extensions"> & {
   onChangeTitle: (text: string) => void;
   title: string;
   id: string;
@@ -127,6 +128,7 @@ function DocumentEditor(props: Props, ref: React.RefObject<any>) {
         scrollTo={window.location.hash}
         readOnly={readOnly}
         shareId={shareId}
+        extensions={fullPackage}
         grow
         {...rest}
       />

app/scenes/Document/components/MultiplayerEditor.tsx

@@ -188,17 +188,18 @@ function MultiplayerEditor({ onSynced, ...props }: Props, ref: any) {
 
   const extensions = React.useMemo(() => {
     if (!remoteProvider) {
-      return [];
+      return props.extensions;
     }
 
     return [
+      ...(props.extensions || []),
       new MultiplayerExtension({
         user,
         provider: remoteProvider,
         document: ydoc,
       }),
     ];
-  }, [remoteProvider, user, ydoc]);
+  }, [remoteProvider, user, ydoc, props.extensions]);
 
   React.useEffect(() => {
     if (isLocalSynced && isRemoteSynced) {
@@ -251,17 +252,23 @@ function MultiplayerEditor({ onSynced, ...props }: Props, ref: any) {
     return () => window.removeEventListener("error", onUnhandledError);
   }, [showToast, t]);
 
-  if (!extensions.length) {
+  if (!remoteProvider) {
     return null;
   }
 
   // while the collaborative document is loading, we render a version of the
   // document from the last text cache in read-only mode if we have it.
   const showCache = !isLocalSynced && !isRemoteSynced;
+
   return (
     <>
       {showCache && (
-        <Editor defaultValue={props.defaultValue} readOnly ref={ref} />
+        <Editor
+          defaultValue={props.defaultValue}
+          extensions={props.extensions}
+          readOnly
+          ref={ref}
+        />
       )}
       <Editor
         {...props}