Your window into the Elastic Stack
Find a file
Eyo O. Eyo 22e0545d0e
Redesign the "Add Panel" Experience (#183764)
## Summary

Closes https://github.com/elastic/kibana/issues/144418

This PR introduces changes to the dashboard add panel selection
functionality, so that panel selection would now happen from within a
flyout, and as such panels are now grouped together logically.

With this implementation any panel that is intended to show up within
this new flyout is required to have either been registered leveraging
the ui action trigger `ADD_PANEL_TRIGGER` and have it's `grouping` value
defined or belong to a subset of visualization types (`PROMOTED`,
`TOOLS`, and `LEGACY`) that would automatically get grouped.

It's worth pointing out that because we can't control the order at which
UI actions gets registered, we won't always get the the panel groups in
the same order, for this specific reason ~a new optional property
(`placementPriority`) has been added in~ the property `order` is now
leveraged such that it allows a user registering a UI action define a
relative weight for where they'd like their group to show up. All
registered actions would be rendered in descending order considering all
`order` defined, in the case where no order is defined `0` is assumed
for the group. In addition an action which is registered without a
group, would automatically get assigned into a default group titled
"Other".

The search implemented within the add panel is rudimentary, checking if
the group titles and group item titles contain the input character; when
a group title is matched the entire group is remains highlighted, in the
case that the group isn't matched and it's just the group item, only
said item is highlighted within it's group.

## Visuals

#### Default view
<img width="2560" alt="Screenshot 2024-06-10 at 17 44 17"
src="90aadf82-684a-4263-aecd-2843c3eff3c1">


#### Search match view
<img width="2560" alt="Screenshot 2024-06-10 at 17 45 11"
src="5a766f29-a3b7-40e3-b1f7-8b423073cd87">


##### P.S.

This changes also includes changes to the display of certain panels;
- ML group has a new title i.e. *Machine Learning and Analytics*
- In serverless, the observability panels (SLO*) only shows as a
selection choice in the observability project type.


### Checklist

Delete any items that are not applicable to this PR.

- [x] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
<!--
- [ ]
[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials
- [ ] [Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed
- [ ] If a plugin configuration key changed, check if it needs to be
allowlisted in the cloud and added to the [docker
list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)
-->
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [x] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [x] Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)


<!--
### Risk Matrix

Delete this section if it is not applicable to this PR.

Before closing this PR, invite QA, stakeholders, and other developers to
identify risks that should be tested prior to the change/feature
release.

When forming the risk matrix, consider some of the following examples
and how they may potentially impact the change:

| Risk | Probability | Severity | Mitigation/Notes |

|---------------------------|-------------|----------|-------------------------|
| Multiple Spaces&mdash;unexpected behavior in non-default Kibana Space.
| Low | High | Integration tests will verify that all features are still
supported in non-default Kibana Space and when user switches between
spaces. |
| Multiple nodes&mdash;Elasticsearch polling might have race conditions
when multiple Kibana nodes are polling for the same tasks. | High | Low
| Tasks are idempotent, so executing them multiple times will not result
in logical error, but will degrade performance. To test for this case we
add plenty of unit tests around this logic and document manual testing
procedure. |
| Code should gracefully handle cases when feature X or plugin Y are
disabled. | Medium | High | Unit tests will verify that any feature flag
or plugin combination still results in our service operational. |
| [See more potential risk
examples](https://github.com/elastic/kibana/blob/main/RISK_MATRIX.mdx) |


### For maintainers

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)
-->

---------

Co-authored-by: Catherine Liu <catherine.liu@elastic.co>
Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2024-06-26 13:55:28 -07:00
.buildkite [CI / FIPS] Convert smoke tests to use FIPS agent (#186858) 2024-06-26 12:55:51 -07:00
.github [eem] rename asset_manager to entity_manager (#186617) 2024-06-26 14:25:32 +02:00
api_docs [eem] rename asset_manager to entity_manager (#186617) 2024-06-26 14:25:32 +02:00
config [Index Management] Disable data stream stats in serverless (#186420) 2024-06-21 13:45:23 -07:00
dev_docs Update nav-kibana-dev.docnav.json (#186192) 2024-06-17 09:25:09 +00:00
docs [DOCS] Release notes for 8.14.2 (#186920) 2024-06-26 14:58:55 +00:00
examples Redesign the "Add Panel" Experience (#183764) 2024-06-26 13:55:28 -07:00
kbn_pm Replace deprecated node-sass with sass #2 (#173942) 2023-12-28 10:35:17 -06:00
legacy_rfcs rename @elastic/* packages to @kbn/* (#138957) 2022-08-18 08:54:42 -07:00
licenses build: remove requirement to clone open-source repo (#180715) 2024-04-15 15:10:46 -05:00
oas_docs [DOCS] Add SLO APIs to bundled OpenAPI document (#186575) 2024-06-20 19:49:05 -07:00
packages Redesign the "Add Panel" Experience (#183764) 2024-06-26 13:55:28 -07:00
plugins
scripts [HTTP/OAS] Commit OAS snapshot (#183338) 2024-05-30 06:02:19 -07:00
src Redesign the "Add Panel" Experience (#183764) 2024-06-26 13:55:28 -07:00
test Redesign the "Add Panel" Experience (#183764) 2024-06-26 13:55:28 -07:00
typings Remove legacy kibana react code editor (#171047) 2024-01-05 14:35:09 +01:00
x-pack Redesign the "Add Panel" Experience (#183764) 2024-06-26 13:55:28 -07:00
.backportrc.json chore(NA): adds 8.15 into backportrc (#181082) 2024-04-17 21:28:21 +01:00
.bazelignore Remove references to deleted .ci folder (#177168) 2024-02-20 19:54:21 +01:00
.bazeliskversion chore(NA): upgrade bazelisk into v1.11.0 (#125070) 2022-02-09 20:43:57 +00:00
.bazelrc chore(NA): use new and more performant BuildBuddy servers (#130350) 2022-04-18 02:01:38 +01:00
.bazelrc.common Transpile packages on demand, validate all TS projects (#146212) 2022-12-22 19:00:29 -06:00
.bazelversion chore(NA): revert bazel upgrade for v5.2.0 (#135096) 2022-06-24 03:57:21 +01:00
.browserslistrc Add Firefox ESR to browserlistrc (#184462) 2024-05-29 17:53:18 -05:00
.editorconfig
.eslintignore [ES|QL] New @kbn/esql-services package (#179029) 2024-03-27 14:39:48 +01:00
.eslintrc.js [GenAI][Integrations] UI for the custom integration creation with AI (#186304) 2024-06-21 19:19:05 +02:00
.gitattributes
.gitignore [Moving] Move APM and APM_Data_Access folders into /x-pack/observability_solution/ (#177433) 2024-02-23 09:56:21 -07:00
.i18nrc.json [Ingest Pipelines] Add unsaved changes prompt (#183699) 2024-06-07 20:35:56 +02:00
.node-version Upgrade Node.js to v20.13.1 (#183345) 2024-05-14 12:11:56 -07:00
.npmrc [npmrc] Fix puppeteer_skip_download configuration (#177673) 2024-02-22 18:59:01 -07:00
.nvmrc Upgrade Node.js to v20.13.1 (#183345) 2024-05-14 12:11:56 -07:00
.prettierignore
.prettierrc
.puppeteerrc Add .puppeteerrc (#179847) 2024-04-03 09:14:39 -05:00
.stylelintignore
.stylelintrc Bump stylelint to ^14 (#136693) 2022-07-20 10:11:00 -05:00
.telemetryrc.json [Telemetry] Fix telemetry-tools TS parser for packages (#149819) 2023-01-31 04:09:09 +03:00
.yarnrc
BUILD.bazel Transpile packages on demand, validate all TS projects (#146212) 2022-12-22 19:00:29 -06:00
catalog-info.yaml [BK] Add template for pipeline defs (#180189) 2024-04-08 11:21:28 +02:00
CODE_OF_CONDUCT.md
CONTRIBUTING.md Update doc slugs to improve analytic tracking, move to appropriate folders (#113630) 2021-10-04 13:36:45 -04:00
FAQ.md Fix small typos in the root md files (#134609) 2022-06-23 09:36:11 -05:00
fleet_packages.json [main] Sync bundled packages with Package Storage (#186399) 2024-06-18 11:41:16 -07:00
github_checks_reporter.json
kibana.d.ts fix all violations 2022-04-16 01:37:30 -05:00
LICENSE.txt
nav-kibana-dev.docnav.json Update nav-kibana-dev.docnav.json (#186192) 2024-06-17 09:25:09 +00:00
NOTICE.txt Copy assets from appropriate directory for kbn-monaco (#178669) 2024-03-21 16:29:20 +01:00
package.json Update dependency @launchdarkly/node-server-sdk to ^9.4.6 (main) (#187002) 2024-06-26 11:40:58 -07:00
preinstall_check.js Always throw error objects - never strings (#171498) 2023-11-20 09:23:16 -05:00
README.md [README] Update version Compatibility with Elasticsearch (#116040) 2022-01-10 10:31:21 -05:00
renovate.json chore(launchdarkly): Update renovate rule (#186979) 2024-06-26 09:08:57 -07:00
RISK_MATRIX.mdx Add "Risk Matrix" section to the PR template (#100649) 2021-06-02 14:43:47 +02:00
run_fleet_setup_parallel.sh [Fleet] Prevent concurrent runs of Fleet setup (#183636) 2024-05-31 16:38:51 +02:00
SECURITY.md
sonar-project.properties [ci] Run sonarqube daily (#173961) 2024-01-03 15:43:29 -06:00
STYLEGUIDE.mdx [styleguide] update path to scss theme (#140742) 2022-09-15 10:41:14 -04:00
tsconfig.base.json [eem] rename asset_manager to entity_manager (#186617) 2024-06-26 14:25:32 +02:00
tsconfig.browser.json
tsconfig.browser_bazel.json [build_ts_refs] improve caches, allow building a subset of projects (#107981) 2021-08-10 22:12:45 -07:00
tsconfig.json Transpile packages on demand, validate all TS projects (#146212) 2022-12-22 19:00:29 -06:00
TYPESCRIPT.md Fix small typos in the root md files (#134609) 2022-06-23 09:36:11 -05:00
versions.json [ci] Remove 8.13 (#186377) 2024-06-18 12:17:33 -05:00
WORKSPACE.bazel Upgrade Node.js to v20.13.1 (#183345) 2024-05-14 12:11:56 -07:00
yarn.lock Update dependency @launchdarkly/node-server-sdk to ^9.4.6 (main) (#187002) 2024-06-26 11:40:58 -07:00

Kibana

Kibana is your window into the Elastic Stack. Specifically, it's a browser-based analytics and search dashboard for Elasticsearch.

Getting Started

If you just want to try Kibana out, check out the Elastic Stack Getting Started Page to give it a whirl.

If you're interested in diving a bit deeper and getting a taste of Kibana's capabilities, head over to the Kibana Getting Started Page.

Using a Kibana Release

If you want to use a Kibana release in production, give it a test run, or just play around:

Building and Running Kibana, and/or Contributing Code

You might want to build Kibana locally to contribute some code, test out the latest features, or try out an open PR:

Documentation

Visit Elastic.co for the full Kibana documentation.

For information about building the documentation, see the README in elastic/docs.

Version Compatibility with Elasticsearch

Ideally, you should be running Elasticsearch and Kibana with matching version numbers. If your Elasticsearch has an older version number or a newer major number than Kibana, then Kibana will fail to run. If Elasticsearch has a newer minor or patch number than Kibana, then the Kibana Server will log a warning.

Note: The version numbers below are only examples, meant to illustrate the relationships between different types of version numbers.

Situation Example Kibana version Example ES version Outcome
Versions are the same. 7.15.1 7.15.1 💚 OK
ES patch number is newer. 7.15.0 7.15.1 ⚠️ Logged warning
ES minor number is newer. 7.14.2 7.15.0 ⚠️ Logged warning
ES major number is newer. 7.15.1 8.0.0 🚫 Fatal error
ES patch number is older. 7.15.1 7.15.0 ⚠️ Logged warning
ES minor number is older. 7.15.1 7.14.2 🚫 Fatal error
ES major number is older. 8.0.0 7.15.1 🚫 Fatal error

Questions? Problems? Suggestions?

  • If you've found a bug or want to request a feature, please create a GitHub Issue. Please check to make sure someone else hasn't already created an issue for the same topic.
  • Need help using Kibana? Ask away on our Kibana Discuss Forum and a fellow community member or Elastic engineer will be glad to help you out.