From 394d62ee51b6feb6e23c2b24505ee469460db146 Mon Sep 17 00:00:00 2001
From: Jack Fragassi <jfragassi98@gmail.com>
Date: Fri, 12 Aug 2022 16:33:21 -0700
Subject: [PATCH] Add embedded docs config details to extensions registry
 (#21052)

---
 .../src/ui-overrides/ExtensionsRegistry.ts    |  5 ++++
 .../components/DashboardEmbedControls.tsx     | 25 ++++++++++++-------
 2 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/superset-frontend/packages/superset-ui-core/src/ui-overrides/ExtensionsRegistry.ts b/superset-frontend/packages/superset-ui-core/src/ui-overrides/ExtensionsRegistry.ts
index dc71c809ea760..bf050a2c4c495 100644
--- a/superset-frontend/packages/superset-ui-core/src/ui-overrides/ExtensionsRegistry.ts
+++ b/superset-frontend/packages/superset-ui-core/src/ui-overrides/ExtensionsRegistry.ts
@@ -35,7 +35,12 @@ type ReturningDisplayable<P = void> = (props: P) => string | React.ReactElement;
  * When defining a new option here, take care to keep any parameters to functions (or components) minimal.
  * Any removal or alteration to a parameter will be considered a breaking change.
  */
+type ConfigDetailsProps = {
+  embeddedId: string;
+};
+
 export type Extensions = Partial<{
+  'embedded.documentation.configuration_details': React.ComponentType<ConfigDetailsProps>;
   'embedded.documentation.description': ReturningDisplayable;
   'embedded.documentation.url': string;
   'dashboard.nav.right': React.ComponentType;
diff --git a/superset-frontend/src/dashboard/components/DashboardEmbedControls.tsx b/superset-frontend/src/dashboard/components/DashboardEmbedControls.tsx
index dfe3f49baa455..6d28b7fd90462 100644
--- a/superset-frontend/src/dashboard/components/DashboardEmbedControls.tsx
+++ b/superset-frontend/src/dashboard/components/DashboardEmbedControls.tsx
@@ -148,6 +148,9 @@ export const DashboardEmbedControls = ({ dashboardId, onHide }: Props) => {
     return <Loading />;
   }
 
+  const DocsConfigDetails = extensionsRegistry.get(
+    'embedded.documentation.configuration_details',
+  );
   const docsDescription = extensionsRegistry.get(
     'embedded.documentation.description',
   );
@@ -157,21 +160,25 @@ export const DashboardEmbedControls = ({ dashboardId, onHide }: Props) => {
 
   return (
     <>
-      <p>
-        {embedded ? (
-          <>
+      {embedded ? (
+        DocsConfigDetails ? (
+          <DocsConfigDetails embeddedId={embedded.uuid} />
+        ) : (
+          <p>
             {t(
               'This dashboard is ready to embed. In your application, pass the following id to the SDK:',
             )}
             <br />
             <code>{embedded.uuid}</code>
-          </>
-        ) : (
-          t(
+          </p>
+        )
+      ) : (
+        <p>
+          {t(
             'Configure this dashboard to embed it into an external web application.',
-          )
-        )}
-      </p>
+          )}
+        </p>
+      )}
       <p>
         {t('For further instructions, consult the')}{' '}
         <a href={docsUrl} target="_blank" rel="noreferrer">