From 06feb38c3957af1d793ce9ed0d3052b0978925be Mon Sep 17 00:00:00 2001 From: Anan Zhuang Date: Fri, 12 Apr 2024 23:08:00 +0000 Subject: [PATCH] [VisBuilder] Change VisBuilder from experimental to production Issue Resolve https://github.com/opensearch-project/OpenSearch-Dashboards/issues/6435 --- CHANGELOG.md | 1 + .../components/experimental_info.tsx | 41 ------------------- .../application/components/workspace.scss | 2 +- .../application/components/workspace.tsx | 8 +--- .../public/embeddable/disabled_embeddable.tsx | 34 --------------- .../embeddable/disabled_visualization.scss | 12 ------ .../embeddable/disabled_visualization.tsx | 31 -------------- .../vis_builder_embeddable_factory.tsx | 19 ++------- src/plugins/vis_builder/public/plugin.test.ts | 1 - src/plugins/vis_builder/public/plugin.ts | 2 - .../public/services/type_service/types.ts | 2 +- .../type_service/visualization_type.tsx | 2 +- 12 files changed, 8 insertions(+), 147 deletions(-) delete mode 100644 src/plugins/vis_builder/public/application/components/experimental_info.tsx delete mode 100644 src/plugins/vis_builder/public/embeddable/disabled_embeddable.tsx delete mode 100644 src/plugins/vis_builder/public/embeddable/disabled_visualization.scss delete mode 100644 src/plugins/vis_builder/public/embeddable/disabled_visualization.tsx diff --git a/CHANGELOG.md b/CHANGELOG.md index bbcc7f0a9c9..cc1584e8542 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -91,6 +91,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) - [Dynamic Configurations] Improve dynamic configurations by adding cache and simplifying client fetch ([#6364](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6364)) - [MD] Add OpenSearch cluster group label to top of single selectable dropdown ([#6400](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6400)) - [Workspace] Support workspace in saved objects client in server side. ([#6365](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6365)) +- [VisBuilder] Change VisBuilder from experimental to production ([#6436](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6436)) ### 🐛 Bug Fixes diff --git a/src/plugins/vis_builder/public/application/components/experimental_info.tsx b/src/plugins/vis_builder/public/application/components/experimental_info.tsx deleted file mode 100644 index ea341e1e887..00000000000 --- a/src/plugins/vis_builder/public/application/components/experimental_info.tsx +++ /dev/null @@ -1,41 +0,0 @@ -/* - * Copyright OpenSearch Contributors - * SPDX-License-Identifier: Apache-2.0 - */ - -import React, { memo } from 'react'; -import { EuiCallOut, EuiLink } from '@elastic/eui'; -import { FormattedMessage } from '@osd/i18n/react'; -import { i18n } from '@osd/i18n'; - -export const InfoComponent = () => { - return ( - - - the GitHub issue - - ), - }} - /> - - ); -}; - -export const ExperimentalInfo = memo(InfoComponent); diff --git a/src/plugins/vis_builder/public/application/components/workspace.scss b/src/plugins/vis_builder/public/application/components/workspace.scss index 09285ab1498..70bb078b927 100644 --- a/src/plugins/vis_builder/public/application/components/workspace.scss +++ b/src/plugins/vis_builder/public/application/components/workspace.scss @@ -11,7 +11,7 @@ $keyframe-multiplier: calc(1 / $animation-multiplier); .vbWorkspace { display: grid; -ms-grid-rows: auto $euiSizeM 1fr; - grid-template-rows: auto 1fr; + grid-template-rows: 1fr; grid-area: workspace; grid-gap: $euiSizeM; padding: $euiSizeM; diff --git a/src/plugins/vis_builder/public/application/components/workspace.tsx b/src/plugins/vis_builder/public/application/components/workspace.tsx index 31880e93bb7..295ed528434 100644 --- a/src/plugins/vis_builder/public/application/components/workspace.tsx +++ b/src/plugins/vis_builder/public/application/components/workspace.tsx @@ -4,7 +4,7 @@ */ import { i18n } from '@osd/i18n'; -import { EuiEmptyPrompt, EuiFlexGroup, EuiFlexItem, EuiIcon, EuiPanel } from '@elastic/eui'; +import { EuiEmptyPrompt, EuiFlexItem, EuiIcon, EuiPanel } from '@elastic/eui'; import React, { useState, useMemo, useEffect, useLayoutEffect } from 'react'; import { useOpenSearchDashboards } from '../../../../opensearch_dashboards_react/public'; import { IExpressionLoaderParams } from '../../../../expressions/public'; @@ -18,7 +18,6 @@ import hand_field from '../../assets/hand_field.svg'; import fields_bg from '../../assets/fields_bg.svg'; import './workspace.scss'; -import { ExperimentalInfo } from './experimental_info'; import { handleVisEvent } from '../utils/handle_vis_event'; export const WorkspaceUI = () => { @@ -105,11 +104,6 @@ export const WorkspaceUI = () => { return (
- - - - - {expression ? ( { - private domNode?: HTMLElement; - public readonly type = VISBUILDER_EMBEDDABLE; - - constructor(private readonly title: string, initialInput: VisBuilderInput) { - super(initialInput, { title }); - } - - public reload() {} - public render(domNode: HTMLElement) { - if (this.title) { - this.domNode = domNode; - ReactDOM.render(, domNode); - } - } - - public destroy() { - if (this.domNode) { - ReactDOM.unmountComponentAtNode(this.domNode); - } - } -} diff --git a/src/plugins/vis_builder/public/embeddable/disabled_visualization.scss b/src/plugins/vis_builder/public/embeddable/disabled_visualization.scss deleted file mode 100644 index 825ff4d7322..00000000000 --- a/src/plugins/vis_builder/public/embeddable/disabled_visualization.scss +++ /dev/null @@ -1,12 +0,0 @@ -/* - * Copyright OpenSearch Contributors - * SPDX-License-Identifier: Apache-2.0 - */ -.vbDisabledVisualization { - width: 100%; - display: grid; - grid-gap: $euiSize; - place-content: center; - place-items: center; - text-align: center; -} diff --git a/src/plugins/vis_builder/public/embeddable/disabled_visualization.tsx b/src/plugins/vis_builder/public/embeddable/disabled_visualization.tsx deleted file mode 100644 index 30b5dd5ffa3..00000000000 --- a/src/plugins/vis_builder/public/embeddable/disabled_visualization.tsx +++ /dev/null @@ -1,31 +0,0 @@ -/* - * Copyright OpenSearch Contributors - * SPDX-License-Identifier: Apache-2.0 - */ - -import { EuiIcon } from '@elastic/eui'; -import { FormattedMessage } from '@osd/i18n/react'; -import React from 'react'; - -import './disabled_visualization.scss'; - -export function DisabledVisualization({ title }: { title: string }) { - return ( -
- -
- {title} }} - /> -
-
- -
-
- ); -} diff --git a/src/plugins/vis_builder/public/embeddable/vis_builder_embeddable_factory.tsx b/src/plugins/vis_builder/public/embeddable/vis_builder_embeddable_factory.tsx index 3c0bf033736..52cc74c82e0 100644 --- a/src/plugins/vis_builder/public/embeddable/vis_builder_embeddable_factory.tsx +++ b/src/plugins/vis_builder/public/embeddable/vis_builder_embeddable_factory.tsx @@ -11,7 +11,6 @@ import { IContainer, SavedObjectEmbeddableInput, } from '../../../embeddable/public'; -import { VISUALIZE_ENABLE_LABS_SETTING } from '../../../visualizations/public'; import { EDIT_PATH, PLUGIN_ID, @@ -19,7 +18,6 @@ import { VisBuilderSavedObjectAttributes, VISBUILDER_SAVED_OBJECT, } from '../../common'; -import { DisabledEmbeddable } from './disabled_embeddable'; import { VisBuilderEmbeddable, VisBuilderInput, @@ -27,12 +25,7 @@ import { VISBUILDER_EMBEDDABLE, } from './vis_builder_embeddable'; import { getStateFromSavedObject } from '../saved_visualizations/transforms'; -import { - getHttp, - getSavedVisBuilderLoader, - getTimeFilter, - getUISettings, -} from '../plugin_services'; +import { getHttp, getSavedVisBuilderLoader, getTimeFilter } from '../plugin_services'; import { StartServicesGetter } from '../../../opensearch_dashboards_utils/public'; import { VisBuilderPluginStartDependencies } from '../types'; @@ -45,7 +38,7 @@ export class VisBuilderEmbeddableFactory EmbeddableFactoryDefinition< SavedObjectEmbeddableInput, VisBuilderOutput | EmbeddableOutput, - VisBuilderEmbeddable | DisabledEmbeddable, + VisBuilderEmbeddable, VisBuilderSavedObjectAttributes > { public readonly type = VISBUILDER_EMBEDDABLE; @@ -75,17 +68,11 @@ export class VisBuilderEmbeddableFactory savedObjectId: string, input: VisBuilderInput, parent?: IContainer - ): Promise { + ): Promise { try { const savedObject = await getSavedVisBuilderLoader().get(savedObjectId); const editPath = `${EDIT_PATH}/${savedObjectId}`; const editUrl = getHttp().basePath.prepend(`/app/${PLUGIN_ID}${editPath}`); - const isLabsEnabled = getUISettings().get(VISUALIZE_ENABLE_LABS_SETTING); - - if (!isLabsEnabled) { - return new DisabledEmbeddable(PLUGIN_NAME, input); - } - const savedVis = getStateFromSavedObject(savedObject); const indexPatternService = this.deps.start().plugins.data.indexPatterns; const indexPattern = await indexPatternService.get( diff --git a/src/plugins/vis_builder/public/plugin.test.ts b/src/plugins/vis_builder/public/plugin.test.ts index 35e17865649..f6f3a8a6e83 100644 --- a/src/plugins/vis_builder/public/plugin.test.ts +++ b/src/plugins/vis_builder/public/plugin.test.ts @@ -39,7 +39,6 @@ describe('VisBuilderPlugin', () => { title: PLUGIN_NAME, aliasPath: '#/', aliasApp: PLUGIN_ID, - stage: 'experimental', }) ); }); diff --git a/src/plugins/vis_builder/public/plugin.ts b/src/plugins/vis_builder/public/plugin.ts index 4e8f020d1fe..5383db69e3d 100644 --- a/src/plugins/vis_builder/public/plugin.ts +++ b/src/plugins/vis_builder/public/plugin.ts @@ -188,7 +188,6 @@ export class VisBuilderPlugin defaultMessage: 'Create visualizations using the new VisBuilder', }), icon: 'visBuilder', - stage: 'experimental', aliasApp: PLUGIN_ID, aliasPath: '#/', appExtensions: { @@ -201,7 +200,6 @@ export class VisBuilderPlugin icon: 'visBuilder', id, savedObjectType: VISBUILDER_SAVED_OBJECT, - stage: 'experimental', title: attributes?.title, typeTitle: VIS_BUILDER_CHART_TYPE, updated_at: updatedAt, diff --git a/src/plugins/vis_builder/public/services/type_service/types.ts b/src/plugins/vis_builder/public/services/type_service/types.ts index edcc0b659fc..bc0a5cfe6c6 100644 --- a/src/plugins/vis_builder/public/services/type_service/types.ts +++ b/src/plugins/vis_builder/public/services/type_service/types.ts @@ -22,7 +22,7 @@ export interface VisualizationTypeOptions { readonly title: string; readonly description?: string; readonly icon: IconType; - readonly stage?: 'experimental' | 'production'; + readonly stage?: 'production'; readonly ui: { containerConfig: { data: DataTabConfig; diff --git a/src/plugins/vis_builder/public/services/type_service/visualization_type.tsx b/src/plugins/vis_builder/public/services/type_service/visualization_type.tsx index 2f863316435..0c2fadf3cf3 100644 --- a/src/plugins/vis_builder/public/services/type_service/visualization_type.tsx +++ b/src/plugins/vis_builder/public/services/type_service/visualization_type.tsx @@ -14,7 +14,7 @@ export class VisualizationType implements IVisualizationType { public readonly title: string; public readonly description: string; public readonly icon: IconType; - public readonly stage: 'experimental' | 'production'; + public readonly stage: 'production'; public readonly ui: IVisualizationType['ui']; public readonly toExpression: ( state: RenderState,