deps(Trix): Move back to official editor

.storybook/preview.js

@@ -14,7 +14,7 @@ import UserProvider from '../components/UserProvider';
 import 'react-pdf/dist/esm/Page/TextLayer.css';
 import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
 import 'nprogress/nprogress.css';
-import '@opencollective/trix/dist/trix.css';
+import 'trix/dist/trix.css';
 import '../public/static/styles/app.css';
 
 // config file

components/RichTextEditor.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { css } from '@styled-system/css';
-import { get, remove } from 'lodash';
+import { get } from 'lodash';
 import styled from 'styled-components';
 import { v4 as uuid } from 'uuid';
 import { isURL } from 'validator';
@@ -272,7 +272,7 @@ export default class RichTextEditor extends React.Component<RichTextEditorProps,
 
     // Load Trix
     if (typeof window !== 'undefined') {
-      this.Trix = require('@opencollective/trix').default; // eslint-disable-line @typescript-eslint/no-var-requires
+      this.Trix = require('trix').default; // eslint-disable-line @typescript-eslint/no-var-requires
       document.addEventListener('trix-before-initialize', this.trixBeforeInitialize);
     }
   }
@@ -355,8 +355,10 @@ export default class RichTextEditor extends React.Component<RichTextEditorProps,
   trixBeforeInitialize = () => {
     this.Trix.config.blockAttributes.heading1 = { tagName: 'h3' };
     this.Trix.config.attachments.preview.caption = { name: false, size: false };
-    remove(this.Trix.config.parser.forbiddenElements, type => type === 'iframe'); // Allow iframes for video embeds
-    this.Trix.config.parser.allowedAttributes.push('frameborder', 'allowfullscreen');
+    if (this.props.videoEmbedEnabled) {
+      this.Trix.config.dompurify.ADD_TAGS = ['iframe']; // Allow iframes for video embeds
+      this.Trix.config.dompurify.ADD_ATTR = ['allowfullscreen', 'frameborder'];
+    }
   };
 
   trixInitialize = event => {

package.json

@@ -21,7 +21,7 @@
     "@hyperwatch/hyperwatch": "4.0.0",
     "@icons-pack/react-simple-icons": "^10.0.0",
     "@opencollective/taxes": "5.0.0",
-    "@opencollective/trix": "2.1.6",
+    "trix": "2.1.11",
     "@popperjs/core": "2.11.8",
     "@radix-ui/react-accordion": "1.2.1",
     "@radix-ui/react-alert-dialog": "1.1.2",

pages/_app.js

@@ -23,7 +23,7 @@ import { WorkspaceProvider } from '../components/WorkspaceProvider';
 import 'react-pdf/dist/esm/Page/TextLayer.css';
 import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
 import 'nprogress/nprogress.css';
-import '@opencollective/trix/dist/trix.css';
+import 'trix/dist/trix.css';
 import '../public/static/styles/app.css';
 import 'react-lite-youtube-embed/dist/LiteYouTubeEmbed.css';
 

renovate.json

@@ -6,7 +6,7 @@
       "assignees": ["betree"],
       "matchPackageNames": [
         "@opencollective/taxes",
-        "@opencollective/trix",
+        "trix",
         "@sentry/**",
         "interweave**",
         "lottie-react",