From 11f824b6ae2e8642f75e6aa3d91bd8693df691bf Mon Sep 17 00:00:00 2001
From: Christos Nasikas <christos.nasikas@elastic.co>
Date: Mon, 7 Sep 2020 13:10:22 +0300
Subject: [PATCH] Improve UX when editing an alert

---
 .../builtin_action_types/jira/api.test.ts     |  2 +-
 .../builtin_action_types/jira/jira_params.tsx | 27 ++++++++++++++++---
 2 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/x-pack/plugins/actions/server/builtin_action_types/jira/api.test.ts b/x-pack/plugins/actions/server/builtin_action_types/jira/api.test.ts
index 1aa6b91a11f1c35..4495c37f758eea4 100644
--- a/x-pack/plugins/actions/server/builtin_action_types/jira/api.test.ts
+++ b/x-pack/plugins/actions/server/builtin_action_types/jira/api.test.ts
@@ -360,7 +360,7 @@ describe('api', () => {
     });
 
     describe('fieldsByIssueType', () => {
-      test('it returns the issue types correctly', async () => {
+      test('it returns the fields correctly', async () => {
         const res = await api.fieldsByIssueType({
           externalService,
           params: { id: '10006' },
diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_params.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_params.tsx
index 25995eabb250dff..bde3d67ffd65f4e 100644
--- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_params.tsx
+++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_params.tsx
@@ -33,13 +33,20 @@ const JiraParamsFields: React.FunctionComponent<ActionParamsProps<JiraActionPara
     actionParams.subActionParams || {};
 
   const [issueTypesSelectOptions, setIssueTypesSelectOptions] = useState<EuiSelectOption[]>([]);
+  const [firstLoad, setFirstLoad] = useState(false);
   const [prioritiesSelectOptions, setPrioritiesSelectOptions] = useState<EuiSelectOption[]>([]);
   const { http, toastNotifications } = useAppDependencies();
+
+  useEffect(() => {
+    setFirstLoad(true);
+  }, []);
+
   const { isLoading: isLoadingIssueTypes, issueTypes } = useGetIssueTypes({
     http,
     toastNotifications,
     actionConnector,
   });
+
   const { isLoading: isLoadingFields, fields } = useGetFieldsByIssueType({
     http,
     toastNotifications,
@@ -90,15 +97,27 @@ const JiraParamsFields: React.FunctionComponent<ActionParamsProps<JiraActionPara
 
   // Reset parameters when changing connector
   useEffect(() => {
+    if (!firstLoad) {
+      return;
+    }
+
     setIssueTypesSelectOptions([]);
-    editAction('subActionParams', { savedObjectId }, index);
+    editAction('subActionParams', { title, comments, description: '', savedObjectId }, index);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [actionConnector]);
 
   // Reset fields when changing connector or issue type
   useEffect(() => {
+    if (!firstLoad) {
+      return;
+    }
+
     setPrioritiesSelectOptions([]);
-    editAction('subActionParams', { issueType, savedObjectId }, index);
+    editAction(
+      'subActionParams',
+      { title, issueType, comments, description: '', savedObjectId },
+      index
+    );
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [issueType, savedObjectId]);
 
@@ -121,7 +140,7 @@ const JiraParamsFields: React.FunctionComponent<ActionParamsProps<JiraActionPara
 
   // Set default issue type
   useEffect(() => {
-    if (issueTypesSelectOptions.length > 0) {
+    if (!issueType && issueTypesSelectOptions.length > 0) {
       editSubActionProperty('issueType', issueTypesSelectOptions[0].value as string);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -129,7 +148,7 @@ const JiraParamsFields: React.FunctionComponent<ActionParamsProps<JiraActionPara
 
   // Set default priority
   useEffect(() => {
-    if (prioritiesSelectOptions.length > 0) {
+    if (!priority && prioritiesSelectOptions.length > 0) {
       editSubActionProperty('priority', prioritiesSelectOptions[0].value as string);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps