Fixes default state not updating when changing state name (opensearch-project#145)

Signed-off-by: Drew Baugher <dbbaughe@amazon.com>

Author: dbbaughe

.github/workflows/cypress-workflow.yml

@@ -9,7 +9,7 @@ on:
       - development-*
 env:
   OPENSEARCH_DASHBOARDS_VERSION: '1.x'
-  OPENSEARCH_VERSION: '1.2.0-SNAPSHOT'
+  OPENSEARCH_VERSION: '1.3.0-SNAPSHOT'
 jobs:
   tests:
     name: Run Cypress E2E tests

cypress/fixtures/sample_rollover_policy.json

@@ -7,7 +7,10 @@
         "name": "hot",
         "actions": [
           {
-            "rollover": {}
+            "rollover": {},
+            "retry": {
+              "count": 0
+            }
           }
         ],
         "transitions": [

opensearch_dashboards.json

@@ -1,7 +1,7 @@
 {
   "id": "indexManagementDashboards",
-  "version": "1.2.0.0",
-  "opensearchDashboardsVersion": "1.2.0",
+  "version": "1.3.0.0",
+  "opensearchDashboardsVersion": "1.3.0",
   "configPath": ["opensearch_index_management"],
   "requiredPlugins": ["navigation"],
   "server": true,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "opensearch_index_management_dashboards",
-  "version": "1.2.0.0",
+  "version": "1.3.0.0",
   "description": "Opensearch Dashboards plugin for Index Management",
   "main": "index.js",
   "license": "Apache-2.0",

public/pages/VisualCreatePolicy/containers/CreateState/CreateState.tsx

@@ -34,7 +34,7 @@ import { actionRepoSingleton, getOrderInfo } from "../../utils/helpers";
 
 interface CreateStateProps {
   policy: Policy;
-  onSaveState: (state: State, editingState: State | null, states: State[], order: string, afterBeforeState: string) => void;
+  onSaveState: (state: State, states: State[], order: string, afterBeforeState: string) => void;
   onCloseFlyout: () => void;
   state: State | null;
 }
@@ -176,14 +176,13 @@ export default class CreateState extends Component<CreateStateProps, CreateState
 
   onClickSaveState = () => {
     const { order, afterBeforeState } = this.state;
-    const { onSaveState, state, policy } = this.props;
+    const { onSaveState, policy } = this.props;
     onSaveState(
       {
         name: this.state.name,
         actions: this.state.actions.map((action) => action.toAction()),
         transitions: this.state.transitions.map((transition) => transition.transition),
       },
-      state,
       policy.states,
       order,
       afterBeforeState

public/pages/VisualCreatePolicy/containers/VisualCreatePolicy/VisualCreatePolicy.tsx

@@ -17,7 +17,7 @@ import ISMTemplates from "../../components/ISMTemplates";
 import States from "../../components/States";
 import CreateState from "../CreateState";
 import { getErrorMessage } from "../../../../utils/helpers";
-import { getUpdatedStates } from "../../utils/helpers";
+import { getUpdatedPolicy, getUpdatedStates } from "../../utils/helpers";
 import ErrorNotification from "../ErrorNotification";
 
 interface VisualCreatePolicyProps extends RouteComponentProps {
@@ -171,13 +171,13 @@ export default class VisualCreatePolicy extends Component<VisualCreatePolicyProp
         this.context.notifications.toasts.addSuccess(`Created policy: ${response.response._id}`);
         this.props.history.push(ROUTES.INDEX_POLICIES);
       } else {
-        this.setState({ submitError: response.error });
+        this.setState({ submitError: response.error, isSubmitting: false });
         this.context.notifications.toasts.addDanger(`Failed to create policy: ${response.error}`);
       }
     } catch (err) {
       const errorMessage = getErrorMessage(err, "There was a problem creating the policy");
       this.context.notifications.toasts.addDanger(errorMessage);
-      this.setState({ submitError: errorMessage });
+      this.setState({ submitError: errorMessage, isSubmitting: false });
     }
   };
 
@@ -195,12 +195,12 @@ export default class VisualCreatePolicy extends Component<VisualCreatePolicyProp
         this.props.history.push(ROUTES.INDEX_POLICIES);
       } else {
         this.context.notifications.toasts.addDanger(`Failed to update policy: ${response.error}`);
-        this.setState({ submitError: response.error });
+        this.setState({ submitError: response.error, isSubmitting: false });
       }
     } catch (err) {
       const errorMessage = getErrorMessage(err, "There was a problem updating the policy");
       this.context.notifications.toasts.addDanger(errorMessage);
-      this.setState({ submitError: errorMessage });
+      this.setState({ submitError: errorMessage, isSubmitting: false });
     }
   };
 
