Commit graph

14 commits

Author SHA1 Message Date
Hannah Mudge
91635994fd
[Tech Debt] Remove deprecated EuiLoadingContent (#156316)
## Summary

This PR removes the deprecated `EuiLoadingContent` in favour of the new
`EuiSkeletonText` + `EuiSkeletonRectangle` components in all
Presentation-owned files.

cc @elastic/eui-team 


### Checklist

- [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)



### 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)
2023-05-03 08:01:37 -06:00
Catherine Liu
32de23bdb3
[Dashboard] Scroll to new panel (#152056)
## Summary

Closes #97064.

This scrolls to a newly added panel on a dashboard instead of remaining
at the top. The user can see the new panel without having to manually
scroll to the bottom.

~This also scrolls to the maximized panel when you minimize instead of
just throwing you back to the top of the dashboard.~ Note: Scrolling on
minimize will be addressed in a future PR.

This scrolling behavior also seems to work with portable dashboards
embedded in another apps, but it may require additional work on the
consumer to call `scrollToPanel` in the appropriate callbacks when
adding panels.

#### Scrolls to newly added panel and shows a success border animation

![Apr-18-2023
07-40-41](https://user-images.githubusercontent.com/1697105/232812491-5bf3ee3a-c81d-4dd3-8b04-67978da3b9a8.gif)

#### Scrolls to panel on return from editor
![Apr-18-2023
07-56-35](https://user-images.githubusercontent.com/1697105/232817401-6cfd7085-91b6-4f05-be1c-e47f6cc3edab.gif)

#### Scrolls to panel clone
![Apr-18-2023
07-54-43](https://user-images.githubusercontent.com/1697105/232816928-2b473778-76e1-4781-8e51-f9e46ab74b9b.gif)

#### Scrolling in portable dashboards example

![Apr-18-2023
08-13-14](https://user-images.githubusercontent.com/1697105/232822632-ffcbd9ad-9cad-4185-931c-a68fbf7e0fbe.gif)



### Checklist

Delete any items that are not applicable to this PR.

- [ ] 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
- [ ] [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
- [ ] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [ ] 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))
- [ ] 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)
- [ ] 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))
- [ ] 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—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—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: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Hannah Mudge <Heenawter@users.noreply.github.com>
2023-04-24 12:40:48 -07:00
Devon Thomson
ffc349225e
[Analyst Experience Components] Dashboard & Control Group APIs (#150121)
Aligns the Portable Dashboard renderer and the Control Group renderer to a new API structure using `useImperativeHandle` rather than the overcomplicated and mostly unused wrapper provider system.
2023-04-19 15:34:39 -04:00
Jatin Kathuria
6d8d1708fe
[Control Group] Add override options of openAddDataControlFlyout (#153007)
## Summary

This PR adds the option to provide, custom props when calling
`openAddDataControlFlyout`. For example, users of the API may want
different placeholder than default for any new options list that is
added.

Currently, in security solution, we need a custom placeholder for newly
added controls. Hence, this PR. Please let me know if this is not the
best way to do this.



https://user-images.githubusercontent.com/7485038/232775198-a111d711-ffba-4d26-8c70-c2af08008e05.mov
2023-04-19 16:58:48 +02:00
Hannah Mudge
b6fb66017b
[Dashboard] [Controls] Use uiActions for control hover actions (#153065)
Closes https://github.com/elastic/kibana/issues/143585
Closes https://github.com/elastic/kibana/issues/151767
Closes https://github.com/elastic/kibana/issues/152609

## Summary
This PR accomplishes three things, the first of which is moving the
edit/delete control hover actions to use the `uiActions` service - this
is the first step in moving existing panel actions (such as replacing
the panel, opening the panel settings flyout, etc.) to this hover
framework, which is outlined in
[this](https://github.com/elastic/kibana/issues/151233) issue.

While this was the primary goal of this PR, this also made the following
fixes possible:
1. Since I was refactoring the control editor flyout code as part of
this PR, I made it so that changes to the control's width/grow
properties are **only applied** when the changes are **saved** rather
than being automatically applied.

    | Before            | After |
    | ------------- | ------------- |
| ![Mar-14-2023
13-05-36](https://user-images.githubusercontent.com/8698078/225110954-d443f76b-4ac7-476c-b5b7-9af082d187fd.gif)
| ![Mar-14-2023
13-06-41](https://user-images.githubusercontent.com/8698078/225111172-ab9cce7e-7a70-45e4-ab06-5a87c053fb95.gif)
|
  


2. Since the edit control button is no longer a custom component, the
tooltip now responds to focus as expected.

    | Before            | After |
    | ------------- | ------------- |
| ![Mar-14-2023
13-05-36](https://user-images.githubusercontent.com/8698078/225113458-fe8f05fb-d56c-437a-b625-2a336bb4ba29.gif)
| ![Mar-14-2023
13-06-41](https://user-images.githubusercontent.com/8698078/225113313-d8cb7fcc-f611-48d0-83b4-f6fd147ce0ae.gif)
|


### Checklist

- [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)
- [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 was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)


### 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: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2023-03-21 08:47:40 -06:00
Devon Thomson
f77f924a2a
[Control Group] Add Button & Minimal Editor Settings (#151161)
Adds an "add" button that shows up to the right of the Control Group if
configured. Also adds a system for fetching settings from consumers, and
adds settings that can hide or show pieces of the Control editor flyout.
2023-02-23 13:45:20 -06:00
Hannah Mudge
27dda79627
[Portable Dashboards] Add portable dashboard example plugin (#148997)
Closes https://github.com/elastic/kibana/issues/145427

## Summary

This PR adds an example plugin that demonstrates a few uses of the new
portable dashboards. It includes the following examples:
1. A by-value dashboard with controls

![Feb-07-2023
11-41-13](https://user-images.githubusercontent.com/8698078/217336429-d4bbd7be-a453-45f1-a008-6046d58874b6.gif)

2. A by-value empty dashboard that allows panels (both by-value and
by-reference) to be added where the state can be saved to local storage

![Feb-07-2023
11-43-37](https://user-images.githubusercontent.com/8698078/217336922-48348617-1fdf-445a-851a-3507c6920805.gif)

3. Two side-by-side by-value empty dashboards with independent redux
states

![Feb-07-2023
11-45-57](https://user-images.githubusercontent.com/8698078/217337433-8e00b24f-3363-4ff0-a2bd-5fa15c736d08.gif)

4. A static, by-reference dashboard


![StaticByRefernece](https://user-images.githubusercontent.com/8698078/217340227-5b8ac1ab-0cdc-4ff4-8fb8-2b2792fa3959.png)

5. A static, by-value dashboard


![StaticByValue](https://user-images.githubusercontent.com/8698078/217339782-c4ab2a4c-6c62-4045-a823-648befc6959f.png)


As part of this, I created a new demo embeddable type - the
`FilterDebuggerEmbeddable` which, when added to a dashboard, will
display the filters + query that it is receiving as an input. You can
see how this embeddable works in the GIF for the first example above.

### Checklist

- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

### 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: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2023-02-10 13:21:53 -07:00
Spencer
1b85815402
[packages] migrate all plugins to packages (#148130)
Fixes https://github.com/elastic/kibana/issues/149344

This PR migrates all plugins to packages automatically. It does this
using `node scripts/lint_packages` to automatically migrate
`kibana.json` files to `kibana.jsonc` files. By doing this automatically
we can simplify many build and testing procedures to only support
packages, and not both "packages" and "synthetic packages" (basically
pointers to plugins).

The majority of changes are in operations related code, so we'll be
having operations review this before marking it ready for review. The
vast majority of the code owners are simply pinged because we deleted
all `kibana.json` files and replaced them with `kibana.jsonc` files, so
we plan on leaving the PR ready-for-review for about 24 hours before
merging (after feature freeze), assuming we don't have any blockers
(especially from @elastic/kibana-core since there are a few core
specific changes, though the majority were handled in #149370).

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2023-02-08 21:06:50 -06:00
Tiago Costa
e38350f7f9
chore(NA): upgrades uuid to v9.0.0 (#149135)
This PR upgrades uuid into its latest version `9.0.0`.
The previous default used version `v4` was kept where it was previously
used and places using `v1` or `v5` are still using it.

In this latest version they removed the deep import feature and as we
are not using tree shaking it increased our bundles by a significant
size. As such, I've moved this dependency into the `ui-shared-deps-npm`
bundle.

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2023-01-19 19:48:07 +00:00
Nathan Reese
36a3d6915c
[controls] Edit and save example (#147897)
Part of https://github.com/elastic/kibana/issues/145428

PR does the following:
* Removes ControlsCallout
* Cleans up ControlGroupContainer API to avoid leaking Dashboard
implementation details
    * Removes getCreateControlButton method
    * Removes getCreateTimeSliderControlButton
    * Removes getToolbarButtons
    * Adds openAddDataControlFlyout
* Add Edit and save example  

<img width="600" alt="Screen Shot 2022-12-21 at 9 29 21 AM"
src="https://user-images.githubusercontent.com/373691/208928858-94984880-3fdb-45f4-bb2a-a086bfc440d0.png">

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2023-01-03 16:47:42 -05:00
Spencer
afb09ccf8a
Transpile packages on demand, validate all TS projects (#146212)
## Dearest Reviewers 👋 

I've been working on this branch with @mistic and @tylersmalley and
we're really confident in these changes. Additionally, this changes code
in nearly every package in the repo so we don't plan to wait for reviews
to get in before merging this. If you'd like to have a concern
addressed, please feel free to leave a review, but assuming that nobody
raises a blocker in the next 24 hours we plan to merge this EOD pacific
tomorrow, 12/22.

We'll be paying close attention to any issues this causes after merging
and work on getting those fixed ASAP. 🚀

---

The operations team is not confident that we'll have the time to achieve
what we originally set out to accomplish by moving to Bazel with the
time and resources we have available. We have also bought ourselves some
headroom with improvements to babel-register, optimizer caching, and
typescript project structure.

In order to make sure we deliver packages as quickly as possible (many
teams really want them), with a usable and familiar developer
experience, this PR removes Bazel for building packages in favor of
using the same JIT transpilation we use for plugins.

Additionally, packages now use `kbn_references` (again, just copying the
dx from plugins to packages).

Because of the complex relationships between packages/plugins and in
order to prepare ourselves for automatic dependency detection tools we
plan to use in the future, this PR also introduces a "TS Project Linter"
which will validate that every tsconfig.json file meets a few
requirements:

1. the chain of base config files extended by each config includes
`tsconfig.base.json` and not `tsconfig.json`
1. the `include` config is used, and not `files`
2. the `exclude` config includes `target/**/*`
3. the `outDir` compiler option is specified as `target/types`
1. none of these compiler options are specified: `declaration`,
`declarationMap`, `emitDeclarationOnly`, `skipLibCheck`, `target`,
`paths`

4. all references to other packages/plugins use their pkg id, ie:
	
	```js
    // valid
    {
      "kbn_references": ["@kbn/core"]
    }
    // not valid
    {
      "kbn_references": [{ "path": "../../../src/core/tsconfig.json" }]
    }
    ```

5. only packages/plugins which are imported somewhere in the ts code are
listed in `kbn_references`

This linter is not only validating all of the tsconfig.json files, but
it also will fix these config files to deal with just about any
violation that can be produced. Just run `node scripts/ts_project_linter
--fix` locally to apply these fixes, or let CI take care of
automatically fixing things and pushing the changes to your PR.

> **Example:** [`64e93e5`
(#146212)](64e93e5806)
When I merged main into my PR it included a change which removed the
`@kbn/core-injected-metadata-browser` package. After resolving the
conflicts I missed a few tsconfig files which included references to the
now removed package. The TS Project Linter identified that these
references were removed from the code and pushed a change to the PR to
remove them from the tsconfig.json files.

## No bazel? Does that mean no packages??
Nope! We're still doing packages but we're pretty sure now that we won't
be using Bazel to accomplish the 'distributed caching' and 'change-based
tasks' portions of the packages project.

This PR actually makes packages much easier to work with and will be
followed up with the bundling benefits described by the original
packages RFC. Then we'll work on documentation and advocacy for using
packages for any and all new code.

We're pretty confident that implementing distributed caching and
change-based tasks will be necessary in the future, but because of
recent improvements in the repo we think we can live without them for
**at least** a year.

## Wait, there are still BUILD.bazel files in the repo
Yes, there are still three webpack bundles which are built by Bazel: the
`@kbn/ui-shared-deps-npm` DLL, `@kbn/ui-shared-deps-src` externals, and
the `@kbn/monaco` workers. These three webpack bundles are still created
during bootstrap and remotely cached using bazel. The next phase of this
project is to figure out how to get the package bundling features
described in the RFC with the current optimizer, and we expect these
bundles to go away then. Until then any package that is used in those
three bundles still needs to have a BUILD.bazel file so that they can be
referenced by the remaining webpack builds.

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2022-12-22 19:00:29 -06:00
Nathan Reese
b5d3a63516
[controls] add filters, query, and timeRange props to ControlGroupRenderer and create search example (#147581)
Part of https://github.com/elastic/kibana/issues/145428

PR makes the following changes:
1) updates ControlGroupRenderer component with declarative properties
for filters, query, and timeRange.
2) creates a search example showing how to use controls to narrow
results
3) Updates redux example to use web logs sample data set
4) Updates existing uses of ControlGroupRenderer to use new props.

<img width="600" alt="Screen Shot 2022-12-14 at 4 29 58 PM"
src="https://user-images.githubusercontent.com/373691/207719012-28771203-27c3-45c0-a8ac-2bf96c10f641.png">

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2022-12-19 13:44:39 -05:00
Nathan Reese
15ed59d6f0
[controls] complete control input builder API (#146764)
ControlGroupRenderer API changes
* Added parameter `initialInput: Partial<ControlGroupInput>,` to
getCreationOptions method signature so consumers don't need to call
`getDefaultControlGroupInput`
* Rename prop onEmbeddableLoad -> onLoadComplete
* Rename prop getCreationOptions -> getInitialInput

controlGroupInputBuilder API changes
* Added `addOptionsListControl` method that allows users to pass
selectedOptions
* Added `addRangeSliderControl`
* Added `addTimeSliderControl`

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Devon Thomson <devon.thomson@elastic.co>
2022-12-01 16:38:43 -07:00
Hannah Mudge
bb91749f0c
[Controls] [Portable Dashboards] Add control group renderer example plugin (#146189)
Closes https://github.com/elastic/kibana/issues/145429

## Summary

This PR expands on the control group building block by 
1. Replacing the old `input` declarative API and replacing it with a
`getCreationOptions` callback
2. Exposing the redux embeddable tools to the consumer

As part of this, I created an example plugin to demonstrate some of the
new functionality 👍

![Nov-23-2022
10-27-08](https://user-images.githubusercontent.com/8698078/203611035-a9633929-2a49-4d06-b38f-fcf90d8fa885.gif)


Also, to avoid some code duplication, I had to move some code to the
generic `control_group_helpers.tsx` so that both the controls plugin and
the new example plugin could use it.

### Checklist

- [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)

### 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)
2022-11-24 14:00:49 -07:00