Merge pull request #1697 from red-hat-storage/sync_ds--master

Syncing latest changes from master for odf-console

.eslintrc.js

@@ -65,7 +65,6 @@ module.exports = {
     'nonblock-statement-body-position': 'off',
     'react/jsx-curly-newline': 'off',
     'react/jsx-indent': 'off',
-    'react/jsx-no-constructed-context-values': 'off',
     'react/jsx-no-useless-fragment': ['error', { allowExpressions: true }],
     'react/no-unused-prop-types': 'off',
     'consistent-return': 'off',

cypress/tests/persistent-dashboard-check.spec.ts

@@ -70,12 +70,16 @@ describe('Check Persistent Dashboard', () => {
     );
     let initialPVC: number;
     let initialPV: number;
+    cy.byTestID('inventory-pvc')
+      .find('.skeleton-inventory')
+      .should('not.exist');
     cy.byTestID('inventory-pvc')
       .invoke('text')
       .then((pvcText) => {
         initialPVC = Number(extractNumbersFromText(pvcText));
         cy.log(`Initial number of PVCs: ${initialPVC}`);
       });
+    cy.byTestID('inventory-pv').find('.skeleton-inventory').should('not.exist');
     cy.byTestID('inventory-pv')
       .invoke('text')
       .then((pvText) => {

locales/en/plugin__odf-console.json

@@ -476,6 +476,7 @@
   "Image States": "Image States",
   "Mirroring": "Mirroring",
   "Mirroring status": "Mirroring status",
+  "Mirroring health": "Mirroring health",
   "Overall image health": "Overall image health",
   "Show image states": "Show image states",
   "Last checked": "Last checked",
@@ -486,6 +487,7 @@
   "Stopped": "Stopped",
   "Error": "Error",
   "Syncing": "Syncing",
+  "Ok": "Ok",
   "Performance": "Performance",
   "IOPS": "IOPS",
   "Throughput": "Throughput",
@@ -617,6 +619,8 @@
   "Used Capacity": "Used Capacity",
   "Recovery": "Recovery",
   "Performance metrics over time showing IOPS, Latency and more. Each metric is a link to a detailed view of this metric.": "Performance metrics over time showing IOPS, Latency and more. Each metric is a link to a detailed view of this metric.",
+  "{{value}} IOPS": "{{value}} IOPS",
+  "{{unit}} IOPS": "{{unit}} IOPS",
   "Block and File service is unhealthy": "Block and File service is unhealthy",
   "Object service is unhealthy": "Object service is unhealthy",
   "Create Storage Pool": "Create Storage Pool",
@@ -675,7 +679,6 @@
   "Create storage pool": "Create storage pool",
   "Pool creation is not supported for Data Foundation's external RHCS StorageSystem.": "Pool creation is not supported for Data Foundation's external RHCS StorageSystem.",
   "StorageClasses": "StorageClasses",
-  "Last synced": "Last synced",
   "Default pool cannot be deleted.": "Default pool cannot be deleted.",
   "Edit Pool": "Edit Pool",
   "Delete Pool": "Delete Pool",
@@ -1159,8 +1162,8 @@
   "Edit labels": "Edit labels",
   "Edit annotations": "Edit annotations",
   "Edit bucket": "Edit bucket",
-  "Objects": "Objects",
   "Refresh": "Refresh",
+  "Objects": "Objects",
   "Created via OBC": "Created via OBC",
   "Created via S3": "Created via S3",
   "MCG": "MCG",
@@ -1186,7 +1189,7 @@
   "Ideal for Kubernetes environments providing a more abstracted approach to managing storage resources and leveraging dynamic provisioning.": "Ideal for Kubernetes environments providing a more abstracted approach to managing storage resources and leveraging dynamic provisioning.",
   "Create via S3 API": "Create via S3 API",
   "Ideal for applications and systems that need to interact directly with S3-compatible storage.": "Ideal for applications and systems that need to interact directly with S3-compatible storage.",
-  "OBC references a StorageClass that uses a provisioner to interact with the S3 API and create the bucket. Kubernetes binds the OBC to the bucket, making it accessible to applications.": "OBC references a StorageClass that uses a provisioner to interact with the S3 API and create the bucket. Kubernetes binds the OBC to the bucket, making it accessible to applications.",
+  "OBC references a StorageClass with a provisioner that interacts with the S3 API to create the bucket. Kubernetes then binds the OBC, making the bucket accessible to applications.": "OBC references a StorageClass with a provisioner that interacts with the S3 API to create the bucket. Kubernetes then binds the OBC, making the bucket accessible to applications.",
   "Bucket Name": "Bucket Name",
   "my-bucket": "my-bucket",
   "A unique name for your bucket.": "A unique name for your bucket.",
@@ -1210,11 +1213,13 @@
   "Successfully deleted {{ successCount }} object from the bucket.": "Successfully deleted {{ successCount }} object from the bucket.",
   "Successfully deleted {{ successCount }} objects from the bucket.": "Successfully deleted {{ successCount }} objects from the bucket.",
   "Objects are the fundamental entities stored in buckets.": "Objects are the fundamental entities stored in buckets.",
+  "Downloading": "Downloading",
   "Download": "Download",
+  "Previewing": "Previewing",
   "Preview": "Preview",
   "Share with presigned URL": "Share with presigned URL",
   "No objects found": "No objects found",
-  "You do not have any objects in the bucket": "You do not have any objects in the bucket",
+  "You do not have any objects in this bucket": "You do not have any objects in this bucket",
   "many": "many",
   "{{ fromCount }} - {{ toCount }} of {{ totalCount }}": "{{ fromCount }} - {{ toCount }} of {{ totalCount }}",
   "Add objects": "Add objects",
@@ -1410,7 +1415,7 @@
   "All characters are allowed except for the forward slash (\"/\").": "All characters are allowed except for the forward slash (\"/\").",
   "A unique folder name is required. All characters are allowed except for the forward slash (\"/\").": "A unique folder name is required. All characters are allowed except for the forward slash (\"/\").",
   "Organize objects within a bucket by creating virtual folders for easier management and navigation of objects.": "Organize objects within a bucket by creating virtual folders for easier management and navigation of objects.",
-  "Folders structure and group objects logically by using prefixes in object keys, without enforcing any physical hierarchy.": "Folders structure and group objects logically by using prefixes in object keys, without enforcing any physical hierarchy.",
+  "Folders help structure and group objects logically by using prefixes in object keys, without enforcing any physical hierarchy.": "Folders help structure and group objects logically by using prefixes in object keys, without enforcing any physical hierarchy.",
   "Folder name": "Folder name",
   "Delete bucket permanently?": "Delete bucket permanently?",
   "The bucket is being deleted. This may take a while.": "The bucket is being deleted. This may take a while.",
@@ -1429,10 +1434,10 @@
   "Bucket emptying was not completed. Check for conflicts or permissions issues that are blocking this operation.": "Bucket emptying was not completed. Check for conflicts or permissions issues that are blocking this operation.",
   "Successfully emptied bucket ": "Successfully emptied bucket ",
   "Your bucket is now empty. If you want to delete this bucket, click Delete bucket": "Your bucket is now empty. If you want to delete this bucket, click Delete bucket",
-  "<0>To confirm deletion, type <1>{{delete}}</1> in the text input field.</0>": "<0>To confirm deletion, type <1>{{delete}}</1> in the text input field.</0>",
+  "<0>To confirm deletion, type <1>{{delete}}</1>:</0>": "<0>To confirm deletion, type <1>{{delete}}</1>:</0>",
   "Object name": "Object name",
   "Delete object?": "Delete object?",
-  "Deleted objects will no longer be visible in the bucket. If versioning is enabled a delete marker is created, you can recover object from previous versions. For unversioned objects, deletion is final and cannot be undone.": "Deleted objects will no longer be visible in the bucket. If versioning is enabled a delete marker is created, you can recover object from previous versions. For unversioned objects, deletion is final and cannot be undone.",
+  "Deleted objects will no longer be visible in the bucket. If versioning is enabled, a delete marker is created, allowing recovery from previous versions. For unversioned buckets, deletion is permanent and cannot be undone.": "Deleted objects will no longer be visible in the bucket. If versioning is enabled, a delete marker is created, allowing recovery from previous versions. For unversioned buckets, deletion is permanent and cannot be undone.",
   "Delete object": "Delete object",
   "Delete status": "Delete status",
   "Failed": "Failed",
@@ -1452,6 +1457,12 @@
   "Create presigned URL": "Create presigned URL",
   "Object: ": "Object: ",
   "A third-party entity can access the object using this presigned URL, which allows sharing without requiring a login, until the URL expires.": "A third-party entity can access the object using this presigned URL, which allows sharing without requiring a login, until the URL expires.",
+  "Full deployment": "Full deployment",
+  "MultiCloud Object Gateway": "MultiCloud Object Gateway",
+  "Provider Mode": "Provider Mode",
+  "Lean mode": "Lean mode",
+  "Balanced mode": "Balanced mode",
+  "Performance mode": "Performance mode",
   "hr": "hr",
   "min": "min",
   "Select at least 2 Backing Store resources": "Select at least 2 Backing Store resources",

locales/ko/plugin__odf-console.json

@@ -1414,4 +1414,4 @@
   "Cannot change resource namespace (original: \"{{namespace}}\", updated: \"{{newNamespace}}\").": "리소스 네임 스페이스(원본: \"{{namespace}}\", 업데이트: \"{{newNamespace}}\")를 변경할 수 없습니다.",
   "Cannot change resource kind (original: \"{{original}}\", updated: \"{{updated}}\").": "리소스 종류 (원본: \"{{original}}\", 업데이트: \"{{updated}}\")를 변경할 수 없습니다.",
   "Cannot change API group (original: \"{{apiGroup}}\", updated: \"{{newAPIGroup}}\").": "API 그룹(원본: \"{{apiGroup}}\", 업데이트:\"{{newAPIGroup}}\")을 변경할 수 없습니다."
-}
+}

locales/zh/plugin__odf-console.json

@@ -1414,4 +1414,4 @@
   "Cannot change resource namespace (original: \"{{namespace}}\", updated: \"{{newNamespace}}\").": "无法更改资源命名空间（原始：“{{namespace}} “， 更新： ”{{newNamespace}} ”）。",
   "Cannot change resource kind (original: \"{{original}}\", updated: \"{{updated}}\").": "无法更改资源种类（原始：“{{original}} “， 更新： ”{{updated}} ”）。",
   "Cannot change API group (original: \"{{apiGroup}}\", updated: \"{{newAPIGroup}}\").": "无法更改 API 组（原始：“{{apiGroup}} “， 更新： ”{{newAPIGroup}} ”）。"
-}
+}

