Upgrade EUI to 13.6.0 by thompsongl · Pull Request #43916 · elastic/kibana

thompsongl · 2019-08-23T21:13:42Z

eui@13.3.0 ⏩ eui@13.6.0

Enhancement: The side nav bar can now be locked open. Space is adjusted in the main page area to allow all content to be seen (not hidden behind the nav). The user's choice to lock/unlock is stored in localStorage and will be honored on subsequent view changes and page reloads.
Fixes #33328

`13.6.0`

Revert conversion of EuiSwitch to button[role=switch] and TypeScript (#2255)

`13.5.0`

Fixed logoCloudEnterprise, logoLogging, and logoSecurity SVGs in EuiIcon to be center aligned (#2246)
Added locking behavior of EuiNavDrawer expanded state inluding the following props isLocked, onIsLockedUpdate (#2247)

`13.4.1`

Converted EuiSwitch to TypeScript (#2243)

Bug fixes

Added missing viewBox attribute to Docker, Kubernetes, and Redis logos (#2240)

`13.4.0`

Converted EuiFacetButton to TypeScript (#2226)
Added an optional onClear prop to the the EuiDatePicker component (#2235)
Added support for onClick and href props on EuiListGroupItem and converted to TypeScript (#1933)

Bug fixes

Fixed EuiSwitch semantics to align with aria roles (#2193)
Removed Firefox's focus ring to match other browsers (#2193)
Added missing onChange TS defs for EuiRange (#2211)
Fixed EuiBadge text cursor to default pointer (#2234)
Fixed EuiPageContent className prop to allow the passed-in className to take cascade precedence over classes generated by the component (#2237)

snide

Looks like the nav changes are safe. We'll want to change them to incorporate the new functionality, but it looks like as it right now they still work as they did previously. That means we can do the added stuff as a separate PR if this goes green and we want to merge it. Might want to triple check with @cchaos there though.

elasticmachine · 2019-08-23T22:45:28Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

snide

This will require some changes for the nav. We'll take care of it on monday.

cchaos · 2019-08-26T18:06:07Z

@thompsongl I could use your help here since we will actually need that onIsLockedUpdate function to traverse two levels up somehow. Essentially, looking at the DOM we need:

cchaos · 2019-08-26T18:07:12Z

Actually looking at it some more, it's possible we would just need the new class at the .header-global-wrapper level.

joshdover · 2019-08-26T20:19:48Z

It's worth mentioning that the hierarchy of these tags at the header / app-wrapper level are kind of a mess. I've been hitting up against this with moving some global UI to the New Platform.

I'd really like to clean up the hierarchy here and its associated CSS, but we've been afraid of breaking selectors in subtle ways.

That said, I think the solution of adding a class to the header-global-wrapper should "work" but only if you use a sibling selector: .header-global-wrapper.nav-drawer-locked + .app-wrapper. This is sorta limiting since it means we can't have any other tags between those components.

cchaos · 2019-08-26T20:54:04Z

@joshdover That was what I was thinking, but you can use the indirect sibling selector ~ so that it doesn't have to be directly next to, but at the same level of the .header-global-wrapper.

thompsongl · 2019-08-26T21:20:30Z

@cchaos The class name toggle is in place. I would imagine someone will have RxJS suggestions for me, but styling can be done at this point.

src/core/public/chrome/chrome_service.tsx

joshdover · 2019-08-26T21:25:41Z

@joshdover That was what I was thinking, but you can use the indirect sibling selector ~ so that it doesn't have to be directly next to, but at the same level of the .header-global-wrapper.

Ah right I forgot that selector existed. That should work fine for now then.

thompsongl · 2019-08-26T22:01:22Z

@joshdover Wrapper component added, no longer using an Observable for locked state.

src/core/public/chrome/ui/header.tsx

And updated BEM naming of `header-global-wrapper`

cchaos · 2019-08-26T22:37:46Z

@thompsongl PR4U: thompsongl#2

Made the changes during my CSS additions

src/core/public/chrome/ui/header.tsx

elasticmachine · 2019-08-26T23:04:22Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

elasticmachine · 2019-08-26T23:47:26Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

elasticmachine · 2019-08-27T00:31:50Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

snide

Just a quick question about the storage of the setting.

src/core/public/chrome/ui/header/header_wrapper.tsx

cchaos · 2019-08-27T12:28:13Z

@snide I noticed that too and also think that the only fix for it is to store the user preference somehow. However, I think that shouldn't hold up this PR from actually getting merged. But we should definitely make sure that functionality makes it into 7.4.

@spalger had created something a while back but it never got used. Maybe he can point us to the right files so we can get it hooked up.

joshdover · 2019-08-27T13:50:37Z

I don't think we need full-on user preferences that are stored in ES or anything. It seems to me localStorage would be fine?

snide · 2019-08-27T13:56:08Z

Yeah. Was just suggesting a basic react localstore to initialize the hook state.

…

On Tue, Aug 27, 2019, 6:51 AM Josh Dover ***@***.***> wrote: I don't think we need full-on user preferences that are stored in ES or anything. It seems to me localStorage would be fine? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#43916?email_source=notifications&email_token=AACPHJ6EQ2IF7C5CNJB2FHDQGUWNRA5CNFSM4IPDL3J2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD5HZUPA#issuecomment-525310524>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AACPHJ5FXBTPNXV3CJBTSOLQGUWNRANCNFSM4IPDL3JQ> .

thompsongl · 2019-08-27T14:43:04Z

localStorage now in use

cchaos

Awesome, LGTM. I found an issue where the title text for the icon was reversed, but have a PR up on EUI for this fix already. elastic/eui#2261

cchaos · 2019-08-27T15:14:21Z

We should probably mark this with release-note: enhancement and a note to the docs writers about the nav toggle

snide

Thanks folks. Much better!

src/core/public/chrome/ui/header/header_wrapper.tsx

elasticmachine · 2019-08-27T16:18:04Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

elasticmachine · 2019-08-27T18:10:46Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

cchaos · 2019-08-27T18:18:19Z

jenkins, test this

elasticmachine · 2019-08-27T19:47:21Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

* eui to 13.6.0 * euirange updates * euipage snapshot updates * add classname toggle for nav locking * new header wrapper component; removed observable * Add styles for locked nav And updated BEM naming of `header-global-wrapper` * move headerwrapper * isLocked localStorage * remove useEffect

fbaligand · 2019-09-04T06:13:26Z

I love the “lock side bar” button!
Thanks for this feature!

It solves my issue: #43019

thompsongl added 3 commits August 23, 2019 15:50

eui to 13.6.0

075445d

euirange updates

7af2a12

euipage snapshot updates

3350774

thompsongl added chore v8.0.0 release_note:skip Skip the PR/issue when compiling release notes v7.4.0 labels Aug 23, 2019

thompsongl requested review from chandlerprall and snide August 23, 2019 21:13

snide reviewed Aug 23, 2019

View reviewed changes

snide suggested changes Aug 23, 2019

View reviewed changes

Merge branch 'master' into eui/13.6.0

103ad47

add classname toggle for nav locking

7c862b7

thompsongl requested a review from a team as a code owner August 26, 2019 21:18

joshdover reviewed Aug 26, 2019

View reviewed changes

src/core/public/chrome/chrome_service.tsx Outdated Show resolved Hide resolved

new header wrapper component; removed observable

4bb1437

cchaos previously requested changes Aug 26, 2019

View reviewed changes

src/core/public/chrome/ui/header.tsx Outdated Show resolved Hide resolved

Add styles for locked nav

1885329

And updated BEM naming of `header-global-wrapper`

joshdover reviewed Aug 26, 2019

View reviewed changes

src/core/public/chrome/ui/header.tsx Show resolved Hide resolved

move headerwrapper

ec91c42

snide reviewed Aug 27, 2019

View reviewed changes

src/core/public/chrome/ui/header/header_wrapper.tsx Outdated Show resolved Hide resolved

thompsongl added 2 commits August 27, 2019 09:41

Merge branch 'master' into eui/13.6.0

924e02c

isLocked localStorage

fae3240

cchaos approved these changes Aug 27, 2019

View reviewed changes

thompsongl added release_note:enhancement and removed release_note:skip Skip the PR/issue when compiling release notes labels Aug 27, 2019

snide approved these changes Aug 27, 2019

View reviewed changes

thompsongl requested a review from joshdover August 27, 2019 15:39

joshdover reviewed Aug 27, 2019

View reviewed changes

src/core/public/chrome/ui/header/header_wrapper.tsx Outdated Show resolved Hide resolved

remove useEffect

2fe88cf

joshdover approved these changes Aug 27, 2019

View reviewed changes

thompsongl merged commit 084433f into elastic:master Aug 27, 2019

thompsongl mentioned this pull request Aug 27, 2019

[7.x] Upgrade EUI to 13.6.0 (#43916) #44146

Merged

ryankeairns mentioned this pull request Aug 29, 2019

Clean up unused navigation code for localStorage #44389

Closed

fbaligand mentioned this pull request Sep 4, 2019

Make side bar “expanded state” persistent #43019

Closed

Conversation

thompsongl commented Aug 23, 2019 • edited by cchaos Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

13.6.0

13.5.0

13.4.1

13.4.0

Uh oh!

snide left a comment

Choose a reason for hiding this comment

Uh oh!

elasticmachine commented Aug 23, 2019

💚 Build Succeeded

Uh oh!

snide left a comment

Choose a reason for hiding this comment

Uh oh!

cchaos commented Aug 26, 2019

Uh oh!

cchaos commented Aug 26, 2019

Uh oh!

joshdover commented Aug 26, 2019

Uh oh!

cchaos commented Aug 26, 2019

Uh oh!

thompsongl commented Aug 26, 2019 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

joshdover commented Aug 26, 2019

Uh oh!

thompsongl commented Aug 26, 2019

Uh oh!

Uh oh!

cchaos commented Aug 26, 2019

Uh oh!

Uh oh!

elasticmachine commented Aug 26, 2019

💚 Build Succeeded

Uh oh!

elasticmachine commented Aug 26, 2019

💚 Build Succeeded

Uh oh!

elasticmachine commented Aug 27, 2019

💚 Build Succeeded

Uh oh!

snide left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

cchaos commented Aug 27, 2019

Uh oh!

joshdover commented Aug 27, 2019

Uh oh!

snide commented Aug 27, 2019 via email

Uh oh!

thompsongl commented Aug 27, 2019

Uh oh!

cchaos left a comment

Choose a reason for hiding this comment

Uh oh!

cchaos commented Aug 27, 2019

Uh oh!

snide left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

elasticmachine commented Aug 27, 2019

💚 Build Succeeded

Uh oh!

elasticmachine commented Aug 27, 2019

💔 Build Failed

Uh oh!

cchaos commented Aug 27, 2019

Uh oh!

elasticmachine commented Aug 27, 2019

💚 Build Succeeded

Uh oh!

fbaligand commented Sep 4, 2019

Uh oh!

thompsongl commented Aug 23, 2019 •

edited by cchaos

Loading

`13.6.0`

`13.5.0`

`13.4.1`

`13.4.0`

thompsongl commented Aug 26, 2019 •

edited

Loading