fix for notification

Author: shivani170

src/components/notifications/CreateHeaderDetails.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { ReactComponent as DeleteCross } from '../../assets/icons/ic-cross.svg'
 import { CreateHeaderDetailsType } from './types'
+import { CustomInput } from '@devtron-labs/devtron-fe-common-lib'
 
 export default function CreateHeaderDetails({
     index,
@@ -22,16 +23,16 @@ export default function CreateHeaderDetails({
 
     return (
         <div className="flexbox mb-8">
-            <input
-                className="form__input tag-input pt-4-imp pb-4-imp fs-13 dc__no-right-radius"
+            <CustomInput 
+                rootClassName="tag-input pt-4-imp pb-4-imp fs-13 dc__no-right-radius"
                 value={headerData?.["key"]}
                 name="key"
                 onChange={handleInputChange}
                 placeholder="Enter key"
                 data-testid={`header-key-${index}`}
             />
-            <input
-                className="form__input tag-input pt-4-imp pb-4-imp fs-13 dc__no-border-radius dc__no-right-border dc__no-left-border"
+            <CustomInput
+                rootClassName="tag-input pt-4-imp pb-4-imp fs-13 dc__no-border-radius dc__no-right-border dc__no-left-border"
                 value={headerData?.["value"]}
                 name="value"
                 onChange={handleInputChange}

src/components/notifications/SESConfigModal.tsx

@@ -288,8 +288,8 @@ export class SESConfigModal extends Component<SESConfigModalProps, SESConfigModa
                             />
                         </label>
                         <label className="form__row">
-                            <span className="form__label">Secret Access Key*</span>
                             <CustomInput
+                                label="Secret Access Key"
                                 data-testid="add-ses-secret-access-key"
                                 type="text"
                                 name="app-name"
@@ -303,8 +303,8 @@ export class SESConfigModal extends Component<SESConfigModalProps, SESConfigModa
                             />
                         </label>
                         <div className="form__row">
-                            <label htmlFor="" className="form__label">
-                                AWS Region*
+                            <label htmlFor="" className="form__label dc__reuired-field">
+                                AWS Region
                             </label>
                             <ReactSelect
                                 classNamePrefix="add-ses-aws-region"

src/components/notifications/SMTPConfigModal.tsx

@@ -178,6 +178,7 @@ export class SMTPConfigModal extends Component<SMTPConfigModalProps, SMTPConfigM
                         <label className="form__row">
                             <CustomInput
                                 name="configName "
+                                label="Configuration name"
                                 data-testid="add-smtp-configuration-name"
                                 ref={(node) => (this._configName = node)}
                                 value={this.state.form.configName}
@@ -205,7 +206,7 @@ export class SMTPConfigModal extends Component<SMTPConfigModalProps, SMTPConfigM
                             />
                         </label>
                         <label className="form__row">
-                            < CustomInput
+                            <CustomInput
                                 label="SMTP Port"
                                 data-testid="add-smtp-port"
                                 name="port"
@@ -219,10 +220,7 @@ export class SMTPConfigModal extends Component<SMTPConfigModalProps, SMTPConfigM
                             />
                         </label>
                         <div className="form__row">
-                            <label htmlFor="" className="form__label">
-                                SMTP Username*
-                            </label>
-                            < CustomInput
+                            <CustomInput
                                 label="SMTP Username"
                                 data-testid="add-smtp-username"
                                 name="authUser"
@@ -248,8 +246,8 @@ export class SMTPConfigModal extends Component<SMTPConfigModalProps, SMTPConfigM
                             />
                         </div>
                         <label className="form__row">
-                            <span className="form__label">Send email from*</span>
-                            < CustomInput
+                            <CustomInput
+                                label="Send email from"
                                 data-testid="add-smtp-send-email"
                                 type="email"
                                 name="fromEmail"

src/components/notifications/SlackConfigModal.tsx

@@ -218,7 +218,7 @@ export class SlackConfigModal extends Component<SlackConfigModalProps, SlackConf
                             />
                 </label>
                 <div>
-                    <label className="form__label">Project*
+                    <label className="form__label dc__required-field">Project
                         <Tippy className="default-tt" arrow={true} trigger={"click"}
                             interactive={true} placement="top" content="Required to control user Acccess">
                             <Help className="ml-5 dc__vertical-align-middle icon-dim-16 cursor" />