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

[ResponseOps][Connectors] Fix flex issues of create connector flyout with technical badge #194775

Merged
merged 2 commits into from
Oct 3, 2024

Conversation

mdefazio
Copy link
Contributor

@mdefazio mdefazio commented Oct 3, 2024

Summary

When multiple badges are present, the Technical Preview badge in the Connector flyout gets pushed away from the title.

CleanShot 2024-10-02 at 20 51 04@2x

With the flexbox fixes
CleanShot 2024-10-02 at 20 49 40@2x

Checklist

Delete any items that are not applicable to this PR.

@mdefazio mdefazio requested a review from a team as a code owner October 3, 2024 01:02
@mdefazio mdefazio added Feature:Actions/ConnectorTypes Issues related to specific Connector Types on the Actions Framework 8.16 candidate labels Oct 3, 2024
@mdefazio mdefazio requested a review from cnasikas October 3, 2024 01:03
@kibana-ci
Copy link
Collaborator

💛 Build succeeded, but was flaky

Failed CI Steps

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
triggersActionsUi 1.6MB 1.6MB +8.0B

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

@cnasikas cnasikas added release_note:skip Skip the PR/issue when compiling release notes Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) v9.0.0 backport:prev-minor Backport to (8.x) the previous minor version (i.e. one version back from main) v8.16.0 and removed 8.16 candidate labels Oct 3, 2024
@elasticmachine
Copy link
Contributor

Pinging @elastic/response-ops (Team:ResponseOps)

@cnasikas cnasikas changed the title Fix flex issues of create connector flyout with technical badge [ResponseOps][Connectors] Fix flex issues of create connector flyout with technical badge Oct 3, 2024
@mdefazio mdefazio merged commit d22b830 into elastic:main Oct 3, 2024
47 checks passed
@mdefazio mdefazio deleted the create-connector-flyout branch October 3, 2024 10:05
@kibanamachine
Copy link
Contributor

Starting backport for target branches: 8.x

