## Summary
Part of https://github.com/elastic/kibana/issues/138222
in @types/react@18 types
https://github.com/DefinitelyTyped/DefinitelyTyped/pull/56210. This PR
addresses a bunch of remaining fixes **(hopefully the last mass ping PR
like this)** The most common are:
### 1 Objects are no longer considered a valid ReactNode
In types@17 the ReactNode typing was too soft, it allowed objects and
functions being passed as ReactNode, e.g.
```
let obj: React.ReactNode = {};
let func: React.ReactNode = () => {};
```
This was by mistake, and this PR mutes most of such cases by simply
casting to a `string` or `ReactNode`.
In some cases, it is worth to follow up and address the raised issues in
a better way (see in comments)
```diff
function MyComponent() {
const error: string | Error = 'Error'
return (
<div>
- {error}
+ {error as string}
</div>
)
}
```
Most common problems are related to rendering errors, where it could be
`string | Error` object rendered directly as a ReactNode. Most often it
is related to alerting framework:
```
export interface RuleFormParamsErrors {
[key: string]: string | string[] | RuleFormParamsErrors;
}
```
Not sure if there is a better fix then casting, surely not short-term.
### 2 More `useCallback` implicit any fixes
Follow up to https://github.com/elastic/kibana/pull/191659
### 3 `EuiSelect` doesn't have a placeholder prop
In a couple of places, the `placeholder` prop was removed. This is
because react types were updated and `placeholder` was removed from the
base HTML element, so it highlighted places where `placeholder` prop was
redundant
## Summary
Upgrades `@testing-library/user-event` to `^14.5.2`. See the release
notes for `v14` for breaking changes:
https://github.com/testing-library/user-event/releases/tag/v14.0.0
I was facing an
[issue](https://github.com/testing-library/user-event/issues/662) with
`v13.5.0` with `userEvent.click()` in a PR
(https://github.com/elastic/kibana/pull/189729) and was able to verify
that `v14.4.3` onwards fixes it so I decided to update that package.
What a rabbit hole 😅 !
- In `user-event` `v14` events return a promise, so this PR updates
usage of the likes of `userEvent.click` with `await userEvent.click`.
Regex to search for `userEvent` calls that miss `await` except `.setup`:
`(?<!await\s)userEvent\.(?!setup\b)`
- The way to handle pointer events needed changing from `, undefined, {
skipPointerEventsCheck: true });` to `, { pointerEventsCheck: 0 });`.
- I tried a bit to do the refactor with codemods, but there were quite
some edge cases so it ended up being done manually.
- I looked into all failing tests and tried my best to update them, but
for some of them I lacked the context to make them work again. If you're
a code owner and find a skipped test in this PR please give it a try to
fix and push in this PR or let me know if it's fine for you to fix in
follow ups.
List of files where I had to skip tests (`git diff main...HEAD
-G'\.skip' --name-only`):
### `packages/kbn-dom-drag-drop`
- `packages/kbn-dom-drag-drop/src/droppable.test.tsx`
### `x-pack/plugins/cases`
- `x-pack/plugins/cases/public/components/templates/form.test.tsx`
-
`x-pack/plugins/cases/public/components/user_actions/user_actions_list.test.tsx`
### `x-pack/plugins/cloud_security_posture`
-
`x-pack/plugins/cloud_security_posture/public/components/fleet_extensions/policy_template_form.test.tsx`
### `x-pack/plugins/lens`
-
`x-pack/plugins/lens/public/datasources/form_based/dimension_panel/format_selector.test.tsx`
### `x-pack/plugins/observability_solution`
-
`x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/request_body_field.test.tsx`
### `x-pack/plugins/security_solution`
-
`x-pack/plugins/security_solution/public/management/components/console/components/command_input/integration_tests/command_input.test.tsx`
-
`x-pack/plugins/security_solution/public/management/components/endpoint_responder/command_render_components/integration_tests/kill_process_action.test.tsx`
-
`x-pack/plugins/security_solution/public/management/components/endpoint_responder/command_render_components/integration_tests/release_action.test.tsx`
-
`x-pack/plugins/security_solution/public/management/components/endpoint_responder/command_render_components/integration_tests/status_action.test.tsx`
-
`x-pack/plugins/security_solution/public/management/components/endpoint_responder/command_render_components/integration_tests/upload_action.test.tsx`
-
`x-pack/plugins/security_solution/public/management/components/endpoint_response_actions_list/integration_tests/response_actions_log.test.tsx`
-
`x-pack/plugins/security_solution/public/management/pages/event_filters/view/components/event_filters_flyout.test.tsx`
-
`x-pack/plugins/security_solution/public/management/pages/response_actions/view/response_actions_list_page.test.tsx`
----
I plan to do a talk on Kibana Demo Days to walk through some of the
breaking changes and learnings.
### Checklist
- [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
- [ ] [Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed
- [x] 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)
## Summary
Fixes needed for getting CI to pass when EUI throws an error if
attempting to render a component without the EuiProvider in the render
tree.
## Detailed description
In https://github.com/elastic/kibana/pull/180819, I will deliver a
change that will cause EUI components to throw an error if the
EuiProvider context is missing. This PR comes in as part of the final
work to get all functional tests passing in an environment where EUI
will throw the error. The tied to the ["Fix 'dark mode' inconsistencies
in Kibana" Epic](https://github.com/elastic/kibana-team/issues/805) has
so far been in preparation for this.
**Reviewers: Please interact with critical paths through the UI
components touched in this PR, ESPECIALLY in terms of testing dark mode
and i18n.**
<img width="1107" alt="image"
src="c0d2ce08-ac35-45a7-8192-0b2256fceb0e">
### Checklist
Delete any items that are not applicable to this PR.
- [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
- [ ] 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)
---------
Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
## Summary
The `toMountPoint` module from `@kbn/kibana-react-plugin/public` is
deprecated. Many areas of code need to include it and provide it as a
required prop of `TableListViewKibanaProvider`. This PR resolves that:
it shouldn't need to be a required prop anywhere, since it is a
stateless component and can be included as-needed.
This PR also updates the inclusion of `toMountPoint` to use the
non-deprecated source, which is `@kbn/react-kibana-mount`. As a side
effect of that, some consumers need to update the `core` property being
passed, to ensure it includes the `analytics`, `i18n` and `theme`
services.
### Checklist
Delete any items that are not applicable to this PR.
- [ ] [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
---------
Co-authored-by: Anton Dosov <anton.dosov@elastic.co>
## Summary
Close https://github.com/elastic/kibana/issues/176536
Close https://github.com/elastic/kibana/issues/176742
### Links to legacy visualization editors are once again disabled
<img width="208" alt="Screenshot 2024-02-14 at 10 19 52 AM"
src="711f5372-d7f6-4f0d-88c6-605e528d6f13">
### A better message in the inspector
<img width="685" alt="Screenshot 2024-02-14 at 10 23 25 AM"
src="734a8f6a-0f00-46c7-8d27-2a86a24cf7ab">
### Checklist
Delete any items that are not applicable to this PR.
- [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
---------
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Stratoula Kalafateli <efstratia.kalafateli@elastic.co>
## Summary
close https://github.com/elastic/kibana/issues/161545
close https://github.com/elastic/kibana/issues/153257
This PR makes `SavedObjectFinder` component backward compatible. It is
achieved by going through content- management layer, more technical
details
[here](https://docs.google.com/document/d/1ssYmqSEUPrsuCR4iz8DohkEWekoYrm2yL4QR_fVxXLg/edit)
### Testing
`SavedObjectFinder` is this component that allows to pick a saved object
(supports: `search` `index-pattern` `map` `visualization` `lens`
`event-annotation-group`:
It is used in the following places:
- Dashboard
- Add panel
- Replace panel
- Discover - Open Search
- Visualization - Select search as a source for new viz
- Graph - select source
- Cases - markdown editor add lens
- ML (3 places)
- Canvas - select embeddable panel
- Transform
- Lens > select event annotation
### Risks / Follow up
The `SavedObjectFinder` should stay mostly the same, the only notable
functional change is that now `SavedObjectFinder` doesn't support
`includeFields` which allowed partial saved object returns, this was
done to make the call backward-compatible without making the system even
more complicated as otherwise we'll need a way to abstract
`includeFields` from so attributes and allow to run migrations on it
before making a search. follow up issue to bring it back
https://github.com/elastic/kibana/issues/163043
The risk with that is that some client that have a lot of large objects
might run into performance issues when using `SavedObjectFinder`. This
can be mitigated by changing listing limit in advanced setting from
default 1000 to something lower
## Summary
Why?
To simplify the process of migration to react-router@6.
https://github.com/remix-run/react-router/discussions/8753
What problems exactly it solves?
- In my previous PR I added `CompatRouter`
https://github.com/elastic/kibana/pull/159173, which caused changes in
~50 files and pinged 15 Teams. And this is just meant to be a temporary
change, so when we're done with the migration I would have to revert
these changes and engage everyone to review the PR again. And it is just
a single step in the migration strategy. So to make our lives easier I
think it would be better to have a common place where we do import our
router components because it will allow us to surface some extra logic
in single place instead of going through the whole source code again.
- `react-router@6` doesn't support a custom `Route` component, so that
means our custom `Route` component that we're using almost everywhere
today, will need to be replaced by a different solution. I have decided
to add `Routes` component, which will be responsible for rendering the
proper component (`react-router@6` renamed `Switch` to `Routes`, so I
have named this component to align with the dictionary of the new
router) and also is going to add the logic that today is done in `Route`
(moving logic to `Routes` will be done in the follow-up PR, here I just
wanted to focus on using the common router components to make the review
process easier)
---------
Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
## Summary
Part of https://github.com/elastic/kibana/issues/152224
Follow up to https://github.com/elastic/kibana/issues/153256
This PR onboards maps CM integration into the multi-type search
(`msearch`). It isn't actually used anywhere in the user-facing UI yet,
as first other types need to be migrated to CM.
This PR also adds an example app to test the `msearch` end-to-end.
## Summary
Partially addresses https://github.com/elastic/kibana/issues/152224
[Tech Doc
(private)](https://docs.google.com/document/d/1ssYmqSEUPrsuCR4iz8DohkEWekoYrm2yL4QR_fVxXLg/edit#heading=h.6sj4n6bjcgp5)
Introduce `mSearch` - temporary cross-content type search layer for
content management backed by `savedObjects.find`
Until we have [a dedicated search layer in CM
services](https://docs.google.com/document/d/1mTa1xJIr8ttRnhkHcbdyLSpNJDL1FPJ3OyK4xnOsmnQ/edit),
we want to provide a temporary solution to replace client-side or naive
server proxy usages of `savedObjects.find()` across multiple types with
Content Management API to prepare these places for backward
compatibility compliance.
Later we plan to use the new API together with shared components that
work across multiple types like `SavedObjectFinder` or `TableListView`
The api would only work with content types that use saved objects as a
backend.
To opt-in a saved object backed content type to `mSearch` need to
provide `MSearchConfig` on `ContentStorage`:
```
export class MapsStorage implements ContentStorage<Map> {
// ...
mSearch: {
savedObjectType: 'maps',
toItemResult: (ctx: StorageContext, mapsSavedObject: SavedObject<MapsAttributes>) => toMap(ctx,mapsSavedObject), // transform, validate, version
additionalSearchFields: ['something-maps-specific'],
}
}
```
*Out of scope of this PR:*
- tags search (will follow up shortly)
- pagination (as described in [the doc]([Tech
Doc](https://docs.google.com/document/d/1ssYmqSEUPrsuCR4iz8DohkEWekoYrm2yL4QR_fVxXLg/edit#heading=h.6sj4n6bjcgp5))
server-side pagination is not needed for the first consumers, but will
follow up shortly)
- end-to-end / integration testing (don't want to introduce a dummy
saved object for testing this, instead plan to wait for maps CM onboard
and test using maps https://github.com/elastic/kibana/pull/153304)
- Documentation (will add into
https://github.com/elastic/kibana/pull/154453)
- Add rxjs and hook method
## Summary
Close https://github.com/elastic/kibana/issues/152002
In https://github.com/elastic/kibana/pull/151163 we introduced a simple
demo todo app run in a storybook with a custom client-side content
management client (no server-side cm registry usage).
This is a follow-up PR that re-uses the same demo todo app, but also
runs it in an example plugin with proper server-side content management
registry usage, so now we have a basic end-to-end demonstration of
content management capabilities. The demo app is covered by functional
tests, so now we also have basic end-to-end test coverage.
As this is the first kind of real-world end-to-end usage of the CM APIs,
I'd like to use this and
[previous](https://github.com/elastic/kibana/pull/151163) prs as a base
for the discussion and polishing current APIs. I'll leave a review with
comments where I think some API polishing is needed.
**Notable changes apart from the example plugin itself:**
1. Move `demo/` todo app and its stories introduced in
https://github.com/elastic/kibana/pull/151163 from
`src/plugins/content_management` to
`examples/content_management_examples`. This was mostly needed to not
export `demo/` code on the public plugin export to avoid increasing
bundle size.
2. Add needed exports to the plugin contract
3. Reshuffle `common/` to not import `@kbn/schema` client side
48aa41403b
4. Fix client-side RPC client to work with the latest server-side
changes (shouldn't break from now on because of the end-to-end test
coverage)
