[Backport 2.x] [VisBuilder] Change VisBuilder from experimental to production

changelogs/fragments/6436.yml

@@ -0,0 +1,2 @@
+feat:
+- [VisBuilder] Change VisBuilder from experimental to production ([#6436](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6436))

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;

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 (
     <section className="vbWorkspace">
-      <EuiFlexGroup className="vbCanvasControls">
-        <EuiFlexItem>
-          <ExperimentalInfo />
-        </EuiFlexItem>
-      </EuiFlexGroup>
       <EuiPanel className="vbCanvas" data-test-subj="visualizationLoader">
         {expression ? (
           <ReactExpressionRenderer

src/plugins/vis_builder/public/embeddable/vis_builder_embeddable_factory.tsx

@@ -11,28 +11,21 @@ import {
   IContainer,
   SavedObjectEmbeddableInput,
 } from '../../../embeddable/public';
-import { VISUALIZE_ENABLE_LABS_SETTING } from '../../../visualizations/public';
 import {
   EDIT_PATH,
   PLUGIN_ID,
   PLUGIN_NAME,
   VisBuilderSavedObjectAttributes,
   VISBUILDER_SAVED_OBJECT,
 } from '../../common';
-import { DisabledEmbeddable } from './disabled_embeddable';
 import {
   VisBuilderEmbeddable,
   VisBuilderInput,
   VisBuilderOutput,
   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<VisBuilderEmbeddable | ErrorEmbeddable | DisabledEmbeddable> {
+  ): Promise<VisBuilderEmbeddable | ErrorEmbeddable> {
     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<boolean>(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(

src/plugins/vis_builder/public/plugin.test.ts

@@ -39,7 +39,6 @@ describe('VisBuilderPlugin', () => {
           title: PLUGIN_NAME,
           aliasPath: '#/',
           aliasApp: PLUGIN_ID,
-          stage: 'experimental',
         })
       );
     });

src/plugins/vis_builder/public/plugin.ts

@@ -192,7 +192,6 @@ export class VisBuilderPlugin
         defaultMessage: 'Create visualizations using the new VisBuilder',
       }),
       icon: 'visBuilder',
-      stage: 'experimental',
       aliasApp: PLUGIN_ID,
       aliasPath: '#/',
       appExtensions: {
@@ -205,7 +204,6 @@ export class VisBuilderPlugin
             icon: 'visBuilder',
             id,
             savedObjectType: VISBUILDER_SAVED_OBJECT,
-            stage: 'experimental',
             title: attributes?.title,
             typeTitle: VIS_BUILDER_CHART_TYPE,
             updated_at: updatedAt,

src/plugins/vis_builder/public/services/type_service/types.ts

@@ -22,7 +22,7 @@ export interface VisualizationTypeOptions<T = any> {
   readonly title: string;
   readonly description?: string;
   readonly icon: IconType;
-  readonly stage?: 'experimental' | 'production';
+  readonly stage?: 'production';
   readonly ui: {
     containerConfig: {
       data: DataTabConfig;

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,

test/functional/apps/vis_builder/index.ts

@@ -34,6 +34,5 @@ export default function ({ getService, loadTestFile }: FtrProviderContext) {
     });
 
     loadTestFile(require.resolve('./_base'));
-    loadTestFile(require.resolve('./_experimental_vis'));
   });
 }