Functional Component Refactor: Pitch, Prezi, Spotify, Trello (#4264)

shared/editor/embeds/Trello.tsx

@@ -2,34 +2,32 @@ import * as React from "react";
 import Frame from "../components/Frame";
 import { EmbedProps as Props } from ".";
 
-const URL_REGEX = /^https:\/\/trello\.com\/(c|b)\/([^/]*)(.*)?$/;
-
-export default class Trello extends React.Component<Props> {
-  static ENABLED = [URL_REGEX];
-
-  render() {
-    const { matches } = this.props.attrs;
-    const objectId = matches[2];
-
-    if (matches[1] === "c") {
-      return (
-        <Frame
-          width="316px"
-          height="158px"
-          src={`https://trello.com/embed/card?id=${objectId}`}
-          title={`Trello Card (${objectId})`}
-        />
-      );
-    }
+function Trello(props: Props) {
+  const { matches } = props.attrs;
+  const objectId = matches[2];
 
+  if (matches[1] === "c") {
     return (
       <Frame
-        {...this.props}
-        width="248px"
-        height="185px"
-        src={`https://trello.com/embed/board?id=${objectId}`}
-        title={`Trello Board (${objectId})`}
+        width="316px"
+        height="158px"
+        src={`https://trello.com/embed/card?id=${objectId}`}
+        title={`Trello Card (${objectId})`}
       />
     );
   }
+
+  return (
+    <Frame
+      {...props}
+      width="248px"
+      height="185px"
+      src={`https://trello.com/embed/board?id=${objectId}`}
+      title={`Trello Board (${objectId})`}
+    />
+  );
 }
+
+Trello.ENABLED = [/^https:\/\/trello\.com\/(c|b)\/([^/]*)(.*)?$/];
+
+export default Trello;