docs: create Docusaurus v2.4.0 release docs + changelog + release blog post (#8811)

website/src/components/BrowserWindow/IframeWindow.tsx

@@ -0,0 +1,33 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+
+import BrowserWindow from './index';
+
+// Quick and dirty component, to improve later if needed
+export default function IframeWindow({url}: {url: string}): JSX.Element {
+  return (
+    <div style={{padding: 10}}>
+      <BrowserWindow
+        url={url}
+        style={{
+          minWidth: 'min(100%,45vw)',
+          width: 800,
+          maxWidth: '100%',
+          overflow: 'hidden',
+        }}
+        bodyStyle={{padding: 0}}>
+        <iframe
+          src={url}
+          title={url}
+          style={{display: 'block', width: '100%', height: 300}}
+        />
+      </BrowserWindow>
+    </div>
+  );
+}

website/src/components/BrowserWindow/index.tsx

@@ -51,3 +51,17 @@ export default function BrowserWindow({
     </div>
   );
 }
+
+// Quick and dirty component, to improve later if needed
+export function IframeWindow({url}: {url: string}): JSX.Element {
+  return (
+    <div style={{padding: 10}}>
+      <BrowserWindow
+        url={url}
+        style={{minWidth: '40vw', maxWidth: 400}}
+        bodyStyle={{padding: 0}}>
+        <iframe src={url} title={url} style={{width: '100%', height: 300}} />
+      </BrowserWindow>
+    </div>
+  );
+}

website/src/components/ErrorBoundaryTestButton/index.tsx

@@ -9,15 +9,24 @@ import React, {type ReactNode, useState} from 'react';
 
 export default function ErrorBoundaryTestButton({
   children = 'Boom!',
+  message = 'Boom!\nSomething bad happened, but you can try again!',
+  cause,
 }: {
   children?: ReactNode;
+  message?: string;
+  cause?: string;
 }): JSX.Element {
   const [state, setState] = useState(false);
   if (state) {
-    throw new Error('Boom!\nSomething bad happened, but you can try again!');
+    throw new Error(message, {
+      cause: cause ? new Error(cause) : undefined,
+    });
   }
   return (
-    <button type="button" onClick={() => setState(true)}>
+    <button
+      className="button button--danger"
+      type="button"
+      onClick={() => setState(true)}>
       {children}
     </button>
   );