Skip to content

[Security Solution][Detections] Fix "Severity override" dropdowns in "Create new rule" -> "About rule" - #82271

Merged
banderror merged 4 commits into
elastic:masterfrom
banderror:fix-dropdown-in-about-rule
Nov 3, 2020
Merged

banderror merged 4 commits into
elastic:masterfrom
banderror:fix-dropdown-in-about-rule

Conversation

@banderror

@banderror banderror commented Nov 2, 2020 •

Copy link
Copy Markdown
Contributor

Addresses: #81284
Related PR: elastic/eui#4210

Summary

We use EuiComboBox in all "Severity override" dropdowns (which are called FieldComponent and AutocompleteFieldMatchComponent). The issue with EuiComboBox is that it doesn't handle long text in the placeholder properly. In the #81284 you can see the placeholders' text being split into multiple lines that gives this messy effect.

TODO:

  • Adjust the layout of the severity block in such a way that it gives more space to the dropdowns. It will fix the bug and overall improve the UX. Currently most of the values in these droprowns are longer than the dropdown's width, so it's hard to see what values can be selected in the first place.
  • Report an issue to EUI. Try to fix it if it's easy. See [EuiComboBox] Truncate long placeholder text with ellipsis eui#4210
  • Do the same changes in the "Risk score" block for the sake of consistency. Aligned with @marrasherrier

Before

After

Default:

Screenshot 2020-11-02 at 19 54 45

Both overrides checked:

Screenshot 2020-11-02 at 19 56 02

Small screen width:

Screenshot 2020-11-02 at 19 57 14

Now it's enough space to show the whole field name in most cases:

Screenshot 2020-11-02 at 19 58 21

Checklist

Delete any items that are not applicable to this PR.

For maintainers

@banderror banderror changed the title [Security Solution] Fix "Severity override" dropdowns in "Create new rule" -> "About rule" [Security Solution][Detections] Fix "Severity override" dropdowns in "Create new rule" -> "About rule" Nov 2, 2020
@banderror banderror self-assigned this Nov 2, 2020
@banderror banderror added release_note:fix Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:Detections and Resp v7.11.0 v8.0.0 labels Nov 2, 2020
@banderror
banderror marked this pull request as ready for review November 2, 2020 19:41
@banderror
banderror requested review from a team as code owners November 2, 2020 19:41
@kibanamachine

Copy link
Copy Markdown
Contributor

💚 Build Succeeded

Metrics [docs]

async chunks size

id before after diff
securitySolution 7.8MB 7.8MB -97.0B

History

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

@peluja1012 peluja1012 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pulled down the branch and played with the UI. It looks good. I like the UX improvement around field suggestions. Now there is more room and users are actually able to see what they're selecting. Thanks Georgii!

@banderror
banderror merged commit 1c4cd33 into elastic:master Nov 3, 2020
@banderror
banderror deleted the fix-dropdown-in-about-rule branch November 3, 2020 13:05
banderror added a commit to banderror/kibana that referenced this pull request Nov 3, 2020
…"Create new rule" -> "About rule" (elastic#82271)

We use `EuiComboBox` in all "Severity override" dropdowns (which are called `FieldComponent` and `AutocompleteFieldMatchComponent`). The issue with `EuiComboBox` is that it doesn't handle long text in the placeholder properly. In the elastic#81284 you can see the placeholders' text being split into multiple lines that gives this messy effect.
banderror added a commit that referenced this pull request Nov 4, 2020
…"Create new rule" -> "About rule" (#82271) (#82427)

We use `EuiComboBox` in all "Severity override" dropdowns (which are called `FieldComponent` and `AutocompleteFieldMatchComponent`). The issue with `EuiComboBox` is that it doesn't handle long text in the placeholder properly. In the #81284 you can see the placeholders' text being split into multiple lines that gives this messy effect.

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
@banderror
banderror restored the fix-dropdown-in-about-rule branch November 4, 2020 13:19
banderror added a commit to banderror/kibana that referenced this pull request Nov 12, 2020
…"Create new rule" -> "About rule" (elastic#82271)

We use `EuiComboBox` in all "Severity override" dropdowns (which are called `FieldComponent` and `AutocompleteFieldMatchComponent`). The issue with `EuiComboBox` is that it doesn't handle long text in the placeholder properly. In the elastic#81284 you can see the placeholders' text being split into multiple lines that gives this messy effect.
banderror added a commit that referenced this pull request Nov 12, 2020
…"Create new rule" -> "About rule" (#82271) (#83272)

We use `EuiComboBox` in all "Severity override" dropdowns (which are called `FieldComponent` and `AutocompleteFieldMatchComponent`). The issue with `EuiComboBox` is that it doesn't handle long text in the placeholder properly. In the #81284 you can see the placeholders' text being split into multiple lines that gives this messy effect.
@banderror
banderror deleted the fix-dropdown-in-about-rule branch November 12, 2020 15:02
patrykkopycinski pushed a commit to patrykkopycinski/kibana that referenced this pull request May 6, 2026
…"Create new rule" -> "About rule" (elastic#82271)

We use `EuiComboBox` in all "Severity override" dropdowns (which are called `FieldComponent` and `AutocompleteFieldMatchComponent`). The issue with `EuiComboBox` is that it doesn't handle long text in the placeholder properly. In the elastic#81284 you can see the placeholders' text being split into multiple lines that gives this messy effect.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

release_note:fix Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. v7.10.1 v7.11.0 v8.0.0

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Security Solution]UI [drop down icon and text] is broken when "severity override" is checked under the create a new rule tab.

3 participants