[Fleet] Improve UX for policy secrets #171405
Merged
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
- Highlight secrets in policy editor "create" mode with a special background and tooltip - Add docs link where appropriate - Highlight "new secrets" in a separate callout during policy upgrade
kpollich
added
release_note:enhancement
Team:Fleet
|
Pinging @elastic/fleet (Team:Fleet) |
🤖 GitHub commentsExpand to view the GitHub comments
Just comment with:
|
kilfoyle
reviewed
Nov 16, 2023
...cy/create_package_policy_page/components/steps/components/package_policy_input_var_field.tsx
Outdated
Show resolved
Hide resolved
kilfoyle
approved these changes
Nov 16, 2023
…policy/create_package_policy_page/components/steps/components/package_policy_input_var_field.tsx Co-authored-by: David Kilfoyle <41695641+kilfoyle@users.noreply.github.com>
nchaulet
reviewed
Nov 16, 2023
| @@ -117,6 +117,44 @@ export const EditPackagePolicyForm = memo<{ | |||
|
|
|||
| const canWriteIntegrationPolicies = useAuthz().integrations.writeIntegrationPolicies; | |||
|
|
|||
| const newSecrets = useMemo(() => { | |||
There was a problem hiding this comment.
I think it would be great to move that to an util function out of that already huge file, so we can better separate/unit test that logic what do you think?
nchaulet
reviewed
Nov 16, 2023
| const [currentPackagePolicy, proposedUpgradePackagePolicy] = dryRunData[0].diff || []; | ||
| const isReadyForUpgrade = currentPackagePolicy && !dryRunData[0].hasErrors; | ||
|
|
||
| const HasNewSecretsCallOut = () => { |
There was a problem hiding this comment.
nit: I would prefer to have all those callout extracted to there own components (could still be in the same file but outside of that UpgradeStatusCallout) in my opinion it make things clearer
|
After some chats with the EUI team and Kuldeep, here's what the new secrets interface looks like on the policy editor:
|
|
I've added the same label/tooltip treatment to the "Edit" view of secrets as well |
|
One last update here, we've moved the "learn more" link to the bottom of the
|
nchaulet
approved these changes
Nov 16, 2023
|
The latest UI changes (the tooltips and the moved docs link) all look good to me! |
💚 Build Succeeded
Metrics [docs]Module Count
Async chunks
Page load bundle
History
To update your PR or re-run it, just comment with: cc @kpollich |
💔 All backports failed
Manual backportTo create the backport manually run: Questions ?Please refer to the Backport tool documentation |
💚 All backports created successfully
Note: Successful backport PRs will be merged automatically after passing CI. Questions ?Please refer to the Backport tool documentation |
kpollich
added a commit
to kpollich/kibana
that referenced
this pull request
Nov 28, 2023
## Summary Closes elastic#171225 - Highlights secrets during package policy creation with a distinct background and icon - Add tooltip + docs link for secrets where appropriate - Detect "new secrets" during policy upgrade and alert the user in a separate callout ## To do - [x] Fix any failing tests - [x] Add tests for "new secrets" detection logic ## Screenshots    ## How to test There's probably an easier way to do this, but this is what I did 1. Clone https://github.com/elastic/package-registry and https://github.com/elastic/integrations 2. Add the following to `config.yml` in your package-registry repo ```yml package_paths: - path/to/your/integrations/build/packages ``` 3. Build a version of an integration with some `secrets: true` for various variables. I used `1password` ```shell cd integrations/packages/1password # Edit `manifest.yml` or a given `data_stream/*/manifest.yml` file to change some variables to `secret: true`. Also bump the version and update `changelog.yml` elastic-package build ``` 4. Run the local package registry e.g. ```shell cd package-registry go run . --feature-proxy-mode=true -proxy-to=https://epr.elastic.co # makes it so you can still see EPR packages in Kibana ``` 5. Update your `kibana.dev.yml` to point at your local package registry ```yml xpack.fleet.registryUrl: http://localhost:8080 ``` 6. Start Kibana and Elasticsearch and install, upgrade, etc your package in question to verify the changes --------- Co-authored-by: David Kilfoyle <41695641+kilfoyle@users.noreply.github.com> (cherry picked from commit 9396ef3) # Conflicts: # packages/kbn-doc-links/src/get_doc_links.ts # packages/kbn-doc-links/src/types.ts # x-pack/plugins/translations/translations/fr-FR.json # x-pack/plugins/translations/translations/ja-JP.json # x-pack/plugins/translations/translations/zh-CN.json
kpollich
added a commit
that referenced
this pull request
Nov 29, 2023
# Backport This will backport the following commits from `main` to `8.11`: - [[Fleet] Improve UX for policy secrets (#171405)](#171405) <!--- Backport version: 8.9.8 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport) <!--BACKPORT [{"author":{"name":"Kyle Pollich","email":"kyle.pollich@elastic.co"},"sourceCommit":{"committedDate":"2023-11-16T19:35:19Z","message":"[Fleet] Improve UX for policy secrets (#171405)\n\n## Summary\r\n\r\nCloses https://github.com/elastic/kibana/issues/171225\r\n\r\n- Highlights secrets during package policy creation with a distinct\r\nbackground and icon\r\n- Add tooltip + docs link for secrets where appropriate\r\n- Detect \"new secrets\" during policy upgrade and alert the user in a\r\nseparate callout\r\n\r\n## To do\r\n- [x] Fix any failing tests\r\n- [x] Add tests for \"new secrets\" detection logic\r\n\r\n## Screenshots\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n## How to test\r\n\r\nThere's probably an easier way to do this, but this is what I did\r\n\r\n1. Clone https://github.com/elastic/package-registry and\r\nhttps://github.com/elastic/integrations\r\n2. Add the following to `config.yml` in your package-registry repo\r\n\r\n```yml\r\npackage_paths:\r\n - path/to/your/integrations/build/packages\r\n```\r\n\r\n3. Build a version of an integration with some `secrets: true` for\r\nvarious variables. I used `1password`\r\n\r\n```shell\r\ncd integrations/packages/1password\r\n# Edit `manifest.yml` or a given `data_stream/*/manifest.yml` file to change some variables to `secret: true`. Also bump the version and update `changelog.yml`\r\nelastic-package build\r\n```\r\n\r\n4. Run the local package registry e.g. \r\n\r\n```shell\r\ncd package-registry\r\ngo run . --feature-proxy-mode=true -proxy-to=https://epr.elastic.co # makes it so you can still see EPR packages in Kibana\r\n```\r\n\r\n5. Update your `kibana.dev.yml` to point at your local package registry\r\n\r\n```yml\r\nxpack.fleet.registryUrl: http://localhost:8080\r\n```\r\n\r\n6. Start Kibana and Elasticsearch and install, upgrade, etc your package\r\nin question to verify the changes\r\n\r\n---------\r\n\r\nCo-authored-by: David Kilfoyle <41695641+kilfoyle@users.noreply.github.com>","sha":"9396ef3d6bed213b681970a4914eeb558a30ed44","branchLabelMapping":{"^v8.12.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:enhancement","Team:Fleet","backport:prev-minor","v8.12.0"],"number":171405,"url":"https://github.com/elastic/kibana/pull/171405","mergeCommit":{"message":"[Fleet] Improve UX for policy secrets (#171405)\n\n## Summary\r\n\r\nCloses https://github.com/elastic/kibana/issues/171225\r\n\r\n- Highlights secrets during package policy creation with a distinct\r\nbackground and icon\r\n- Add tooltip + docs link for secrets where appropriate\r\n- Detect \"new secrets\" during policy upgrade and alert the user in a\r\nseparate callout\r\n\r\n## To do\r\n- [x] Fix any failing tests\r\n- [x] Add tests for \"new secrets\" detection logic\r\n\r\n## Screenshots\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n## How to test\r\n\r\nThere's probably an easier way to do this, but this is what I did\r\n\r\n1. Clone https://github.com/elastic/package-registry and\r\nhttps://github.com/elastic/integrations\r\n2. Add the following to `config.yml` in your package-registry repo\r\n\r\n```yml\r\npackage_paths:\r\n - path/to/your/integrations/build/packages\r\n```\r\n\r\n3. Build a version of an integration with some `secrets: true` for\r\nvarious variables. I used `1password`\r\n\r\n```shell\r\ncd integrations/packages/1password\r\n# Edit `manifest.yml` or a given `data_stream/*/manifest.yml` file to change some variables to `secret: true`. Also bump the version and update `changelog.yml`\r\nelastic-package build\r\n```\r\n\r\n4. Run the local package registry e.g. \r\n\r\n```shell\r\ncd package-registry\r\ngo run . --feature-proxy-mode=true -proxy-to=https://epr.elastic.co # makes it so you can still see EPR packages in Kibana\r\n```\r\n\r\n5. Update your `kibana.dev.yml` to point at your local package registry\r\n\r\n```yml\r\nxpack.fleet.registryUrl: http://localhost:8080\r\n```\r\n\r\n6. Start Kibana and Elasticsearch and install, upgrade, etc your package\r\nin question to verify the changes\r\n\r\n---------\r\n\r\nCo-authored-by: David Kilfoyle <41695641+kilfoyle@users.noreply.github.com>","sha":"9396ef3d6bed213b681970a4914eeb558a30ed44"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v8.12.0","labelRegex":"^v8.12.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/171405","number":171405,"mergeCommit":{"message":"[Fleet] Improve UX for policy secrets (#171405)\n\n## Summary\r\n\r\nCloses https://github.com/elastic/kibana/issues/171225\r\n\r\n- Highlights secrets during package policy creation with a distinct\r\nbackground and icon\r\n- Add tooltip + docs link for secrets where appropriate\r\n- Detect \"new secrets\" during policy upgrade and alert the user in a\r\nseparate callout\r\n\r\n## To do\r\n- [x] Fix any failing tests\r\n- [x] Add tests for \"new secrets\" detection logic\r\n\r\n## Screenshots\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n## How to test\r\n\r\nThere's probably an easier way to do this, but this is what I did\r\n\r\n1. Clone https://github.com/elastic/package-registry and\r\nhttps://github.com/elastic/integrations\r\n2. Add the following to `config.yml` in your package-registry repo\r\n\r\n```yml\r\npackage_paths:\r\n - path/to/your/integrations/build/packages\r\n```\r\n\r\n3. Build a version of an integration with some `secrets: true` for\r\nvarious variables. I used `1password`\r\n\r\n```shell\r\ncd integrations/packages/1password\r\n# Edit `manifest.yml` or a given `data_stream/*/manifest.yml` file to change some variables to `secret: true`. Also bump the version and update `changelog.yml`\r\nelastic-package build\r\n```\r\n\r\n4. Run the local package registry e.g. \r\n\r\n```shell\r\ncd package-registry\r\ngo run . --feature-proxy-mode=true -proxy-to=https://epr.elastic.co # makes it so you can still see EPR packages in Kibana\r\n```\r\n\r\n5. Update your `kibana.dev.yml` to point at your local package registry\r\n\r\n```yml\r\nxpack.fleet.registryUrl: http://localhost:8080\r\n```\r\n\r\n6. Start Kibana and Elasticsearch and install, upgrade, etc your package\r\nin question to verify the changes\r\n\r\n---------\r\n\r\nCo-authored-by: David Kilfoyle <41695641+kilfoyle@users.noreply.github.com>","sha":"9396ef3d6bed213b681970a4914eeb558a30ed44"}}]}] BACKPORT--> --------- Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
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.
Summary
Closes #171225
To do
Screenshots
How to test
There's probably an easier way to do this, but this is what I did
config.ymlin your package-registry reposecrets: truefor various variables. I used1passwordkibana.dev.ymlto point at your local package registry