Typescript sample panel action (#33602) (#33871)

* Typescript sample panel action

* Update EUI version to match main cabana version

* update yarn.lock

* add back typings include

* use correct relative path

package.json

@@ -89,8 +89,7 @@
       "**/@types/*/**",
       "**/grunt-*",
       "**/grunt-*/**",
-      "x-pack/typescript",
-      "kbn_tp_*/**"
+      "x-pack/typescript"
     ]
   },
   "dependencies": {

src/dev/typescript/projects.ts

@@ -35,6 +35,9 @@ export const PROJECTS = [
   ...glob
     .sync('packages/*/tsconfig.json', { cwd: REPO_ROOT })
     .map(path => new Project(resolve(REPO_ROOT, path))),
+  ...glob
+    .sync('test/plugin_functional/plugins/*/tsconfig.json', { cwd: REPO_ROOT })
+    .map(path => new Project(resolve(REPO_ROOT, path))),
 ];
 
 export function filterProjectsByFlag(projectFlag?: string) {

src/legacy/ui/public/embeddable/context_menu_actions/index.ts

@@ -21,3 +21,4 @@ export { ContextMenuPanel } from './context_menu_panel';
 export { ContextMenuAction } from './context_menu_action';
 export { ContextMenuActionsRegistryProvider } from './context_menu_actions_registry';
 export { buildEuiContextMenuPanels } from './build_eui_context_menu_panels';
+export { PanelActionAPI } from './types';

test/plugin_functional/plugins/kbn_tp_sample_panel_action/index.ts

@@ -17,8 +17,15 @@
  * under the License.
  */
 
-function samplePanelAction(kibana) {
+import { resolve } from 'path';
+
+// TODO: use something better once https://github.com/elastic/kibana/issues/26555 is
+// figured out.
+type KibanaPlugin = any;
+
+function samplePanelAction(kibana: KibanaPlugin) {
   return new kibana.Plugin({
+    publicDir: resolve(__dirname, './public'),
     uiExports: {
       contextMenuActions: [
         'plugins/kbn_tp_sample_panel_action/sample_panel_action',
@@ -28,9 +35,6 @@ function samplePanelAction(kibana) {
   });
 }
 
-module.exports = function (kibana) {
-  return [
-    samplePanelAction(kibana),
-  ];
+module.exports = (kibana: KibanaPlugin) => {
+  return [samplePanelAction(kibana)];
 };
-

test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json

@@ -1,13 +1,22 @@
 {
   "name": "kbn_tp_sample_panel_action",
   "version": "1.0.0",
+  "main":"target/test/plugin_functional/plugins/kbn_tp_sample_panel_action",
   "kibana": {
     "version": "kibana",
     "templateVersion": "1.0.0"
   },
   "license": "Apache-2.0",
   "dependencies": {
-    "@elastic/eui": "9.4.0",
+    "@elastic/eui": "9.4.2",
     "react": "^16.8.0"
+  },
+  "scripts": {
+    "kbn": "node ../../../../scripts/kbn.js",
+    "build": "rm -rf './target' && tsc"
+  },
+  "devDependencies": {
+    "@kbn/plugin-helpers" : "9.0.2",
+    "typescript": "^3.3.3333"
   }
-}
+}

test/plugin_functional/plugins/kbn_tp_sample_panel_action/public/sample_panel_action.tsx

@@ -23,6 +23,7 @@ import { openFlyout } from 'ui/flyout';
 import {
   ContextMenuAction,
   ContextMenuActionsRegistryProvider,
+  PanelActionAPI,
 } from 'ui/embeddable';
 
 class SamplePanelAction extends ContextMenuAction {
@@ -33,7 +34,10 @@ class SamplePanelAction extends ContextMenuAction {
       parentPanelId: 'mainMenu',
     });
   }
-  onClick({ embeddable }) {
+  public onClick = ({ embeddable }: PanelActionAPI) => {
+    if (!embeddable) {
+      return;
+    }
     openFlyout(
       <React.Fragment>
         <EuiFlyoutHeader>
@@ -47,9 +51,9 @@ class SamplePanelAction extends ContextMenuAction {
       </React.Fragment>,
       {
         'data-test-subj': 'samplePanelActionFlyout',
-      },
+      }
     );
-  }
+  };
 }
 
 ContextMenuActionsRegistryProvider.register(() => new SamplePanelAction());

test/plugin_functional/plugins/kbn_tp_sample_panel_action/public/sample_panel_link.ts

@@ -16,10 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import {
-  ContextMenuAction,
-  ContextMenuActionsRegistryProvider,
-} from 'ui/embeddable';
+import { ContextMenuAction, ContextMenuActionsRegistryProvider } from 'ui/embeddable';
 
 class SamplePanelLink extends ContextMenuAction {
   constructor() {
@@ -29,9 +26,10 @@ class SamplePanelLink extends ContextMenuAction {
       parentPanelId: 'mainMenu',
     });
   }
-  getHref() {
+
+  public getHref = () => {
     return 'https://example.com/kibana/test';
-  }
+  };
 }
 
 ContextMenuActionsRegistryProvider.register(() => new SamplePanelLink());

test/plugin_functional/plugins/kbn_tp_sample_panel_action/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "../../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./target",
+    "skipLibCheck": true
+  },
+  "include": [
+    "index.ts",
+    "public/**/*.ts",
+    "public/**/*.tsx",
+    "../../../../typings/**/*",
+  ],
+  "exclude": []
+}

test/scripts/jenkins_ci_group.sh

@@ -22,6 +22,10 @@ export TEST_BROWSER_HEADLESS=1
 "$(FORCE_COLOR=0 yarn bin)/grunt" "run:functionalTests_ciGroup${CI_GROUP}";
 
 if [ "$CI_GROUP" == "1" ]; then
-  "$(FORCE_COLOR=0 yarn bin)/grunt" run:pluginFunctionalTestsRelease;
+  # build kbn_tp_sample_panel_action
+  cd test/plugin_functional/plugins/kbn_tp_sample_panel_action;
+  yarn build;
+  cd -;
+  "$(FORCE_COLOR=0 yarn bin)/grunt" run:pluginFunctionalTestsRelease --from=source;
   "$(FORCE_COLOR=0 yarn bin)/grunt" run:interpreterFunctionalTestsRelease;
 fi

test/tsconfig.json

@@ -7,6 +7,10 @@
     ]
   },
   "include": [
-    "**/*.ts"
+    "**/*.ts",
+    "**/*.tsx",
+  ],
+  "exclude": [
+    "plugin_functional/plugins/**/*"
   ]
 }