disable sharing popover if the dashboard doesn't have data (#14266)

frontend/src/metabase/dashboard/components/DashboardActions.jsx

 import React from "react";
 import { t } from "ttag";
+import cx from "classnames";
 
 import DashboardSharingEmbeddingModal from "../containers/DashboardSharingEmbeddingModal.jsx";
 import FullscreenIcon from "metabase/components/icons/FullscreenIcon";
@@ -26,6 +27,7 @@ export const getDashboardActions = (
     onRefreshPeriodChange,
     onSharingClick,
     onEmbeddingClick,
+    dashcardData,
   },
 ) => {
   const isPublicLinksEnabled = MetabaseSettings.get("enable-public-sharing");
@@ -33,6 +35,11 @@ export const getDashboardActions = (
 
   const buttons = [];
 
+  /* we consider the dashboard to be shareable if there is at least one card with data in it on the dashboard
+    markdown cards don't appear in dashcardData so we check to see if there is at least one value
+  */
+  const canShareDashboard = Object.keys(dashcardData).length > 0;
+
   if (!isEditing && !isEmpty) {
     const extraButtonClassNames =
       "bg-brand-hover text-white-hover py2 px3 text-bold block cursor-pointer";
@@ -40,9 +47,22 @@ export const getDashboardActions = (
     buttons.push(
       <PopoverWithTrigger
         ref="popover"
+        disabled={!canShareDashboard}
         triggerElement={
-          <Tooltip tooltip={t`Sharing`}>
-            <Icon name="share" className="text-brand-hover" />
+          <Tooltip
+            tooltip={
+              canShareDashboard
+                ? t`Sharing`
+                : t`Add data to share this dashboard`
+            }
+          >
+            <Icon
+              name="share"
+              className={cx({
+                "text-brand-hover": canShareDashboard,
+                "text-light": !canShareDashboard,
+              })}
+            />
           </Tooltip>
         }
       >