[Legacy Input Controls] Show deprecation badge in Dashboard (#174302)

## Summary

Closes #134050.

This adds a deprecation badge to legacy input control panels on
dashboards. This badge is only visible in edit mode. I've also added
support for displaying tooltips on badges shown in the embeddable panel
header when `getDisplayNameTooltip` is defined.

<img width="468" alt="Screenshot 2024-01-04 at 3 43 15 PM"
src="https://github.com/elastic/kibana/assets/1697105/c3e8c8d2-d2df-4880-acbb-f13c5c5222bc">

#### Testing
In order to test this, set `disableCreate: false` in the
`InputControlVis` vis type definition to add a legacy input control to a
dashboard if you don't have an existing dashboard that contains a legacy
input control.


https://github.com/elastic/kibana/blob/46a58541fa8ce21f86a32408cbc759c1bf22487b/src/plugins/input_control_vis/public/input_control_vis_type.ts#L33

---------

Co-authored-by: kibanamachine <[email protected]>

src/plugins/embeddable/public/embeddable_panel/panel_header/use_embeddable_panel_badges.tsx

@@ -106,18 +106,30 @@ export const useEmbeddablePanelBadges = (
 
   const badgeComponents = useMemo(
     () =>
-      badges?.map((badge) => (
-        <EuiBadge
-          key={badge.id}
-          className="embPanel__headerBadge"
-          iconType={badge.getIconType({ embeddable, trigger: panelBadgeTrigger })}
-          onClick={() => badge.execute({ embeddable, trigger: panelBadgeTrigger })}
-          onClickAriaLabel={badge.getDisplayName({ embeddable, trigger: panelBadgeTrigger })}
-          data-test-subj={`embeddablePanelBadge-${badge.id}`}
-        >
-          {badge.getDisplayName({ embeddable, trigger: panelBadgeTrigger })}
-        </EuiBadge>
-      )),
+      badges?.map((badge) => {
+        const badgeComponent = (
+          <EuiBadge
+            key={badge.id}
+            className="embPanel__headerBadge"
+            iconType={badge.getIconType({ embeddable, trigger: panelBadgeTrigger })}
+            onClick={() => badge.execute({ embeddable, trigger: panelBadgeTrigger })}
+            onClickAriaLabel={badge.getDisplayName({ embeddable, trigger: panelBadgeTrigger })}
+            data-test-subj={`embeddablePanelBadge-${badge.id}`}
+          >
+            {badge.getDisplayName({ embeddable, trigger: panelBadgeTrigger })}
+          </EuiBadge>
+        );
+
+        const tooltip = badge.getDisplayNameTooltip
+          ? badge.getDisplayNameTooltip({ embeddable, trigger: panelBadgeTrigger })
+          : '';
+
+        return tooltip ? (
+          <EuiToolTip content={tooltip}>{badgeComponent}</EuiToolTip>
+        ) : (
+          badgeComponent
+        );
+      }),
     [badges, embeddable]
   );
 

src/plugins/input_control_vis/kibana.jsonc

@@ -12,10 +12,11 @@
       "expressions",
       "visDefaultEditor",
       "visualizations",
-      "unifiedSearch"
+      "unifiedSearch",
+      "uiActions"
     ],
     "requiredBundles": [
-      "kibanaReact"
+      "kibanaReact", "embeddable"
     ]
   }
 }

src/plugins/input_control_vis/public/deprecation_badge.ts

@@ -0,0 +1,54 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { Action } from '@kbn/ui-actions-plugin/public';
+
+import { Embeddable, ViewMode } from '@kbn/embeddable-plugin/public';
+import { i18n } from '@kbn/i18n';
+import { VisualizeInput } from '@kbn/visualizations-plugin/public';
+
+export const ACTION_DEPRECATION_BADGE = 'ACTION_INPUT_CONTROL_DEPRECATION_BADGE';
+
+export interface DeprecationBadgeActionContext {
+  embeddable: Embeddable<VisualizeInput>;
+}
+
+export class InputControlDeprecationBadge implements Action<DeprecationBadgeActionContext> {
+  public id = ACTION_DEPRECATION_BADGE;
+  public type = ACTION_DEPRECATION_BADGE;
+  public disabled = true;
+
+  public getDisplayName() {
+    return i18n.translate('inputControl.deprecationBadgeAction.deprecationBadgeLabel', {
+      defaultMessage: 'Deprecated',
+    });
+  }
+
+  public getIconType() {
+    return 'warning';
+  }
+
+  public getDisplayNameTooltip() {
+    return i18n.translate('inputControl.deprecationBadgeAction.deprecationWarningDescription', {
+      defaultMessage:
+        'Input controls are deprecated and will be removed in a future release. Use the new Controls to filter and interact with your dashboard data.',
+    });
+  }
+
+  public async isCompatible({ embeddable }: DeprecationBadgeActionContext) {
+    return (
+      embeddable.getInput().viewMode === ViewMode.EDIT &&
+      embeddable.getInput()?.savedVis?.type === 'input_control_vis'
+    );
+  }
+
+  public async execute() {
+    // do nothing
+    return;
+  }
+}

src/plugins/input_control_vis/public/plugin.ts

@@ -15,10 +15,13 @@ import {
 } from '@kbn/unified-search-plugin/public';
 import { Plugin as ExpressionsPublicPlugin } from '@kbn/expressions-plugin/public';
 import { VisualizationsSetup, VisualizationsStart } from '@kbn/visualizations-plugin/public';
+import { UiActionsStart } from '@kbn/ui-actions-plugin/public';
+import { PANEL_BADGE_TRIGGER } from '@kbn/embeddable-plugin/public';
 import { createInputControlVisFn } from './input_control_fn';
 import { getInputControlVisRenderer } from './input_control_vis_renderer';
 import { createInputControlVisTypeDefinition } from './input_control_vis_type';
 import { InputControlPublicConfig } from '../config';
+import { InputControlDeprecationBadge } from './deprecation_badge';
 
 type InputControlVisCoreSetup = CoreSetup<InputControlVisPluginStartDependencies, void>;
 
@@ -48,6 +51,7 @@ export interface InputControlVisPluginStartDependencies {
   visualizations: VisualizationsStart;
   data: DataPublicPluginStart;
   unifiedSearch: UnifiedSearchPublicPluginStart;
+  uiActions: UiActionsStart;
 }
 
 /** @internal */
@@ -78,5 +82,12 @@ export class InputControlVisPlugin implements Plugin<void, void> {
 
   public start(core: CoreStart, deps: InputControlVisPluginStartDependencies) {
     // nothing to do here
+    const { uiActions } = deps;
+
+    const deprecationBadge = new InputControlDeprecationBadge();
+
+    uiActions.addTriggerAction(PANEL_BADGE_TRIGGER, deprecationBadge);
+
+    return {};
   }
 }

src/plugins/input_control_vis/tsconfig.json

@@ -23,6 +23,8 @@
     "@kbn/i18n-react",
     "@kbn/test-jest-helpers",
     "@kbn/config-schema",
+    "@kbn/ui-actions-plugin",
+    "@kbn/embeddable-plugin",
   ],
   "exclude": [
     "target/**/*",