HandlerOptions styling
deniz kusefoglu
parent
0c935d9887
commit
e42a87746f
|
|
@ -7,68 +7,73 @@ const AlertaHandler = ({selectedHandler, handleModifyHandler, configLink}) => {
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="token"
|
||||
fieldDisplay="Token"
|
||||
placeholder="ex: my_token"
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="environment"
|
||||
fieldDisplay="Environment"
|
||||
placeholder="ex: environment"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="origin"
|
||||
fieldDisplay="Origin"
|
||||
placeholder="ex: origin"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="token"
|
||||
fieldDisplay="Token"
|
||||
placeholder="ex: my_token"
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="environment"
|
||||
fieldDisplay="Environment"
|
||||
placeholder="ex: environment"
|
||||
/>
|
||||
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="origin"
|
||||
fieldDisplay="Origin"
|
||||
placeholder="ex: origin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="resource"
|
||||
fieldDisplay="Resource"
|
||||
placeholder=""
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="event"
|
||||
fieldDisplay="Event"
|
||||
placeholder=""
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="group"
|
||||
fieldDisplay="Group"
|
||||
placeholder=""
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="value"
|
||||
fieldDisplay="Value"
|
||||
placeholder=""
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="service"
|
||||
fieldDisplay="Service"
|
||||
placeholder=""
|
||||
parseToArray={true}
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="resource"
|
||||
fieldDisplay="Resource"
|
||||
placeholder=""
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="event"
|
||||
fieldDisplay="Event"
|
||||
placeholder=""
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="group"
|
||||
fieldDisplay="Group"
|
||||
placeholder=""
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="value"
|
||||
fieldDisplay="Value"
|
||||
placeholder=""
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="service"
|
||||
fieldDisplay="Service"
|
||||
placeholder=""
|
||||
parseToArray={true}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -14,46 +14,50 @@ const EmailHandler = ({
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="from"
|
||||
fieldDisplay="From E-mail"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="host"
|
||||
fieldDisplay="SMTP Host"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="port"
|
||||
fieldDisplay="SMTP Port"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="from"
|
||||
fieldDisplay="From E-mail"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="host"
|
||||
fieldDisplay="SMTP Host"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="port"
|
||||
fieldDisplay="SMTP Port"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="to"
|
||||
fieldDisplay="Recipient E-mail Addresses: (separated by spaces)"
|
||||
placeholder="ex: bob@domain.com susan@domain.com"
|
||||
parseToArray={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<RuleDetailsText rule={rule} updateDetails={updateDetails} />
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="to"
|
||||
fieldDisplay="Recipient E-mail Addresses: (separated by spaces)"
|
||||
placeholder="ex: bob@domain.com susan@domain.com"
|
||||
parseToArray={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<RuleDetailsText rule={rule} updateDetails={updateDetails} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -6,15 +6,17 @@ const ExecHandler = ({selectedHandler, handleModifyHandler}) => {
|
|||
<div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="command"
|
||||
fieldDisplay="Command (arguments separated by spaces):"
|
||||
placeholder="ex: command argument"
|
||||
fieldColumns="col-md-12"
|
||||
parseToArray={true}
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="command"
|
||||
fieldDisplay="Command (arguments separated by spaces):"
|
||||
placeholder="ex: command argument"
|
||||
fieldColumns="col-md-12"
|
||||
parseToArray={true}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -7,30 +7,32 @@ const HipchatHandler = ({selectedHandler, handleModifyHandler, configLink}) => {
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="token"
|
||||
fieldDisplay="Token:"
|
||||
placeholder="ex: the_token"
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="Subdomain Url"
|
||||
placeholder="ex: hipchat_subdomain"
|
||||
disabled={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="room"
|
||||
fieldDisplay="Room:"
|
||||
placeholder="ex: room_name"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="token"
|
||||
fieldDisplay="Token:"
|
||||
placeholder="ex: the_token"
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="Subdomain Url"
|
||||
placeholder="ex: hipchat_subdomain"
|
||||
disabled={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="room"
|
||||
fieldDisplay="Room:"
|
||||
placeholder="ex: room_name"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -6,14 +6,16 @@ const LogHandler = ({selectedHandler, handleModifyHandler}) => {
|
|||
<div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="filePath"
|
||||
fieldDisplay="File Path for Log File:"
|
||||
placeholder="ex: /tmp/alerts.log"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="filePath"
|
||||
fieldDisplay="File Path for Log File:"
|
||||
placeholder="ex: /tmp/alerts.log"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -11,35 +11,39 @@ const OpsgenieHandler = ({
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="api-key"
|
||||
fieldDisplay="API-key"
|
||||
placeholder=""
|
||||
redacted={true}
|
||||
disabled={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="api-key"
|
||||
fieldDisplay="API-key"
|
||||
placeholder=""
|
||||
redacted={true}
|
||||
disabled={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler:</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="teams"
|
||||
fieldDisplay="Teams"
|
||||
placeholder="ex: teams_name"
|
||||
parseToArray={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="recipients"
|
||||
fieldDisplay="Recipients"
|
||||
placeholder="ex: recipients_name"
|
||||
parseToArray={true}
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="teams"
|
||||
fieldDisplay="Teams"
|
||||
placeholder="ex: teams_name"
|
||||
parseToArray={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="recipients"
|
||||
fieldDisplay="Recipients"
|
||||
placeholder="ex: recipients_name"
|
||||
parseToArray={true}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -11,15 +11,17 @@ const PagerdutyHandler = ({
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="serviceKey"
|
||||
fieldDisplay="Service Key:"
|
||||
placeholder="ex: service_key"
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="serviceKey"
|
||||
fieldDisplay="Service Key:"
|
||||
placeholder="ex: service_key"
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -6,14 +6,16 @@ const HttpHandler = ({selectedHandler, handleModifyHandler}) => {
|
|||
<div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="HTTP endpoint for POST request"
|
||||
placeholder="ex: http://example.com/api/alert"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="HTTP endpoint for POST request"
|
||||
placeholder="ex: http://example.com/api/alert"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -11,62 +11,66 @@ const PushoverHandler = ({
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="token"
|
||||
fieldDisplay="Token"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="userKey"
|
||||
fieldDisplay="User Key"
|
||||
placeholder=""
|
||||
redacted={true}
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="token"
|
||||
fieldDisplay="Token"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="userKey"
|
||||
fieldDisplay="User Key"
|
||||
placeholder=""
|
||||
redacted={true}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="title"
|
||||
fieldDisplay="Alert Title:"
|
||||
placeholder="ex: Important Alert"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="URL:"
|
||||
placeholder="ex: https://influxdata.com"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="urlTitle"
|
||||
fieldDisplay="URL Title:"
|
||||
placeholder="ex: InfluxData"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="device"
|
||||
fieldDisplay="Devices: (comma separated)"
|
||||
placeholder="ex: dv1, dv2"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="sound"
|
||||
fieldDisplay="Alert Sound:"
|
||||
placeholder="ex: alien"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="title"
|
||||
fieldDisplay="Alert Title:"
|
||||
placeholder="ex: Important Alert"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="URL:"
|
||||
placeholder="ex: https://influxdata.com"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="urlTitle"
|
||||
fieldDisplay="URL Title:"
|
||||
placeholder="ex: InfluxData"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="device"
|
||||
fieldDisplay="Devices: (comma separated)"
|
||||
placeholder="ex: dv1, dv2"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="sound"
|
||||
fieldDisplay="Alert Sound:"
|
||||
placeholder="ex: alien"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -7,33 +7,37 @@ const SensuHandler = ({selectedHandler, handleModifyHandler, configLink}) => {
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="addr"
|
||||
fieldDisplay="Address"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="source"
|
||||
fieldDisplay="Source"
|
||||
placeholder="ex: my_source"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="addr"
|
||||
fieldDisplay="Address"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="source"
|
||||
fieldDisplay="Source"
|
||||
placeholder="ex: my_source"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="handlers"
|
||||
fieldDisplay="Handlers"
|
||||
placeholder="ex: my_handlers"
|
||||
fieldColumns="col-md-12"
|
||||
parseToArray={true}
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="handlers"
|
||||
fieldDisplay="Handlers"
|
||||
placeholder="ex: my_handlers"
|
||||
fieldColumns="col-md-12"
|
||||
parseToArray={true}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -7,43 +7,47 @@ const SlackHandler = ({selectedHandler, handleModifyHandler, configLink}) => {
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="Webhook URL:"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="Webhook URL:"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="channel"
|
||||
fieldDisplay="Channel:"
|
||||
placeholder="ex: #my_favorite_channel"
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="username"
|
||||
fieldDisplay="Username:"
|
||||
placeholder="ex: my_favorite_username"
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="iconEmoji"
|
||||
fieldDisplay="Emoji:"
|
||||
placeholder="ex: :thumbsup:"
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="channel"
|
||||
fieldDisplay="Channel:"
|
||||
placeholder="ex: #my_favorite_channel"
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="username"
|
||||
fieldDisplay="Username:"
|
||||
placeholder="ex: my_favorite_username"
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="iconEmoji"
|
||||
fieldDisplay="Emoji:"
|
||||
placeholder="ex: :thumbsup:"
|
||||
fieldColumns="col-md-4"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -7,23 +7,25 @@ const TalkHandler = ({selectedHandler, handleModifyHandler, configLink}) => {
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="URL"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="author_name"
|
||||
fieldDisplay="Author Name"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="url"
|
||||
fieldDisplay="URL"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="author_name"
|
||||
fieldDisplay="Author Name"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -6,14 +6,16 @@ const TcpHandler = ({selectedHandler, handleModifyHandler}) => {
|
|||
<div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="address"
|
||||
fieldDisplay="Address"
|
||||
placeholder="ex: exampleendpoint.com:5678"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="address"
|
||||
fieldDisplay="Address"
|
||||
placeholder="ex: exampleendpoint.com:5678"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -12,45 +12,49 @@ const TelegramHandler = ({
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="token"
|
||||
fieldDisplay="Token"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="token"
|
||||
fieldDisplay="Token"
|
||||
placeholder=""
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="chatId"
|
||||
fieldDisplay="Chat ID:"
|
||||
placeholder="ex: chat_id"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="parseMode"
|
||||
fieldDisplay="Parse Mode:"
|
||||
placeholder="ex: Markdown or HTML"
|
||||
/>
|
||||
<HandlerCheckbox
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="disableWebPagePreview"
|
||||
fieldDisplay="Disable web page preview"
|
||||
/>
|
||||
<HandlerCheckbox
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="disableNotification"
|
||||
fieldDisplay="Disable notification"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="chatId"
|
||||
fieldDisplay="Chat ID:"
|
||||
placeholder="ex: chat_id"
|
||||
/>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="parseMode"
|
||||
fieldDisplay="Parse Mode:"
|
||||
placeholder="ex: Markdown or HTML"
|
||||
/>
|
||||
<HandlerCheckbox
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="disableWebPagePreview"
|
||||
fieldDisplay="Disable web page preview"
|
||||
/>
|
||||
<HandlerCheckbox
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="disableNotification"
|
||||
fieldDisplay="Disable notification"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -11,27 +11,31 @@ const VictoropsHandler = ({
|
|||
? <div className="endpoint-tab-contents">
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters from Kapacitor Configuration</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="api-key"
|
||||
fieldDisplay="API key"
|
||||
placeholder="ex: api_key"
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="api-key"
|
||||
fieldDisplay="API key"
|
||||
placeholder="ex: api_key"
|
||||
disabled={true}
|
||||
redacted={true}
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="endpoint-tab--parameters">
|
||||
<h4>Parameters for this Alert Handler</h4>
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="routingKey"
|
||||
fieldDisplay="Routing Key:"
|
||||
placeholder="ex: routing_key"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
<div className="faux-form">
|
||||
<HandlerInput
|
||||
selectedHandler={selectedHandler}
|
||||
handleModifyHandler={handleModifyHandler}
|
||||
fieldName="routingKey"
|
||||
fieldDisplay="Routing Key:"
|
||||
placeholder="ex: routing_key"
|
||||
fieldColumns="col-md-12"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
: <HandlerEmpty configLink={configLink} />
|
||||
|
|
|
|||
|
|
@ -542,9 +542,11 @@ $rule-builder--radius-lg: 5px;
|
|||
padding-bottom: $rule-builder--padding-lg;
|
||||
}
|
||||
}
|
||||
.endpoint-tab--parameters .form-group {
|
||||
margin-left: -18px;
|
||||
margin-right: 18px;
|
||||
.endpoint-tab--parameters .faux-form {
|
||||
margin-left: -6px;
|
||||
margin-right: -6px;
|
||||
width: calc(100% + 12px);
|
||||
display: inline-block;
|
||||
}
|
||||
.endpoint-tab--parameters--empty {
|
||||
align-items: center;
|
||||
|
|
@ -579,7 +581,7 @@ $rule-builder--radius-lg: 5px;
|
|||
}
|
||||
|
||||
/*
|
||||
Section 3 - Rule Details
|
||||
Rule Details
|
||||
-----------------------------------------------------------------------------
|
||||
*/
|
||||
.rule-builder--details {
|
||||
|
|
@ -595,6 +597,7 @@ $rule-builder--radius-lg: 5px;
|
|||
height: 100px;
|
||||
min-width: 100%;
|
||||
max-width: 100%;
|
||||
width: 100% !important;
|
||||
@include custom-scrollbar($rule-builder--section-bg,$rule-builder--accent-color);
|
||||
}
|
||||
.rule-builder--details-template {
|
||||
|
|
|
|||
|
|
@ -468,3 +468,62 @@ $dash-editable-header-padding: 7px;
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Fake form padding without <form>
|
||||
|
||||
*/
|
||||
|
||||
div.faux-form {
|
||||
.form-group.col-xs-1,
|
||||
.form-group.col-xs-2,
|
||||
.form-group.col-xs-3,
|
||||
.form-group.col-xs-4,
|
||||
.form-group.col-xs-5,
|
||||
.form-group.col-xs-6,
|
||||
.form-group.col-xs-7,
|
||||
.form-group.col-xs-8,
|
||||
.form-group.col-xs-9,
|
||||
.form-group.col-xs-10,
|
||||
.form-group.col-xs-11,
|
||||
.form-group.col-xs-12,
|
||||
.form-group.col-sm-1,
|
||||
.form-group.col-sm-2,
|
||||
.form-group.col-sm-3,
|
||||
.form-group.col-sm-4,
|
||||
.form-group.col-sm-5,
|
||||
.form-group.col-sm-6,
|
||||
.form-group.col-sm-7,
|
||||
.form-group.col-sm-8,
|
||||
.form-group.col-sm-9,
|
||||
.form-group.col-sm-10,
|
||||
.form-group.col-sm-11,
|
||||
.form-group.col-sm-12,
|
||||
.form-group.col-md-1,
|
||||
.form-group.col-md-2,
|
||||
.form-group.col-md-3,
|
||||
.form-group.col-md-4,
|
||||
.form-group.col-md-5,
|
||||
.form-group.col-md-6,
|
||||
.form-group.col-md-7,
|
||||
.form-group.col-md-8,
|
||||
.form-group.col-md-9,
|
||||
.form-group.col-md-10,
|
||||
.form-group.col-md-11,
|
||||
.form-group.col-md-12,
|
||||
.form-group.col-lg-1,
|
||||
.form-group.col-lg-2,
|
||||
.form-group.col-lg-3,
|
||||
.form-group.col-lg-4,
|
||||
.form-group.col-lg-5,
|
||||
.form-group.col-lg-6,
|
||||
.form-group.col-lg-7,
|
||||
.form-group.col-lg-8,
|
||||
.form-group.col-lg-9,
|
||||
.form-group.col-lg-10,
|
||||
.form-group.col-lg-11,
|
||||
.form-group.col-lg-12 {
|
||||
padding-left: 6px;
|
||||
padding-right: 6px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue