Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Stack Monitoring] Elasticsearch Overview view migration #111941

Merged
merged 11 commits into from
Sep 15, 2021

Conversation

estermv
Copy link
Contributor

@estermv estermv commented Sep 13, 2021

Summary

This PR is part of #111756

It migrates the Elasticsearch Overview page to react and adds an elasticsearch template that contains the tabs for all the Elaticsearch views.
It also migrates the onBrush event callback so it can be reused on different views.
NOTE: when the URL changes dates (zoom out link / browser go back arrow), these changes are not reflected in the datepicker. I opened a separate bug #112063 to fix this (details in that issue to come)

@estermv estermv added v8.0.0 Team:Infra Monitoring UI - DEPRECATED DEPRECATED - Label for the Infra Monitoring UI team. Use Team:obs-ux-infra_services release_note:skip Skip the PR/issue when compiling release notes Feature:Stack Monitoring auto-backport Deprecated - use backport:version if exact versions are needed v7.16.0 Epic: Stack Monitoring de-angularization labels Sep 13, 2021
@estermv estermv marked this pull request as ready for review September 13, 2021 17:30
@estermv estermv requested a review from a team as a code owner September 13, 2021 17:30
@estermv estermv requested review from a team September 13, 2021 17:30
@elasticmachine
Copy link
Contributor

Pinging @elastic/logs-metrics-ui (Team:logs-metrics-ui)

Comment on lines +30 to +32
if (onBrushHappenedRef.current) {
setOnBrushHappened(false);
} else {
Copy link
Contributor Author

@estermv estermv Sep 14, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The pop state event is also fired when the onBrush event is fired, and I couldn't find out why this happens. So I added a flag to know when the onBrush event is fired to prevent changing the zoom level at the wrong moment.
In Angular, this was handled by removing the listener before updating the state and adding it again after some milliseconds, but the same trick didn't work in React.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Interesting. Might be good to capture this in a code comment.

Copy link
Contributor

@matschaffer matschaffer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me overall. I'll hook it up to a cloud QA cluster to check logs and additional tabs before approving.

Comment on lines +30 to +32
if (onBrushHappenedRef.current) {
setOnBrushHappened(false);
} else {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Interesting. Might be good to capture this in a code comment.

Copy link
Contributor

@matschaffer matschaffer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Screen Shot 2021-09-15 at 13 35 24

Looks solid here. Let's go for it. We can add code comments later, and maybe by then we'll even have worked out way to not have the pop/brush ref handling.

@kibanamachine
Copy link
Contributor

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
monitoring 578 581 +3

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
monitoring 774.9KB 783.1KB +8.2KB

History

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

@estermv estermv merged commit a949cc8 into elastic:master Sep 15, 2021
kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Sep 15, 2021
)

* Elasticsearch overview first version

* Fix timezone in react components

* Extraxt on brush behaviour from elasticsearch overview page

* Fix overview component type

* Add elasticsearch pages template with some tabs

* Conditionally add some tabs for elasticsearch pages

* fix import and types

* Filter angular errors in react

* remove disabled property from tabs

* Add comment
@kibanamachine
Copy link
Contributor

💚 Backport successful

Status Branch Result
7.x

This backport PR will be merged automatically after passing CI.

kibanamachine added a commit that referenced this pull request Sep 15, 2021
…112233)

* Elasticsearch overview first version

* Fix timezone in react components

* Extraxt on brush behaviour from elasticsearch overview page

* Fix overview component type

* Add elasticsearch pages template with some tabs

* Conditionally add some tabs for elasticsearch pages

* fix import and types

* Filter angular errors in react

* remove disabled property from tabs

* Add comment

Co-authored-by: Ester Martí Vilaseca <ester.martivilaseca@elastic.co>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
auto-backport Deprecated - use backport:version if exact versions are needed Epic: Stack Monitoring de-angularization Feature:Stack Monitoring release_note:skip Skip the PR/issue when compiling release notes Team:Infra Monitoring UI - DEPRECATED DEPRECATED - Label for the Infra Monitoring UI team. Use Team:obs-ux-infra_services v7.16.0 v8.0.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants