Skip to content

Commit

Permalink
[8.x] fix: [Search:AppSearch:Settings page]Issues with switches (#201798
Browse files Browse the repository at this point in the history
) (#201994)

# Backport

This will backport the following commits from `main` to `8.x`:
- [fix: [Search:AppSearch:Settings page]Issues with switches
(#201798)](#201798)

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

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

<!--BACKPORT [{"author":{"name":"Alexey
Antonov","email":"alexwizp@gmail.com"},"sourceCommit":{"committedDate":"2024-11-27T11:08:11Z","message":"fix:
[Search:AppSearch:Settings page]Issues with switches
(#201798)\n\nCloses: #200710\r\n\r\n## Description\r\nWhen switch is
turned on/off user should be correctly informed about it.\r\nEspecially,
for the user using assistive technology that he/she would\r\nunderstand
what happened with the button.\r\n\r\n## What was changed: \r\n\r\n1.
explicitly set `aria-labbeledby` attribute for `EuiSwitch`\r\n\r\n##
Screen\r\n\r\n<img width=\"1330\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/381fb3a9-41cf-4674-92ae-6d29fba61b63\">","sha":"acb596cbf10cd893bca8189461d5cd114b13502e","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Project:Accessibility","release_note:skip","v9.0.0","Team:Search","backport:prev-minor"],"title":"fix:
[Search:AppSearch:Settings page]Issues with
switches","number":201798,"url":"https://github.com/elastic/kibana/pull/201798","mergeCommit":{"message":"fix:
[Search:AppSearch:Settings page]Issues with switches
(#201798)\n\nCloses: #200710\r\n\r\n## Description\r\nWhen switch is
turned on/off user should be correctly informed about it.\r\nEspecially,
for the user using assistive technology that he/she would\r\nunderstand
what happened with the button.\r\n\r\n## What was changed: \r\n\r\n1.
explicitly set `aria-labbeledby` attribute for `EuiSwitch`\r\n\r\n##
Screen\r\n\r\n<img width=\"1330\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/381fb3a9-41cf-4674-92ae-6d29fba61b63\">","sha":"acb596cbf10cd893bca8189461d5cd114b13502e"}},"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/201798","number":201798,"mergeCommit":{"message":"fix:
[Search:AppSearch:Settings page]Issues with switches
(#201798)\n\nCloses: #200710\r\n\r\n## Description\r\nWhen switch is
turned on/off user should be correctly informed about it.\r\nEspecially,
for the user using assistive technology that he/she would\r\nunderstand
what happened with the button.\r\n\r\n## What was changed: \r\n\r\n1.
explicitly set `aria-labbeledby` attribute for `EuiSwitch`\r\n\r\n##
Screen\r\n\r\n<img width=\"1330\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/381fb3a9-41cf-4674-92ae-6d29fba61b63\">","sha":"acb596cbf10cd893bca8189461d5cd114b13502e"}}]}]
BACKPORT-->

Co-authored-by: Alexey Antonov <alexwizp@gmail.com>
  • Loading branch information
kibanamachine and alexwizp authored Nov 27, 2024
1 parent 556deb0 commit 0d4cbe3
Showing 1 changed file with 40 additions and 21 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
EuiText,
EuiTextColor,
EuiTitle,
useGeneratedHtmlId,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';

Expand All @@ -34,6 +35,7 @@ export const LogRetentionPanel: React.FC = () => {
const apiLogRetentionSettings = logRetention?.[LogRetentionOptions.API];
const auditLogRetentionSettings = logRetention?.[LogRetentionOptions.Audit];
const crawlerLogRetentionSettings = logRetention?.[LogRetentionOptions.Crawler];
const switchPrefixId = useGeneratedHtmlId();

useEffect(() => {
fetchLogRetention();
Expand All @@ -51,21 +53,24 @@ export const LogRetentionPanel: React.FC = () => {
<EuiSpacer size="m" />
<EuiText>
<EuiSwitch
aria-labelledby={`${switchPrefixId}analytics`}
label={
<>
<strong>
<strong id={`${switchPrefixId}analytics`}>
{i18n.translate(
'xpack.enterpriseSearch.appSearch.settings.logRetention.analytics.label',
{
defaultMessage: 'Log analytics events',
}
)}
</strong>
{': '}
{hasILM && (
<EuiTextColor color="subdued">
<LogRetentionMessage type={LogRetentionOptions.Analytics} />
</EuiTextColor>
<>
{': '}
<EuiTextColor color="subdued">
<LogRetentionMessage type={LogRetentionOptions.Analytics} />
</EuiTextColor>
</>
)}
</>
}
Expand All @@ -78,21 +83,24 @@ export const LogRetentionPanel: React.FC = () => {
<EuiSpacer size="m" />
<EuiText>
<EuiSwitch
aria-labelledby={`${switchPrefixId}api`}
label={
<>
<strong>
<strong id={`${switchPrefixId}api`}>
{i18n.translate(
'xpack.enterpriseSearch.appSearch.settings.logRetention.api.label',
{
defaultMessage: 'Log API events',
}
)}
</strong>
{': '}
{hasILM && (
<EuiTextColor color="subdued">
<LogRetentionMessage type={LogRetentionOptions.API} />
</EuiTextColor>
<>
{': '}
<EuiTextColor color="subdued">
<LogRetentionMessage type={LogRetentionOptions.API} />
</EuiTextColor>
</>
)}
</>
}
Expand All @@ -105,21 +113,24 @@ export const LogRetentionPanel: React.FC = () => {
<EuiSpacer size="m" />
<EuiText>
<EuiSwitch
aria-labelledby={`${switchPrefixId}crawler`}
label={
<>
<strong>
<strong id={`${switchPrefixId}crawler`}>
{i18n.translate(
'xpack.enterpriseSearch.appSearch.settings.logRetention.crawler.label',
{
defaultMessage: 'Web Crawler Logs',
}
)}
</strong>
{': '}
{hasILM && (
<EuiTextColor color="subdued">
<LogRetentionMessage type={LogRetentionOptions.Crawler} />
</EuiTextColor>
<>
{': '}
<EuiTextColor color="subdued">
<LogRetentionMessage type={LogRetentionOptions.Crawler} />
</EuiTextColor>
</>
)}
</>
}
Expand All @@ -132,21 +143,25 @@ export const LogRetentionPanel: React.FC = () => {
<EuiSpacer size="m" />
<EuiText>
<EuiSwitch
aria-labelledby={`${switchPrefixId}audit`}
label={
<>
<strong>
<strong id={`${switchPrefixId}audit`}>
{i18n.translate(
'xpack.enterpriseSearch.appSearch.settings.logRetention.audit.label',
{
defaultMessage: 'Log audit events',
}
)}
</strong>
{': '}
{hasILM && (
<EuiTextColor color="subdued">
<LogRetentionMessage type={LogRetentionOptions.Audit} />
</EuiTextColor>
<>
{': '}
<EuiTextColor color="subdued">
<LogRetentionMessage type={LogRetentionOptions.Audit} />
</EuiTextColor>
{': '}
</>
)}
</>
}
Expand All @@ -163,7 +178,11 @@ export const LogRetentionPanel: React.FC = () => {
defaultMessage: 'Log retention is determined by the ILM policies for your deployment.',
})}
<br />
<EuiLink href={docLinks.appSearchLogSettings} target="_blank">
<EuiLink
data-test-subj="enterpriseSearchLogRetentionPanelLearnMoreAboutLogRetentionForEnterpriseSearchLink"
href={docLinks.appSearchLogSettings}
target="_blank"
>
{i18n.translate('xpack.enterpriseSearch.appSearch.settings.logRetention.learnMore', {
defaultMessage: 'Learn more about log retention for Enterprise Search.',
})}
Expand Down

0 comments on commit 0d4cbe3

Please sign in to comment.