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

[Osquery] Add to timeline button #128596

Merged
merged 30 commits into from
Apr 29, 2022
Merged

Conversation

tomsonpl
Copy link
Contributor

@tomsonpl tomsonpl commented Mar 28, 2022

Summary

Add possibility to quickly add osquery action to the timeline.

Screenshot 2022-03-28 at 12 05 43

Zrzut ekranu 2022-04-25 o 17 13 52

Also - remove the go back button from the Osquery Flyout

@tomsonpl tomsonpl added Team:Asset Management Security Asset Management Team Feature:Osquery Security Solution Osquery feature v8.2.0 labels Mar 28, 2022
@tomsonpl tomsonpl self-assigned this Mar 28, 2022
@tomsonpl tomsonpl requested review from a team as code owners March 28, 2022 10:07
@elasticmachine
Copy link
Contributor

Pinging @elastic/security-asset-management (Team:Asset Management)

@tomsonpl tomsonpl changed the title Osquery add to timeline [Osquery] Add to timeline button Mar 28, 2022
@tomsonpl tomsonpl added the release_note:feature Makes this part of the condensed release notes label Mar 28, 2022
@tomsonpl
Copy link
Contributor Author

@elasticmachine merge upstream

},
};

return getAddToTimelineButton({
Copy link
Contributor

Choose a reason for hiding this comment

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

I think we should have at least a unit test to check the flyout is rendered correctly according to the props and then check if add to timeline was executed with the right options.

@tomsonpl
Copy link
Contributor Author

@elasticmachine merge upstream

Copy link
Contributor

@YulNaumenko YulNaumenko left a comment

Choose a reason for hiding this comment

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

Security solution changes LGTM

@tomsonpl tomsonpl added v8.3.0 and removed v8.2.0 labels Mar 31, 2022
@tomsonpl
Copy link
Contributor Author

@elasticmachine merge upstream

onClose={onClose}
aria-labelledby="flyoutTitle"
// eslint-disable-next-line react-perf/jsx-no-new-object-as-prop
maskProps={{ style: 'z-index: 6000' }} // For an edge case to display above the alerts flyout
Copy link
Contributor

@kqualters-elastic kqualters-elastic Mar 31, 2022

Choose a reason for hiding this comment

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

So I see below that this flyout has a form in it, did you verify that all the select dropdowns etc that render in this form, namely EuiSuperSelect options and anything that renders itself via a portal (not sure of everything) render correctly? I noticed recently that any element that renders itself in a portal and has a parent that is also in a portal, when it tries to determine it's own stacking context cannot have a z-index higher than 2000 or something. https://codesandbox.io/s/crimson-voice-zq510u?file=/demo.js for a demo. Mentioned this to eui but they didn't seem to think it's a bug, personally I do, https://github.com/elastic/eui/blob/main/src/services/popover/popover_positioning.ts#L743 for an element in a portal will not do what it should.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Hey, I don't know yet, but will take a look at this and get back to you. Big thanks! :)

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Thanks, I double checked and it seems to be working just fine. Selects too :)
The only thing is the Global NavBar that doesnt really work when any of the additional flyouts is opened.

Copy link
Contributor Author

@tomsonpl tomsonpl Apr 26, 2022

Choose a reason for hiding this comment

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

So we checked one more time, and apparently it works fine on Alerts, but messes up one of the flyouts in Osquery itself.

Thanks for pointing this out :)

Copy link
Contributor Author

Choose a reason for hiding this comment

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

the issue is fixed here #130944

@tomsonpl
Copy link
Contributor Author

tomsonpl commented Apr 4, 2022

@elasticmachine merge upstream

@tomsonpl tomsonpl marked this pull request as ready for review April 26, 2022 07:45
dataProvider: providerA,
field: value,
ownFocus: false,
...(payload.isIcon ? { showTooltip: true } : { Component: TimelineComponent }),
Copy link
Contributor

Choose a reason for hiding this comment

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

is this ever called with isIcon false?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

No, never. It's either true or undefined


const handleAddToTimeline = useCallback(
(payload: { query: [string, string]; isIcon?: true }) => {
const [field, value] = payload.query;
Copy link
Contributor

Choose a reason for hiding this comment

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

nit: could change this to const { query: [field, value], isIcon } = payload so it's more clear that isIcon is used below

Copy link
Contributor Author

Choose a reason for hiding this comment

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

👍

Copy link
Contributor

@kqualters-elastic kqualters-elastic left a comment

Choose a reason for hiding this comment

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

unless i'm missing something not sure if you need to pass isIcon around as it always seems true, but otherwise lgtm 👍

@tomsonpl
Copy link
Contributor Author

Thanks @kqualters-elastic :)
Regarding isIcon: we're using this handleAddToTimeline in two places. One of which contains isIcon: true in payload, the other doesn't - then we render the Component instead of tooltip.
I hope that makes sense?

@tomsonpl
Copy link
Contributor Author

@elasticmachine merge upstream

@kibanamachine
Copy link
Contributor

merge conflict between base and head

# Conflicts:
#	x-pack/plugins/osquery/cypress/integration/all/live_query.spec.ts
#	x-pack/plugins/osquery/public/live_queries/form/index.tsx
#	x-pack/plugins/osquery/public/live_queries/index.tsx
#	x-pack/plugins/osquery/public/results/results_table.tsx
#	x-pack/plugins/osquery/public/routes/saved_queries/edit/tabs.tsx
#	x-pack/plugins/osquery/public/shared_components/osquery_action/index.tsx
#	x-pack/plugins/security_solution/public/detections/components/osquery/osquery_flyout.tsx
@tomsonpl
Copy link
Contributor Author

@elasticmachine merge upstream

@tomsonpl
Copy link
Contributor Author

@elasticmachine merge upstream

@tomsonpl
Copy link
Contributor Author

@elasticmachine merge upstream

@kibana-ci
Copy link
Collaborator

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
securitySolution 2787 2786 -1

Async chunks

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

id before after diff
osquery 998.6KB 998.9KB +347.0B
securitySolution 4.8MB 4.8MB +103.0B
total +450.0B

History

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

cc @tomsonpl

Copy link
Contributor

@patrykkopycinski patrykkopycinski left a comment

Choose a reason for hiding this comment

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

Asset management LGTM

@tomsonpl tomsonpl merged commit 0b988f3 into elastic:main Apr 29, 2022
@kibanamachine kibanamachine added the backport:skip This commit does not require backporting label Apr 29, 2022
dmlemeshko pushed a commit to dmlemeshko/kibana that referenced this pull request May 5, 2022
kertal pushed a commit to kertal/kibana that referenced this pull request May 24, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
backport:skip This commit does not require backporting Feature:Osquery Security Solution Osquery feature release_note:feature Makes this part of the condensed release notes Team:Asset Management Security Asset Management Team v8.3.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

7 participants