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

[Security Solution] ThreeWayDiff UI: Add remaining field components for FieldReadOnly #193261

Merged

Conversation

nikitaindik
Copy link
Contributor

@nikitaindik nikitaindik commented Sep 18, 2024

Partially addresses: #171520
Is a follow-up PR to: #192342

This is the 3rd of the 3 PRs for FieldReadOnly.

  • The 1st PR added the FieldReadOnly and a bunch of field components.
  • The 2nd PR moved away from using DiffableAllFields type in favour of DiffableRule and split the large FieldReadOnly component into smaller ones for readability.
  • This (3rd) PR adds the remaining field components.

Summary

This PR adds field components for FieldReadOnly. Field components display a read-only view of a particular DiffableRule field, similar to how fields are shown on the Rule Details page.

FieldReadOnly and field components will be displayed in the right side of the new Diff tab of the Upgrade flyout (see it on the Miro board). They will let the user see how an upgraded version of a rule will look like in a user-friendly way.

Running

FinalReadOnly and its field components are not yet integrated into the flyout, but you can view components in Storybook.

  1. Run Storybook: yarn storybook security_solution
  2. Go to http://localhost:9001 in browser.
Scherm­afbeelding 2024-09-03 om 13 05 11

@nikitaindik nikitaindik added release_note:skip Skip the PR/issue when compiling release notes Team:Detections and Resp Security Detection Response Team Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:Detection Rule Management Security Detection Rule Management Team Feature:Prebuilt Detection Rules Security Solution Prebuilt Detection Rules backport:prev-minor Backport to (8.x) the previous minor version (i.e. one version back from main) labels Sep 18, 2024
@nikitaindik nikitaindik self-assigned this Sep 18, 2024
@nikitaindik nikitaindik force-pushed the 3wd-field-readonly-more-field-components branch from 7f44356 to 7ba4500 Compare September 18, 2024 22:46
@nikitaindik nikitaindik force-pushed the 3wd-field-readonly-more-field-components branch from 7ba4500 to c2e495a Compare September 19, 2024 11:41
@nikitaindik nikitaindik marked this pull request as ready for review September 19, 2024 11:42
@nikitaindik nikitaindik requested a review from a team as a code owner September 19, 2024 11:42
@elasticmachine
Copy link
Contributor

Pinging @elastic/security-detections-response (Team:Detections and Resp)

@elasticmachine
Copy link
Contributor

Pinging @elastic/security-solution (Team: SecuritySolution)

@elasticmachine
Copy link
Contributor

Pinging @elastic/security-detection-rule-management (Team:Detection Rule Management)

@nikitaindik nikitaindik removed the request for review from dplumlee September 19, 2024 11:46
@nikitaindik nikitaindik removed the request for review from a team September 20, 2024 09:40
Copy link
Contributor

@maximpn maximpn left a comment

Choose a reason for hiding this comment

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

LGTM

@nikitaindik nikitaindik enabled auto-merge (squash) September 24, 2024 07:55
@nikitaindik nikitaindik merged commit b78b633 into elastic:main Sep 24, 2024
42 checks passed
@kibana-ci
Copy link
Collaborator

💚 Build Succeeded

Metrics [docs]

Async chunks

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

id before after diff
securitySolution 20.4MB 20.4MB +285.0B

History

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

