Syncing latest changes from master for odf-console

README.md

@@ -59,6 +59,18 @@ yarn test-cypress-headless
 
 By default, it will look for Chrome in the system and use it, but if you want to use Firefox instead, set BRIDGE_E2E_BROWSER_NAME environment variable in your shell with the value firefox.
 
+### NooBaa Object Browser setup
+
+To run NooBaa Object Browser in development mode, do the following:
+
+```
+oc port-forward $(oc get pods -n openshift-storage | grep noobaa-endpoint | awk '{print $1}') 6001
+
+CONSOLE_VERSION=4.18 BRIDGE_PLUGIN_PROXY='{"services":[{"consoleAPIPath":"/api/proxy/plugin/odf-console/s3/","endpoint":"http://localhost:6001"}]}' BRIDGE_PLUGINS='odf-console=http://localhost:9001' PLUGIN=odf yarn dev:c
+```
+
+To see the NooBaa S3 logs: `oc logs -f deploy/noobaa-endpoint`
+
 ### Debugging with VSCode
 
 To debug with VSCode breakpoints, do the following:

cypress/plugin.js

@@ -71,5 +71,6 @@ module.exports = (on, config) => {
   config.env.BRIDGE_HTPASSWD_USERNAME = process.env.BRIDGE_HTPASSWD_USERNAME;
   config.env.BRIDGE_HTPASSWD_PASSWORD = process.env.BRIDGE_HTPASSWD_PASSWORD;
   config.env.BRIDGE_KUBEADMIN_PASSWORD = process.env.BRIDGE_KUBEADMIN_PASSWORD;
+  config.env.OAUTH_BASE_ADDRESS = `https://${process.env.OAUTH_BASE_ADDRESS}`;
   return config;
 };

cypress/support/login.ts

