From dfa2d45d347fc51f2a7e653b30190ab581b75b48 Mon Sep 17 00:00:00 2001
From: keskami <kkak808@gmail.com>
Date: Fri, 24 Nov 2023 09:07:55 -0500
Subject: [PATCH] -s

---
 .../opensearch_dashboards.json                |  3 +-
 .../public/drilldown_options.tsx              | 71 ++++++++++++++++++-
 .../vis_type_drilldown/public/types.ts        |  7 +-
 3 files changed, 76 insertions(+), 5 deletions(-)

diff --git a/src/plugins/vis_type_drilldown/opensearch_dashboards.json b/src/plugins/vis_type_drilldown/opensearch_dashboards.json
index c7cb6af3f0fa..c309b8fc8d2e 100644
--- a/src/plugins/vis_type_drilldown/opensearch_dashboards.json
+++ b/src/plugins/vis_type_drilldown/opensearch_dashboards.json
@@ -13,5 +13,6 @@
     "data",
     "visDefaultEditor"
   ],
-  "optionalPlugins": []
+  "optionalPlugins": [],
+  "requiredBundles": ["opensearchDashboardsUtils", "opensearchDashboardsReact", "home"]
 }
diff --git a/src/plugins/vis_type_drilldown/public/drilldown_options.tsx b/src/plugins/vis_type_drilldown/public/drilldown_options.tsx
index 6060414ba4d0..07f97f568f1c 100644
--- a/src/plugins/vis_type_drilldown/public/drilldown_options.tsx
+++ b/src/plugins/vis_type_drilldown/public/drilldown_options.tsx
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, Fragment, useState, useEffect } from 'react';
 import {
   EuiPanel,
   EuiTitle,
@@ -12,11 +12,13 @@ import {
   EuiFlexItem,
   EuiFieldText,
   EuiAccordion,
+  EuiSuperSelect,
+  EuiText,
 } from '@elastic/eui';
-import { FormattedMessage } from '@osd/i18n/react';
 
 import { VisOptionsProps } from 'src/plugins/vis_default_editor/public';
-import { DrilldownVisParams } from './types';
+import { useOpenSearchDashboards } from 'src/plugins/opensearch_dashboards_react/public';
+import { DrilldownServices, DrilldownVisParams } from './types';
 
 function DrilldownOptions({ stateParams, setValue }: VisOptionsProps<DrilldownVisParams>) {
   const onMarkdownUpdate = useCallback(
@@ -24,11 +26,58 @@ function DrilldownOptions({ stateParams, setValue }: VisOptionsProps<DrilldownVi
     [setValue]
   );
 
+  const {
+    services: { savedObjectsClient },
+  } = useOpenSearchDashboards<DrilldownServices>();
+
+  useEffect(() => {
+    const savedObject = savedObjectsClient.find({
+      type: 'dashboard',
+    });
+  });
+
   const onDescriptionUpdate = useCallback(
     (value: DrilldownVisParams['cardDescription']) => setValue('cardDescription', value),
     [setValue]
   );
 
+  const activeVisName = '';
+  const handleVisTypeChange = () => {};
+  const options = [
+    {
+      value: '1',
+      inputDisplay: 'Option 1',
+      dropdownDisplay: (
+        <Fragment>
+          <strong>Name</strong>
+          <EuiText size="s" color="subdued">
+            <p className="euiTextColor--subdued">
+              id
+              <br />
+              text
+            </p>
+          </EuiText>
+        </Fragment>
+      ),
+    },
+    {
+      value: '2',
+      inputDisplay: 'Option 2',
+      dropdownDisplay: (
+        <Fragment>
+          <strong>Name</strong>
+          <EuiText size="s" color="subdued">
+            <p className="euiTextColor--subdued">
+              id
+              <br />
+              text
+            </p>
+          </EuiText>
+        </Fragment>
+      ),
+    },
+  ];
+
   return (
     <EuiAccordion buttonContent="Drilldown 1">
       <EuiPanel paddingSize="s">
@@ -70,6 +119,22 @@ function DrilldownOptions({ stateParams, setValue }: VisOptionsProps<DrilldownVi
               data-test-subj="markdownTextarea"
             />
           </EuiFlexItem>
+
+          <EuiFlexItem>
+            <EuiTitle size="xs">
+              <h2>
+                <label htmlFor="drilldownVisInput">Select a Destination</label>
+              </h2>
+            </EuiTitle>
+          </EuiFlexItem>
+
+          <EuiSuperSelect
+            options={options}
+            valueOfSelected={activeVisName}
+            onChange={handleVisTypeChange}
+            fullWidth
+            data-test-subj="chartPicker"
+          />
         </EuiFlexGroup>
       </EuiPanel>
     </EuiAccordion>
diff --git a/src/plugins/vis_type_drilldown/public/types.ts b/src/plugins/vis_type_drilldown/public/types.ts
index b147c2745027..54a63f10e845 100644
--- a/src/plugins/vis_type_drilldown/public/types.ts
+++ b/src/plugins/vis_type_drilldown/public/types.ts
@@ -3,9 +3,10 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import { SavedObjectsClientContract } from 'src/core/public/saved_objects/saved_objects_client';
+import { CoreStart } from 'src/core/server';
 import { NavigationPublicPluginStart } from '../../navigation/public';
 import { VisualizationsSetup } from '../../visualizations/public';
-import { Arguments } from '../../vis_type_markdown/public/types';
 
 export interface VisDrilldownPluginSetup {
   getGreeting: () => string;
@@ -39,3 +40,7 @@ export interface DrilldownVisParams {
   cardName: DrilldownArguments['cardName'];
   cardDescription: DrilldownArguments['cardDescription'];
 }
+
+export interface DrilldownServices extends CoreStart {
+  savedObjectsClient: SavedObjectsClientContract;
+}