disble connector fields when user is read only

gmmorris · Jul 3, 2020 · e6025ba · e6025ba
1 parent 53916fd
commit e6025ba
Show file tree

Hide file tree

Showing 12 changed files with 76 additions and 36 deletions.
diff --git a/...s_actions_ui/public/application/components/builtin_action_types/email/email_connector.tsx b/...s_actions_ui/public/application/components/builtin_action_types/email/email_connector.tsx
@@ -19,7 +19,7 @@ import { EmailActionConnector } from '../types';
 
 export const EmailActionConnectorFields: React.FunctionComponent<ActionConnectorFieldsProps<
   EmailActionConnector
->> = ({ action, editActionConfig, editActionSecrets, errors }) => {
+>> = ({ action, editActionConfig, editActionSecrets, errors, readOnly }) => {
   const { from, host, port, secure } = action.config;
   const { user, password } = action.secrets;
 
@@ -41,6 +41,7 @@ export const EmailActionConnectorFields: React.FunctionComponent<ActionConnector
           >
             <EuiFieldText
               fullWidth
+              readOnly={readOnly}
               isInvalid={errors.from.length > 0 && from !== undefined}
               name="from"
               value={from || ''}
@@ -73,6 +74,7 @@ export const EmailActionConnectorFields: React.FunctionComponent<ActionConnector
           >
             <EuiFieldText
               fullWidth
+              readOnly={readOnly}
               isInvalid={errors.host.length > 0 && host !== undefined}
               name="host"
               value={host || ''}
@@ -108,6 +110,7 @@ export const EmailActionConnectorFields: React.FunctionComponent<ActionConnector
                   prepend=":"
                   isInvalid={errors.port.length > 0 && port !== undefined}
                   fullWidth
+                  readOnly={readOnly}
                   name="port"
                   value={port || ''}
                   data-test-subj="emailPortInput"
@@ -132,6 +135,7 @@ export const EmailActionConnectorFields: React.FunctionComponent<ActionConnector
                         defaultMessage: 'Secure',
                       }
                     )}
