init use observability deps

Signed-off-by: Shenoy Pratik <sgguruda@amazon.com>

opensearch_dashboards.json

@@ -4,6 +4,6 @@
   "opensearchDashboardsVersion": "3.0.0",
   "server": true,
   "ui": true,
-  "requiredPlugins": ["navigation", "opensearchDashboardsReact"],
-  "optionalPlugins": []
+  "requiredPlugins": ["navigation", "opensearchDashboardsReact", "opensearchDashboardsUtils"],
+  "optionalPlugins": ["observabilityDashboards"]
 }

package.json

@@ -50,4 +50,4 @@
     "semver": "^7.5.2",
     "@cypress/request": "^3.0.0"
   }
-}
+}

public/components/SQLPage/SQLPage.tsx

@@ -24,6 +24,7 @@ import 'brace/mode/sql';
 import React from 'react';
 import { CoreStart } from '../../../../../src/core/public';
 import { SAMPLE_SQL_QUERY } from '../../../common/constants';
+import { getRenderCreateAccelerationFlyout } from '../../dependencies/register_observability_flyouts';
 import { ResponseDetail, TranslateResult } from '../Main/main';
 import { CreateAcceleration } from '../acceleration/create/create_acceleration';
 
@@ -59,6 +60,8 @@ export class SQLPage extends React.Component<SQLPageProps, SQLPageState> {
     };
   }
 
+  renderCreateAccelerationFlyout = getRenderCreateAccelerationFlyout();
+
   setIsModalVisible(visible: boolean): void {
     this.setState({
       isModalVisible: visible,
@@ -148,7 +151,7 @@ export class SQLPage extends React.Component<SQLPageProps, SQLPageState> {
         >
           <EuiSpacer size="s" />
           <EuiCodeEditor
-            data-test-subj='sqlCodeEditor'
+            data-test-subj="sqlCodeEditor"
             mode="sql"
             theme="textmate"
             width="100%"
@@ -167,7 +170,7 @@ export class SQLPage extends React.Component<SQLPageProps, SQLPageState> {
           <EuiFlexGroup justifyContent="spaceBetween">
             <EuiFlexItem>
               <EuiFlexGroup className="action-container" gutterSize="m">
-                <EuiFlexItem grow={false} >
+                <EuiFlexItem grow={false}>
                   <EuiButton
                     data-test-subj="sqlRunButton"
                     fill={true}
@@ -185,7 +188,11 @@ export class SQLPage extends React.Component<SQLPageProps, SQLPageState> {
                     this.props.onClear();
                   }}
                 >
-                  <EuiButton data-test-subj="sqlClearButton" className="sql-editor-button" isDisabled={this.props.asyncLoading}>
+                  <EuiButton
+                    data-test-subj="sqlClearButton"
+                    className="sql-editor-button"
+                    isDisabled={this.props.asyncLoading}
+                  >
                     Clear
                   </EuiButton>
                 </EuiFlexItem>
@@ -220,7 +227,9 @@ export class SQLPage extends React.Component<SQLPageProps, SQLPageState> {
                 <EuiFlexItem grow={false}>
                   <EuiButton
                     className="sql-accelerate-button"
-                    onClick={this.setAccelerationFlyout}
+                    onClick={() =>
+                      this.renderCreateAccelerationFlyout(this.props.selectedDatasource[0].label)
+                    }
                     isDisabled={this.props.asyncLoading}
                   >
                     Accelerate Table
@@ -234,4 +243,4 @@ export class SQLPage extends React.Component<SQLPageProps, SQLPageState> {
       </>
     );
   }
-}
+}

public/dependencies/register_observability_flyouts.tsx

@@ -0,0 +1,30 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { createGetterSetter } from '../../../../src/plugins/opensearch_dashboards_utils/public';
+import { ObservabilityStart } from '../types';
+
+export const [
+  getRenderAccelerationDetailsFlyout,
+  setRenderAccelerationDetailsFlyout,
+] = createGetterSetter('renderAccelerationDetailsFlyout');
+
+export const [
+  getRenderAssociatedObjectsDetailsFlyout,
+  setRenderAssociatedObjectsDetailsFlyout,
+] = createGetterSetter('renderAssociatedObjectsDetailsFlyout');
+
+export const [
+  getRenderCreateAccelerationFlyout,
+  setRenderCreateAccelerationFlyout,
+] = createGetterSetter<(dataSource: string) => void>('renderCreateAccelerationFlyout');
+
+export const registerObservabilityDependencies = (start?: ObservabilityStart) => {
+  if (!start) return;
+
+  setRenderAccelerationDetailsFlyout(start.renderAccelerationDetailsFlyout);
+  setRenderAssociatedObjectsDetailsFlyout(start.renderAssociatedObjectsDetailsFlyout);
+  setRenderCreateAccelerationFlyout(start.renderCreateAccelerationFlyout);
+};

public/plugin.ts

@@ -5,6 +5,7 @@
 
 import { AppMountParameters, CoreSetup, CoreStart, Plugin } from '../../../src/core/public';
 import { PLUGIN_NAME } from '../common/constants';
+import { registerObservabilityDependencies } from './dependencies/register_observability_flyouts';
 import { coreRefs } from './framework/core_refs';
 import { AppPluginStartDependencies, WorkbenchPluginSetup, WorkbenchPluginStart } from './types';
 
@@ -34,14 +35,15 @@ export class WorkbenchPlugin implements Plugin<WorkbenchPluginSetup, WorkbenchPl
     return {};
   }
 
-  public start(core: CoreStart): WorkbenchPluginStart {
+  public start(core: CoreStart, startDeps: AppPluginStartDependencies): WorkbenchPluginStart {
     coreRefs.http = core.http;
     coreRefs.savedObjectsClient = core.savedObjects.client;
     coreRefs.toasts = core.notifications.toasts;
     coreRefs.chrome = core.chrome;
     coreRefs.application = core.application;
     coreRefs.overlays = core.overlays;
 
+    registerObservabilityDependencies(startDeps.observabilityDashboards);
     return {};
   }
 

public/types.ts

@@ -3,8 +3,8 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-
 import { NavigationPublicPluginStart } from '../../../src/plugins/navigation/public';
+import { ObservabilityStart } from './types';
 
 export interface WorkbenchPluginSetup {}
 
@@ -13,4 +13,7 @@ export interface WorkbenchPluginStart {}
 
 export interface AppPluginStartDependencies {
   navigation: NavigationPublicPluginStart;
+  observabilityDashboards?: ObservabilityStart;
 }
+
+export type { ObservabilityStart } from '../../dashboards-observability/public';