github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 01:38:56 -04:00
Code Issues Projects Releases Packages Wiki Activity

[8.18] [A11y][APM] Add aria-label to fold traces button (#216485) (#217609)

Browse source 
# Backport

This will backport the following commits from `main` to `8.18`:
- [[A11y][APM] Add `aria-label` to fold traces button
(#216485)](https://github.com/elastic/kibana/pull/216485)

<!--- Backport version: 9.6.6 -->

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

<!--BACKPORT [{"author":{"name":"Sergi
Romeu","email":"sergi.romeu@elastic.co"},"sourceCommit":{"committedDate":"2025-04-01T09:06:55Z","message":"[A11y][APM]
Add `aria-label` to fold traces button (#216485)\n\n## Summary\n\nFixes
#212228\n\nThis PR adds `aria-label` to the fold/unfold traces
button.\n\n\n![image](https://github.com/user-attachments/assets/7c14d3d1-c246-4b85-a80c-4fb51dd1f305)","sha":"54ce010161e754d43f8eac60cf4b8a1c7f621cba","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","apm","Team:obs-ux-infra_services","backport:version","a11y","v9.1.0","v8.19.0","v8.18.1","v9.0.1"],"title":"[A11y][APM]
Add `aria-label` to fold traces
button","number":216485,"url":"https://github.com/elastic/kibana/pull/216485","mergeCommit":{"message":"[A11y][APM]
Add `aria-label` to fold traces button (#216485)\n\n## Summary\n\nFixes
#212228\n\nThis PR adds `aria-label` to the fold/unfold traces
button.\n\n\n![image](https://github.com/user-attachments/assets/7c14d3d1-c246-4b85-a80c-4fb51dd1f305)","sha":"54ce010161e754d43f8eac60cf4b8a1c7f621cba"}},"sourceBranch":"main","suggestedTargetBranches":["8.18","9.0"],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/216485","number":216485,"mergeCommit":{"message":"[A11y][APM]
Add `aria-label` to fold traces button (#216485)\n\n## Summary\n\nFixes
#212228\n\nThis PR adds `aria-label` to the fold/unfold traces
button.\n\n\n![image](https://github.com/user-attachments/assets/7c14d3d1-c246-4b85-a80c-4fb51dd1f305)","sha":"54ce010161e754d43f8eac60cf4b8a1c7f621cba"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"url":"https://github.com/elastic/kibana/pull/216600","number":216600,"state":"MERGED","mergeCommit":{"sha":"20425bc726d7cb6442f273c25f24ebaaafee4892","message":"[8.x]
[A11y][APM] Add `aria-label` to fold traces button (#216485)
(#216600)\n\n# Backport\n\nThis will backport the following commits from
`main` to `8.x`:\n- [[A11y][APM] Add `aria-label` to fold traces
button\n(#216485)](https://github.com/elastic/kibana/pull/216485)\n\n\n\n###
Questions ?\nPlease refer to the [Backport
tool\ndocumentation](https://github.com/sorenlouv/backport)\n\n\n\nCo-authored-by:
Sergi Romeu
<sergi.romeu@elastic.co>"}},{"branch":"8.18","label":"v8.18.1","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"9.0","label":"v9.0.1","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Sergi Romeu <sergi.romeu@elastic.co>
This commit is contained in:
Kibana Machine 2025-04-09 13:58:15 +02:00 • committed by GitHub
parent 3654301127
commit 1bb180276c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 12 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

12
x-pack/solutions/observability/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/index.tsx
View file

@ -145,6 +145,18 @@ export function Waterfall({ waterfall, waterfallItemId, showCriticalPath }: Prop
position: absolute;
z-index: ${theme.eui.euiZLevel2};
`}
aria-label={i18n.translate('xpack.apm.waterfall.foldButton.ariaLabel', {
defaultMessage: 'Click to {isAccordionOpen} the waterfall',
values: {
isAccordionOpen: isAccordionOpen
? i18n.translate('xpack.apm.waterfall.foldButton.ariaLabel.fold', {
defaultMessage: 'fold',
})
: i18n.translate('xpack.apm.waterfall.foldButton.ariaLabel.unfold', {
defaultMessage: 'unfold',
}),
},
})}
iconType={isAccordionOpen ? 'fold' : 'unfold'}
onClick={() => {
setIsAccordionOpen((isOpen) => !isOpen);