[App Menu Standardization] New way to register app menu

[kowalczyk-krzysztof]

Summary

This PR adds a new way to add app menu to applications.

Usage:

• Declarative (preferred):

import React, { useEffect } from 'react';
import { AppMenu } from '@kbn/core-chrome-app-menu';
import type { AppMenuConfig } from '@kbn/core-chrome-app-menu-components';
import type { CoreStart } from '@kbn/core/public';

interface Props {
  config: AppMenuConfig;
  core: CoreStart
}

const Example = ({ config, core }: Props) => {
  const { chrome } = core;

  return <AppMenu config={config} setAppMenu={chrome.setAppMenu} />;
};

• Imperative:

import React, { useEffect } from 'react';
import type { AppMenuConfig } from '@kbn/core-chrome-app-menu-components';
import type { CoreStart } from '@kbn/core/public';

interface Props {
  config: AppMenuConfig;
  core: CoreStart
}

const Example = ({ config, core }: Props) => {
  const { chrome } = core;

  useEffect(() => {
    chrome.setAppMenu(config);
  }, [chrome.setAppMenu, config]);

  return <div>Hello world!</div>;
};

• As a standalone component:

import React, { useEffect } from 'react';
import { AppMenuComponent, type AppMenuConfig } from '@kbn/core-chrome-app-menu-components';

interface Props {
  config: AppMenuConfig;
}

const Example = ({ config }: Props) => {
  return <AppMenuComponent config={config} />;
};

Closes: https://github.com/elastic/kibana-team/issues/2408

[davismcphee]

The Discover changes are looking good! Left a couple of comments.

[kowalczyk-krzysztof]

The Discover changes are looking good! Left a couple of comments.

Thanks for checking this out @davismcphee

I will probably open separate PRs for both discover and dashboards later as this one includes those changes, mostly to see if this approach would work.

EDIT: Moved to: #246156

[kowalczyk-krzysztof]

I moved Storybook directly to SharedUX Stories as in current state, integrating the component with unified tabs would cause circular dependencies if the Storybook file was kept within the app menu package. Once the integration with discover tabs is complete, it will be safe to delete the discover story and move the file back to app menu package.

[elasticmachine]

Pinging @elastic/appex-sharedux (Team:SharedUX)

[elasticmachine]

💛 Build succeeded, but was flaky

• Buildkite Build
• Commit: 02a4051
• Storybooks Preview

Failed CI Steps

• Scout: [ observability / observability_onboarding ] plugin

Test Failures

• [job] [logs] Scout: [ observability / observability_onboarding ] plugin / Navigates correctly within Kubernetes Host flow using the keyboard only
• [job] [logs] Scout: [ observability / observability_onboarding ] plugin / stateful - Onboarding UI Validation - Navigates correctly within Kubernetes Host flow using the keyboard only

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
core	523	539	+16
navigation	25	17	-8
total			+8

Public APIs missing comments

Total count of every public API that lacks a comment. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats comments for more detailed information.

id	before	after	diff
@kbn/core-chrome-app-menu	-	3	+3
@kbn/core-chrome-app-menu-components	-	42	+42
@kbn/core-chrome-browser	87	88	+1
total			+46

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
core	115.1KB	126.4KB	+11.3KB
navigation	8.9KB	0.0B	-8.9KB
total			+2.4KB

Public APIs missing exports

Total count of every type that is part of your API that should be exported but is not. This will cause broken links in the API documentation system. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats exports for more detailed information.

id	before	after	diff
@kbn/core	919	928	+9
navigation	6	5	-1
total			+8

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
core	497.9KB	498.9KB	+1.1KB
navigation	13.9KB	11.0KB	-2.9KB
total			-1.8KB

Unknown metric groups

API count

id	before	after	diff
@kbn/core-chrome-app-menu	-	6	+6
@kbn/core-chrome-app-menu-components	-	57	+57
@kbn/core-chrome-browser	191	194	+3
total			+66

async chunk count

id	before	after	diff
core	3	4	+1
navigation	1	0	-1
total			-0

ESLint disabled line counts

id	before	after	diff
@kbn/core-chrome-app-menu-components	-	1	+1

Total ESLint disabled count

id	before	after	diff
@kbn/core-chrome-app-menu-components	-	1	+1

History

• 💚 Build #377675 succeeded 786d2e1
• 💛 Build #376845 was flaky 5bdf15e
• 💛 Build #375870 was flaky a0b16dc
• 💔 Build #375768 failed 335291f
• 💔 Build #375753 failed 9bab8eb
• 💛 Build #374707 was flaky eac3549

cc @kowalczyk-krzysztof