+                    disabled={readOnly}
                     checked={secure || false}
                     onChange={(e) => {
                       editActionConfig('secure', e.target.checked);
@@ -161,6 +165,7 @@ export const EmailActionConnectorFields: React.FunctionComponent<ActionConnector
               fullWidth
               isInvalid={errors.user.length > 0}
               name="user"
+              readOnly={readOnly}
               value={user || ''}
               data-test-subj="emailUserInput"
               onChange={(e) => {
@@ -184,6 +189,7 @@ export const EmailActionConnectorFields: React.FunctionComponent<ActionConnector
           >
             <EuiFieldPassword
               fullWidth
+              readOnly={readOnly}
               isInvalid={errors.password.length > 0}
               name="password"
               value={password || ''}

diff --git a/...ons_ui/public/application/components/builtin_action_types/es_index/es_index_connector.tsx b/...ons_ui/public/application/components/builtin_action_types/es_index/es_index_connector.tsx
@@ -28,7 +28,7 @@ import {
 
 const IndexActionConnectorFields: React.FunctionComponent<ActionConnectorFieldsProps<
   EsIndexActionConnector
->> = ({ action, editActionConfig, errors, http }) => {
+>> = ({ action, editActionConfig, errors, http, readOnly }) => {
   const { index, refresh, executionTimeField } = action.config;
   const [hasTimeFieldCheckbox, setTimeFieldCheckboxState] = useState<boolean>(
     executionTimeField != null
@@ -102,6 +102,7 @@ const IndexActionConnectorFields: React.FunctionComponent<ActionConnectorFieldsP
                 ]
               : []
           }
+          isDisabled={readOnly}
           onChange={async (selected: EuiComboBoxOptionOption[]) => {
             editActionConfig('index', selected.length > 0 ? selected[0].value : '');
             const indices = selected.map((s) => s.value as string);
@@ -132,6 +133,7 @@ const IndexActionConnectorFields: React.FunctionComponent<ActionConnectorFieldsP
       <EuiSwitch
         data-test-subj="indexRefreshCheckbox"
         checked={refresh || false}
+        disabled={readOnly}
         onChange={(e) => {
           editActionConfig('refresh', e.target.checked);
         }}
@@ -159,6 +161,7 @@ const IndexActionConnectorFields: React.FunctionComponent<ActionConnectorFieldsP
       <EuiSwitch
         data-test-subj="hasTimeFieldCheckbox"
         checked={hasTimeFieldCheckbox || false}
+        disabled={readOnly}
         onChange={() => {
           setTimeFieldCheckboxState(!hasTimeFieldCheckbox);
           // if changing from checked to not checked (hasTimeField === true),

diff --git a/..._ui/public/application/components/builtin_action_types/pagerduty/pagerduty_connectors.tsx b/..._ui/public/application/components/builtin_action_types/pagerduty/pagerduty_connectors.tsx
@@ -12,7 +12,7 @@ import { PagerDutyActionConnector } from '.././types';
 
 const PagerDutyActionConnectorFields: React.FunctionComponent<ActionConnectorFieldsProps<
   PagerDutyActionConnector
->> = ({ errors, action, editActionConfig, editActionSecrets, docLinks }) => {
+>> = ({ errors, action, editActionConfig, editActionSecrets, docLinks, readOnly }) => {
   const { apiUrl } = action.config;
   const { routingKey } = action.secrets;
   return (
@@ -31,6 +31,7 @@ const PagerDutyActionConnectorFields: React.FunctionComponent<ActionConnectorFie
           fullWidth
           name="apiUrl"
           value={apiUrl || ''}
+          readOnly={readOnly}
           data-test-subj="pagerdutyApiUrlInput"
           onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
             editActionConfig('apiUrl', e.target.value);
@@ -69,6 +70,7 @@ const PagerDutyActionConnectorFields: React.FunctionComponent<ActionConnectorFie
           fullWidth
           isInvalid={errors.routingKey.length > 0 && routingKey !== undefined}
           name="routingKey"
+          readOnly={readOnly}
           value={routingKey || ''}
           data-test-subj="pagerdutyRoutingKeyInput"
           onChange={(e: React.ChangeEvent<HTMLInputElement>) => {

diff --git a/..._actions_ui/public/application/components/builtin_action_types/slack/slack_connectors.tsx b/..._actions_ui/public/application/components/builtin_action_types/slack/slack_connectors.tsx
@@ -12,7 +12,7 @@ import { SlackActionConnector } from '../types';
 
 const SlackActionFields: React.FunctionComponent<ActionConnectorFieldsProps<
   SlackActionConnector
->> = ({ action, editActionSecrets, errors, docLinks }) => {
+>> = ({ action, editActionSecrets, errors, docLinks, readOnly }) => {
   const { webhookUrl } = action.secrets;
 
   return (
@@ -44,6 +44,7 @@ const SlackActionFields: React.FunctionComponent<ActionConnectorFieldsProps<
           fullWidth
           isInvalid={errors.webhookUrl.length > 0 && webhookUrl !== undefined}
           name="webhookUrl"
+          readOnly={readOnly}
           placeholder="Example: https://hooks.slack.com/services"
           value={webhookUrl || ''}
           data-test-subj="slackWebhookUrlInput"

diff --git a/...ions_ui/public/application/components/builtin_action_types/webhook/webhook_connectors.tsx b/...ions_ui/public/application/components/builtin_action_types/webhook/webhook_connectors.tsx
@@ -30,7 +30,7 @@ const HTTP_VERBS = ['post', 'put'];
 
 const WebhookActionConnectorFields: React.FunctionComponent<ActionConnectorFieldsProps<
   WebhookActionConnector
->> = ({ action, editActionConfig, editActionSecrets, errors }) => {
+>> = ({ action, editActionConfig, editActionSecrets, errors, readOnly }) => {
   const [httpHeaderKey, setHttpHeaderKey] = useState<string>('');
   const [httpHeaderValue, setHttpHeaderValue] = useState<string>('');
   const [hasHeaders, setHasHeaders] = useState<boolean>(false);
@@ -126,6 +126,7 @@ const WebhookActionConnectorFields: React.FunctionComponent<ActionConnectorField
                 fullWidth
                 isInvalid={hasHeaderErrors && httpHeaderKey !== undefined}
                 name="keyHeader"
+                readOnly={readOnly}
                 value={httpHeaderKey}
                 data-test-subj="webhookHeadersKeyInput"
                 onChange={(e) => {
@@ -151,6 +152,7 @@ const WebhookActionConnectorFields: React.FunctionComponent<ActionConnectorField
                 fullWidth
                 isInvalid={hasHeaderErrors && httpHeaderValue !== undefined}
                 name="valueHeader"
+                readOnly={readOnly}
                 value={httpHeaderValue}
                 data-test-subj="webhookHeadersValueInput"
                 onChange={(e) => {
@@ -220,6 +222,7 @@ const WebhookActionConnectorFields: React.FunctionComponent<ActionConnectorField
             <EuiSelect
               name="method"
               value={method || 'post'}
+              disabled={readOnly}
               data-test-subj="webhookMethodSelect"
               options={HTTP_VERBS.map((verb) => ({ text: verb.toUpperCase(), value: verb }))}
               onChange={(e) => {
@@ -245,6 +248,7 @@ const WebhookActionConnectorFields: React.FunctionComponent<ActionConnectorField
               name="url"
               isInvalid={errors.url.length > 0 && url !== undefined}
               fullWidth
+              readOnly={readOnly}
               value={url || ''}
               data-test-subj="webhookUrlText"
               onChange={(e) => {
@@ -277,6 +281,7 @@ const WebhookActionConnectorFields: React.FunctionComponent<ActionConnectorField
               fullWidth
               isInvalid={errors.user.length > 0 && user !== undefined}
               name="user"
+              readOnly={readOnly}
               value={user || ''}
               data-test-subj="webhookUserInput"
               onChange={(e) => {
@@ -306,6 +311,7 @@ const WebhookActionConnectorFields: React.FunctionComponent<ActionConnectorField
             <EuiFieldPassword
               fullWidth
               name="password"
+              readOnly={readOnly}
               isInvalid={errors.password.length > 0 && password !== undefined}
               value={password || ''}
               data-test-subj="webhookPasswordInput"
@@ -325,6 +331,7 @@ const WebhookActionConnectorFields: React.FunctionComponent<ActionConnectorField
       <EuiSpacer size="m" />
       <EuiSwitch
         data-test-subj="webhookViewHeadersSwitch"
+        disabled={readOnly}
         label={i18n.translate(
           'xpack.triggersActionsUI.components.builtinActionTypes.webhookAction.viewHeadersSwitch',
           {

diff --git a/...rs_actions_ui/public/application/sections/action_connector_form/action_connector_form.tsx b/...rs_actions_ui/public/application/sections/action_connector_form/action_connector_form.tsx
@@ -18,10 +18,11 @@ import {
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
-import { HttpSetup, DocLinksStart } from 'kibana/public';
+import { HttpSetup, ApplicationStart, DocLinksStart } from 'kibana/public';
 import { ReducerAction } from './connector_reducer';
 import { ActionConnector, IErrorObject, ActionTypeModel } from '../../../types';
 import { TypeRegistry } from '../../type_registry';
+import { hasSaveActionsCapability } from '../../lib/capabilities';
 
 export function validateBaseProperties(actionObject: ActionConnector) {
   const validationResult = { errors: {} };
@@ -53,6 +54,7 @@ interface ActionConnectorProps {
   http: HttpSetup;
   actionTypeRegistry: TypeRegistry<ActionTypeModel>;
   docLinks: DocLinksStart;
+  capabilities: ApplicationStart['capabilities'];
 }
 
 export const ActionConnectorForm = ({
@@ -64,7 +66,10 @@ export const ActionConnectorForm = ({
   http,
   actionTypeRegistry,
   docLinks,
+  capabilities,
 }: ActionConnectorProps) => {
+  const canSave = hasSaveActionsCapability(capabilities);
+
   const setActionProperty = (key: string, value: any) => {
     dispatch({ command: { type: 'setProperty' }, payload: { key, value } });
   };
@@ -137,6 +142,7 @@ export const ActionConnectorForm = ({
         <EuiFieldText
           fullWidth
           autoFocus={true}
+          readOnly={!canSave}
           isInvalid={errors.name.length > 0 && connector.name !== undefined}
           name="name"
           placeholder="Untitled"
@@ -166,6 +172,7 @@ export const ActionConnectorForm = ({
           <FieldsComponent
             action={connector}
             errors={errors}
+            readOnly={!canSave}
             editActionConfig={setActionConfigProperty}
             editActionSecrets={setActionSecretsProperty}
             http={http}

diff --git a/...ins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx b/...ins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx
@@ -45,6 +45,7 @@ import { TypeRegistry } from '../../type_registry';
 import { actionTypeCompare } from '../../lib/action_type_compare';
 import { checkActionFormActionTypeEnabled } from '../../lib/check_action_type_enabled';
 import { VIEW_LICENSE_OPTIONS_LINK } from '../../../common/constants';
+import { hasSaveActionsCapability } from '../../lib/capabilities';
 
 interface ActionAccordionFormProps {
   actions: AlertAction[];
@@ -87,6 +88,8 @@ export const ActionForm = ({
   capabilities,
   docLinks,
 }: ActionAccordionFormProps) => {
+  const canSave = hasSaveActionsCapability(capabilities);
+
   const [addModalVisible, setAddModalVisibility] = useState<boolean>(false);
   const [activeActionItem, setActiveActionItem] = useState<ActiveActionConnectorState | undefined>(
     undefined
@@ -254,6 +257,7 @@ export const ActionForm = ({
                 />
               }
               labelAppend={
+                canSave &&
                 actionTypesIndex &&
                 actionTypesIndex[actionConnector.actionTypeId].enabledInConfig ? (
                   <EuiButtonEmpty
@@ -479,23 +483,27 @@ export const ActionForm = ({
                 />
               )
             }
-            actions={[
-              <EuiButton
-                color="primary"
-                fill
-                size="s"
-                data-test-subj="createActionConnectorButton"
-                onClick={() => {
-                  setActiveActionItem({ actionTypeId: actionItem.actionTypeId, index });
-                  setAddModalVisibility(true);
-                }}
-              >
-                <FormattedMessage
-                  id="xpack.triggersActionsUI.sections.alertForm.addConnectorButtonLabel"
-                  defaultMessage="Create a connector"
-                />
-              </EuiButton>,
-            ]}
+            actions={
+              canSave
+                ? [
+                    <EuiButton
+                      color="primary"
+                      fill
+                      size="s"
+                      data-test-subj="createActionConnectorButton"
+                      onClick={() => {
+                        setActiveActionItem({ actionTypeId: actionItem.actionTypeId, index });
+                        setAddModalVisibility(true);
+                      }}
+                    >
+                      <FormattedMessage
+                        id="xpack.triggersActionsUI.sections.alertForm.addConnectorButtonLabel"
+                        defaultMessage="Create a connector"
+                      />
+                    </EuiButton>,
+                  ]
+                : []
+            }
           />
         </EuiAccordion>
         <EuiSpacer size="xs" />

diff --git a/...ers_actions_ui/public/application/sections/action_connector_form/connector_add_flyout.tsx b/...ers_actions_ui/public/application/sections/action_connector_form/connector_add_flyout.tsx
@@ -117,6 +117,7 @@ export const ConnectorAddFlyout = ({
         actionTypeRegistry={actionTypeRegistry}
         http={http}
         docLinks={docLinks}
+        capabilities={capabilities}
       />
     );
   }

diff --git a/...gers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.tsx b/...gers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.tsx
@@ -164,6 +164,7 @@ export const ConnectorAddModal = ({
             actionTypeRegistry={actionTypeRegistry}
             docLinks={docLinks}
             http={http}
+            capabilities={capabilities}
           />
         </EuiModalBody>
         <EuiModalFooter>

diff --git a/...rs_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx b/...rs_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx
@@ -185,6 +185,7 @@ export const ConnectorEditFlyout = ({
             actionTypeRegistry={actionTypeRegistry}
             http={http}
             docLinks={docLinks}
+            capabilities={capabilities}
           />
         ) : (
           <Fragment>

diff --git a/...ublic/application/sections/actions_connectors_list/components/actions_connectors_list.tsx b/...ublic/application/sections/actions_connectors_list/components/actions_connectors_list.tsx
@@ -324,19 +324,21 @@ export const ActionsConnectorsList: React.FunctionComponent = () => {
                   />
                 </EuiButton>,
               ],
-        toolsRight: [
-          <EuiButton
-            data-test-subj="createActionButton"
-            key="create-action"
-            fill
-            onClick={() => setAddFlyoutVisibility(true)}
-          >
-            <FormattedMessage
-              id="xpack.triggersActionsUI.sections.actionsConnectorsList.addActionButtonLabel"
-              defaultMessage="Create connector"
-            />
-          </EuiButton>,
-        ],
+        toolsRight: canSave
+          ? [
+              <EuiButton
+                data-test-subj="createActionButton"
+                key="create-action"
+                fill
+                onClick={() => setAddFlyoutVisibility(true)}
+              >
+                <FormattedMessage
+                  id="xpack.triggersActionsUI.sections.actionsConnectorsList.addActionButtonLabel"
+                  defaultMessage="Create connector"
+                />
+              </EuiButton>,
+            ]
+          : [],
       }}
     />
   );

diff --git a/x-pack/plugins/triggers_actions_ui/public/types.ts b/x-pack/plugins/triggers_actions_ui/public/types.ts
@@ -32,6 +32,7 @@ export interface ActionConnectorFieldsProps<TActionConnector> {
   errors: IErrorObject;
   docLinks: DocLinksStart;
   http?: HttpSetup;
+  readOnly: boolean;
 }
 
 export interface ActionParamsProps<TParams> {