openshift-ci/odf-catalog-source.yaml

@@ -28,7 +28,7 @@ spec:
   icon:
     base64data: ''
     mediatype: ''
-  image: quay.io/rhceph-dev/ocs-registry:latest-4.16
+  image: quay.io/rhceph-dev/ocs-registry:latest-4.17
   priority: 100
   publisher: Red Hat
   sourceType: grpc
@@ -42,7 +42,7 @@ metadata:
   name: odf-operator
   namespace: openshift-storage
 spec:
-  channel: stable-4.16
+  channel: stable-4.17
   installPlanApproval: Automatic
   name: odf-operator
   source: redhat-operators
@@ -62,7 +62,7 @@ spec:
       type: RuntimeDefault
   containers:
     - name: rhceph-dev-icsp
-      image: quay.io/rhceph-dev/ocs-registry:latest-4.16
+      image: quay.io/rhceph-dev/ocs-registry:latest-4.17
       securityContext:
         allowPrivilegeEscalation: false
         capabilities:

package.json

@@ -21,24 +21,24 @@
     "test-coverage": "jest --config=jest/config.js --silent --coverage --coverageReporters text-summary",
     "test-cypress": "node_modules/.bin/cypress open --e2e --config-file ./cypress/cypress.config.ts --env openshift=true",
     "test-cypress-headless": "node --max-old-space-size=4096 node_modules/.bin/cypress run --e2e --config-file ./cypress/cypress.config.ts --env openshift=true --browser ${BRIDGE_E2E_BROWSER_NAME:=chrome} --headless",
