[8.x] [ObsUx][A11y] Add unique accessible lables to metadata table (#217496)

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

@@ -25380,13 +25380,6 @@
     "xpack.infra.logsSettingsPage.loadingButtonLabel": "Chargement",
     "xpack.infra.logsStreamEmbeddable.deprecationWarningDescription": "La maintenance des panneaux de flux de logs n'est plus assurée. Essayez d'utiliser {savedSearchDocsLink} pour une visualisation similaire.",
     "xpack.infra.logsStreamEmbeddable.deprecationWarningDescription.discoverSessionsLinkLabel": "Sessions Discover",
-    "xpack.infra.logStreamEmbeddable.description": "Ajoutez un tableau de logs de diffusion en direct. Pour une expérience plus efficace, nous vous recommandons d'utiliser la page Découvrir pour créer une session Discovery au lieu d'utiliser Logs Stream.",
-    "xpack.infra.logStreamEmbeddable.displayName": "Logs Stream (déclassé)",
-    "xpack.infra.logStreamEmbeddable.title": "Flux de log",
-    "xpack.infra.logStreamPageTemplate.backtoLogsStream": "Retour au flux de logs",
-    "xpack.infra.logStreamPageTemplate.widgetBadge": "Widget",
-    "xpack.infra.logStreamPageTemplate.widgetDescription": "Vous visionnez un widget intégré. Les modifications seront synchronisées avec l'URL, mais elles ne seront pas conservées dans la vue par défaut du flux de logs.",
-    "xpack.infra.metadata.pinAriaLabel": "Champ épinglé",
     "xpack.infra.metadataEmbeddable.AddFilterAriaLabel": "Ajouter un filtre",
     "xpack.infra.metadataEmbeddable.errorAction": "récupérer de nouveau les métadonnées",
     "xpack.infra.metadataEmbeddable.errorMessage": "Une erreur s'est produite lors du chargement des données. Essayez de {refetch} et d'ouvrir à nouveau les détails de l'hôte.",
@@ -51793,4 +51786,4 @@
     "xpack.watcher.watchEdit.thresholdWatchExpression.aggType.fieldIsRequiredValidationMessage": "Ce champ est requis.",
     "xpack.watcher.watcherDescription": "Détectez les modifications survenant dans vos données en créant, gérant et monitorant des alertes."
   }
-}
+}

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

@@ -25358,13 +25358,6 @@
     "xpack.infra.logsSettingsPage.loadingButtonLabel": "読み込み中",
     "xpack.infra.logsStreamEmbeddable.deprecationWarningDescription": "ログストリームパネルは管理されていません。{savedSearchDocsLink}を同様の視覚化に活用してください。",
     "xpack.infra.logsStreamEmbeddable.deprecationWarningDescription.discoverSessionsLinkLabel": "Discoverセッション",
-    "xpack.infra.logStreamEmbeddable.description": "ライブストリーミングログのテーブルを追加します。体験を効率化するために、ログストリームを使用するのではなく、検出ページを使用して、保存されたDiscoverセッションを作成することをお勧めします。",
-    "xpack.infra.logStreamEmbeddable.displayName": "ログストリーム（廃止予定）",
-    "xpack.infra.logStreamEmbeddable.title": "ログストリーム",
-    "xpack.infra.logStreamPageTemplate.backtoLogsStream": "ログストリームに戻る",
-    "xpack.infra.logStreamPageTemplate.widgetBadge": "ウィジェット",
-    "xpack.infra.logStreamPageTemplate.widgetDescription": "埋め込まれたウィジェットを表示しています。変更はURLと同期されますが、デフォルトログストリームビューには永続しません。",
-    "xpack.infra.metadata.pinAriaLabel": "固定されたフィールド",
     "xpack.infra.metadataEmbeddable.AddFilterAriaLabel": "フィルターを追加",
     "xpack.infra.metadataEmbeddable.errorAction": "メタデータを再取得",
     "xpack.infra.metadataEmbeddable.errorMessage": "データの読み込みエラーが発生しました。{refetch}し、ホスト詳細をもう一度開いてください。",
@@ -51754,4 +51747,4 @@
     "xpack.watcher.watchEdit.thresholdWatchExpression.aggType.fieldIsRequiredValidationMessage": "フィールドを選択してください。",
     "xpack.watcher.watcherDescription": "アラートの作成、管理、監視によりデータへの変更を検知します。"
   }
-}
+}

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

@@ -25411,13 +25411,6 @@
     "xpack.infra.logsSettingsPage.loadingButtonLabel": "正在加载",
     "xpack.infra.logsStreamEmbeddable.deprecationWarningDescription": "将不再维护日志流面板。尝试将 {savedSearchDocsLink} 用于类似可视化。",
     "xpack.infra.logsStreamEmbeddable.deprecationWarningDescription.discoverSessionsLinkLabel": "Discover 会话",
-    "xpack.infra.logStreamEmbeddable.description": "添加实时流式传输日志的表。为了获得更高效的体验，建议使用 Discover 页面创建保存的 Discover 会话，而不是使用日志流。",
-    "xpack.infra.logStreamEmbeddable.displayName": "日志流（已过时）",
-    "xpack.infra.logStreamEmbeddable.title": "日志流",
-    "xpack.infra.logStreamPageTemplate.backtoLogsStream": "返回到日志流",
-    "xpack.infra.logStreamPageTemplate.widgetBadge": "小组件",
-    "xpack.infra.logStreamPageTemplate.widgetDescription": "您正在查看嵌入式小组件。更改将同步到 URL，但不会持续存在于默认日志流视图。",
-    "xpack.infra.metadata.pinAriaLabel": "已固定字段",
     "xpack.infra.metadataEmbeddable.AddFilterAriaLabel": "添加筛选",
     "xpack.infra.metadataEmbeddable.errorAction": "重新提取元数据",
     "xpack.infra.metadataEmbeddable.errorMessage": "加载数据时出错。尝试{refetch}并再次打开主机详情。",
