diff --git a/shared/editor/embeds/Berrycast.test.ts b/shared/editor/embeds/Berrycast.test.ts
new file mode 100644
index 000000000..cd22f8d62
--- /dev/null
+++ b/shared/editor/embeds/Berrycast.test.ts
@@ -0,0 +1,8 @@
+import Berrycast from "./Berrycast";
+
+describe("Berrycast", () => {
+  Berrycast.ENABLED[0];
+
+  // TODO
+  test.todo("");
+});
diff --git a/shared/editor/embeds/Cawemo.tsx b/shared/editor/embeds/Cawemo.tsx
index b59e42b53..f04b9445f 100644
--- a/shared/editor/embeds/Cawemo.tsx
+++ b/shared/editor/embeds/Cawemo.tsx
@@ -4,19 +4,17 @@ import { EmbedProps as Props } from ".";
 
 const URL_REGEX = new RegExp("https?://cawemo.com/(?:share|embed)/(.*)$");
 
-export default class Cawemo extends React.Component<Props> {
-  static ENABLED = [URL_REGEX];
-
-  render() {
-    const { matches } = this.props.attrs;
-    const shareId = matches[1];
-    return (
-      <Frame
-        {...this.props}
-        src={`https://cawemo.com/embed/${shareId}`}
-        title={"Cawemo Embed"}
-        border
-      />
-    );
-  }
+export default function Cawemo(props: Props) {
+  const { matches } = props.attrs;
+  const shareId = matches[1];
+  return (
+    <Frame
+      {...props}
+      src={`https://cawemo.com/embed/${shareId}`}
+      title={"Cawemo Embed"}
+      border
+    />
+  );
 }
+
+Cawemo.ENABLED = [URL_REGEX];
diff --git a/shared/editor/embeds/ClickUp.tsx b/shared/editor/embeds/ClickUp.tsx
index 8bf00efd1..d346dfd31 100644
--- a/shared/editor/embeds/ClickUp.tsx
+++ b/shared/editor/embeds/ClickUp.tsx
@@ -2,21 +2,11 @@ import * as React from "react";
 import Frame from "../components/Frame";
 import { EmbedProps as Props } from ".";
 
-export default class ClickUp extends React.Component<Props> {
-  static ENABLED = [
-    new RegExp("^https?://share\\.clickup\\.com/[a-z]/[a-z]/(.*)/(.*)$"),
-    new RegExp(
-      "^https?://sharing\\.clickup\\.com/[0-9]+/[a-z]/[a-z]/(.*)/(.*)$"
-    ),
-  ];
-
-  render() {
-    return (
-      <Frame
-        {...this.props}
-        src={this.props.attrs.href}
-        title="ClickUp Embed"
-      />
-    );
-  }
+export default function ClickUp(props: Props) {
+  return <Frame {...props} src={this.props.attrs.href} title="ClickUp Embed" />;
 }
+
+ClickUp.ENABLED = [
+  new RegExp("^https?://share\\.clickup\\.com/[a-z]/[a-z]/(.*)/(.*)$"),
+  new RegExp("^https?://sharing\\.clickup\\.com/[0-9]+/[a-z]/[a-z]/(.*)/(.*)$"),
+];
diff --git a/shared/editor/embeds/Codepen.tsx b/shared/editor/embeds/Codepen.tsx
index 0271f52ab..f5bbce2e8 100644
--- a/shared/editor/embeds/Codepen.tsx
+++ b/shared/editor/embeds/Codepen.tsx
@@ -4,11 +4,9 @@ import { EmbedProps as Props } from ".";
 
 const URL_REGEX = new RegExp("^https://codepen.io/(.*?)/(pen|embed)/(.*)$");
 
-export default class Codepen extends React.Component<Props> {
-  static ENABLED = [URL_REGEX];
-
-  render() {
-    const normalizedUrl = this.props.attrs.href.replace(/\/pen\//, "/embed/");
-    return <Frame {...this.props} src={normalizedUrl} title="Codepen Embed" />;
-  }
+export default function Codepen(props: Props) {
+  const normalizedUrl = props.attrs.href.replace(/\/pen\//, "/embed/");
+  return <Frame {...this.props} src={normalizedUrl} title="Codepen Embed" />;
 }
+
+Codepen.ENABLED = [URL_REGEX];
diff --git a/shared/editor/embeds/DBDiagram.test.ts b/shared/editor/embeds/DBDiagram.test.ts
new file mode 100644
index 000000000..42665486c
--- /dev/null
+++ b/shared/editor/embeds/DBDiagram.test.ts
@@ -0,0 +1,8 @@
+import DBDiagram from "./DBDiagram";
+
+describe("DBDiagram", () => {
+  DBDiagram.ENABLED[0];
+
+  // TODO
+  test.todo("");
+});
diff --git a/shared/editor/embeds/DBDiagram.tsx b/shared/editor/embeds/DBDiagram.tsx
index 31fa524ac..826e61081 100644
--- a/shared/editor/embeds/DBDiagram.tsx
+++ b/shared/editor/embeds/DBDiagram.tsx
@@ -2,21 +2,19 @@ import * as React from "react";
 import Frame from "../components/Frame";
 import { EmbedProps as Props } from ".";
 
-export default class DBDiagram extends React.Component<Props> {
-  static ENABLED = [new RegExp("https://dbdiagram.io/(embed|d)/(\\w+)$")];
+export default function DBDiagram(props: Props) {
+  const { matches } = props.attrs;
+  const shareId = matches[2];
 
-  render() {
-    const { matches } = this.props.attrs;
-    const shareId = matches[2];
-
-    return (
-      <Frame
-        {...this.props}
-        src={`https://dbdiagram.io/embed/${shareId}`}
-        title={`DBDiagram (${shareId})`}
-        width="100%"
-        height="400px"
-      />
-    );
-  }
+  return (
+    <Frame
+      {...props}
+      src={`https://dbdiagram.io/embed/${shareId}`}
+      title={`DBDiagram (${shareId})`}
+      width="100%"
+      height="400px"
+    />
+  );
 }
+
+DBDiagram.ENABLED = [new RegExp("https://dbdiagram.io/(embed|d)/(\\w+)$")];
diff --git a/shared/editor/embeds/Descript.tsx b/shared/editor/embeds/Descript.tsx
index aef9c4f13..8fb896b53 100644
--- a/shared/editor/embeds/Descript.tsx
+++ b/shared/editor/embeds/Descript.tsx
@@ -2,19 +2,17 @@ import * as React from "react";
 import Frame from "../components/Frame";
 import { EmbedProps as Props } from ".";
 
-export default class Descript extends React.Component<Props> {
-  static ENABLED = [new RegExp("https?://share\\.descript\\.com/view/(\\w+)$")];
-
-  render() {
-    const { matches } = this.props.attrs;
-    const shareId = matches[1];
-    return (
-      <Frame
-        {...this.props}
-        src={`https://share.descript.com/embed/${shareId}`}
-        title={`Descript (${shareId})`}
-        width="400px"
-      />
-    );
-  }
+export default function Descript(props: Props) {
+  const { matches } = props.attrs;
+  const shareId = matches[1];
+  return (
+    <Frame
+      {...props}
+      src={`https://share.descript.com/embed/${shareId}`}
+      title={`Descript (${shareId})`}
+      width="400px"
+    />
+  );
 }
+
+Descript.ENABLED = [new RegExp("https?://share\\.descript\\.com/view/(\\w+)$")];