ZKUI-370: Unable to enable the versioning for the bucket hosted on Az…

…ure or GCP
scality · Jul 13, 2023 · 000b959 · 000b959
1 parent d101909
commit 000b959
Show file tree

Hide file tree

Showing 3 changed files with 113 additions and 42 deletions.
diff --git a/src/js/mock/S3Client.ts b/src/js/mock/S3Client.ts
@@ -157,6 +157,21 @@ export const bucketInfoResponseObjectLockDefaultRetention: BucketInfo = {
     },
   },
 };
+
+export const bucketInfoResponseVersioningDisabled: BucketInfo = {
+  name: bucketName,
+  policy: false,
+  owner: ownerName,
+  aclGrantees: 0,
+  cors: false,
+  versioning: 'Disabled',
+  isVersioning: false,
+  public: false,
+  locationConstraint: 'azure-blob',
+  objectLockConfiguration: {
+    ObjectLockEnabled: 'Disabled',
+  },
+};
 export class MockS3Client implements S3ClientInterface {
   listBucketsWithLocation() {
     return Promise.resolve({

diff --git a/src/react/databrowser/buckets/details/Overview.tsx b/src/react/databrowser/buckets/details/Overview.tsx
@@ -13,7 +13,7 @@ import { ButtonContainer } from '../../../ui-elements/Container';
 import DeleteConfirmation from '../../../ui-elements/DeleteConfirmation';
 import type { BucketInfo } from '../../../../types/s3';
 import { CellLink, TableContainer } from '../../../ui-elements/Table';
-import { Icon, Toggle } from '@scality/core-ui';
+import { Icon, Toggle, Tooltip } from '@scality/core-ui';
 import {
   getLocationType,
   getLocationIngestionState,
@@ -94,7 +94,7 @@ function Overview({ bucket, ingestionStates }: Props) {
   );
   const bucketInfo = useSelector((state: AppState) => state.s3.bucketInfo);
   const locations = useSelector(
-    (state: AppState) => state.configuration.latest.locations,
+    (state: AppState) => state.configuration.latest?.locations,
   );
   const loading = useSelector(
     (state: AppState) => state.networkActivity.counter > 0,
@@ -149,7 +149,10 @@ function Overview({ bucket, ingestionStates }: Props) {
     ingestionStates,
     bucketInfo.locationConstraint || 'us-east-1',
   );
-
+  const locationType =
+    locations && locations[bucketInfo.locationConstraint]?.locationType;
+  const isBucketHostedOnAzureOrGCP =
+    locationType === 'location-azure-v1' || locationType === 'location-gcp-v1';
   return (
     <TableContainer>
       <DeleteConfirmation
@@ -192,25 +195,43 @@ function Overview({ bucket, ingestionStates }: Props) {
                 <T.Value>
                   {bucketInfo.objectLockConfiguration.ObjectLockEnabled ===
                     'Disabled' && (
-                    <Toggle
-                      disabled={loading}
-                      toggle={bucketInfo.isVersioning}
-                      label={
-                        bucketInfo.versioning === 'Enabled'
-                          ? 'Active'
-                          : bucketInfo.versioning === 'Disabled'
-                          ? 'Inactive'
-                          : bucketInfo.versioning
-                      }
-                      onChange={() =>
-                        dispatch(
-                          toggleBucketVersioning(
-                            bucket.name,
-                            !bucketInfo.isVersioning,
-                          ),
+                    <Tooltip
+                      overlay={
+                        locationType === 'location-azure-v1' ? (
+                          <>
+                            Enabling versioning is not possible due to the
+                            bucket being hosted on Microsoft Azure.
+                          </>
+                        ) : locationType === 'location-gcp-v1' ? (
+                          <>
+                            Enabling versioning is not possible due to the
+                            bucket being hosted on Google Cloud.
+                          </>
+                        ) : (
+                          <></>
                         )
                       }
-                    />
+                    >
+                      <Toggle
+                        disabled={loading || isBucketHostedOnAzureOrGCP}
+                        toggle={bucketInfo.isVersioning}
+                        label={
+                          bucketInfo.versioning === 'Enabled'
+                            ? 'Active'
+                            : bucketInfo.versioning === 'Disabled'
+                            ? 'Inactive'
+                            : bucketInfo.versioning
+                        }
+                        onChange={() =>
+                          dispatch(
+                            toggleBucketVersioning(
+                              bucket.name,
+                              !bucketInfo.isVersioning,
+                            ),
+                          )
+                        }
+                      />
+                    </Tooltip>
                   )}
                   {bucketInfo.objectLockConfiguration.ObjectLockEnabled ===
                     'Enabled' && (

diff --git a/src/react/databrowser/buckets/details/__tests__/Overview.test.tsx b/src/react/databrowser/buckets/details/__tests__/Overview.test.tsx
@@ -3,45 +3,54 @@ import * as actions from '../../../../actions/s3bucket';
 import {
   bucketInfoResponseNoVersioning,
   bucketInfoResponseVersioning,
+  bucketInfoResponseVersioningDisabled,
   bucketInfoResponseObjectLockNoDefaultRetention,
   bucketName,
   bucketInfoResponseObjectLockDefaultRetention,
 } from '../../../../../js/mock/S3Client';
 import Overview from '../Overview';
 import { Toggle } from '@scality/core-ui';
-import { reduxMount } from '../../../../utils/testUtil';
+import { reduxMount, reduxRender } from '../../../../utils/testUtil';
+import { screen, waitFor, within } from '@testing-library/react';
+import Immutable from 'immutable';
+import userEvent from '@testing-library/user-event';
 const BUCKET = {
   CreationDate: 'Tue Oct 12 2020 18:38:56',
   LocationConstraint: '',
   Name: bucketName,
 };
 const TEST_STATE = {
   uiBuckets: {
-    showDelete: '',
+    showDelete: false,
   },
   configuration: {
     latest: {
-      locations: [
-        {
-          'us-east-1': {
-            isBuiltin: true,
-            locationType: 'location-file-v1',
-            name: 'us-east-1',
-            objectId: '1060b13c-d805-11ea-a59c-a0999b105a5f',
-          },
+      locations: {
+        'us-east-1': {
+          isBuiltin: true,
+          locationType: 'location-file-v1',
+          name: 'us-east-1',
+          objectId: '1060b13c-d805-11ea-a59c-a0999b105a5f',
         },
-      ],
+
+        'azure-blob': {
+          locationType: 'location-azure-v1',
+          name: 'azure-blob',
+          objectId: '1060b13c-d806-11ea-a59c-a0999b105a5f',
+        },
+      },
     },
   },
   workflow: {
     replications: [],
   },
   networkActivity: {
     counter: 0,
+    messages: Immutable.List(),
   },
 };
 //TODO: Those tests are testing implementation details based on child component names. We should refactor them.
-describe.skip('Overview', () => {
+describe('Overview', () => {
   it('should render Overview component', () => {
     const { component } = reduxMount(<Overview bucket={BUCKET} />, {
       ...TEST_STATE,
@@ -157,23 +166,49 @@ describe.skip('Overview', () => {
       'Governance - 5 days',
     );
   });
-  it('should trigger deleteBucket function when approving clicking on delete button when modal popup', () => {
+  it.skip('should trigger deleteBucket function when approving clicking on delete button when modal popup', async () => {
     const deleteBucketMock = jest.spyOn(actions, 'deleteBucket');
-    const { component } = reduxMount(<Overview bucket={BUCKET} />, {
+    reduxRender(<Overview bucket={BUCKET} />, {
       ...TEST_STATE,
       ...{
-        uiBuckets: {
-          showDelete: bucketName,
-        },
         s3: {
           bucketInfo: bucketInfoResponseVersioning,
         },
       },
     });
-    const deleteButton = component.find(
-      'button.delete-confirmation-delete-button',
-    );
-    deleteButton.simulate('click');
-    expect(deleteBucketMock).toHaveBeenCalledTimes(1);
+    const deleteButton = screen.getByRole('button', { name: /delete bucket/i });
+    userEvent.click(deleteButton);
+    await waitFor(() => {
+      expect(
+        screen.getByRole('dialog', { name: /confirmation/i }),
+      ).toBeVisible();
+    });
+    const confirmationDialog = screen.getByRole('dialog', {
+      name: /confirmation/i,
+    });
+    const confirmDeleteButton = within(confirmationDialog).getByRole('button', {
+      name: /delete/i,
+    });
+    userEvent.click(confirmDeleteButton);
+    expect(deleteBucketMock).toHaveBeenCalledWith(bucketName);
+  });
+  it('should disable the versioning toogle for Azure Blob Storage', async () => {
+    //S
+    reduxRender(<Overview bucket={BUCKET} />, {
+      ...TEST_STATE,
+      ...{ s3: { bucketInfo: bucketInfoResponseVersioningDisabled } },
+    });
+    await waitFor(() => {
+      expect(
+        screen.getByRole('checkbox', {
+          name: /inactive/i,
+        }),
+      ).toBeInTheDocument();
+    });
+    const versioningToggleItem = screen.getByRole('checkbox', {
+      name: /inactive/i,
+    });
+    //V
+    expect(versioningToggleItem).toHaveAttribute('disabled');
   });
 });