Map layout changes #77132
Merged
Map layout changes #77132
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
smith
added
release_note:skip
|
@elasticmachine merge upstream |
|
Pinging @elastic/apm-ui (Team:apm) |
|
retest |
|
@elasticmachine merge upstream |
sorenlouv
reviewed
Sep 15, 2020
| }; | ||
| } | ||
|
|
||
| export function useCytoscapeEventHandlers({ |
There was a problem hiding this comment.
Would it be possible to add a simple test for this hook?
sorenlouv
approved these changes
Sep 15, 2020
💚 Build SucceededBuild metrics@kbn/optimizer bundle module count
async chunks size
History
To update your PR or re-run it, just comment with: |
smith
added a commit
to smith/kibana
that referenced
this pull request
Sep 15, 2020
These changes make the map work better with auto-refresh and with dragged nodes. Extract all event handling out of the Cytoscape component into a hook. Use React.memo to only render when the list of element ids has changed. Only do a fit on the layout if we're going from 0 to more than 0 elements. Instead of removing all the nodes on rerender, only remove the ones that aren't in the new list. Trigger a custom:data event instead of data when we receive fetched data. Before we triggered a data event which would trigger a layout if you called data() on an element. Don't trigger a deselect when we get new data, so popovers stay open when we get new data. Animate the layout on changes. When we do a layout, exclude selected nodes and nodes that have been dragged. When we set the time range to something low (like the default of 15m) and a fast refresh interval (1-3s) the edges we get back from the API are not consistent, so you can see the map changing frequently. See this video for an example: https://www.dropbox.com/s/jsq2bffxdw61xhu/77132.mov?dl=0 Fixes elastic#73156. Fixes elastic#76936.
jloleysens
added a commit
to jloleysens/kibana
that referenced
this pull request
Sep 16, 2020
…s-for-710 * 'master' of github.com:elastic/kibana: (95 commits) log request body in new ES client (elastic#77150) use `navigateToUrl` to navigate to recent nav links (elastic#77446) Move core config service to `kbn/config` package (elastic#76874) [UBI] Copy license to /licenses folder (elastic#77563) Skip flaky Events Viewer Cypress test [Lens] Remove dynamic names in telemetry fields (elastic#76988) [Maps] Add DynamicStyleProperty#getMbPropertyName and DynamicStyleProperty#getMbPropertyValue (elastic#77366) [Enterprise Search] Add flag to restrict width of layout (elastic#77539) [Security Solutions][Cases - Timeline] Fix bug when adding a timeline to a case (elastic#76967) [Security Solution][Detections] Integration test for Editing a Rule (elastic#77090) [Ingest pipelines] Polish pipeline debugging workflow (elastic#76058) [@kbn/utils] Adds missing dependency (elastic#77536) Add the Enterprise Search logo to the Overview search result (elastic#77514) [Logs UI] [Metrics UI] Remove saved object field mappings (elastic#75482) [Security Solution][Exceptions] Exception modal bulk close option only closes alerts generated by same rule (elastic#77402) Adds @kbn/utils package (elastic#76518) Map layout changes (elastic#77132) [Security Solution] [Detections] EQL Rule Creation (elastic#76831) Adding test user to maps tests under documents source folder (elastic#77245) Suppress error logs when clients connect over HTTP instead of HTTPS (elastic#77397) ... # Conflicts: # x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/index.ts # x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/phases/warm_phase.tsx
kibanamachine
added
the
backport missing
|
Looks like this PR has a backport PR but it still hasn't been merged. Please merge it ASAP to keep the branches relatively in sync. |
kibanamachine
removed
the
backport missing
smith
added a commit
that referenced
this pull request
Sep 18, 2020
These changes make the map work better with auto-refresh and with dragged nodes. Extract all event handling out of the Cytoscape component into a hook. Use React.memo to only render when the list of element ids has changed. Only do a fit on the layout if we're going from 0 to more than 0 elements. Instead of removing all the nodes on rerender, only remove the ones that aren't in the new list. Trigger a custom:data event instead of data when we receive fetched data. Before we triggered a data event which would trigger a layout if you called data() on an element. Don't trigger a deselect when we get new data, so popovers stay open when we get new data. Animate the layout on changes. When we do a layout, exclude selected nodes and nodes that have been dragged. When we set the time range to something low (like the default of 15m) and a fast refresh interval (1-3s) the edges we get back from the API are not consistent, so you can see the map changing frequently. See this video for an example: https://www.dropbox.com/s/jsq2bffxdw61xhu/77132.mov?dl=0 Fixes #73156. Fixes #76936.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
These changes make the map work better with auto-refresh and with dragged nodes.
Cytoscapecomponent into a hook.React.memoto only render when the list of element ids has changed.fiton the layout if we're going from 0 to more than 0 elements.custom:dataevent instead ofdatawhen we receive fetched data. Before we triggered adataevent which would trigger a layout if you calleddata()on an element.deselectwhen we get new data, so popovers stay open when we get new data.When we set the time range to something low (like the default of 15m) and a fast refresh interval (1-3s) the edges we get back from the API are not consistent, so you can see the map changing frequently.
See this video for an example: https://www.dropbox.com/s/jsq2bffxdw61xhu/77132.mov?dl=0
Fixes #73156.
Fixes #76936.