@@ -51838,4 +51831,4 @@
     "xpack.watcher.watchEdit.thresholdWatchExpression.aggType.fieldIsRequiredValidationMessage": "此字段必填。",
     "xpack.watcher.watcherDescription": "通过创建、管理和监测警报来检测数据中的更改。"
   }
-}
+}

x-pack/solutions/observability/plugins/infra/public/components/asset_details/components/expandable_content.tsx

@@ -14,10 +14,11 @@ import useToggle from 'react-use/lib/useToggle';
 import type { Field } from '../tabs/metadata/utils';
 
 interface ExpandableContentProps {
+  fieldName?: string;
   values?: Field['value'];
 }
 export const ExpandableContent = (props: ExpandableContentProps) => {
-  const { values } = props;
+  const { fieldName, values } = props;
   const [isExpanded, toggle] = useToggle(false);
   const showLessRef = useRef<HTMLAnchorElement | null>(null);
   const showMoreRef = useRef<HTMLAnchorElement | null>(null);
@@ -50,15 +51,17 @@ export const ExpandableContent = (props: ExpandableContentProps) => {
           <>
             <EuiLink
               data-test-subj="infraAssetDetailsExpandableContentCountMoreLink"
+              aria-label={i18n.translate('xpack.infra.assetDetails.metadata.seeMore.ariaLabel', {
+                defaultMessage: 'See {count} more {fieldName}',
+                values: { fieldName, count: others.length },
+              })}
               onClick={handleToggle}
               ref={showMoreRef}
             >
               <FormattedMessage
                 id="xpack.infra.assetDetails.tabs.metadata.seeMore"
                 defaultMessage="+{count} more"
-                values={{
-                  count: others.length,
-                }}
+                values={{ count: others.length }}
               />
             </EuiLink>
           </>

x-pack/solutions/observability/plugins/infra/public/components/asset_details/tabs/metadata/add_pin_to_row.tsx

@@ -18,10 +18,6 @@ interface AddMetadataPinToRowProps {
   onPinned: Dispatch<React.SetStateAction<Array<Field['name']> | undefined>>;
 }
 
-const PIN_FIELD = i18n.translate('xpack.infra.metadataEmbeddable.pinField', {
-  defaultMessage: 'Pin Field',
-});
-
 export const AddMetadataPinToRow = ({
   fieldName,
   pinnedItems,
@@ -52,8 +48,9 @@ export const AddMetadataPinToRow = ({
             color="primary"
             iconType="pinFilled"
             data-test-subj="infraAssetDetailsMetadataRemovePin"
-            aria-label={i18n.translate('xpack.infra.metadata.pinAriaLabel', {
-              defaultMessage: 'Pinned field',
+            aria-label={i18n.translate('xpack.infra.metadata.pinnedAriaLabel', {
+              defaultMessage: 'Pinned {fieldName}',
+              values: { fieldName },
             })}
             onClick={handleRemovePin}
           />
@@ -78,13 +75,20 @@ export const AddMetadataPinToRow = ({
 
   return (
     <span className={showOnRowHoverCss}>
-      <EuiToolTip content={PIN_FIELD}>
+      <EuiToolTip
+        content={i18n.translate('xpack.infra.metadataEmbeddable.pinField', {
+          defaultMessage: 'Pin field',
+        })}
+      >
         <EuiButtonIcon
           color="primary"
           size="s"
           iconType="pin"
           data-test-subj="infraAssetDetailsMetadataAddPin"
-          aria-label={PIN_FIELD}
+          aria-label={i18n.translate('xpack.infra.metadataEmbeddable.pinField.ariaLabel', {
+            defaultMessage: 'Pin {fieldName}',
+            values: { fieldName },
+          })}
           onClick={handleAddPin}
         />
       </EuiToolTip>

x-pack/solutions/observability/plugins/infra/public/components/asset_details/tabs/metadata/table.tsx

@@ -77,7 +77,14 @@ export const Table = ({ loading, rows, onSearchChange, search, showActionsColumn
     () => [
       {
         field: 'value',
-        name: <EuiIcon type="pin" />,
+        name: (
+          <EuiIcon
+            type="pin"
+            aria-label={i18n.translate('xpack.infra.metadataEmbeddable.pinFieldsColumn.ariaLabel', {
+              defaultMessage: 'Pin fields',
+            })}
+          />
+        ),
         align: 'center' as HorizontalAlignment,
         width: '5%',
         sortable: false,
@@ -103,7 +110,9 @@ export const Table = ({ loading, rows, onSearchChange, search, showActionsColumn
         name: VALUE_LABEL,
         width: '50%',
         sortable: false,
-        render: (_name: string, item: Field) => <ExpandableContent values={item.value} />,
+        render: (_name: string, item: Field) => (
+          <ExpandableContent fieldName={item.name} values={item.value} />
+        ),
       },
     ],
     [pinnedItems, setPinnedItems]