Add support for convert_index_to_remote action

models/interfaces.ts

@@ -428,6 +428,14 @@ export interface SnapshotAction extends Action {
   };
 }
 
+export interface ConvertIndexToRemoteAction extends Action {
+  convert_index_to_remote: {
+    repository: string;
+    snapshot: string;
+    rename_pattern?: string;
+  };
+}
+
 export interface IndexPriorityAction extends Action {
   index_priority: {
     priority?: number;

public/pages/Aliases/containers/Aliases/Aliases.test.tsx

@@ -170,7 +170,7 @@ describe("<Aliases /> spec", () => {
       });
     });
     await userEvent.click(document.getElementById(`_selection_column_${testAliasId}-checkbox`) as Element);
-    await waitFor(() => {});
+    await waitFor(() => { });
     await userEvent.click(document.querySelector('[data-test-subj="moreAction"] button') as Element);
     await userEvent.click(document.querySelector('[data-test-subj="editAction"]') as Element);
     await userEvent.click(getByTestId("cancelCreateAliasButton"));
@@ -225,7 +225,7 @@ describe("<Aliases /> spec", () => {
       getByTestId("form-name-indexArray").querySelector('[data-test-subj="comboBoxSearchInput"]') as Element,
       "1{enter}"
     );
-    await waitFor(() => {});
+    await waitFor(() => { });
     await userEvent.click(getByTestId("createAliasButton"));
     await waitFor(() => {
       expect(coreServicesMock.notifications.toasts.addDanger).toBeCalledTimes(1);

public/pages/VisualCreatePolicy/components/UIActions/ConvertIndexToRemoteUIAction/ConvertIndexToRemoteUIAction.test.tsx

@@ -0,0 +1,60 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from "react";
+import "@testing-library/jest-dom";
+import { render, screen, cleanup } from "@testing-library/react";
+import { DEFAULT_CONVERT_INDEX_TO_REMOTE } from "../../../utils/constants";
+import { ConvertIndexToRemoteAction, UIAction } from "../../../../../../models/interfaces";
+import { actionRepoSingleton } from "../../../utils/helpers";
+
+const TEST_PROPS: UIAction<ConvertIndexToRemoteAction> = {
+  action: DEFAULT_CONVERT_INDEX_TO_REMOTE,
+} as UIAction<ConvertIndexToRemoteAction>;
+
+const mockOnChangeAction = jest.fn();
+
+afterEach(() => cleanup());
+
+describe("ConvertIndexToRemoteUIAction component", () => {
+  it("renders correctly with default action", () => {
+    const { container } = render(actionRepoSingleton.getUIAction("convert_index_to_remote").render(TEST_PROPS, mockOnChangeAction));
+
+    const repositoryInput = screen.getByTestId("action-render-convert-index-to-remote-repository");
+    expect(repositoryInput).toBeInTheDocument();
+    expect(repositoryInput).toHaveValue(DEFAULT_CONVERT_INDEX_TO_REMOTE.convert_index_to_remote.repository);
+    const snapshotInput = screen.getByTestId("action-render-convert-index-to-remote-snapshot");
+    expect(snapshotInput).toBeInTheDocument();
+    expect(snapshotInput).toHaveValue(DEFAULT_CONVERT_INDEX_TO_REMOTE.convert_index_to_remote.snapshot);
+    const renamePatternInput = screen.getByTestId("action-render-convert-index-to-remote-rename-pattern");
+    expect(renamePatternInput).toBeInTheDocument();
+    // Should display the backend default fallback value
+    expect(renamePatternInput).toHaveValue("$1_remote");
+
+    expect(container).toMatchSnapshot();
+  });
+
+  it("renders correctly when rename_pattern is provided", () => {
+    const actionWithoutRenamePattern: UIAction<ConvertIndexToRemoteAction> = {
+      action: {
+        convert_index_to_remote: {
+          repository: "test-repository",
+          snapshot: "test-snapshot",
+          rename_pattern: "remote_$1",
+        },
+      },
+    } as UIAction<ConvertIndexToRemoteAction>;
+
+    const { container } = render(
+      actionRepoSingleton.getUIAction("convert_index_to_remote").render(actionWithoutRenamePattern, mockOnChangeAction)
+    );
+
+    const renamePatternInput = screen.getByTestId("action-render-convert-index-to-remote-rename-pattern");
+    expect(renamePatternInput).toBeInTheDocument();
+    expect(renamePatternInput).toHaveValue("remote_$1");
+
+    expect(container).toMatchSnapshot();
+  });
+});

public/pages/VisualCreatePolicy/components/UIActions/ConvertIndexToRemoteUIAction/ConvertIndexToRemoteUIAction.tsx

@@ -0,0 +1,107 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React, { ChangeEvent } from "react";
+import { DEFAULT_CONVERT_INDEX_TO_REMOTE } from "../../../utils/constants";
+import { EuiCompressedFormRow, EuiCompressedFieldText, EuiSpacer } from "@elastic/eui";
+import { ConvertIndexToRemoteAction, UIAction } from "../../../../../../models/interfaces";
+import { makeId } from "../../../../../utils/helpers";
+import { ActionType } from "../../../utils/constants";
+import EuiFormCustomLabel from "../../EuiFormCustomLabel";
+
+export default class ConvertIndexToRemoteUIAction implements UIAction<ConvertIndexToRemoteAction> {
+  id: string;
+  action: ConvertIndexToRemoteAction;
+  type = ActionType.ConvertIndexToRemote;
+
+  constructor(action: ConvertIndexToRemoteAction, id: string = makeId()) {
+    this.action = action;
+    this.id = id;
+  }
+
+  content = () => `Convert Index To Remote`;
+
+  clone = (action: ConvertIndexToRemoteAction) => new ConvertIndexToRemoteUIAction(action, this.id);
+
+  isValid = () => {
+    return !!this.action.convert_index_to_remote.snapshot && !!this.action.convert_index_to_remote.repository;
+  };
+
+  render = (action: UIAction<ConvertIndexToRemoteAction>, onChangeAction: (action: UIAction<ConvertIndexToRemoteAction>) => void) => {
+    return (
+      <>
+        <EuiFormCustomLabel
+          title="Repository"
+          helpText="The repository name that you register through the native snapshot API operations."
+          isInvalid={!this.isValid()}
+        />
+        <EuiCompressedFormRow fullWidth isInvalid={!this.isValid()} error={null}>
+          <EuiCompressedFieldText
+            fullWidth
+            value={(action.action as ConvertIndexToRemoteAction).convert_index_to_remote.repository}
+            onChange={(e: ChangeEvent<HTMLInputElement>) => {
+              const repository = e.target.value;
+              onChangeAction(
+                this.clone({
+                  convert_index_to_remote: {
+                    ...action.action.convert_index_to_remote,
+                    repository,
+                  },
+                })
+              );
+            }}
+            data-test-subj="action-render-convert-index-to-remote-repository"
+          />
+        </EuiCompressedFormRow>
+        <EuiSpacer size="s" />
+        <EuiFormCustomLabel title="Snapshot" helpText="The name of the snapshot." isInvalid={!this.isValid()} />
+        <EuiCompressedFormRow fullWidth isInvalid={!this.isValid()} error={null}>
+          <EuiCompressedFieldText
+            fullWidth
+            value={(action.action as ConvertIndexToRemoteAction).convert_index_to_remote.snapshot}
+            onChange={(e: ChangeEvent<HTMLInputElement>) => {
+              const snapshot = e.target.value;
+              onChangeAction(
+                this.clone({
+                  convert_index_to_remote: {
+                    ...action.action.convert_index_to_remote,
+                    snapshot,
+                  },
+                })
+              );
+            }}
+            data-test-subj="action-render-convert-index-to-remote-snapshot"
+          />
+        </EuiCompressedFormRow>
+        <EuiSpacer size="s" />
+        <EuiFormCustomLabel
+          title="Rename Pattern"
+          helpText="Rename pattern for restored index ($1 is the name of managed index)."
+          isInvalid={!this.isValid()}
+        />
+        <EuiCompressedFormRow fullWidth isInvalid={!this.isValid()} error={null}>
+          <EuiCompressedFieldText
+            fullWidth
+            value={(action.action as ConvertIndexToRemoteAction).convert_index_to_remote.rename_pattern ?? "$1_remote"}
+            onChange={(e: ChangeEvent<HTMLInputElement>) => {
+              const rename_pattern = e.target.value;
+              onChangeAction(
+                this.clone({
+                  convert_index_to_remote: {
+                    ...action.action.convert_index_to_remote,
+                    rename_pattern,
+                  },
+                })
+              );
+            }}
+            data-test-subj="action-render-convert-index-to-remote-rename-pattern"
+          />
+        </EuiCompressedFormRow>
+      </>
+    );
+  };
+
+  toAction = () => this.action;
+}