https://github.com/elastic/kibana/actions/runs/11159956896

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Oct 3, 2024
…with technical badge (elastic#194775)

## Summary

When multiple badges are present, the Technical Preview badge in the
Connector flyout gets pushed away from the title.

![CleanShot 2024-10-02 at 20 51
04@2x](https://github.com/user-attachments/assets/2e12e082-9a53-4046-a7a0-7c3bb2d6a100)

With the flexbox fixes
![CleanShot 2024-10-02 at 20 49
40@2x](https://github.com/user-attachments/assets/6a2f92b9-226b-4497-9058-18a5b7cf4ebf)

### Checklist

Delete any items that are not applicable to this PR.

- [ ] ~Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)~
- [ ]
~[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials~
- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] [Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed
- [ ] ~Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard
accessibility](https://webaim.org/techniques/keyboard/))~
- [ ] ~Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))~
- [ ] ~If a plugin configuration key changed, check if it needs to be
allowlisted in the cloud and added to the [docker
list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)~
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

(cherry picked from commit d22b830)
@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 Oct 3, 2024
…lyout with technical badge (#194775) (#194800)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[ResponseOps][Connectors] Fix flex issues of create connector flyout
with technical badge
(#194775)](#194775)

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

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

<!--BACKPORT [{"author":{"name":"Michael
DeFazio","email":"michael.defazio@elastic.co"},"sourceCommit":{"committedDate":"2024-10-03T10:04:56Z","message":"[ResponseOps][Connectors]
Fix flex issues of create connector flyout with technical badge
(#194775)\n\n## Summary\r\n\r\nWhen multiple badges are present, the
Technical Preview badge in the\r\nConnector flyout gets pushed away from
the title.\r\n\r\n![CleanShot 2024-10-02 at 20
51\r\n04@2x](https://github.com/user-attachments/assets/2e12e082-9a53-4046-a7a0-7c3bb2d6a100)\r\n\r\nWith
the flexbox fixes\r\n![CleanShot 2024-10-02 at 20
49\r\n40@2x](https://github.com/user-attachments/assets/6a2f92b9-226b-4497-9058-18a5b7cf4ebf)\r\n\r\n\r\n###
Checklist\r\n\r\nDelete any items that are not applicable to this
PR.\r\n\r\n- [ ] ~Any text added follows [EUI's
writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\r\nsentence case text and includes
[i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)~\r\n-
[
]\r\n~[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)\r\nwas
added for features that require explanation or tutorials~\r\n- [ ] [Unit
or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [ ] [Flaky
Test\r\nRunner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1)
was\r\nused on any tests changed\r\n- [ ] ~Any UI touched in this PR is
usable by keyboard only (learn more\r\nabout
[keyboard\r\naccessibility](https://webaim.org/techniques/keyboard/))~\r\n-
[ ] ~Any UI touched in this PR does not create any new axe
failures\r\n(run axe in
browser:\r\n[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),\r\n[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))~\r\n-
[ ] ~If a plugin configuration key changed, check if it needs to
be\r\nallowlisted in the cloud and added to the
[docker\r\nlist](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)~\r\n-
[x] This renders correctly on smaller devices using a
responsive\r\nlayout. (You can test this [in
your\r\nbrowser](https://www.browserstack.com/guide/responsive-testing-on-local-server))\r\n-
[x] This was checked for
[cross-browser\r\ncompatibility](https://www.elastic.co/support/matrix#matrix_browsers)","sha":"d22b8306236d98c376c42e94a268fd5f9d8bca85","branchLabelMapping":{"^v9.0.0$":"main","^v8.16.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","Team:ResponseOps","v9.0.0","Feature:Actions/ConnectorTypes","backport:prev-minor","v8.16.0"],"title":"[ResponseOps][Connectors]
Fix flex issues of create connector flyout with technical
badge","number":194775,"url":"https://github.com/elastic/kibana/pull/194775","mergeCommit":{"message":"[ResponseOps][Connectors]
Fix flex issues of create connector flyout with technical badge
(#194775)\n\n## Summary\r\n\r\nWhen multiple badges are present, the
Technical Preview badge in the\r\nConnector flyout gets pushed away from
the title.\r\n\r\n![CleanShot 2024-10-02 at 20
51\r\n04@2x](https://github.com/user-attachments/assets/2e12e082-9a53-4046-a7a0-7c3bb2d6a100)\r\n\r\nWith
the flexbox fixes\r\n![CleanShot 2024-10-02 at 20
49\r\n40@2x](https://github.com/user-attachments/assets/6a2f92b9-226b-4497-9058-18a5b7cf4ebf)\r\n\r\n\r\n###
Checklist\r\n\r\nDelete any items that are not applicable to this
PR.\r\n\r\n- [ ] ~Any text added follows [EUI's
writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\r\nsentence case text and includes
[i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)~\r\n-
[
]\r\n~[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)\r\nwas
added for features that require explanation or tutorials~\r\n- [ ] [Unit
or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [ ] [Flaky
Test\r\nRunner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1)
was\r\nused on any tests changed\r\n- [ ] ~Any UI touched in this PR is
usable by keyboard only (learn more\r\nabout
[keyboard\r\naccessibility](https://webaim.org/techniques/keyboard/))~\r\n-
[ ] ~Any UI touched in this PR does not create any new axe
failures\r\n(run axe in
browser:\r\n[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),\r\n[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))~\r\n-
[ ] ~If a plugin configuration key changed, check if it needs to
be\r\nallowlisted in the cloud and added to the
[docker\r\nlist](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)~\r\n-
[x] This renders correctly on smaller devices using a
responsive\r\nlayout. (You can test this [in
your\r\nbrowser](https://www.browserstack.com/guide/responsive-testing-on-local-server))\r\n-
[x] This was checked for
[cross-browser\r\ncompatibility](https://www.elastic.co/support/matrix#matrix_browsers)","sha":"d22b8306236d98c376c42e94a268fd5f9d8bca85"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/194775","number":194775,"mergeCommit":{"message":"[ResponseOps][Connectors]
Fix flex issues of create connector flyout with technical badge
(#194775)\n\n## Summary\r\n\r\nWhen multiple badges are present, the
Technical Preview badge in the\r\nConnector flyout gets pushed away from
the title.\r\n\r\n![CleanShot 2024-10-02 at 20
51\r\n04@2x](https://github.com/user-attachments/assets/2e12e082-9a53-4046-a7a0-7c3bb2d6a100)\r\n\r\nWith
the flexbox fixes\r\n![CleanShot 2024-10-02 at 20
49\r\n40@2x](https://github.com/user-attachments/assets/6a2f92b9-226b-4497-9058-18a5b7cf4ebf)\r\n\r\n\r\n###
Checklist\r\n\r\nDelete any items that are not applicable to this
PR.\r\n\r\n- [ ] ~Any text added follows [EUI's
writing\r\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\r\nsentence case text and includes
[i18n\r\nsupport](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)~\r\n-
[
]\r\n~[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)\r\nwas
added for features that require explanation or tutorials~\r\n- [ ] [Unit
or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [ ] [Flaky
Test\r\nRunner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1)
was\r\nused on any tests changed\r\n- [ ] ~Any UI touched in this PR is
usable by keyboard only (learn more\r\nabout
[keyboard\r\naccessibility](https://webaim.org/techniques/keyboard/))~\r\n-
[ ] ~Any UI touched in this PR does not create any new axe
failures\r\n(run axe in
browser:\r\n[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),\r\n[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))~\r\n-
[ ] ~If a plugin configuration key changed, check if it needs to
be\r\nallowlisted in the cloud and added to the
[docker\r\nlist](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)~\r\n-
[x] This renders correctly on smaller devices using a
responsive\r\nlayout. (You can test this [in
your\r\nbrowser](https://www.browserstack.com/guide/responsive-testing-on-local-server))\r\n-
[x] This was checked for
[cross-browser\r\ncompatibility](https://www.elastic.co/support/matrix#matrix_browsers)","sha":"d22b8306236d98c376c42e94a268fd5f9d8bca85"}},{"branch":"8.x","label":"v8.16.0","branchLabelMappingKey":"^v8.16.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Michael DeFazio <michael.defazio@elastic.co>
tiansivive pushed a commit to tiansivive/kibana that referenced this pull request Oct 7, 2024
…with technical badge (elastic#194775)

## Summary

When multiple badges are present, the Technical Preview badge in the
Connector flyout gets pushed away from the title.

![CleanShot 2024-10-02 at 20 51
04@2x](https://github.com/user-attachments/assets/2e12e082-9a53-4046-a7a0-7c3bb2d6a100)

With the flexbox fixes
![CleanShot 2024-10-02 at 20 49
40@2x](https://github.com/user-attachments/assets/6a2f92b9-226b-4497-9058-18a5b7cf4ebf)


### Checklist

Delete any items that are not applicable to this PR.

- [ ] ~Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)~
- [ ]
~[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials~
- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] [Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed
- [ ] ~Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard
accessibility](https://webaim.org/techniques/keyboard/))~
- [ ] ~Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))~
- [ ] ~If a plugin configuration key changed, check if it needs to be
allowlisted in the cloud and added to the [docker
list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)~
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)
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:Actions/ConnectorTypes Issues related to specific Connector Types on the Actions Framework release_note:skip Skip the PR/issue when compiling release notes Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) v8.16.0 v9.0.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants