Merge branch 'pr-integr-duplicate' of github.com:yubonluo/OpenSearch-…

…Dashboards into pr-integr-duplicate

src/core/public/http/http_service.test.ts

@@ -83,21 +83,22 @@ describe('#setup()', () => {
     expect(setupResult.basePath.get()).toEqual('');
   });
 
-  it('setup basePath with workspaceId provided in window.location.href', () => {
+  it('setup basePath with workspaceId provided in window.location.href and basePath present in injectedMetadata', () => {
     const windowSpy = jest.spyOn(window, 'window', 'get');
     windowSpy.mockImplementation(
       () =>
         ({
           location: {
-            href: 'http://localhost/w/workspaceId/app',
+            href: 'http://localhost/base_path/w/workspaceId/app',
           },
         } as any)
     );
     const injectedMetadata = injectedMetadataServiceMock.createSetupContract();
+    injectedMetadata.getBasePath.mockReturnValue('/base_path');
     const fatalErrors = fatalErrorsServiceMock.createSetupContract();
     const httpService = new HttpService();
     const setupResult = httpService.setup({ fatalErrors, injectedMetadata });
-    expect(setupResult.basePath.get()).toEqual('/w/workspaceId');
+    expect(setupResult.basePath.get()).toEqual('/base_path/w/workspaceId');
     windowSpy.mockRestore();
   });
 });

src/core/public/http/http_service.ts

