[Look&Feel] apply missing pattern guidance to Alerting experience (#1004

) (#1023) Signed-off-by: Zhongnan Su <[email protected]> (cherry picked from commit 3c6cb06)
opensearch-project · Jul 25, 2024 · 69e6c7d · 69e6c7d
1 parent aa3468a
commit 69e6c7d
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 12 deletions.
diff --git a/cypress/integration/composite_level_monitor_spec.js b/cypress/integration/composite_level_monitor_spec.js
@@ -154,7 +154,7 @@ describe('CompositeLevelMonitor', () => {
 
       // Wait for monitor to be created
       cy.wait('@updateMonitorRequest').then(() => {
-        cy.get('.euiTitle--small').contains(`${SAMPLE_VISUAL_EDITOR_MONITOR}_edited`);
+        cy.get('.euiText--small').contains(`${SAMPLE_VISUAL_EDITOR_MONITOR}_edited`);
       });
     });
   });

diff --git a/public/components/Flyout/flyouts/__snapshots__/flyouts.test.js.snap b/public/components/Flyout/flyouts/__snapshots__/flyouts.test.js.snap
@@ -21,15 +21,15 @@ Object {
     <EuiFlexItem
       className="eui-textTruncate"
     >
-      <EuiTitle
+      <EuiText
         className="eui-textTruncate"
         data-test-subj="alertsDashboardFlyout_header_undefined"
-        size="m"
+        size="s"
       >
-        <h3>
+        <h2>
           Alerts by undefined
-        </h3>
-      </EuiTitle>
+        </h2>
+      </EuiText>
     </EuiFlexItem>
     <EuiFlexItem
       grow={false}

diff --git a/public/components/Flyout/flyouts/alertsDashboard.js b/public/components/Flyout/flyouts/alertsDashboard.js
@@ -4,7 +4,7 @@
  */
 
 import React from 'react';
-import { EuiFlexGroup, EuiSmallButtonIcon, EuiTitle, EuiFlexItem } from '@elastic/eui';
+import { EuiFlexGroup, EuiText, EuiFlexItem, EuiSmallButtonIcon } from '@elastic/eui';
 import AlertsDashboardFlyoutComponent from './components/AlertsDashboardFlyoutComponent';
 
 const alertsDashboard = (payload) => {
@@ -20,13 +20,13 @@ const alertsDashboard = (payload) => {
     header: (
       <EuiFlexGroup justifyContent="flexStart" alignItems="center">
         <EuiFlexItem className="eui-textTruncate">
-          <EuiTitle
+          <EuiText
             className="eui-textTruncate"
-            size={'m'}
+            size={'s'}
             data-test-subj={`alertsDashboardFlyout_header_${trigger_name}`}
           >
-            <h3>{`Alerts by ${trigger_name}`}</h3>
-          </EuiTitle>
+            <h2>{`Alerts by ${trigger_name}`}</h2>
+          </EuiText>
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiSmallButtonIcon

diff --git a/public/pages/Monitors/components/MonitorActions/MonitorActions.js b/public/pages/Monitors/components/MonitorActions/MonitorActions.js
@@ -103,7 +103,7 @@ export default class MonitorActions extends Component {
             panelPaddingSize="none"
             anchorPosition="downLeft"
           >
-            <EuiContextMenuPanel items={this.getActions()} />
+            <EuiContextMenuPanel items={this.getActions()} size="s" />
           </EuiPopover>
         </EuiFlexItem>
         <EuiFlexItem grow={false}>