Tim Sullivan
|
0c680d7783
|
Project Side Navigation: Use EuiCollapsibleNavBeta component (#164910)
## Summary
Closes https://github.com/elastic/kibana/issues/162507
Relates to https://github.com/elastic/kibana/issues/166545
^ additional IA-related tasks - related to the alignment discussions -
can be found here
## Work for next steps
In this PR, some work items are being saved for a next PR:
1. _Only affects Search solution_: Navigation "group titles" do not
create a breadcrumb item, as sub-items in the group are not
hierarchically under the title. To address this, group titles may be
going away from the design.
https://github.com/elastic/kibana/issues/167323
2. _Only affects Observability solution_: Navigation accordions can not
be collapsed and do not show arrow icons. To address this, in a later PR
we will add internal state management for the open/closed state of each
accordion. https://github.com/elastic/kibana/issues/167328
3. _Affects all solutions:_ The "collapsed" state of the side nav should
show a docked view with icons-only. To address this, in later PRs we
will bring Security solution into the unified nav components.
4. https://github.com/elastic/kibana/issues/167326
5. https://github.com/elastic/kibana/issues/167330
6. https://github.com/elastic/kibana/issues/167332
### Recordings
These videos show a before-and-after with the new UI.
| project | old | new |
|--|--|--|
|observability|
663765a3-4e4b-416e-b7d5-7d87eece83e8
| <img width="298" alt="CleanShot 2023-09-22 at 14 20 48@2x"
src="d61f6fe0-a6a9-4806-bc27-08b0ff2afb49">
|
|search|
f383773e-27a8-4485-8289-274d8231b960
| <img width="281" alt="CleanShot 2023-09-22 at 14 18 43@2x"
src="901b8fc1-9945-4cee-b566-5e4539f08043">
|
|security|
481f4533-64e5-41db-bc8e-5012f82c188a
| *will change to the new style after this PR and the flyout/panel
support are completed |
### 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
- [ ] 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))
- [ ] 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: Sébastien Loix <sebastien.loix@elastic.co>
|
2023-09-27 14:22:46 -07:00 |
|
