split duplicate_modal

Signed-off-by: yubonluo <yubonluo@amazon.com>

src/plugins/saved_objects_management/public/management_section/objects_table/components/duplicate_modal.test.tsx

@@ -8,17 +8,14 @@ import {
   notificationServiceMock,
   workspacesServiceMock,
 } from '../../../../../../core/public/mocks';
-import {
-  DuplicateMode,
-  ShowDuplicateModalProps,
-  SavedObjectsDuplicateModal,
-} from './duplicate_modal';
+import { ShowDuplicateModalProps, SavedObjectsDuplicateModal } from './duplicate_modal';
 import { SavedObjectWithMetadata } from '../../../types';
 import { shallowWithI18nProvider } from 'test_utils/enzyme_helpers';
 import React from 'react';
 import { WorkspaceObject } from 'src/core/types';
 import { render } from '@testing-library/react';
 import { WorkspaceOption } from './utils';
+import { DuplicateMode } from '../../types';
 
 interface Props extends ShowDuplicateModalProps {
   onClose: () => void;

src/plugins/saved_objects_management/public/management_section/objects_table/components/duplicate_modal.tsx

@@ -29,17 +29,10 @@ import { HttpSetup, NotificationsStart, WorkspacesStart } from 'opensearch-dashb
 import { i18n } from '@osd/i18n';
 import { SavedObjectWithMetadata } from '../../../../common';
 import { getSavedObjectLabel } from '../../../../public';
-import {
-  WorkspaceOption,
-  capitalizeFirstLetter,
-  getTargetWorkspacesOptions,
-  workspaceToOption,
-} from './utils';
+import { WorkspaceOption, getTargetWorkspacesOptions, workspaceToOption } from './utils';
+import { DuplicateMode } from '../../types';
+import RenderDuplicateObjectCategories from './duplicate_object_categories';
 
-export enum DuplicateMode {
-  Selected = 'selected',
-  All = 'all',
-}
 export interface ShowDuplicateModalProps {
   onDuplicate: (
     savedObjects: SavedObjectWithMetadata[],
@@ -148,49 +141,6 @@ export class SavedObjectsDuplicateModal extends React.Component<Props, State> {
     }
   };
 
-  // A checkbox showing the type and count of save objects.
-  renderDuplicateObjectCategory = (
-    savedObjectType: string,
-    savedObjectTypeCount: number,
-    savedObjectTypeChecked: boolean
-  ) => {
-    return (
-      <EuiCheckbox
-        id={'includeSavedObjectType.' + savedObjectType}
-        key={savedObjectType}
-        label={
-          <FormattedMessage
-            id={
-              'savedObjectsManagement.objectsTable.duplicateModal.savedObjectType.' +
-              savedObjectType
-            }
-            defaultMessage={
-              capitalizeFirstLetter(savedObjectType) + ` (${savedObjectTypeCount.toString()})`
-            }
-          />
-        }
-        checked={savedObjectTypeChecked}
-        onChange={() => this.changeIncludeSavedObjectType(savedObjectType)}
-      />
-    );
-  };
-
-  renderDuplicateObjectCategories = () => {
-    const { savedObjectTypeInfoMap } = this.state;
-    const checkboxList: JSX.Element[] = [];
-    savedObjectTypeInfoMap.forEach(
-      ([savedObjectTypeCount, savedObjectTypeChecked], savedObjectType) =>
-        checkboxList.push(
-          this.renderDuplicateObjectCategory(
-            savedObjectType,
-            savedObjectTypeCount,
-            savedObjectTypeChecked
-          )
-        )
-    );
-    return checkboxList;
-  };
-
   isSavedObjectTypeIncluded = (savedObjectType: string) => {
     const { savedObjectTypeInfoMap } = this.state;
     const savedObjectTypeInfo = savedObjectTypeInfoMap.get(savedObjectType);
@@ -223,18 +173,13 @@ export class SavedObjectsDuplicateModal extends React.Component<Props, State> {
       confirmDuplicateButtonEnabled = true;
     }
 
-    const warningMessageForOnlyOneSavedObject = (
+    const warningMessage = (
       <EuiText>
-        <EuiTextColor color="danger">1</EuiTextColor> saved object will{' '}
-        <EuiTextColor color="danger">not</EuiTextColor> be copied, because it has already existed in
-        the selected workspace or it is worksapce itself.
-      </EuiText>
-    );
-    const warningMessageForMultipleSavedObjects = (
-      <EuiText>
-        <EuiTextColor color="danger">{ignoredSelectedObjectsLength}</EuiTextColor> saved objects
-        will <EuiTextColor color="danger">not</EuiTextColor> be copied, because they have already
-        existed in selected workspace or they are workspaces themselves.
+        <EuiTextColor color="danger">{ignoredSelectedObjectsLength}</EuiTextColor> saved object
+        {ignoredSelectedObjectsLength === 1 ? ' will' : 's will'}{' '}
+        <EuiTextColor color="danger">not</EuiTextColor> be copied, because{' '}
+        {ignoredSelectedObjectsLength === 1 ? 'it has' : 'they have'} already existed in the
+        selected workspace.
       </EuiText>
     );
 
@@ -247,9 +192,7 @@ export class SavedObjectsDuplicateModal extends React.Component<Props, State> {
           iconType="help"
           aria-disabled={ignoredSelectedObjectsLength === 0}
         >
-          {ignoredSelectedObjectsLength === 1
-            ? warningMessageForOnlyOneSavedObject
-            : warningMessageForMultipleSavedObjects}
+          {warningMessage}
         </EuiCallOut>
         <EuiSpacer />
       </>
@@ -303,7 +246,11 @@ export class SavedObjectsDuplicateModal extends React.Component<Props, State> {
           </EuiFormRow>
 
           <EuiSpacer size="m" />
-          {duplicateMode === DuplicateMode.All && this.renderDuplicateObjectCategories()}
+          {duplicateMode === DuplicateMode.All &&
+            RenderDuplicateObjectCategories(
+              this.state.savedObjectTypeInfoMap,
+              this.changeIncludeSavedObjectType
+            )}
           {duplicateMode === DuplicateMode.All && <EuiSpacer size="m" />}
 
           <EuiFormRow

src/plugins/saved_objects_management/public/management_section/objects_table/components/duplicate_object_categories.test.tsx

@@ -0,0 +1,23 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import RenderDuplicateObjectCategories from './duplicate_object_categories';
+
+describe('RenderDuplicateObjectCategories', () => {
+  test('renders checkboxes correctly', () => {
+    const savedObjectTypeInfoMap: Map<string, [number, boolean]> = new Map([
+      ['type1', [5, true]],
+      ['type2', [10, false]],
+    ]);
+    const changeIncludeSavedObjectTypeMock = jest.fn();
+
+    const renderDuplicateObjectCategories = RenderDuplicateObjectCategories(
+      savedObjectTypeInfoMap,
+      changeIncludeSavedObjectTypeMock
+    );
+
+    expect(renderDuplicateObjectCategories).toMatchSnapshot();
+  });
+});

src/plugins/saved_objects_management/public/management_section/objects_table/components/duplicate_object_categories.tsx

@@ -0,0 +1,56 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { EuiCheckbox } from '@elastic/eui';
+import React from 'react';
+import { FormattedMessage } from '@osd/i18n/react';
+import { capitalizeFirstLetter } from './utils';
+
+// A checkbox showing the type and count of save objects.
+function renderDuplicateObjectCategory(
+  savedObjectType: string,
+  savedObjectTypeCount: number,
+  savedObjectTypeChecked: boolean,
+  changeIncludeSavedObjectType: (savedObjectType: string) => void
+) {
+  return (
+    <EuiCheckbox
+      id={'includeSavedObjectType.' + savedObjectType}
+      key={savedObjectType}
+      label={
+        <FormattedMessage
+          id={
+            'savedObjectsManagement.objectsTable.duplicateModal.savedObjectType.' + savedObjectType
+          }
+          defaultMessage={
+            capitalizeFirstLetter(savedObjectType) + ` (${savedObjectTypeCount.toString()})`
+          }
+        />
+      }
+      checked={savedObjectTypeChecked}
+      onChange={() => changeIncludeSavedObjectType(savedObjectType)}
+    />
+  );
+}
+
+// eslint-disable-next-line import/no-default-export
+export default function RenderDuplicateObjectCategories(
+  savedObjectTypeInfoMap: Map<string, [number, boolean]>,
+  changeIncludeSavedObjectType: (savedObjectType: string) => void
+) {
+  const checkboxList: React.JSX.Element[] = [];
+  savedObjectTypeInfoMap.forEach(
+    ([savedObjectTypeCount, savedObjectTypeChecked], savedObjectType) =>
+      checkboxList.push(
+        renderDuplicateObjectCategory(
+          savedObjectType,
+          savedObjectTypeCount,
+          savedObjectTypeChecked,
+          changeIncludeSavedObjectType
+        )
+      )
+  );
+  return checkboxList;
+}

src/plugins/saved_objects_management/public/management_section/objects_table/saved_objects_table.tsx

@@ -96,7 +96,7 @@ import {
 } from '../../services';
 import { Header, Table, Flyout, Relationships, SavedObjectsDuplicateModal } from './components';
 import { DataPublicPluginStart } from '../../../../../plugins/data/public';
-import { DuplicateMode } from './';
+import { DuplicateMode } from '../types';
 
 interface ExportAllOption {
   id: string;

src/plugins/saved_objects_management/public/management_section/types.ts

@@ -47,3 +47,8 @@ export interface SubmittedFormData {
   attributes: any;
   references: SavedObjectReference[];
 }
+
+export enum DuplicateMode {
+  Selected = 'selected',
+  All = 'all',
+}