From 6789c6ef39050a5d16029900cd2c2eae2c273374 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Mon, 10 Aug 2020 10:58:45 +0200
Subject: [PATCH] Transformations: Remove beta notice from transformations and
 field overrides  (#26881)

* Transformations: Remove beta badge for transformations and field overrides

* Removed imports

* Update doc links
---
 packages/grafana-ui/src/components/InfoBox/InfoBox.tsx |  2 +-
 public/app/core/utils/docsLinks.ts                     |  7 ++++---
 .../components/PanelEditor/FieldConfigEditor.tsx       |  8 ++++----
 .../TransformationsEditor/TransformationsEditor.tsx    | 10 +++-------
 4 files changed, 12 insertions(+), 15 deletions(-)

diff --git a/packages/grafana-ui/src/components/InfoBox/InfoBox.tsx b/packages/grafana-ui/src/components/InfoBox/InfoBox.tsx
index bda80126727..0ecc6da2dfd 100644
--- a/packages/grafana-ui/src/components/InfoBox/InfoBox.tsx
+++ b/packages/grafana-ui/src/components/InfoBox/InfoBox.tsx
@@ -107,7 +107,7 @@ const getInfoBoxStyles = stylesFactory((theme: GrafanaTheme) => ({
   `,
   docsLink: css`
     display: inline-block;
-    margin-top: ${theme.spacing.lg};
+    margin-top: ${theme.spacing.md};
     font-size: ${theme.typography.size.sm};
   `,
 }));
diff --git a/public/app/core/utils/docsLinks.ts b/public/app/core/utils/docsLinks.ts
index 8310d264ef8..5872ae967aa 100644
--- a/public/app/core/utils/docsLinks.ts
+++ b/public/app/core/utils/docsLinks.ts
@@ -2,9 +2,10 @@ import { DocsId } from '@grafana/data';
 
 // TODO: Documentation links
 const DOCS_LINKS: Record<DocsId, string> = {
-  [DocsId.Transformations]: 'https://docs.grafana.com',
-  [DocsId.FieldConfig]: 'https://docs.grafana.com',
-  [DocsId.FieldConfigOverrides]: 'https://docs.grafana.com',
+  [DocsId.Transformations]: 'https://grafana.com/docs/grafana/latest/panels/transformations',
+  [DocsId.FieldConfig]: 'https://grafana.com/docs/grafana/latest/panels/field-configuration-options/',
+  [DocsId.FieldConfigOverrides]:
+    'https://grafana.com/docs/grafana/latest/panels/field-configuration-options/#override-a-field',
 };
 
 export const getDocsLink = (id: DocsId) => DOCS_LINKS[id];
diff --git a/public/app/features/dashboard/components/PanelEditor/FieldConfigEditor.tsx b/public/app/features/dashboard/components/PanelEditor/FieldConfigEditor.tsx
index 16e5d13b471..10f60c9b73e 100644
--- a/public/app/features/dashboard/components/PanelEditor/FieldConfigEditor.tsx
+++ b/public/app/features/dashboard/components/PanelEditor/FieldConfigEditor.tsx
@@ -2,12 +2,12 @@ import React, { useCallback, ReactNode } from 'react';
 import cloneDeep from 'lodash/cloneDeep';
 import {
   DataFrame,
-  FeatureState,
   FieldConfigPropertyItem,
   FieldConfigSource,
   PanelPlugin,
   SelectableValue,
   VariableSuggestionsScope,
+  DocsId,
 } from '@grafana/data';
 import { Container, Counter, FeatureInfoBox, Field, fieldMatchersUI, Label, useTheme, ValuePicker } from '@grafana/ui';
 import { getDataLinksVariableSuggestions } from '../../../panel/panellinks/link_srv';
@@ -16,6 +16,7 @@ import groupBy from 'lodash/groupBy';
 import { OptionsGroup } from './OptionsGroup';
 import { selectors } from '@grafana/e2e-selectors';
 import { css } from 'emotion';
+import { getDocsLink } from 'app/core/utils/docsLinks';
 
 interface Props {
   plugin: PanelPlugin;
@@ -111,13 +112,12 @@ export const OverrideFieldConfigEditor: React.FC<Props> = props => {
       {config.overrides.length === 0 && (
         <FeatureInfoBox
           title="Overrides"
-          featureState={FeatureState.beta}
-          // url={getDocsLink(DocsId.FieldConfigOverrides)}
+          url={getDocsLink(DocsId.FieldConfigOverrides)}
           className={css`
             margin: ${theme.spacing.md};
           `}
         >
-          Field options overrides give you a fine grained control over how your data is displayed.
+          Field override rules give you a fine grained control over how your data is displayed.
         </FeatureInfoBox>
       )}
 
diff --git a/public/app/features/dashboard/components/TransformationsEditor/TransformationsEditor.tsx b/public/app/features/dashboard/components/TransformationsEditor/TransformationsEditor.tsx
index 93f24f4ec47..60e7934fe5f 100644
--- a/public/app/features/dashboard/components/TransformationsEditor/TransformationsEditor.tsx
+++ b/public/app/features/dashboard/components/TransformationsEditor/TransformationsEditor.tsx
@@ -11,13 +11,13 @@ import {
 } from '@grafana/ui';
 import {
   DataTransformerConfig,
-  FeatureState,
   GrafanaTheme,
   SelectableValue,
   standardTransformersRegistry,
   transformDataFrame,
   DataFrame,
   PanelData,
+  DocsId,
 } from '@grafana/data';
 import { TransformationOperationRow } from './TransformationOperationRow';
 import { Card, CardProps } from '../../../../core/components/Card/Card';
@@ -25,6 +25,7 @@ import { css } from 'emotion';
 import { selectors } from '@grafana/e2e-selectors';
 import { Unsubscribable } from 'rxjs';
 import { PanelModel } from '../../state';
+import { getDocsLink } from 'app/core/utils/docsLinks';
 
 interface Props {
   panel: PanelModel;
@@ -170,11 +171,7 @@ export class TransformationsEditor extends React.PureComponent<Props, State> {
     return (
       <VerticalGroup spacing={'lg'}>
         <Container grow={1}>
-          <FeatureInfoBox
-            title="Transformations"
-            featureState={FeatureState.beta}
-            // url={getDocsLink(DocsId.Transformations)}
-          >
+          <FeatureInfoBox title="Transformations" url={getDocsLink(DocsId.Transformations)}>
             <p>
               Transformations allow you to join, calculate, re-order, hide and rename your query results before being
               visualized. <br />
@@ -182,7 +179,6 @@ export class TransformationsEditor extends React.PureComponent<Props, State> {
               time series. <br />
               It can help to switch to Table visualization to understand what a transformation is doing. <br />
             </p>
-            <p>Select one of the transformations below to start.</p>
           </FeatureInfoBox>
         </Container>
         <VerticalGroup>