fix: [Search:AppSearch:Engines:Synonyms page]Manage and Add synonym s…

…et modal dialogs missing title from announcement (elastic#202326)

Closes: elastic#202268

## Description
Dialog modal visible title should be announced for the users, especially
using assistive technology to know what dialog modal, flyout opened.

## Changes made:

1. aria-labelledby={modalTitleId} attribute was added for mentioned
EuiModal

# Screen

<img width="962" alt="Screenshot 2024-11-29 at 16 24 15"
src="https://github.com/user-attachments/assets/50f41305-8f68-4f0b-866f-3f37da2cbcc9">

x-pack/plugins/enterprise_search/public/applications/app_search/components/synonyms/components/synonym_modal.tsx

@@ -19,6 +19,7 @@ import {
   EuiFlexItem,
   EuiButton,
   EuiButtonEmpty,
+  useGeneratedHtmlId,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 
@@ -37,6 +38,7 @@ export const SynonymModal: React.FC = () => {
   const { isModalOpen, modalLoading, activeSynonymSet } = useValues(SynonymsLogic);
   const { closeModal, createSynonymSet, updateSynonymSet, deleteSynonymSet } =
     useActions(SynonymsLogic);
+  const modalTitleId = useGeneratedHtmlId();
 
   const modalTitle = activeSynonymSet ? SYNONYM_UPDATE_TITLE : SYNONYM_CREATE_TITLE;
   const id = activeSynonymSet?.id || 'createNewSynonymSet';
@@ -46,9 +48,9 @@ export const SynonymModal: React.FC = () => {
     : (newSynonyms: string[]) => createSynonymSet(newSynonyms);
 
   return isModalOpen ? (
-    <EuiModal onClose={closeModal}>
+    <EuiModal onClose={closeModal} aria-labelledby={modalTitleId}>
       <EuiModalHeader>
-        <EuiModalHeaderTitle>{modalTitle}</EuiModalHeaderTitle>
+        <EuiModalHeaderTitle id={modalTitleId}>{modalTitle}</EuiModalHeaderTitle>
       </EuiModalHeader>
       <FlashMessages />
       <EuiModalBody>
@@ -82,7 +84,12 @@ export const SynonymModal: React.FC = () => {
             )}
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
-            <EuiButtonEmpty onClick={closeModal}>{CANCEL_BUTTON_LABEL}</EuiButtonEmpty>
+            <EuiButtonEmpty
+              data-test-subj="enterpriseSearchSynonymModalButton"
+              onClick={closeModal}
+            >
+              {CANCEL_BUTTON_LABEL}
+            </EuiButtonEmpty>
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
             <EuiButton