cc @nikitaindik

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Sep 24, 2024
…or `FieldReadOnly` (elastic#193261)

**Partially addresses: elastic#171520
**Is a follow-up PR to: elastic#192342

This is the 3rd of the 3 PRs for `FieldReadOnly`.
- The 1st [PR](elastic#191499) added the
`FieldReadOnly` and a bunch of field components.
- The 2nd [PR](elastic#192342) moved away
from using `DiffableAllFields` type in favour of `DiffableRule` and
split the large `FieldReadOnly` component into smaller ones for
readability.
 - This (3rd) PR adds the remaining field components.

## Summary

This PR adds field components for `FieldReadOnly`. Field components
display a read-only view of a particular `DiffableRule` field, similar
to how fields are shown on the Rule Details page.

`FieldReadOnly` and field components will be displayed in the right side
of the new Diff tab of the Upgrade flyout (see it on the [Miro
board](https://miro.com/app/board/uXjVK0gqjjQ=/?moveToWidget=3458764594148126123&cot=14)).
They will let the user see how an upgraded version of a rule will look
like in a user-friendly way.

### Running
`FinalReadOnly` and its field components are not yet integrated into the
flyout, but you can view components in Storybook.
1. Run Storybook: `yarn storybook security_solution`
2. Go to `http://localhost:9001` in browser.

<img width="1062" alt="Scherm­afbeelding 2024-09-03 om 13 05 11"
src="https://github.com/user-attachments/assets/13b227d4-1321-47d9-a0a7-93868c9f4a15">

---------

Co-authored-by: kibanamachine <[email protected]>
Co-authored-by: Maxim Palenov <[email protected]>
(cherry picked from commit b78b633)
@kibanamachine
Copy link
Contributor

💚 All backports created successfully

Status Branch Result
8.x

Note: Successful backport PRs will be merged automatically after passing CI.

Questions ?

Please refer to the Backport tool documentation

kibanamachine added a commit that referenced this pull request Sep 24, 2024
…ents for &#x60;FieldReadOnly&#x60; (#193261) (#193825)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Security Solution] ThreeWayDiff UI: Add remaining field components
for &#x60;FieldReadOnly&#x60;
(#193261)](#193261)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Nikita
Indik","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-09-24T08:04:38Z","message":"[Security
Solution] ThreeWayDiff UI: Add remaining field components for
`FieldReadOnly` (#193261)\n\n**Partially addresses:
https://github.com/elastic/kibana/issues/171520**\r\n**Is a follow-up PR
to: https://github.com/elastic/kibana/pull/192342**\r\n\r\nThis is the
3rd of the 3 PRs for `FieldReadOnly`.\r\n- The 1st
[PR](#191499) added
the\r\n`FieldReadOnly` and a bunch of field components.\r\n- The 2nd
[PR](#192342) moved away\r\nfrom
using `DiffableAllFields` type in favour of `DiffableRule` and\r\nsplit
the large `FieldReadOnly` component into smaller ones
for\r\nreadability.\r\n - This (3rd) PR adds the remaining field
components.\r\n\r\n## Summary\r\n\r\nThis PR adds field components for
`FieldReadOnly`. Field components\r\ndisplay a read-only view of a
particular `DiffableRule` field, similar\r\nto how fields are shown on
the Rule Details page.\r\n\r\n`FieldReadOnly` and field components will
be displayed in the right side\r\nof the new Diff tab of the Upgrade
flyout (see it on the
[Miro\r\nboard](https://miro.com/app/board/uXjVK0gqjjQ=/?moveToWidget=3458764594148126123&cot=14)).\r\nThey
will let the user see how an upgraded version of a rule will
look\r\nlike in a user-friendly way.\r\n\r\n\r\n###
Running\r\n`FinalReadOnly` and its field components are not yet
integrated into the\r\nflyout, but you can view components in
Storybook.\r\n1. Run Storybook: `yarn storybook security_solution`\r\n2.
Go to `http://localhost:9001` in browser.\r\n\r\n<img width=\"1062\"
alt=\"Scherm­afbeelding 2024-09-03 om 13 05
11\"\r\nsrc=\"https://github.com/user-attachments/assets/13b227d4-1321-47d9-a0a7-93868c9f4a15\">\r\n\r\n---------\r\n\r\nCo-authored-by:
kibanamachine
<[email protected]>\r\nCo-authored-by:
Maxim Palenov
<[email protected]>","sha":"b78b6337970b2e7332266cd0e181e14d26c3ed45","branchLabelMapping":{"^v9.0.0$":"main","^v8.16.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","Team:Detections
and Resp","Team: SecuritySolution","Team:Detection Rule
Management","Feature:Prebuilt Detection
Rules","backport:prev-minor"],"title":"[Security Solution] ThreeWayDiff
UI: Add remaining field components for
`FieldReadOnly`","number":193261,"url":"https://github.com/elastic/kibana/pull/193261","mergeCommit":{"message":"[Security
Solution] ThreeWayDiff UI: Add remaining field components for
`FieldReadOnly` (#193261)\n\n**Partially addresses:
https://github.com/elastic/kibana/issues/171520**\r\n**Is a follow-up PR
to: https://github.com/elastic/kibana/pull/192342**\r\n\r\nThis is the
3rd of the 3 PRs for `FieldReadOnly`.\r\n- The 1st
[PR](#191499) added
the\r\n`FieldReadOnly` and a bunch of field components.\r\n- The 2nd
[PR](#192342) moved away\r\nfrom
using `DiffableAllFields` type in favour of `DiffableRule` and\r\nsplit
the large `FieldReadOnly` component into smaller ones
for\r\nreadability.\r\n - This (3rd) PR adds the remaining field
components.\r\n\r\n## Summary\r\n\r\nThis PR adds field components for
`FieldReadOnly`. Field components\r\ndisplay a read-only view of a
particular `DiffableRule` field, similar\r\nto how fields are shown on
the Rule Details page.\r\n\r\n`FieldReadOnly` and field components will
be displayed in the right side\r\nof the new Diff tab of the Upgrade
flyout (see it on the
[Miro\r\nboard](https://miro.com/app/board/uXjVK0gqjjQ=/?moveToWidget=3458764594148126123&cot=14)).\r\nThey
will let the user see how an upgraded version of a rule will
look\r\nlike in a user-friendly way.\r\n\r\n\r\n###
Running\r\n`FinalReadOnly` and its field components are not yet
integrated into the\r\nflyout, but you can view components in
Storybook.\r\n1. Run Storybook: `yarn storybook security_solution`\r\n2.
Go to `http://localhost:9001` in browser.\r\n\r\n<img width=\"1062\"
alt=\"Scherm­afbeelding 2024-09-03 om 13 05
11\"\r\nsrc=\"https://github.com/user-attachments/assets/13b227d4-1321-47d9-a0a7-93868c9f4a15\">\r\n\r\n---------\r\n\r\nCo-authored-by:
kibanamachine
<[email protected]>\r\nCo-authored-by:
Maxim Palenov
<[email protected]>","sha":"b78b6337970b2e7332266cd0e181e14d26c3ed45"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/193261","number":193261,"mergeCommit":{"message":"[Security
Solution] ThreeWayDiff UI: Add remaining field components for
`FieldReadOnly` (#193261)\n\n**Partially addresses:
https://github.com/elastic/kibana/issues/171520**\r\n**Is a follow-up PR
to: https://github.com/elastic/kibana/pull/192342**\r\n\r\nThis is the
3rd of the 3 PRs for `FieldReadOnly`.\r\n- The 1st
[PR](#191499) added
the\r\n`FieldReadOnly` and a bunch of field components.\r\n- The 2nd
[PR](#192342) moved away\r\nfrom
using `DiffableAllFields` type in favour of `DiffableRule` and\r\nsplit
the large `FieldReadOnly` component into smaller ones
for\r\nreadability.\r\n - This (3rd) PR adds the remaining field
components.\r\n\r\n## Summary\r\n\r\nThis PR adds field components for
`FieldReadOnly`. Field components\r\ndisplay a read-only view of a
particular `DiffableRule` field, similar\r\nto how fields are shown on
the Rule Details page.\r\n\r\n`FieldReadOnly` and field components will
be displayed in the right side\r\nof the new Diff tab of the Upgrade
flyout (see it on the
[Miro\r\nboard](https://miro.com/app/board/uXjVK0gqjjQ=/?moveToWidget=3458764594148126123&cot=14)).\r\nThey
will let the user see how an upgraded version of a rule will
look\r\nlike in a user-friendly way.\r\n\r\n\r\n###
Running\r\n`FinalReadOnly` and its field components are not yet
integrated into the\r\nflyout, but you can view components in
Storybook.\r\n1. Run Storybook: `yarn storybook security_solution`\r\n2.
Go to `http://localhost:9001` in browser.\r\n\r\n<img width=\"1062\"
alt=\"Scherm­afbeelding 2024-09-03 om 13 05
11\"\r\nsrc=\"https://github.com/user-attachments/assets/13b227d4-1321-47d9-a0a7-93868c9f4a15\">\r\n\r\n---------\r\n\r\nCo-authored-by:
kibanamachine
<[email protected]>\r\nCo-authored-by:
Maxim Palenov
<[email protected]>","sha":"b78b6337970b2e7332266cd0e181e14d26c3ed45"}}]}]
BACKPORT-->

Co-authored-by: Nikita Indik <[email protected]>
maximpn added a commit that referenced this pull request Sep 27, 2024
…Update Workflow (#193531)

**Epic:** #174168
**Addresses:** #171520

## Summary

This PR introduces a new `Update` tab allowing users to resolve rule upgrade conflicts. It's a result of combination of read-only components implemented in #193261 and rule upgrade state implemented in #191721.

## Details

The goal of this PR is to provide intermediate integration between rule upgrade state ([PR](#191721)) and components displaying the diff and read-only state ([PR](#193261)). It will facilitate further development of rule field editable components and streamline rule upgrade functionality developing.

## How to test?

The functionality is hidden under `prebuiltRulesCustomizationEnabled` feature flag. Add the following to your Kibana config

```yaml
xpack.securitySolution.enableExperimental:
  - prebuiltRulesCustomizationEnabled
```

When the above feature flag enabled the new `Update` tab is displayed instead of the old one.

## Screenshots

Suggested components design 
![image](https://github.com/user-attachments/assets/b5aaf571-286a-4595-9bd4-fdaf9a423b03)

New `Update` tab
<img width="1718" alt="image" src="https://github.com/user-attachments/assets/28aa6bb3-f805-4109-a808-d67e58c7c5b8">
kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Sep 27, 2024
…Update Workflow (elastic#193531)

**Epic:** elastic#174168
**Addresses:** elastic#171520

## Summary

This PR introduces a new `Update` tab allowing users to resolve rule upgrade conflicts. It's a result of combination of read-only components implemented in elastic#193261 and rule upgrade state implemented in elastic#191721.

## Details

The goal of this PR is to provide intermediate integration between rule upgrade state ([PR](elastic#191721)) and components displaying the diff and read-only state ([PR](elastic#193261)). It will facilitate further development of rule field editable components and streamline rule upgrade functionality developing.

## How to test?

The functionality is hidden under `prebuiltRulesCustomizationEnabled` feature flag. Add the following to your Kibana config

```yaml
xpack.securitySolution.enableExperimental:
  - prebuiltRulesCustomizationEnabled
```

When the above feature flag enabled the new `Update` tab is displayed instead of the old one.

## Screenshots

Suggested components design
![image](https://github.com/user-attachments/assets/b5aaf571-286a-4595-9bd4-fdaf9a423b03)

New `Update` tab
<img width="1718" alt="image" src="https://github.com/user-attachments/assets/28aa6bb3-f805-4109-a808-d67e58c7c5b8">

(cherry picked from commit 878ba13)
kibanamachine added a commit that referenced this pull request Sep 27, 2024
… Rule Update Workflow (#193531) (#194348)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Security Solution] Integrate state and components for Prebuilt Rule
Update Workflow
(#193531)](#193531)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Maxim
Palenov","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-09-27T21:07:12Z","message":"[Security
Solution] Integrate state and components for Prebuilt Rule Update
Workflow (#193531)\n\n**Epic:**
https://github.com/elastic/kibana/issues/174168\r\n**Addresses:**
https://github.com/elastic/kibana/issues/171520\r\n\r\n##
Summary\r\n\r\nThis PR introduces a new `Update` tab allowing users to
resolve rule upgrade conflicts. It's a result of combination of
read-only components implemented in
#193261 and rule upgrade state
implemented in https://github.com/elastic/kibana/pull/191721.\r\n\r\n##
Details\r\n\r\nThe goal of this PR is to provide intermediate
integration between rule upgrade state
([PR](#191721)) and components
displaying the diff and read-only state
([PR](#193261)). It will
facilitate further development of rule field editable components and
streamline rule upgrade functionality developing.\r\n\r\n## How to
test?\r\n\r\nThe functionality is hidden under
`prebuiltRulesCustomizationEnabled` feature flag. Add the following to
your Kibana
config\r\n\r\n```yaml\r\nxpack.securitySolution.enableExperimental:\r\n
- prebuiltRulesCustomizationEnabled\r\n```\r\n\r\nWhen the above feature
flag enabled the new `Update` tab is displayed instead of the old
one.\r\n\r\n## Screenshots\r\n\r\nSuggested components design
\r\n![image](https://github.com/user-attachments/assets/b5aaf571-286a-4595-9bd4-fdaf9a423b03)\r\n\r\nNew
`Update` tab\r\n<img width=\"1718\" alt=\"image\"
src=\"https://github.com/user-attachments/assets/28aa6bb3-f805-4109-a808-d67e58c7c5b8\">","sha":"878ba134e96245b038a9765148ad48a36bb2aa4b","branchLabelMapping":{"^v9.0.0$":"main","^v8.16.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","Team:Detections
and Resp","Team: SecuritySolution","Team:Detection Rule
Management","backport:prev-minor"],"title":"[Security Solution]
Integrate state and components for Prebuilt Rule Update
Workflow","number":193531,"url":"https://github.com/elastic/kibana/pull/193531","mergeCommit":{"message":"[Security
Solution] Integrate state and components for Prebuilt Rule Update
Workflow (#193531)\n\n**Epic:**
https://github.com/elastic/kibana/issues/174168\r\n**Addresses:**
https://github.com/elastic/kibana/issues/171520\r\n\r\n##
Summary\r\n\r\nThis PR introduces a new `Update` tab allowing users to
resolve rule upgrade conflicts. It's a result of combination of
read-only components implemented in
#193261 and rule upgrade state
implemented in https://github.com/elastic/kibana/pull/191721.\r\n\r\n##
Details\r\n\r\nThe goal of this PR is to provide intermediate
integration between rule upgrade state
([PR](#191721)) and components
displaying the diff and read-only state
([PR](#193261)). It will
facilitate further development of rule field editable components and
streamline rule upgrade functionality developing.\r\n\r\n## How to
test?\r\n\r\nThe functionality is hidden under
`prebuiltRulesCustomizationEnabled` feature flag. Add the following to
your Kibana
config\r\n\r\n```yaml\r\nxpack.securitySolution.enableExperimental:\r\n
- prebuiltRulesCustomizationEnabled\r\n```\r\n\r\nWhen the above feature
flag enabled the new `Update` tab is displayed instead of the old
one.\r\n\r\n## Screenshots\r\n\r\nSuggested components design
\r\n![image](https://github.com/user-attachments/assets/b5aaf571-286a-4595-9bd4-fdaf9a423b03)\r\n\r\nNew
`Update` tab\r\n<img width=\"1718\" alt=\"image\"
src=\"https://github.com/user-attachments/assets/28aa6bb3-f805-4109-a808-d67e58c7c5b8\">","sha":"878ba134e96245b038a9765148ad48a36bb2aa4b"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/193531","number":193531,"mergeCommit":{"message":"[Security
Solution] Integrate state and components for Prebuilt Rule Update
Workflow (#193531)\n\n**Epic:**
https://github.com/elastic/kibana/issues/174168\r\n**Addresses:**
https://github.com/elastic/kibana/issues/171520\r\n\r\n##
Summary\r\n\r\nThis PR introduces a new `Update` tab allowing users to
resolve rule upgrade conflicts. It's a result of combination of
read-only components implemented in
#193261 and rule upgrade state
implemented in https://github.com/elastic/kibana/pull/191721.\r\n\r\n##
Details\r\n\r\nThe goal of this PR is to provide intermediate
integration between rule upgrade state
([PR](#191721)) and components
displaying the diff and read-only state
([PR](#193261)). It will
facilitate further development of rule field editable components and
streamline rule upgrade functionality developing.\r\n\r\n## How to
test?\r\n\r\nThe functionality is hidden under
`prebuiltRulesCustomizationEnabled` feature flag. Add the following to
your Kibana
config\r\n\r\n```yaml\r\nxpack.securitySolution.enableExperimental:\r\n
- prebuiltRulesCustomizationEnabled\r\n```\r\n\r\nWhen the above feature
flag enabled the new `Update` tab is displayed instead of the old
one.\r\n\r\n## Screenshots\r\n\r\nSuggested components design
\r\n![image](https://github.com/user-attachments/assets/b5aaf571-286a-4595-9bd4-fdaf9a423b03)\r\n\r\nNew
`Update` tab\r\n<img width=\"1718\" alt=\"image\"
src=\"https://github.com/user-attachments/assets/28aa6bb3-f805-4109-a808-d67e58c7c5b8\">","sha":"878ba134e96245b038a9765148ad48a36bb2aa4b"}}]}]
BACKPORT-->

Co-authored-by: Maxim Palenov <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
backport:prev-minor Backport to (8.x) the previous minor version (i.e. one version back from main) Feature:Prebuilt Detection Rules Security Solution Prebuilt Detection Rules release_note:skip Skip the PR/issue when compiling release notes Team:Detection Rule Management Security Detection Rule Management Team Team:Detections and Resp Security Detection Response Team Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. v8.16.0 v9.0.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants