Fix issue with Community iframe height in dashboard (#3834)

Closes #3764.

This PR fixes an issue where the dashboard would cut off the bottom of the
Community Updates posts (displayed in an iframe) if the browser height was
shorter than the height of the iframe. Related to [#605 in the linkerd website
repo](https://github.com/linkerd/website/pull/605).

Signed-off-by: Cintia Sanchez Garcia <cynthiasg@icloud.com>

web/app/js/components/Community.jsx

@@ -1,22 +1,38 @@
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
-import React from 'react';
+import _has from 'lodash/has';
 import { withStyles } from '@material-ui/core/styles';
 
 const styles = () => ({
   iframe: {
     border: "0px",
-    height: "100vh",
     width: "100%",
     overflow: "hidden",
   },
 });
 
 const Community = ({classes}) => {
+  const [iframeHeight, setIframeHeight] = useState(0);
+  useEffect(() => {
+    // We add 5px to avoid cutting box shadow
+    const setFromIframeEvent = e => {
+      if (!_has(e.data, "dashboardHeight")) {
+        return;
+      }
+      setIframeHeight(e.data.dashboardHeight + 5);
+    };
+    window.addEventListener("message", setFromIframeEvent);
+    return () => {
+      window.removeEventListener("message", setFromIframeEvent);
+    };
+  }, []);
+
   return (
     <iframe
       title="Community"
       src="https://linkerd.io/dashboard/"
       scrolling="no"
+      style={{ height: iframeHeight > 0 ? iframeHeight : "100vh" }}
       className={classes.iframe} />
   );
 };