@@ -223,9 +223,15 @@ export default class VisualCreatePolicy extends Component<VisualCreatePolicyProp
     } catch (err) {
       this.context.notifications.toasts.addDanger("Invalid Policy");
       console.error(err);
+      this.setState({ isSubmitting: false });
     }
+  };
 
-    this.setState({ isSubmitting: false });
+  onSaveState = (state: State, states: State[], order: string, afterBeforeState: string) => {
+    const { policy, editingState } = this.state;
+    const updatedPolicy = getUpdatedPolicy(policy, state, editingState, states, order, afterBeforeState);
+    this.setState({ policy: updatedPolicy });
+    this.onCloseFlyout();
   };
 
   render() {
@@ -272,25 +278,7 @@ export default class VisualCreatePolicy extends Component<VisualCreatePolicyProp
         <EuiSpacer size="m" />
 
         {showFlyout && (
-          <CreateState
-            state={editingState}
-            policy={policy}
-            onSaveState={(state: State, editingState: State | null, states: State[], order: string, afterBeforeState: string) => {
-              const updatedStates = getUpdatedStates(state, editingState, states, order, afterBeforeState);
-              let defaultState = policy.default_state;
-              // If we are creating the first state, set the default state to it
-              if (updatedStates.length === 1) defaultState = updatedStates[0].name;
-              this.setState({
-                policy: {
-                  ...policy,
-                  states: updatedStates,
-                  default_state: defaultState,
-                },
-              });
-              this.onCloseFlyout();
-            }}
-            onCloseFlyout={this.onCloseFlyout}
-          />
+          <CreateState state={editingState} policy={policy} onSaveState={this.onSaveState} onCloseFlyout={this.onCloseFlyout} />
         )}
 
         <EuiFlexGroup alignItems="center" justifyContent="flexEnd">

public/pages/VisualCreatePolicy/utils/helpers.test.ts

@@ -3,9 +3,10 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { actionRepoSingleton, capitalizeFirstLetter, convertTemplatesToArray, getOrderInfo } from "./helpers";
+import { actionRepoSingleton, capitalizeFirstLetter, convertTemplatesToArray, getOrderInfo, getUpdatedPolicy } from "./helpers";
 import { Action, ISMTemplate, UIAction } from "../../../../models/interfaces";
 import { makeId } from "../../../utils/helpers";
+import { DEFAULT_POLICY } from "./constants";
 
 test("converts all ism template formats into a list of ism templates", () => {
   expect(convertTemplatesToArray(null)).toEqual([]);
@@ -80,3 +81,10 @@ test("action repository usage", () => {
   expect(actionRepoSingleton.getUIAction("dummy") instanceof DummyUIAction).toBe(true);
   expect(actionRepoSingleton.getUIActionFromData(DEFAULT_DUMMY) instanceof DummyUIAction).toBe(true);
 });
+
+test("changing the default state name correctly updates default_state", () => {
+  const policy = DEFAULT_POLICY;
+  const updatedState = { ...policy.states[0], name: "new_hot" };
+  const newPolicy = getUpdatedPolicy(policy, updatedState, policy.states[0], policy.states, "before", policy.states[1].name);
+  expect(newPolicy.default_state).toBe("new_hot");
+});

public/pages/VisualCreatePolicy/utils/helpers.ts

@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { UIAction, Action, Transition, ISMTemplate, State } from "../../../../models/interfaces";
+import { UIAction, Action, Transition, ISMTemplate, State, Policy } from "../../../../models/interfaces";
 import {
   ActionType,
   DEFAULT_ALLOCATION,
@@ -212,3 +212,30 @@ export const getUpdatedStates = (
 
   return someStates;
 };
+
+export const getUpdatedPolicy = (
+  currentPolicy: Policy,
+  updatedState: State,
+  editingState: State | null,
+  currentStates: State[],
+  order: string,
+  afterBeforeState: string
+): Policy => {
+  const updatedStates = getUpdatedStates(updatedState, editingState, currentStates, order, afterBeforeState);
+  let defaultState = currentPolicy.default_state;
+  // If there is 1 state, change it to this state
+  if (updatedStates.length === 1) {
+    defaultState = updatedStates[0].name;
+  }
+  // Change the default state if the state being edited was the default state
+  if (editingState && editingState.name === defaultState) {
+    // don't bother checking if the name itself changed, just set it regardless to the value from the new state
+    defaultState = updatedState.name;
+  }
+
+  return {
+    ...currentPolicy,
+    states: updatedStates,
+    default_state: defaultState,
+  };
+};