fix: [Security > Get Started][SCREEN READER]: Accordion arrow buttons…

… to expand/collapse sections need unique accessible labels (#180907)

Closes: elastic/security-team#8929

## Description
The Getting Started page has several accordions with arrow buttons to
expand and collapse the sections. These buttons have generic "Expand"
accessible labels that do not provide enough information to screen
readers and voice activation technologies. We should update the
accessible labels to include the section name.

### Steps to recreate

1. Open the [QA environment](https://console.qa.cld.elstc.co/) and
create a new Security serverless project if none exist
2. Once your Security project is created, open it and turn on a screen
reader of your choice
3. Load the Getting Started page (should be by default, but just in
case)
4. Tab through the accordion sections and verify each one says "Expand"
when the arrow button takes focus

### What was done?: 
1. The `aria-expanded` attribute was added to the toggle-button.
2. The `aria-label` was updated to display the title part.
3. The `COLLAPSE_STEP_BUTTON_LABEL` translation was removed.

### Screen 
<img width="1565" alt="image"
src="https://github.com/elastic/kibana/assets/20072247/497077b8-c272-4985-8a85-653e1f29d776">

x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_step/index.tsx

@@ -26,11 +26,7 @@ import type {
   StepId,
   Step,
 } from '../types';
-import {
-  ALL_DONE_TEXT,
-  COLLAPSE_STEP_BUTTON_LABEL,
-  EXPAND_STEP_BUTTON_LABEL,
-} from '../translations';
+import { ALL_DONE_TEXT, EXPAND_STEP_BUTTON_LABEL } from '../translations';
 
 import { StepContent } from './step_content';
 import { useCheckStepCompleted } from '../hooks/use_check_step_completed';
@@ -149,7 +145,8 @@ const CardStepComponent: React.FC<{
               color="primary"
               onClick={toggleStep}
               iconType={isExpandedStep ? 'arrowUp' : 'arrowDown'}
-              aria-label={isExpandedStep ? COLLAPSE_STEP_BUTTON_LABEL : EXPAND_STEP_BUTTON_LABEL}
+              aria-label={EXPAND_STEP_BUTTON_LABEL(title ?? '')}
+              aria-expanded={isExpandedStep}
               size="xs"
               css={toggleButtonStyles}
               isDisabled={!hasStepContent}

x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/translations.ts

@@ -269,16 +269,8 @@ export const ALL_DONE_TEXT = i18n.translate(
   }
 );
 
-export const COLLAPSE_STEP_BUTTON_LABEL = i18n.translate(
-  'xpack.securitySolution.onboarding.togglePanel.collapseStepButton.label',
-  {
-    defaultMessage: 'Collapse',
-  }
-);
-
-export const EXPAND_STEP_BUTTON_LABEL = i18n.translate(
-  'xpack.securitySolution.onboarding.togglePanel.expandStepButton.label',
-  {
-    defaultMessage: 'Expand',
-  }
-);
+export const EXPAND_STEP_BUTTON_LABEL = (title: string) =>
+  i18n.translate('xpack.securitySolution.onboarding.togglePanel.expandStepButton.ariaLabel', {
+    defaultMessage: 'Expand "{title}"',
+    values: { title },
+  });

x-pack/plugins/translations/translations/fr-FR.json

@@ -37257,11 +37257,9 @@
     "xpack.securitySolution.onboarding.task.viewAlerts": "Afficher les alertes",
     "xpack.securitySolution.onboarding.task.viewAlerts.callout.title": "afficher les alertes",
     "xpack.securitySolution.onboarding.task.viewDashboards.callout.title": "afficher les tableaux de bord",
-    "xpack.securitySolution.onboarding.togglePanel.collapseStepButton.label": "Réduire",
     "xpack.securitySolution.onboarding.togglePanel.done.title": "Étape terminée",
     "xpack.securitySolution.onboarding.togglePanel.empty.description": "Activez une bascule pour poursuivre votre expérience \"Démarrer\" organisée",
     "xpack.securitySolution.onboarding.togglePanel.empty.title": "Hmm, on dirait qu’il n’y a rien ici",
-    "xpack.securitySolution.onboarding.togglePanel.expandStepButton.label": "Développer",
     "xpack.securitySolution.onboarding.togglePanel.markAsDoneTitle": "Marquer comme terminé",
     "xpack.securitySolution.onboarding.togglePanel.productBadge.analytics": "Analyse",
     "xpack.securitySolution.onboarding.togglePanel.productBadge.cloud": "Cloud",

x-pack/plugins/translations/translations/ja-JP.json

@@ -37226,11 +37226,9 @@
     "xpack.securitySolution.onboarding.task.viewAlerts": "アラートを表示",
     "xpack.securitySolution.onboarding.task.viewAlerts.callout.title": "アラートを表示",
     "xpack.securitySolution.onboarding.task.viewDashboards.callout.title": "ダッシュボードを表示",
-    "xpack.securitySolution.onboarding.togglePanel.collapseStepButton.label": "縮小",
     "xpack.securitySolution.onboarding.togglePanel.done.title": "ステップ完了",
     "xpack.securitySolution.onboarding.togglePanel.empty.description": "トグルをオンにすると、キュレーションされた「基本操作」エクスペリエンスを続行できます",
     "xpack.securitySolution.onboarding.togglePanel.empty.title": "何もないようです",
-    "xpack.securitySolution.onboarding.togglePanel.expandStepButton.label": "拡張",
     "xpack.securitySolution.onboarding.togglePanel.markAsDoneTitle": "完了に設定",
     "xpack.securitySolution.onboarding.togglePanel.productBadge.analytics": "分析",
     "xpack.securitySolution.onboarding.togglePanel.productBadge.cloud": "クラウド",

x-pack/plugins/translations/translations/zh-CN.json

@@ -37269,11 +37269,9 @@
     "xpack.securitySolution.onboarding.task.viewAlerts": "查看告警",
     "xpack.securitySolution.onboarding.task.viewAlerts.callout.title": "查看告警",
     "xpack.securitySolution.onboarding.task.viewDashboards.callout.title": "查看仪表板",
-    "xpack.securitySolution.onboarding.togglePanel.collapseStepButton.label": "折叠",
     "xpack.securitySolution.onboarding.togglePanel.done.title": "步骤已完成",
     "xpack.securitySolution.onboarding.togglePanel.empty.description": "打开切换按钮，继续您策展的“开始使用”体验",
     "xpack.securitySolution.onboarding.togglePanel.empty.title": "嗯，那里似乎没有任何内容",
-    "xpack.securitySolution.onboarding.togglePanel.expandStepButton.label": "展开",
     "xpack.securitySolution.onboarding.togglePanel.markAsDoneTitle": "标记为已完成",
     "xpack.securitySolution.onboarding.togglePanel.productBadge.analytics": "分析",
     "xpack.securitySolution.onboarding.togglePanel.productBadge.cloud": "云",