-    "build:generate": "yarn clean-${PLUGIN} && tsm ./scripts/versionCheck.mts --plugin ${PLUGIN} && tsm ./scripts/generatePluginPackage.mts --plugin ${PLUGIN}",
-    "build:plugin": "yarn build:generate && NODE_OPTIONS='--max-old-space-size=4096' yarn ts-node node_modules/.bin/webpack -c ./webpack.config.ts",
+    "build:generate": "yarn clean-${PLUGIN} && tsx ./scripts/versionCheck.mts --plugin ${PLUGIN} && tsx ./scripts/generatePluginPackage.mts --plugin ${PLUGIN}",
+    "build:plugin": "yarn build:generate && NODE_OPTIONS='--max-old-space-size=4096' yarn tsx node_modules/.bin/webpack -c ./webpack.config.ts",
     "build": "NODE_ENV=production PLUGIN=odf I8N_NS=plugin__odf-console yarn build:plugin",
     "build-mco": "NODE_ENV=production PLUGIN=mco I8N_NS=plugin__odf-multicluster-console yarn build:plugin",
     "build-client": "NODE_ENV=production PLUGIN=client I8N_NS=plugin__odf-client-console yarn build:plugin",
     "build-dev": "NODE_ENV=development PLUGIN=odf I8N_NS=plugin__odf-console yarn build:plugin",