@@ -53,7 +53,7 @@ export class HttpService implements CoreService<HttpSetup, HttpStart> {
   public setup({ injectedMetadata, fatalErrors }: HttpDeps): HttpSetup {
     const opensearchDashboardsVersion = injectedMetadata.getOpenSearchDashboardsVersion();
     let clientBasePath = '';
-    const workspaceId = getWorkspaceIdFromUrl(window.location.href);
+    const workspaceId = getWorkspaceIdFromUrl(window.location.href, injectedMetadata.getBasePath());
     if (workspaceId) {
       clientBasePath = `${WORKSPACE_PATH_PREFIX}/${workspaceId}`;
     }

src/core/utils/workspace.test.ts

@@ -8,11 +8,11 @@ import { httpServiceMock } from '../public/mocks';
 
 describe('#getWorkspaceIdFromUrl', () => {
   it('return workspace when there is a match', () => {
-    expect(getWorkspaceIdFromUrl('http://localhost/w/foo')).toEqual('foo');
+    expect(getWorkspaceIdFromUrl('http://localhost/w/foo', '')).toEqual('foo');
   });
 
   it('return empty when there is not a match', () => {
-    expect(getWorkspaceIdFromUrl('http://localhost/w2/foo')).toEqual('');
+    expect(getWorkspaceIdFromUrl('http://localhost/w2/foo', '')).toEqual('');
   });
 
   it('return workspace when there is a match with basePath provided', () => {

src/core/utils/workspace.ts

@@ -6,7 +6,7 @@
 import { WORKSPACE_PATH_PREFIX } from './constants';
 import { IBasePath } from '../public';
 
-export const getWorkspaceIdFromUrl = (url: string, basePath?: string): string => {
+export const getWorkspaceIdFromUrl = (url: string, basePath: string): string => {
   const regexp = new RegExp(`^${basePath || ''}\/w\/([^\/]*)`);
   const urlObject = new URL(url);
   const matchedResult = urlObject.pathname.match(regexp);

src/plugins/workspace/public/application.tsx

@@ -10,6 +10,7 @@ import { OpenSearchDashboardsContextProvider } from '../../opensearch_dashboards
 import { WorkspaceListApp } from './components/workspace_list_app';
 import { WorkspaceFatalError } from './components/workspace_fatal_error';
 import { WorkspaceCreatorApp } from './components/workspace_creator_app';
+import { WorkspaceUpdaterApp } from './components/workspace_updater_app';
 import { Services } from './types';
 
 export const renderCreatorApp = ({ element }: AppMountParameters, services: Services) => {
@@ -25,6 +26,19 @@ export const renderCreatorApp = ({ element }: AppMountParameters, services: Serv
   };
 };
 
+export const renderUpdaterApp = ({ element }: AppMountParameters, services: Services) => {
+  ReactDOM.render(
+    <OpenSearchDashboardsContextProvider services={services}>
+      <WorkspaceUpdaterApp />
+    </OpenSearchDashboardsContextProvider>,
+    element
+  );
+
+  return () => {
+    ReactDOM.unmountComponentAtNode(element);
+  };
+};
+
 export const renderFatalErrorApp = (params: AppMountParameters, services: Services) => {
   const { element } = params;
   const history = params.history as ScopedHistory<{ error?: string }>;

src/plugins/workspace/public/components/workspace_form/workspace_bottom_bar.tsx

@@ -92,7 +92,13 @@ export const WorkspaceBottomBar = ({
                 </EuiButton>
               )}
               {operationType === WorkspaceOperationType.Update && (
-                <EuiButton form={formId} type="submit" fill color="primary">
+                <EuiButton
+                  form={formId}
+                  type="submit"
+                  fill
+                  color="primary"
+                  data-test-subj="workspaceForm-bottomBar-updateButton"
+                >
                   {i18n.translate('workspace.form.bottomBar.saveChanges', {
                     defaultMessage: 'Save changes',
                   })}

src/plugins/workspace/public/components/workspace_updater/index.tsx

@@ -0,0 +1,6 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export { WorkspaceUpdater } from './workspace_updater';

src/plugins/workspace/public/components/workspace_updater/workspace_updater.test.tsx

@@ -0,0 +1,211 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { PublicAppInfo, WorkspaceObject } from 'opensearch-dashboards/public';
+import { fireEvent, render, waitFor } from '@testing-library/react';
+import { BehaviorSubject } from 'rxjs';
+import { WorkspaceUpdater as WorkspaceCreatorComponent } from './workspace_updater';
+import { coreMock, workspacesServiceMock } from '../../../../../core/public/mocks';
+import { createOpenSearchDashboardsReactContext } from '../../../../opensearch_dashboards_react/public';
+
+const workspaceClientUpdate = jest.fn().mockReturnValue({ result: true, success: true });
+
+const navigateToApp = jest.fn();
+const notificationToastsAddSuccess = jest.fn();
+const notificationToastsAddDanger = jest.fn();
+const PublicAPPInfoMap = new Map([
+  ['app1', { id: 'app1', title: 'app1' }],
+  ['app2', { id: 'app2', title: 'app2', category: { id: 'category1', label: 'category1' } }],
+  ['app3', { id: 'app3', category: { id: 'category1', label: 'category1' } }],
+  ['app4', { id: 'app4', category: { id: 'category2', label: 'category2' } }],
+  ['app5', { id: 'app5', category: { id: 'category2', label: 'category2' } }],
+]);
+const createWorkspacesSetupContractMockWithValue = () => {
+  const currentWorkspaceId$ = new BehaviorSubject<string>('abljlsds');
+  const currentWorkspace: WorkspaceObject = {
+    id: 'abljlsds',
+    name: 'test1',
+    description: 'test1',
+    features: [],
+    color: '',
+    icon: '',
+    reserved: false,
+  };
+  const workspaceList$ = new BehaviorSubject<WorkspaceObject[]>([currentWorkspace]);
+  const currentWorkspace$ = new BehaviorSubject<WorkspaceObject | null>(currentWorkspace);
+  const initialized$ = new BehaviorSubject<boolean>(false);
+  return {
+    currentWorkspaceId$,
+    workspaceList$,
+    currentWorkspace$,
+    initialized$,
+  };
+};
+
+const mockCoreStart = coreMock.createStart();
+
+const WorkspaceUpdater = (props: any) => {
+  const workspacesService = props.workspacesService || createWorkspacesSetupContractMockWithValue();
+  const { Provider } = createOpenSearchDashboardsReactContext({
+    ...mockCoreStart,
+    ...{
+      application: {
+        ...mockCoreStart.application,
+        capabilities: {
+          ...mockCoreStart.application.capabilities,
+          workspaces: {
+            permissionEnabled: true,
+          },
+        },
+        navigateToApp,
+        getUrlForApp: jest.fn(),
+        applications$: new BehaviorSubject<Map<string, PublicAppInfo>>(PublicAPPInfoMap as any),
+      },
+      workspaces: workspacesService,
+      notifications: {
+        ...mockCoreStart.notifications,
+        toasts: {
+          ...mockCoreStart.notifications.toasts,
+          addDanger: notificationToastsAddDanger,
+          addSuccess: notificationToastsAddSuccess,
+        },
+      },
+      workspaceClient: {
+        ...mockCoreStart.workspaces,
+        update: workspaceClientUpdate,
+      },
+    },
+  });
+
+  return (
+    <Provider>
+      <WorkspaceCreatorComponent {...props} />
+    </Provider>
+  );
+};
+
+function clearMockedFunctions() {
+  workspaceClientUpdate.mockClear();
+  notificationToastsAddDanger.mockClear();
+  notificationToastsAddSuccess.mockClear();
+}
+
+describe('WorkspaceUpdater', () => {
+  beforeEach(() => clearMockedFunctions());
+  const { location } = window;
+  const setHrefSpy = jest.fn((href) => href);
+
+  beforeAll(() => {
+    if (window.location) {
+      // @ts-ignore
+      delete window.location;
+    }
+    window.location = {} as Location;
+    Object.defineProperty(window.location, 'href', {
+      get: () => 'http://localhost/',
+      set: setHrefSpy,
+    });
+  });
+
+  afterAll(() => {
+    window.location = location;
+  });
+
+  it('cannot render when the name of the current workspace is empty', async () => {
+    const mockedWorkspacesService = workspacesServiceMock.createSetupContract();
+    const { container } = render(<WorkspaceUpdater workspacesService={mockedWorkspacesService} />);
+    expect(container).toMatchInlineSnapshot(`<div />`);
+  });
+
+  it('cannot create workspace with invalid name', async () => {
+    const { getByTestId } = render(<WorkspaceUpdater />);
+    const nameInput = getByTestId('workspaceForm-workspaceDetails-nameInputText');
+    fireEvent.input(nameInput, {
+      target: { value: '~' },
+    });
+    expect(workspaceClientUpdate).not.toHaveBeenCalled();
+  });
+
+  it('update workspace successfully', async () => {
+    const { getByTestId, getByText } = render(<WorkspaceUpdater />);
+    const nameInput = getByTestId('workspaceForm-workspaceDetails-nameInputText');
+    fireEvent.input(nameInput, {
+      target: { value: 'test workspace name' },
+    });
+
+    const descriptionInput = getByTestId('workspaceForm-workspaceDetails-descriptionInputText');
+    fireEvent.input(descriptionInput, {
+      target: { value: 'test workspace description' },
+    });
+
+    const colorSelector = getByTestId(
+      'euiColorPickerAnchor workspaceForm-workspaceDetails-colorPicker'
+    );
+    fireEvent.input(colorSelector, {
+      target: { value: '#000000' },
+    });
+
+    fireEvent.click(getByTestId('workspaceForm-workspaceFeatureVisibility-app1'));
+    fireEvent.click(getByTestId('workspaceForm-workspaceFeatureVisibility-category1'));
+
+    fireEvent.click(getByText('Users & Permissions'));
+    fireEvent.click(getByTestId('workspaceForm-permissionSettingPanel-user-addNew'));
+    const userIdInput = getByTestId('workspaceForm-permissionSettingPanel-0-userId');
+    fireEvent.click(userIdInput);
+    fireEvent.input(getByTestId('comboBoxSearchInput'), {
+      target: { value: 'test user id' },
+    });
+    fireEvent.blur(getByTestId('comboBoxSearchInput'));
+
+    fireEvent.click(getByTestId('workspaceForm-bottomBar-updateButton'));
+    expect(workspaceClientUpdate).toHaveBeenCalledWith(
+      expect.any(String),
+      expect.objectContaining({
+        name: 'test workspace name',
+        color: '#000000',
+        description: 'test workspace description',
+        features: expect.arrayContaining(['app1', 'app2', 'app3']),
+      }),
+      expect.arrayContaining([expect.objectContaining({ type: 'user', userId: 'test user id' })])
+    );
+    await waitFor(() => {
+      expect(notificationToastsAddSuccess).toHaveBeenCalled();
+    });
+    expect(notificationToastsAddDanger).not.toHaveBeenCalled();
+  });
+
+  it('should show danger toasts after update workspace failed', async () => {
+    workspaceClientUpdate.mockReturnValue({ result: false, success: false });
+    const { getByTestId } = render(<WorkspaceUpdater />);
+    const nameInput = getByTestId('workspaceForm-workspaceDetails-nameInputText');
+    fireEvent.input(nameInput, {
+      target: { value: 'test workspace name' },
+    });
+    fireEvent.click(getByTestId('workspaceForm-bottomBar-updateButton'));
+    expect(workspaceClientUpdate).toHaveBeenCalled();
+    await waitFor(() => {
+      expect(notificationToastsAddDanger).toHaveBeenCalled();
+    });
+    expect(notificationToastsAddSuccess).not.toHaveBeenCalled();
+  });
+
+  it('should show danger toasts after update workspace threw error', async () => {
+    workspaceClientUpdate.mockImplementation(() => {
+      throw new Error('update workspace failed');
+    });
+    const { getByTestId } = render(<WorkspaceUpdater />);
+    const nameInput = getByTestId('workspaceForm-workspaceDetails-nameInputText');
+    fireEvent.input(nameInput, {
+      target: { value: 'test workspace name' },
+    });
+    fireEvent.click(getByTestId('workspaceForm-bottomBar-updateButton'));
+    expect(workspaceClientUpdate).toHaveBeenCalled();
+    await waitFor(() => {
+      expect(notificationToastsAddDanger).toHaveBeenCalled();
+    });
+    expect(notificationToastsAddSuccess).not.toHaveBeenCalled();
+  });
+});