@@ -22,6 +22,7 @@ Cypress.Commands.add(
       () => {
         // Check if auth is disabled (for a local development environment).
         cy.visit(''); // visits baseUrl which is set in plugins.js
+
         cy.window().then((win: any) => {
           if (win.SERVER_FLAGS?.authDisabled) {
             cy.task(
@@ -31,24 +32,59 @@ Cypress.Commands.add(
             return;
           }
 
-          const idp = provider || KUBEADMIN_IDP;
-          cy.task('log', `  Logging in as ${username || KUBEADMIN_USERNAME}`);
-          cy.byLegacyTestID('login').should('be.visible');
-          // eslint-disable-next-line cypress/require-data-selectors
-          cy.get('body').then(($body) => {
-            if ($body.text().includes(idp)) {
-              cy.contains(idp).should('be.visible').click();
-            }
-          });
-          /* eslint-disable cypress/require-data-selectors */
-          cy.get('#inputUsername').type(username || KUBEADMIN_USERNAME);
-          cy.get('#inputPassword').type(
-            password || Cypress.env('BRIDGE_KUBEADMIN_PASSWORD'),
+          cy.origin(
+            Cypress.env('OAUTH_BASE_ADDRESS'),
             {
-              log: false,
+              args: {
+                provider,
+                username,
+                password,
+                KUBEADMIN_IDP,
+                KUBEADMIN_USERNAME,
+                submitButton,
+              },
+            },
+            ({
+              /* eslint-disable @typescript-eslint/no-shadow, @typescript-eslint/naming-convention */
+              provider,
+              username,
+              password,
+              KUBEADMIN_IDP,
+              KUBEADMIN_USERNAME,
+              submitButton,
+              /* eslint-enable @typescript-eslint/no-shadow, @typescript-eslint/naming-convention */
+            }) => {
+              const idp = provider || KUBEADMIN_IDP;
+
+              cy.task(
+                'log',
+                `  Logging in as ${username || KUBEADMIN_USERNAME}`
+              );
+              cy.get('[data-test-id="login"]', { timeout: 10000 }).should(
+                'be.visible'
+              );
+
+              // eslint-disable-next-line cypress/require-data-selectors
+              cy.get('body').then(($body) => {
+                if ($body.text().includes(idp)) {
+                  cy.contains(idp).should('be.visible').click();
+                }
+              });
+
+              /* eslint-disable cypress/require-data-selectors */
+              cy.get('#inputUsername').type(username || KUBEADMIN_USERNAME);
+              cy.get('#inputPassword').type(
+                password || Cypress.env('BRIDGE_KUBEADMIN_PASSWORD'),
+                {
+                  log: false,
+                }
+              );
+              cy.get(submitButton).click();
             }
           );
-          cy.get(submitButton).click();
+
+          // Back to the console's origin and ensure user is logged in.
+          cy.visit('');
           /* eslint-enable cypress/require-data-selectors */
           masthead.username.shouldBeVisible();
         });

cypress/support/selectors.ts

@@ -13,7 +13,10 @@ declare global {
         options?: Partial<Loggable & Timeoutable & Withinable & Shadow>
       ): Chainable<Element>;
       byTestActionID(selector: string): Chainable<Element>;
-      byLegacyTestID(selector: string): Chainable<Element>;
+      byLegacyTestID(
+        selector: string,
+        options?: Partial<Loggable & Timeoutable & Withinable & Shadow>
+      ): Chainable<Element>;
       byTestDropDownMenu(selector: string): Chainable<Element>;
       byTestOperandLink(selector: string): Chainable<Element>;
       byTestRows(selector: string): Chainable<Element>;
@@ -47,9 +50,15 @@ Cypress.Commands.add(
   }
 );
 
-Cypress.Commands.add('byLegacyTestID', (selector: string) => {
-  cy.get(`[data-test-id="${selector}"]`);
-});
+Cypress.Commands.add(
+  'byLegacyTestID',
+  (
+    selector: string,
+    options?: Partial<Loggable & Timeoutable & Withinable & Shadow>
+  ) => {
+    cy.get(`[data-test-id="${selector}"]`, options);
+  }
+);
 
 Cypress.Commands.add('byTestOperandLink', (selector: string) => {
   cy.get(`[data-test-operand-link="${selector}"]`);

jest/config.js

@@ -16,7 +16,7 @@ const config = {
     '\\.[m]js?$': '@swc/jest',
   },
   transformIgnorePatterns: [
-    '<rootDir>/node_modules/(?!(@openshift-console|@patternfly/react-core/dist|@patternfly/react-icons/dist|@patternfly/react-topology/dist|@patternfly/react-styles|d3|delaunator|internmap|robust-predicates))',
+    '<rootDir>/node_modules/(?!(@openshift-console|@patternfly/react-core/dist|@patternfly/react-icons/dist|@patternfly/react-topology|@patternfly/react-styles|d3|delaunator|internmap|robust-predicates))',
   ],
   testPathIgnorePatterns: ['/node_modules/', '/build/'],
   testRegex: '.*\\.spec\\.tsx?$',

locales/en/plugin__odf-console.json

@@ -1166,11 +1166,16 @@
   "Edit bucket": "Edit bucket",
   "Refresh": "Refresh",
   "Objects": "Objects",
+  "Permissions": "Permissions",
+  "Management": "Management",
+  "Lifecycle rules": "Lifecycle rules",
   "Created via OBC": "Created via OBC",
   "Created via S3": "Created via S3",
   "MCG": "MCG",
   "Object path: ": "Object path: ",
   "Copy to share": "Copy to share",
+  "Bucket policy": "Bucket policy",
+  "CORS": "CORS",
   "Erase the contents of your bucket": "Erase the contents of your bucket",
   "Storage endpoint": "Storage endpoint",
   "Create on": "Create on",

package.json

@@ -82,14 +82,12 @@
     "@openshift-console/dynamic-plugin-sdk-webpack": "1.3.0",
     "@openshift-console/plugin-shared": "^0.0.3",
     "@patternfly/patternfly": "5.4.2",
-    "@patternfly/react-charts": "7.4.5",
-    "@patternfly/react-core": "5.4.2",
-    "@patternfly/react-icons": "5.4.0",
-    "@patternfly/react-table": "5.4.8",
+    "@patternfly/react-charts": "7.4.8",
+    "@patternfly/react-core": "5.4.8",
+    "@patternfly/react-icons": "5.4.2",
+    "@patternfly/react-table": "5.4.14",
     "@patternfly/react-tokens": "5.4.1",
-    "@patternfly/react-topology": "5.4.0",
-    "@types/lodash-es": "^4.17.4",
-    "@types/react-dnd-html5-backend": "^3.0.2",
+    "@patternfly/react-topology": "5.4.1",
     "buffer": "^6.0.3",
     "cache-loader": "^4.1.0",
     "circular-dependency-plugin": "^5.2.2",
@@ -100,8 +98,8 @@
     "fork-ts-checker-webpack-plugin": "^9.0.2",
     "fuzzysearch": "^1.0.3",
     "history": "^4.9.0",
-    "i18next": "^20.2.1",
-    "i18next-conv": "15.1.1",
+    "i18next": "^24.2.1",
+    "i18next-conv": "^15.1.1",
     "immer": "^10.0.3",
     "is-ip": "^5.0.1",
     "js-base64": "^2.1.9",
@@ -137,7 +135,7 @@
     "ts-loader": "^9.5.1",
     "tsx": "^4.19.2",
     "typesafe-actions": "^4.2.1",
-    "typescript": "^5.6.3",
+    "typescript": "^5.7.3",
     "victory-core": "^37.1.1",
     "webpack": "^5.96.1",
     "webpack-bundle-analyzer": "^4.10.2",
@@ -147,40 +145,38 @@
   "devDependencies": {
     "@cypress/webpack-preprocessor": "^6.0.2",
     "@discoveryjs/json-ext": "0.6.1",
-    "@swc/core": "^1.9.2",
+    "@swc/core": "^1.10.11",
     "@swc/jest": "^0.2.37",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^12.1.5",
     "@testing-library/react-hooks": "^8.0.1",
-    "@testing-library/user-event": "^14.5.2",
+    "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^29.5.14",
-    "@types/luxon": "^3.3.1",
-    "@types/node": "^14.14.34",
-    "@types/react": "16.8.13",
-    "@types/react-helmet": "^6.1.1",
-    "@types/react-router": "^5.1.20",
+    "@types/lodash-es": "^4.17.12",
+    "@types/luxon": "^3.4.2",
+    "@types/react-helmet": "^6.1.11",
     "@types/react-window": "^1.8.8",
     "@typescript-eslint/eslint-plugin": "^8.12.2",
     "@typescript-eslint/parser": "^8.17.0",
     "comment-json": "4.x",
-    "cypress": "^13.15.2",
+    "cypress": "^14.0.0",
     "cypress-multi-reporters": "^2.0.4",
     "eslint": "^8.57.1",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-chai-friendly": "^1.0.1",
     "eslint-plugin-cypress": "^4.1.0",
     "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-jest": "^28.9.0",
-    "eslint-plugin-jest-dom": "^5.4.0",
+    "eslint-plugin-jest": "^28.11.0",
+    "eslint-plugin-jest-dom": "^5.5.0",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-mobx": "^0.0.13",
     "eslint-plugin-react": "^7.37.2",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eventsource": "^1.1.1",
     "http-server": "0.12.x",
     "husky": "^7.0.0",
-    "i18next-parser": "9.0.2",
+    "i18next-parser": "9.1.0",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
@@ -196,7 +192,7 @@
     "stylelint-config-sass-guidelines": "^12.1.0",
     "stylelint-config-standard": "^36.0.1",
     "stylelint-order": "^6.0.4",
-    "webpack-dev-server": "^5.1.0"
+    "webpack-dev-server": "^5.2.0"
   },
   "engines": {
     "node": ">=20.x"

packages/ibm/system-connection-details.tsx

@@ -16,8 +16,8 @@ import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
 import { getAPIVersionForModel, isValidIP } from '@odf/shared/utils';
 import { k8sGet } from '@openshift-console/dynamic-plugin-sdk';
 import { Select, SelectOption } from '@patternfly/react-core/deprecated';
-import { TFunction } from 'i18next';
 import * as _ from 'lodash-es';
+import { TFunction } from 'react-i18next';
 import * as Yup from 'yup';
 import {
   FormGroup,

packages/mco/components/discovered-application-wizard/enroll-discovered-application.tsx

@@ -7,7 +7,7 @@ import {
 import PageHeading from '@odf/shared/heading/page-heading';
 import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
 import { Wizard, WizardStep } from '@patternfly/react-core/deprecated';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import { useNavigate } from 'react-router-dom-v5-compat';
 import { Text, TextContent, TextVariants } from '@patternfly/react-core';
 import { EnrollDiscoveredApplicationFooter } from './footer';

packages/mco/components/discovered-application-wizard/footer.tsx

@@ -10,8 +10,8 @@ import {
   WizardContext,
   WizardFooter,
 } from '@patternfly/react-core/deprecated';
-import { TFunction } from 'i18next';
 import * as _ from 'lodash-es';
+import { TFunction } from 'react-i18next';
 import {
   Button,
   ButtonVariant,

packages/mco/components/discovered-application-wizard/wizard-steps/namespace-step/namespace-step.tsx

@@ -18,8 +18,8 @@ import validationRegEx from '@odf/shared/utils/validation';
 import { useYupValidationResolver } from '@odf/shared/yup-validation-resolver';
 import { useK8sWatchResource } from '@openshift-console/dynamic-plugin-sdk';
 import { SelectOption } from '@patternfly/react-core/deprecated';
-import { TFunction } from 'i18next';
 import { useForm } from 'react-hook-form';
+import { TFunction } from 'react-i18next';
 import * as Yup from 'yup';
 import {
   Alert,

packages/mco/components/discovered-application-wizard/wizard-steps/namespace-step/namespace-table.tsx

@@ -26,7 +26,7 @@ import {
   ListPageFilter,
   useListPageFilter,
 } from '@openshift-console/dynamic-plugin-sdk';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import { Bullseye, Grid, GridItem, Text } from '@patternfly/react-core';
 import { Td } from '@patternfly/react-table';
 import {

packages/mco/components/discovered-application-wizard/wizard-steps/replication-step/replication-step.tsx

@@ -22,8 +22,8 @@ import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
 import { getValidatedProp } from '@odf/shared/utils';
 import { RequestSizeInput } from '@odf/shared/utils/RequestSizeInput';
 import { SelectOption } from '@patternfly/react-core/deprecated';
-import { TFunction } from 'i18next';
 import * as _ from 'lodash-es';
+import { TFunction } from 'react-i18next';
 import {
   Form,
   FormGroup,

packages/mco/components/drpolicy-list-page/helper.ts

@@ -1,7 +1,7 @@
 import { CustomKebabItem } from '@odf/shared/kebab';
 import { ModalKeys } from '@odf/shared/modals/types';
 import classNames from 'classnames';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import { sortable, wrappable } from '@patternfly/react-table';
 import { Actions } from '../../constants';
 

packages/mco/components/mco-dashboard/disaster-recovery/cluster-app-card/application.tsx

@@ -22,7 +22,7 @@ import {
   VirtualizedTable,
   useActiveColumns,
 } from '@openshift-console/dynamic-plugin-sdk';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import {
   Pagination,
   PaginationVariant,

packages/mco/components/mco-dashboard/storage-system/system-capacity-card/capacity-card.tsx

@@ -24,8 +24,8 @@ import {
   useK8sWatchResource,
 } from '@openshift-console/dynamic-plugin-sdk';
 import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
-import { TFunction } from 'i18next';
 import * as _ from 'lodash-es';
+import { TFunction } from 'react-i18next';
 import {
   Progress,
   ProgressMeasureLocation,

packages/mco/components/modals/app-failover-relocate/failover-relocate-modal.tsx

@@ -4,7 +4,7 @@ import { ModalBody, ModalFooter } from '@odf/shared/modals/Modal';
 import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
 import { getErrorMessage } from '@odf/shared/utils';
 import { k8sPatch } from '@openshift-console/dynamic-plugin-sdk';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import {
   Modal,
   Button,

packages/mco/components/modals/app-failover-relocate/helper/error-messages.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { docLinks } from '@odf/mco/constants/doc';
 import { ViewDocumentation } from '@odf/shared/utils';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import { Trans } from 'react-i18next';
 import { AlertVariant } from '@patternfly/react-core';
 

packages/mco/components/modals/app-failover-relocate/parser/discovered-application-parser.tsx

@@ -23,7 +23,7 @@ import { CommonModalProps } from '@odf/shared/modals';
 import { getName, getNamespace } from '@odf/shared/selectors';
 import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
 import { useK8sWatchResource } from '@openshift-console/dynamic-plugin-sdk';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import { AlertProps, AlertVariant } from '@patternfly/react-core';
 import { FailoverRelocateModal } from '../failover-relocate-modal';
 import { PlacementControlProps } from '../failover-relocate-modal-body';

packages/mco/components/modals/app-failover-relocate/subscriptions/error-messages.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ViewDocumentation } from '@odf/shared/utils';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import { Trans } from 'react-i18next';
 import { AlertVariant } from '@patternfly/react-core';
 import { docLinks } from '../../../../constants/doc';

packages/mco/components/modals/app-failover-relocate/subscriptions/failover-relocate-modal.tsx

@@ -6,7 +6,7 @@ import { K8sResourceKind } from '@odf/shared/types';
 import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
 import { getErrorMessage } from '@odf/shared/utils';
 import { k8sPatch } from '@openshift-console/dynamic-plugin-sdk';
-import { TFunction } from 'i18next';
+import { TFunction } from 'react-i18next';
 import {
   Modal,
   Button,