-    "server:plugin": "yarn build:generate && I8N_NS=${I8N_NS} yarn ts-node ./node_modules/.bin/webpack serve -c ./webpack.config.ts --progress",
-    "analyze-common": "yarn build:generate && NODE_ENV=production I8N_NS=${I8N_NS} ANALYZE_BUNDLE=true yarn ts-node ./node_modules/.bin/webpack -c ./webpack.config.ts",
-    "analyze-odf": "PLUGIN=odf yarn analyze-common && PLUGIN=odf yarn ts-node ./analyzeTest.ts",
-    "analyze-mco": "PLUGIN=mco yarn analyze-common && PLUGIN=mco yarn ts-node ./analyzeTest.ts",
-    "analyze-client": "PLUGIN=client yarn analyze-common && PLUGIN=client yarn ts-node ./analyzeTest.ts",
+    "server:plugin": "yarn build:generate && I8N_NS=${I8N_NS} yarn tsx ./node_modules/.bin/webpack serve -c ./webpack.config.ts --progress",
+    "analyze-common": "yarn build:generate && NODE_ENV=production I8N_NS=${I8N_NS} ANALYZE_BUNDLE=true yarn tsx ./node_modules/.bin/webpack -c ./webpack.config.ts",
+    "analyze-odf": "PLUGIN=odf yarn analyze-common && PLUGIN=odf yarn tsx ./analyzeTest.ts",
+    "analyze-mco": "PLUGIN=mco yarn analyze-common && PLUGIN=mco yarn tsx ./analyzeTest.ts",
+    "analyze-client": "PLUGIN=client yarn analyze-common && PLUGIN=client yarn tsx ./analyzeTest.ts",
     "dev": "PLUGIN=odf I8N_NS=plugin__odf-console yarn server:plugin",
     "dev:no-type-check": "DEV_NO_TYPE_CHECK=true yarn dev",
     "dev-mco": "PLUGIN=mco I8N_NS=plugin__odf-multicluster-console yarn server:plugin",
     "dev-client": "PLUGIN=client I8N_NS=plugin__odf-client-console yarn server:plugin",
     "serve-local-build": "./http-server.sh ./plugins/odf/dist",
+    "serve-local-build:c": "yarn ocp-console & yarn serve-local-build & wait",
     "serve-local-build-mco": "./http-server.sh ./plugins/mco/dist",
-    "ts-node": "ts-node --transpile-only -O '{\"module\":\"commonjs\"}' -I '/node_modules/(?!(@odf)/)/'",
     "lint-css": "yarn stylelint packages/**/**/*.scss",
     "lint-css-fix": "yarn stylelint packages/**/**/*.scss --fix",
     "lint-ts": "yarn eslint --ext .ts,.tsx .",
@@ -62,10 +62,10 @@
     "@aws-sdk/client-s3": "3.667.0",
     "@aws-sdk/lib-storage": "3.501.0",
     "@aws-sdk/s3-request-presigner": "3.614.0",
-    "@openshift-console/dynamic-plugin-sdk": "1.3.0",
+    "@openshift-console/dynamic-plugin-sdk": "1.8.0",
     "@openshift-console/dynamic-plugin-sdk-internal": "1.0.0",
-    "@openshift-console/dynamic-plugin-sdk-webpack": "1.1.1",
-    "@openshift-console/plugin-shared": "^0.0.1",
+    "@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",
@@ -76,13 +76,13 @@
     "@types/lodash-es": "^4.17.4",
     "@types/react-dnd-html5-backend": "^3.0.2",
     "buffer": "^6.0.3",
-    "cache-loader": "1.x",
-    "circular-dependency-plugin": "5.x",
+    "cache-loader": "^4.1.0",
+    "circular-dependency-plugin": "^5.2.2",
     "classnames": "^2.3.1",
-    "copy-webpack-plugin": "^7.0.0",
-    "css-loader": "0.28.x",
-    "file-loader": "1.x",
-    "fork-ts-checker-webpack-plugin": "^7.2.13",
+    "copy-webpack-plugin": "^12.0.2",
+    "css-loader": "^7.1.2",
+    "file-loader": "^6.2.0",
+    "fork-ts-checker-webpack-plugin": "^9.0.2",
     "fuzzysearch": "^1.0.3",
     "history": "^4.9.0",
     "i18next": "^20.2.1",
