[Connectors][Opsgenie] Edits formatting for required fields (#172420)

x-pack/plugins/stack_connectors/public/connector_types/opsgenie/close_alert.tsx

@@ -11,7 +11,14 @@ import {
   TextAreaWithMessageVariables,
   TextFieldWithMessageVariables,
 } from '@kbn/triggers-actions-ui-plugin/public';
-import { EuiFlexGroup, EuiFlexItem, EuiFormRow, EuiSpacer, RecursivePartial } from '@elastic/eui';
+import {
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiFormRow,
+  EuiSpacer,
+  EuiText,
+  RecursivePartial,
+} from '@elastic/eui';
 import type {
   OpsgenieActionParams,
   OpsgenieCloseAlertParams,
@@ -112,8 +119,13 @@ const CloseAlertComponent: React.FC<CloseAlertProps> = ({
         fullWidth
         error={errors['subActionParams.alias']}
         isInvalid={isAliasInvalid}
-        label={i18n.ALIAS_REQUIRED_FIELD_LABEL}
+        label={i18n.ALIAS_FIELD_LABEL}
         helpText={i18n.OPSGENIE_ALIAS_HELP}
+        labelAppend={
+          <EuiText size="xs" color="subdued">
+            {i18n.REQUIRED_LABEL}
+          </EuiText>
+        }
       >
         <TextFieldWithMessageVariables
           index={index}

x-pack/plugins/stack_connectors/public/connector_types/opsgenie/create_alert/index.tsx

@@ -19,6 +19,7 @@ import {
   EuiFormRow,
   EuiSpacer,
   EuiSwitch,
+  EuiText,
 } from '@elastic/eui';
 import type {
   OpsgenieActionParams,
@@ -60,6 +61,11 @@ const FormView: React.FC<FormViewProps> = ({
         error={errors['subActionParams.message']}
         label={i18n.MESSAGE_FIELD_LABEL}
         isInvalid={isMessageInvalid}
+        labelAppend={
+          <EuiText size="xs" color="subdued">
+            {i18n.REQUIRED_LABEL}
+          </EuiText>
+        }
       >
         <TextFieldWithMessageVariables
           index={index}

x-pack/plugins/stack_connectors/public/connector_types/opsgenie/create_alert/translations.ts

@@ -26,7 +26,7 @@ export const LOADING_JSON_EDITOR = i18n.translate(
 export const MESSAGE_FIELD_LABEL = i18n.translate(
   'xpack.stackConnectors.components.opsgenie.messageLabel',
   {
-    defaultMessage: 'Message (required)',
+    defaultMessage: 'Message',
   }
 );
 
@@ -107,3 +107,10 @@ export const RULE_TAGS_DESCRIPTION = i18n.translate(
     defaultMessage: 'The tags of the rule.',
   }
 );
+
+export const REQUIRED_LABEL = i18n.translate(
+  'xpack.stackConnectors.components.opsgenie.requiredLabel',
+  {
+    defaultMessage: 'Required',
+  }
+);

x-pack/plugins/stack_connectors/public/connector_types/opsgenie/params.test.tsx

@@ -81,7 +81,7 @@ describe('OpsgenieParamFields', () => {
   it('renders the create alert component', async () => {
     render(<OpsgenieParamFields {...defaultCreateAlertProps} />);
 
-    expect(screen.getByText('Message (required)')).toBeInTheDocument();
+    expect(screen.getByText('Message')).toBeInTheDocument();
     expect(screen.getByText('Alias')).toBeInTheDocument();
     expect(screen.getByTestId('opsgenie-subActionSelect'));
 
@@ -93,7 +93,7 @@ describe('OpsgenieParamFields', () => {
     render(<OpsgenieParamFields {...defaultCloseAlertProps} />);
 
     expect(screen.queryByText('Message')).not.toBeInTheDocument();
-    expect(screen.getByText('Alias (required)')).toBeInTheDocument();
+    expect(screen.getByText('Alias')).toBeInTheDocument();
     expect(screen.getByTestId('opsgenie-subActionSelect'));
 
     expect(screen.queryByDisplayValue('hello')).not.toBeInTheDocument();
@@ -108,7 +108,7 @@ describe('OpsgenieParamFields', () => {
       />
     );
 
-    expect(screen.getByText('Message (required)')).toBeInTheDocument();
+    expect(screen.getByText('Message')).toBeInTheDocument();
     expect(screen.getByText('Alias')).toBeInTheDocument();
     expect(screen.queryByTestId('opsgenie-subActionSelect')).not.toBeInTheDocument();
 

x-pack/plugins/stack_connectors/public/connector_types/opsgenie/translations.ts

@@ -68,13 +68,6 @@ export const ALIAS_FIELD_LABEL = i18n.translate(
   }
 );
 
-export const ALIAS_REQUIRED_FIELD_LABEL = i18n.translate(
-  'xpack.stackConnectors.components.opsgenie.aliasRequiredLabel',
-  {
-    defaultMessage: 'Alias (required)',
-  }
-);
-
 export const ALIAS_IS_REQUIRED = i18n.translate(
   'xpack.stackConnectors.components.opsgenie.requiredAliasTextField',
   {
@@ -151,3 +144,10 @@ export const OPSGENIE_USER_HELP = i18n.translate(
     defaultMessage: 'The display name for the owner.',
   }
 );
+
+export const REQUIRED_LABEL = i18n.translate(
+  'xpack.stackConnectors.components.opsgenie.fieldRequiredLabel',
+  {
+    defaultMessage: 'Required',
+  }
+);

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

@@ -38659,7 +38659,6 @@
     "xpack.stackConnectors.components.opsgenie.actionLabel": "Action",
     "xpack.stackConnectors.components.opsgenie.alertFieldsLabel": "Champs d'alerte",
     "xpack.stackConnectors.components.opsgenie.aliasLabel": "Alias",
-    "xpack.stackConnectors.components.opsgenie.aliasRequiredLabel": "Alias (requis)",
     "xpack.stackConnectors.components.opsgenie.apiKeySecret": "Clé d'API",
     "xpack.stackConnectors.components.opsgenie.apiUrlTextFieldLabel": "URL",
     "xpack.stackConnectors.components.opsgenie.closeAlertAction": "Fermer l'alerte",

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

@@ -38658,7 +38658,6 @@
     "xpack.stackConnectors.components.opsgenie.actionLabel": "アクション",
     "xpack.stackConnectors.components.opsgenie.alertFieldsLabel": "アラートフィールド",
     "xpack.stackConnectors.components.opsgenie.aliasLabel": "エイリアス",
-    "xpack.stackConnectors.components.opsgenie.aliasRequiredLabel": "エイリアス（必須）",
     "xpack.stackConnectors.components.opsgenie.apiKeySecret": "API キー",
     "xpack.stackConnectors.components.opsgenie.apiUrlTextFieldLabel": "URL",
     "xpack.stackConnectors.components.opsgenie.closeAlertAction": "アラートを閉じる",

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

@@ -38651,7 +38651,6 @@
     "xpack.stackConnectors.components.opsgenie.actionLabel": "操作",
     "xpack.stackConnectors.components.opsgenie.alertFieldsLabel": "告警字段",
     "xpack.stackConnectors.components.opsgenie.aliasLabel": "别名",
-    "xpack.stackConnectors.components.opsgenie.aliasRequiredLabel": "别名（必填）",
     "xpack.stackConnectors.components.opsgenie.apiKeySecret": "API 密钥",
     "xpack.stackConnectors.components.opsgenie.apiUrlTextFieldLabel": "URL",
     "xpack.stackConnectors.components.opsgenie.closeAlertAction": "关闭告警",