@@ -111,19 +111,18 @@
     "react-window": "^1.8.10",
     "redux": "4.0.1",
     "resolve-url-loader": "^5.0.0",
-    "sass": "^1.55.0",
-    "sass-loader": "^13.0.2",
+    "sass": "^1.81.0",
+    "sass-loader": "^16.0.3",
     "semver": "6.x",
-    "style-loader": "^0.23.1",
+    "style-loader": "^3.3.4",
     "swr": "2.2.5",
-    "thread-loader": "3.0.4",
-    "ts-loader": "^9.4.1",
-    "ts-node": "^10.9.2",
-    "tsm": "^2.3.0",
+    "thread-loader": "^4.0.4",
+    "ts-loader": "^9.5.1",
+    "tsx": "^4.19.2",
     "typesafe-actions": "^4.2.1",
     "typescript": "^5.6.3",
     "victory-core": "^35.4.4",
-    "webpack": "5.94.0",
+    "webpack": "^5.96.1",
     "webpack-bundle-analyzer": "^4.10.2",
     "webpack-cli": "^5.1.4",
     "yup": "^0.32.11"
@@ -182,7 +181,7 @@
     "webpack-dev-server": "^5.1.0"
   },
   "resolutions": {
-    "webpack": "5.94.0",
+    "webpack": "^5.96.1",
     "webpack-bundle-analyzer/ws": "^7.5.10",
     "webpack-dev-server/express": "^4.21.0",
     "tough-cookie": "^4.1.3"

packages/mco/components/drpolicy-list-page/drpolicy-list-page.scss

@@ -1,4 +1,4 @@
-@import '~@patternfly/patternfly/sass-utilities/all';
+@import '@patternfly/patternfly/sass-utilities/all';
 
 .mco-drpolicy-list {
   @media (min-width: $pf-v5-global--breakpoint--md) {

packages/mco/components/mco-dashboard/disaster-recovery/alert-card/alert-item.scss

@@ -1,4 +1,4 @@
-@import '~@patternfly/patternfly/sass-utilities/colors';
+@import '@patternfly/patternfly/sass-utilities/colors';
 
 $mco-icon-and-text-icon-lg: 1.2rem;
 

packages/mco/components/mco-dashboard/disaster-recovery/dr-dashboard.tsx

@@ -116,16 +116,22 @@ const MonitoringDashboard: React.FC = () => {
     return {};
   }, [applicationSets, subscriptions, discovered, loaded, loadError]);
 
-  const dRResourcesContext = {
-    drClusterAppsMap: aggregatedAppsMap,
-    loaded,
-    loadError,
-  };
+  const dRResourcesContext = React.useMemo(() => {
+    return {
+      drClusterAppsMap: aggregatedAppsMap,
+      loaded,
+      loadError,
+    };
+  }, [aggregatedAppsMap, loaded, loadError]);
+
+  const csvContextData = React.useMemo(() => {
+    return { csvData, csvError, csvLoading };
+  }, [csvData, csvError, csvLoading]);
 
   // ToDo(Sanjal): combime multiple Context together to make it scalable
   // refer: https://javascript.plainenglish.io/how-to-combine-context-providers-for-cleaner-react-code-9ed24f20225e
   return (
-    <CSVStatusesContext.Provider value={{ csvData, csvError, csvLoading }}>
+    <CSVStatusesContext.Provider value={csvContextData}>
       <DRResourcesContext.Provider value={dRResourcesContext}>
         <UpperSection />
       </DRResourcesContext.Provider>

packages/ocs/constants/common.ts

@@ -65,3 +65,4 @@ export const OCS_STORAGECLASS_PARAMS = [
 ];
 
 export const CEPH_NS_SESSION_STORAGE = 'odfConsole_scForm_cephNs';
+export const BLOCK_POOL_NAME_LABEL = 'ocs.openshift.io/cephblockpool-name';

packages/ocs/dashboards/block-pool/block-pool-dashboard.tsx

@@ -23,8 +23,11 @@ const mainCards = [
 const rightCards = [{ Card: MirroringCard }];
 
 export const BlockPoolDashboard: React.FC<PoolDashboardProps> = ({ obj }) => {
+  const contextData = React.useMemo(() => {
+    return { obj };
+  }, [obj]);
   return (
-    <BlockPoolDashboardContext.Provider value={{ obj }}>
+    <BlockPoolDashboardContext.Provider value={contextData}>
       <Overview>
         <OverviewGrid
           mainCards={mainCards}