From bb48cdabd98f05bd8bcd0e330ef27025a50b5274 Mon Sep 17 00:00:00 2001 From: Austin Sullivan Date: Wed, 4 Dec 2024 17:05:02 -0500 Subject: [PATCH 1/6] feat(deps)!: upgrade PatternFly to v6 --- package-lock.json | 356 ++-- package.json | 8 +- .../ReportDetails/ReportDetails.spec.cy.tsx | 14 +- packages/advisor-components/package.json | 6 +- .../src/RebootRequired/RebootRequired.scss | 8 +- .../src/RebootRequired/RebootRequired.tsx | 11 +- .../src/ReportDetails/ReportDetails.scss | 22 +- .../src/ReportDetails/ReportDetails.tsx | 13 +- .../src/RuleDescription/RuleDescription.scss | 2 +- .../src/RuleDetails/RuleDetails.scss | 6 +- .../src/RuleDetails/RuleDetails.tsx | 24 +- .../src/RuleRating/RuleRating.scss | 6 +- .../src/RuleRating/RuleRating.tsx | 28 +- .../TemplateProcessor/TemplateProcessor.tsx | 2 +- packages/components/.eslintrc | 2 +- .../Breadcrumbs/Breadcrumbs.spec.cy.js | 4 +- .../BulkSelect/BulkSelect.spec.cy.js | 16 +- .../CheckboxFilter.spec.cy.tsx | 16 +- .../ConditionalFilter.spec.cy.js | 22 +- .../ConditionalFilter/GroupFilter.spec.cy.js | 12 +- .../ConditionalFilter/RadioFilter.spec.cy.js | 20 +- .../DownloadButton/DownloadButton.spec.cy.js | 6 +- .../PrimaryToolbar/Actions.spec.cy.tsx | 14 +- .../PrimaryToolbar/PrimaryToolbar.spec.cy.tsx | 12 +- .../PrimaryToolbar/SortBy.spec.cy.tsx | 6 +- packages/components/doc/treeview-table.md | 2 +- packages/components/package.json | 13 +- packages/components/src/Battery/Battery.tsx | 4 +- .../src/Battery/CriticalBattery.tsx | 4 +- .../components/src/Battery/HighBattery.tsx | 4 +- .../components/src/Battery/LowBattery.tsx | 4 +- .../components/src/Battery/MediumBattery.tsx | 4 +- .../components/src/Battery/NullBattery.tsx | 4 +- packages/components/src/Battery/index.ts | 2 +- .../__snapshots__/Breadcrumbs.test.js.snap | 42 +- .../components/src/BulkSelect/BulkSelect.tsx | 3 +- .../__snapshots__/BulkSelect.test.js.snap | 80 +- .../src/BulkSelect/bulk-select.scss | 4 +- .../src/ConditionalFilter/CheckboxFilter.tsx | 3 +- .../ConditionalFilter.test.js | 2 +- .../ConditionalFilter/ConditionalFilter.tsx | 4 +- .../src/ConditionalFilter/GroupFilter.tsx | 37 +- .../src/ConditionalFilter/RadioFilter.tsx | 1 + .../__snapshots__/CheckboxFilter.test.js.snap | 88 +- .../ConditionalFilter.test.js.snap | 370 ++-- .../__snapshots__/GroupFilter.test.js.snap | 142 +- .../__snapshots__/RadioFilter.test.js.snap | 77 +- .../__snapshots__/TextFilter.test.js.snap | 56 +- .../ConditionalFilter/conditional-filter.scss | 32 +- .../src/ConditionalFilter/group-filter.scss | 18 +- .../ConditionalFilter/groupFilterConstants.ts | 4 +- .../src/CullingInfo/CullingInformation.scss | 8 +- .../CullingInformation.test.js.snap | 8 +- .../src/DownloadButton/DownloadButton.test.js | 2 +- .../src/DownloadButton/DownloadButton.tsx | 12 +- .../__snapshots__/DownloadButton.test.js.snap | 176 +- .../components/src/EmptyTable/EmptyTable.scss | 4 +- .../components/src/ErrorState/ErrorState.tsx | 2 +- .../src/FilterChips/FilterChips.test.js | 8 +- .../src/FilterChips/FilterChips.tsx | 4 +- .../__snapshots__/FilterChips.test.js.snap | 877 ++++---- .../src/FilterChips/filter-chips.scss | 8 +- .../__snapshots__/constants.test.js.snap | 4 +- .../src/FilterHooks/tagFilterHook.scss | 6 +- .../components/src/Filters/FilterDropdown.tsx | 1 + .../__snapshots__/FilterDropdown.test.js.snap | 25 +- .../__snapshots__/FilterInput.test.js.snap | 16 +- .../src/Filters/filter-dropdown.scss | 2 +- .../src/InsightsLabel/InsightsLabel.tsx | 4 +- .../__snapshots__/InsightsLabel.test.js.snap | 26 +- .../src/InvalidObject/InvalidObject.tsx | 6 +- .../components/src/InvalidObject/index.ts | 2 +- packages/components/src/Inventory/AppInfo.js | 2 +- .../components/src/Inventory/DetailWrapper.js | 2 +- .../src/Inventory/InventoryDetail.js | 2 +- .../src/Inventory/InventoryDetailHead.js | 2 +- .../src/Inventory/InventoryTable.js | 2 +- .../src/Inventory/TagWithDialog.tsx | 2 +- packages/components/src/Main/Main.tsx | 2 +- packages/components/src/Main/main.scss | 4 +- .../src/Maintenance/Maintenance.tsx | 6 +- .../__snapshots__/Maintenance.test.js.snap | 64 +- .../src/Maintenance/maintenance.scss | 8 +- .../NoRegisteredSystems.tsx | 8 +- .../NoRegisteredSystems.test.js.snap | 28 +- .../src/NotAuthorized/NotAuthorized.tsx | 8 +- .../components/src/NotAuthorized/index.ts | 2 +- .../src/NotConnected/NotConnected.tsx | 8 +- .../__snapshots__/NotConnected.test.js.snap | 28 +- .../src/OpenSourceBadge/OpenSourceBadge.tsx | 16 +- .../OpenSourceBadge.test.js.snap | 32 +- .../components/src/PageHeader/PageHeader.tsx | 8 +- .../src/PageHeader/PageHeaderTitle.tsx | 2 +- .../__snapshots__/PageHeader.test.js.snap | 2 +- .../PageHeaderTitle.test.js.snap | 6 +- .../src/PageHeader/page-header.scss | 8 +- .../components/src/PrimaryToolbar/Actions.tsx | 6 +- .../src/PrimaryToolbar/PrimaryToolbar.test.js | 8 +- .../src/PrimaryToolbar/PrimaryToolbar.tsx | 5 +- .../components/src/PrimaryToolbar/SortBy.tsx | 8 +- .../__snapshots__/Actions.test.js.snap | 338 ++-- .../__snapshots__/PrimaryToolbar.test.js.snap | 1442 +++++++------- .../__snapshots__/SortBy.test.js.snap | 72 +- .../src/PrimaryToolbar/primary-toolbar.scss | 4 +- .../Reboot/__snapshots__/Reboot.test.js.snap | 4 +- packages/components/src/Reboot/reboot.scss | 2 +- packages/components/src/Section/section.scss | 2 +- .../src/SeverityLine/severity-line.scss | 14 +- .../Shield/__snapshots__/Shield.test.js.snap | 72 +- .../SimpleTableFilter/SimpleTableFilter.tsx | 3 +- .../SimpleTableFilter.test.tsx.snap | 40 +- .../__snapshots__/Skeleton.test.js.snap | 24 +- .../components/src/Skeleton/skeleton.scss | 36 +- packages/components/src/Spinner/Spinner.tsx | 2 +- .../__snapshots__/Spinner.test.js.snap | 4 +- packages/components/src/Spinner/spinner.scss | 4 +- .../components/src/TabLayout/tab-layout.scss | 8 +- .../src/TableToolbar/TableToolbar.scss | 10 +- .../__snapshots__/TableToolbar.test.js.snap | 48 +- .../src/TagModal/TableWithFilter.tsx | 5 +- .../TableWithFilter.test.js.snap | 1766 +++++++++-------- .../components/src/TagModal/tagModal.scss | 2 +- .../__snapshots__/decorator.test.js.snap | 80 +- .../__snapshots__/rowWrapper.test.js.snap | 12 +- .../src/TreeTable/decorator.test.js | 6 +- .../components/src/TreeTable/decorator.tsx | 16 +- packages/components/src/TreeTable/styles.scss | 98 +- packages/components/src/Truncate/Truncate.tsx | 2 +- .../__snapshots__/Truncate.test.js.snap | 218 +- .../src/useScreenSize/breakpoints.ts | 28 +- packages/components/tsconfig.json | 3 +- .../create-crc-app/templates/package.json | 6 +- packages/notifications/package.json | 4 +- .../src/Notification/Notification.tsx | 22 +- .../__snapshots__/Notification.test.tsx.snap | 92 +- .../NotificationPagination.test.js | 4 +- .../NotificationPagination.test.js.snap | 262 +-- .../NotificationPortal.test.js.snap | 231 ++- packages/remediations/package.json | 10 +- .../src/RemediationButton/index.js | 2 +- .../src/RemediationWizard/index.js | 2 +- packages/rule-components/package.json | 6 +- .../rule-components/src/Markdown/Markdown.js | 6 +- .../src/ReportDetails/RiskDescription.js | 6 +- .../src/ReportDetails/RuleFeedback.js | 33 +- .../src/ReportDetails/index.js | 9 +- .../src/ReportDetails/index.scss | 28 +- .../src/RuleTable/RuleTable.js | 16 +- .../rule-components/src/RuleTable/index.scss | 22 +- packages/utils/doc/Cypress.md | 10 +- packages/utils/package.json | 4 +- .../TestingUtils/CypressUtils/TableUtils.js | 2 +- .../TestingUtils/CypressUtils/selectors.js | 16 +- packages/utils/src/styles/_variables.scss | 38 +- 154 files changed, 4432 insertions(+), 3884 deletions(-) diff --git a/package-lock.json b/package-lock.json index 1af45af4b..dfb578b2c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -44,10 +44,10 @@ "@nx/web": "20.0.6", "@nx/webpack": "^20.0.6", "@openshift/dynamic-plugin-sdk-webpack": "^4.1.0", - "@patternfly/quickstarts": "^5.4.1", - "@patternfly/react-core": "^5.4.8", - "@patternfly/react-icons": "^5.4.2", - "@patternfly/react-table": "^5.4.9", + "@patternfly/quickstarts": "^6.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", + "@patternfly/react-table": "^6.0.0", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15", "@simonsmith/cypress-image-snapshot": "^9.1.0", "@swc-node/register": "^1.10.9", @@ -2689,68 +2689,6 @@ "ms": "^2.1.1" } }, - "node_modules/@data-driven-forms/common": { - "version": "3.23.4", - "resolved": "https://registry.npmjs.org/@data-driven-forms/common/-/common-3.23.4.tgz", - "integrity": "sha512-hWL4TDxmRTaZKEs8kAj3Y2/LHiEpuzXfNiAJdAfHyOMACREapQmxOPeXrTaZCHhi0jDHpWXn/t4H7Rcaftk1sA==", - "license": "Apache-2.0", - "dependencies": { - "clsx": "^1.0.4", - "lodash": "^4.17.15", - "prop-types": "^15.7.2" - }, - "peerDependencies": { - "react": "^16.13.1 || ^17.0.2 || ^18.0.0", - "react-dom": "^16.13.1 || ^17.0.2 || ^18.0.0" - } - }, - "node_modules/@data-driven-forms/common/node_modules/clsx": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz", - "integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==", - "license": "MIT", - "engines": { - "node": ">=6" - } - }, - "node_modules/@data-driven-forms/pf4-component-mapper": { - "version": "3.23.4", - "resolved": "https://registry.npmjs.org/@data-driven-forms/pf4-component-mapper/-/pf4-component-mapper-3.23.4.tgz", - "integrity": "sha512-ao/GlAB8QPOl1amsaSgBhrEoypWwpSHVyfhAqKkF6ZWXEqA6QckSi5hFCuyJnv1PMNCyyDYqySG6ef0+RBEGmA==", - "license": "Apache-2.0", - "dependencies": { - "@data-driven-forms/common": "^3.23.4", - "downshift": "^5.4.3", - "lodash": "^4.17.21", - "prop-types": "^15.7.2" - }, - "peerDependencies": { - "@data-driven-forms/react-form-renderer": "^3.23.4", - "@patternfly/react-core": "^5.0.0", - "@patternfly/react-icons": "^5.0.0", - "react": "^17.0.2 || ^18.0.0", - "react-dom": "^17.0.2 || ^18.0.0" - } - }, - "node_modules/@data-driven-forms/react-form-renderer": { - "version": "3.23.4", - "resolved": "https://registry.npmjs.org/@data-driven-forms/react-form-renderer/-/react-form-renderer-3.23.4.tgz", - "integrity": "sha512-p1muOU/O3sJVzmR7R66lp+Qo/WUGIIF4idUWNsSqQ3UxLKpRmlUjkEHcXb1Fe44Kr5xpziuIdrePF6+Gv/Nfdg==", - "license": "Apache-2.0", - "dependencies": { - "final-form": "^4.20.4", - "final-form-arrays": "^3.0.2", - "final-form-focus": "^1.1.2", - "lodash": "^4.17.15", - "prop-types": "^15.7.2", - "react-final-form": "^6.5.0", - "react-final-form-arrays": "^3.1.1" - }, - "peerDependencies": { - "react": "^16.13.1 || ^17.0.2 || ^18.0.0", - "react-dom": "^16.13.1 || ^17.0.2 || ^18.0.0" - } - }, "node_modules/@dependents/detective-less": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/@dependents/detective-less/-/detective-less-5.0.0.tgz", @@ -8025,27 +7963,26 @@ } }, "node_modules/@patternfly/patternfly": { - "version": "5.4.2", - "resolved": "https://registry.npmjs.org/@patternfly/patternfly/-/patternfly-5.4.2.tgz", - "integrity": "sha512-+BaokNR8/AmTYMESxby9UtQXPGACg449BXQd0KejAvW/uGxlgO6mY1X1205DeBEHoK3e/vXkYXjvZPpv/tcxSA==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/patternfly/-/patternfly-6.0.0.tgz", + "integrity": "sha512-Mn92Tt/4okSj1COGCJrgUgh390OOaFCWf0tL0WmigDNUecSHNn1D6Vhpd1hxHQBXvre9eWorzxV2b9yhSEl79Q==", "dev": true, "license": "MIT" }, "node_modules/@patternfly/quickstarts": { - "version": "5.4.1", - "resolved": "https://registry.npmjs.org/@patternfly/quickstarts/-/quickstarts-5.4.1.tgz", - "integrity": "sha512-KICofjKLFi2IO+RiiY7ec7zevA/VXdzxDLLIUGM4f/CLSQ2Yj14B4GCDhYAMMWKUhT24mQLJkT6XMVbA/r5Eig==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/quickstarts/-/quickstarts-6.0.0.tgz", + "integrity": "sha512-gk0BBvYtLhksaeL36mTkbfmDdzoGtZmrxkm/QIlReIr+4dQBQfivTv6Z1bLxc/iLPkwA8dcBRc9aKIHb1YTIww==", "dev": true, "license": "MIT", "dependencies": { - "@patternfly/react-catalog-view-extension": "^5.0.0", "dompurify": "^3.1.3", "history": "^5.0.0" }, "peerDependencies": { - "@patternfly/react-core": ">=5.0.0", - "react": ">=16.8.0", - "react-dom": ">=16.8.0", + "@patternfly/react-core": "^6.0.0", + "react": ">=18.0.0", + "react-dom": ">=18.0.0", "showdown": ">=2.1.0" } }, @@ -8074,33 +8011,53 @@ "react-dom": "^17 || ^18" } }, - "node_modules/@patternfly/react-component-groups": { - "version": "5.5.5", - "resolved": "https://registry.npmjs.org/@patternfly/react-component-groups/-/react-component-groups-5.5.5.tgz", - "integrity": "sha512-Cgp1XxyBWnEDKAQsP+B7A4wlz6Bcp0bjwSMamdOiCR4GALtpBXXGrv6daAomoVCkL9l3zibcAfm/o9d9XBE9Ag==", + "node_modules/@patternfly/react-catalog-view-extension/node_modules/@patternfly/react-core": { + "version": "5.4.14", + "resolved": "https://registry.npmjs.org/@patternfly/react-core/-/react-core-5.4.14.tgz", + "integrity": "sha512-oXVMzLs9Pa+xmdc39L2u05zbXfY3mWuOFi4GDv44GPdDexZUFy5W69+Nv5P8cwfMim55Nf5kKYpcqmatD2bBXw==", + "dev": true, "license": "MIT", "dependencies": { - "@patternfly/react-core": "^5.4.1", - "@patternfly/react-icons": "^5.4.0", - "@patternfly/react-table": "^5.4.1", - "clsx": "^2.1.1", - "react-jss": "^10.10.0" + "@patternfly/react-icons": "^5.4.2", + "@patternfly/react-styles": "^5.4.1", + "@patternfly/react-tokens": "^5.4.1", + "focus-trap": "7.6.2", + "react-dropzone": "^14.2.3", + "tslib": "^2.7.0" }, "peerDependencies": { "react": "^17 || ^18", "react-dom": "^17 || ^18" } }, + "node_modules/@patternfly/react-catalog-view-extension/node_modules/@patternfly/react-icons": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@patternfly/react-icons/-/react-icons-5.4.2.tgz", + "integrity": "sha512-CMQ5oHYzW6TPVTs2jpNJmP2vGCAKR/YeTPwHGO9dLkAUej1IcIxtCCWK2Fdo2UJsnBjuZihasyw2b6ehvbUm9Q==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "react": "^17 || ^18", + "react-dom": "^17 || ^18" + } + }, + "node_modules/@patternfly/react-catalog-view-extension/node_modules/@patternfly/react-tokens": { + "version": "5.4.1", + "resolved": "https://registry.npmjs.org/@patternfly/react-tokens/-/react-tokens-5.4.1.tgz", + "integrity": "sha512-eygdHE7Krta1mijAv/E8RHiKIgysD0eeNTo8EXUYC8/M4e5K6sqpr2p6rQBF8QiRMN8FnbXvZT3K2OQ28pYt9Q==", + "dev": true, + "license": "MIT" + }, "node_modules/@patternfly/react-core": { - "version": "5.4.11", - "resolved": "https://registry.npmjs.org/@patternfly/react-core/-/react-core-5.4.11.tgz", - "integrity": "sha512-+WgxVnnqiZiASB+zMBA8Z1YuaX32/ehJ8Y4UB+j2xIB/tjvBqKNVn7n4VPy56F+G9nJ92Kv8Tekccau6bL6jFg==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/react-core/-/react-core-6.0.0.tgz", + "integrity": "sha512-UKFj9+YzBY+FfEDsLONgOM4N0e8SPV/27/UzNRiJ0gpgqbw2POuXwLpjGSRTTIUuCaLaGGM5PeTSj7mMB73ykw==", "license": "MIT", "dependencies": { - "@patternfly/react-icons": "^5.4.2", - "@patternfly/react-styles": "^5.4.1", - "@patternfly/react-tokens": "^5.4.1", - "focus-trap": "7.6.2", + "@patternfly/react-icons": "^6.0.0", + "@patternfly/react-styles": "^6.0.0", + "@patternfly/react-tokens": "^6.0.0", + "focus-trap": "7.6.0", "react-dropzone": "^14.2.3", "tslib": "^2.7.0" }, @@ -8109,10 +8066,25 @@ "react-dom": "^17 || ^18" } }, + "node_modules/@patternfly/react-core/node_modules/@patternfly/react-styles": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/react-styles/-/react-styles-6.0.0.tgz", + "integrity": "sha512-fJFMB89sTRGlZTzTLmpRmthgOXqcN078scHMFJ3ttfi2D2btnem5oZrxmQ/gPZkZOxR+9MqwKDB6l3F5x1SqLQ==", + "license": "MIT" + }, + "node_modules/@patternfly/react-core/node_modules/focus-trap": { + "version": "7.6.0", + "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.6.0.tgz", + "integrity": "sha512-1td0l3pMkWJLFipobUcGaf+5DTY4PLDDrcqoSaKP8ediO/CoWCCYk/fT/Y2A4e6TNB+Sh6clRJCjOPPnKoNHnQ==", + "license": "MIT", + "dependencies": { + "tabbable": "^6.2.0" + } + }, "node_modules/@patternfly/react-icons": { - "version": "5.4.2", - "resolved": "https://registry.npmjs.org/@patternfly/react-icons/-/react-icons-5.4.2.tgz", - "integrity": "sha512-CMQ5oHYzW6TPVTs2jpNJmP2vGCAKR/YeTPwHGO9dLkAUej1IcIxtCCWK2Fdo2UJsnBjuZihasyw2b6ehvbUm9Q==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/react-icons/-/react-icons-6.0.0.tgz", + "integrity": "sha512-ZFrsBVKrAp0DZrPOss98OA/EVUL4F0frXhR1uBId9+3ZrRArdKTgYgmQUCeSzMbxnSlxpmm3a2L05XQ36VUVbw==", "license": "MIT", "peerDependencies": { "react": "^17 || ^18", @@ -8123,18 +8095,19 @@ "version": "5.4.1", "resolved": "https://registry.npmjs.org/@patternfly/react-styles/-/react-styles-5.4.1.tgz", "integrity": "sha512-XA8PXksD8uiA3RTwxdUwJXOCf+V6sVd+2HKapWAdRLvtSV+Sdk7NgCvalb4IAQncsddLopjPQD8gAHA298+N8w==", + "dev": true, "license": "MIT" }, "node_modules/@patternfly/react-table": { - "version": "5.4.12", - "resolved": "https://registry.npmjs.org/@patternfly/react-table/-/react-table-5.4.12.tgz", - "integrity": "sha512-ZpW/49bWR9JkZCyBGBCbHNdJt0Vn34g5BaXlVF/P7Tl0WPdxFLWS5EQywiXEhu8qoOhz3uGcyGwACCJCvmqCSg==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/react-table/-/react-table-6.0.0.tgz", + "integrity": "sha512-LvWMzjcQZHdFUpK8fjj5EAFrNxqB8/MFd7gUUZu7AgYt6rmS2im4xk6yb7h0K7cAhY085oPeRF9lkYSCgzlRDg==", "license": "MIT", "dependencies": { - "@patternfly/react-core": "^5.4.11", - "@patternfly/react-icons": "^5.4.2", - "@patternfly/react-styles": "^5.4.1", - "@patternfly/react-tokens": "^5.4.1", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", + "@patternfly/react-styles": "^6.0.0", + "@patternfly/react-tokens": "^6.0.0", "lodash": "^4.17.21", "tslib": "^2.7.0" }, @@ -8143,10 +8116,16 @@ "react-dom": "^17 || ^18" } }, + "node_modules/@patternfly/react-table/node_modules/@patternfly/react-styles": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/react-styles/-/react-styles-6.0.0.tgz", + "integrity": "sha512-fJFMB89sTRGlZTzTLmpRmthgOXqcN078scHMFJ3ttfi2D2btnem5oZrxmQ/gPZkZOxR+9MqwKDB6l3F5x1SqLQ==", + "license": "MIT" + }, "node_modules/@patternfly/react-tokens": { - "version": "5.4.1", - "resolved": "https://registry.npmjs.org/@patternfly/react-tokens/-/react-tokens-5.4.1.tgz", - "integrity": "sha512-eygdHE7Krta1mijAv/E8RHiKIgysD0eeNTo8EXUYC8/M4e5K6sqpr2p6rQBF8QiRMN8FnbXvZT3K2OQ28pYt9Q==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/react-tokens/-/react-tokens-6.0.0.tgz", + "integrity": "sha512-xd0ynDkiIW2rp8jz4TNvR4Dyaw9kSMkZdsuYcLlFXCVmvX//Mnl4rhBnid/2j2TaqK0NbkyTTPnPY/BU7SfLVQ==", "license": "MIT" }, "node_modules/@phenomnomnominal/tsquery": { @@ -8279,6 +8258,7 @@ "version": "1.4.5", "resolved": "https://registry.npmjs.org/@redhat-cloud-services/rbac-client/-/rbac-client-1.4.5.tgz", "integrity": "sha512-7kryZfzEYuw1V7c8bO5esXnfeYQO4Skz1XhluJ2whZNji8HcVbwDjBsQxy0+ndaSVirh5d86fufb00vK6fyUjw==", + "license": "Apache-2.0", "dependencies": { "axios": "^0.27.2", "tslib": "^2.6.2" @@ -8288,6 +8268,7 @@ "version": "0.27.2", "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==", + "license": "MIT", "dependencies": { "follow-redirects": "^1.14.9", "form-data": "^4.0.0" @@ -18868,6 +18849,7 @@ "version": "7.6.2", "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.6.2.tgz", "integrity": "sha512-9FhUxK1hVju2+AiQIDJ5Dd//9R2n2RAfJ0qfhF4IHGHgcoEUTMpbTeG/zbEuwaiYXfuAH6XE0/aCyxDdRM+W5w==", + "dev": true, "license": "MIT", "dependencies": { "tabbable": "^6.2.0" @@ -36620,7 +36602,7 @@ "version": "2.0.21", "license": "Apache-2.0", "dependencies": { - "@redhat-cloud-services/frontend-components": "^5.0.1", + "@redhat-cloud-services/frontend-components": "^5.0.2", "dot": "^1.1.3", "lodash": "^4.17.21", "marked": "14.1.2", @@ -36638,8 +36620,8 @@ "style-loader": "^3.3.1" }, "peerDependencies": { - "@patternfly/react-core": "^5.0.0", - "@patternfly/react-icons": "^5.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", "prop-types": "^15.6.2", "react": "^18.2.0", "react-dom": "^18.2.0", @@ -37115,7 +37097,7 @@ "version": "5.2.11", "license": "Apache-2.0", "dependencies": { - "@patternfly/react-component-groups": "^5.5.5", + "@patternfly/react-component-groups": "^6.0.0", "@redhat-cloud-services/frontend-components-utilities": "^5.0.4", "@redhat-cloud-services/types": "^1.0.19", "@scalprum/core": "^0.8.1", @@ -37125,8 +37107,8 @@ }, "devDependencies": { "@cypress/webpack-dev-server": "^1.8.4", - "@patternfly/patternfly": "^5.4.2", - "@types/react": "^18.0.0", + "@patternfly/patternfly": "^6.0.0", + "@types/react": "^18.3.3", "css-loader": "^6.7.1", "eslint-plugin-cypress": "^3.0.0", "glob": "10.3.3", @@ -37134,9 +37116,10 @@ "style-loader": "^3.3.1" }, "peerDependencies": { - "@patternfly/react-core": "^5.4.11", - "@patternfly/react-icons": "^5.4.2", - "@patternfly/react-table": "^5.4.12", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", + "@patternfly/react-table": "^6.0.0", + "@patternfly/react-tokens": "^6.0.0", "lodash": "^4.17.15", "prop-types": "^15.6.2", "react": "^18.2.0", @@ -37193,6 +37176,23 @@ "node": "^18.18.0 || ^20.9.0 || >=21.1.0" } }, + "packages/components/node_modules/@patternfly/react-component-groups": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@patternfly/react-component-groups/-/react-component-groups-6.0.0.tgz", + "integrity": "sha512-q4dQj4b/Yf8fW3ZXWZhXrX8xE73JpRAFF5wydDx6OZe3oZXucUgldghupavbyhY/oYM2V89/P67w24poH6iOqA==", + "license": "MIT", + "dependencies": { + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", + "@patternfly/react-table": "^6.0.0", + "clsx": "^2.1.1", + "react-jss": "^10.10.0" + }, + "peerDependencies": { + "react": "^17 || ^18", + "react-dom": "^17 || ^18" + } + }, "packages/components/node_modules/ajv": { "version": "6.12.6", "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", @@ -38939,8 +38939,8 @@ "typescript": "^5.0.0" }, "peerDependencies": { - "@patternfly/react-core": "^5.0.0", - "@patternfly/react-icons": "^5.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", "prop-types": "^15.6.2", "react": "^18.2.0", "react-dom": "^18.2.0", @@ -39029,31 +39029,93 @@ "version": "3.2.33", "license": "Apache-2.0", "dependencies": { - "@data-driven-forms/pf4-component-mapper": "^3.21.0", - "@data-driven-forms/react-form-renderer": "^3.21.0", + "@data-driven-forms/pf4-component-mapper": "^4.0.0", + "@data-driven-forms/react-form-renderer": "^4.0.0", "@redhat-cloud-services/frontend-components": "^5.1.1", "@redhat-cloud-services/frontend-components-utilities": "^5.0.6", "redux-promise-middleware": "^6.1.3", "urijs": "^1.19.11" }, "peerDependencies": { - "@patternfly/react-core": "^5.0.0", - "@patternfly/react-icons": "^5.0.0", - "@patternfly/react-table": "^5.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", + "@patternfly/react-table": "^6.0.0", "prop-types": "^15.6.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-redux": "^7.0.0 || ^8.0.0 || ^9.0.0" } }, + "packages/remediations/node_modules/@data-driven-forms/common": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@data-driven-forms/common/-/common-4.0.0.tgz", + "integrity": "sha512-pZIejlIMvPoYblYtk9YuhvlMMGOHogthbaz9jH95VysV/NRI+TnPOl/zKlDwe4qkEwX0521n0O7rHWnIC/a6GA==", + "license": "Apache-2.0", + "dependencies": { + "clsx": "^1.0.4", + "lodash": "^4.17.15", + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "react": "^16.13.1 || ^17.0.2 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.2 || ^18.0.0" + } + }, + "packages/remediations/node_modules/@data-driven-forms/pf4-component-mapper": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@data-driven-forms/pf4-component-mapper/-/pf4-component-mapper-4.0.0.tgz", + "integrity": "sha512-hlcS1J4s7xNFwgdbeyWGk5RyWiM9PMnI5Za8KBlqEzGxr43r2O44Es1XON/bs8p2W+f7u+63uWMcGb0KdYPjPw==", + "license": "Apache-2.0", + "dependencies": { + "@data-driven-forms/common": "^4.0.0", + "downshift": "^5.4.3", + "lodash": "^4.17.21", + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "@data-driven-forms/react-form-renderer": "^4.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", + "react": "^17.0.2 || ^18.0.0", + "react-dom": "^17.0.2 || ^18.0.0" + } + }, + "packages/remediations/node_modules/@data-driven-forms/react-form-renderer": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@data-driven-forms/react-form-renderer/-/react-form-renderer-4.0.0.tgz", + "integrity": "sha512-ZX8yH+gYMEv/LxcMvPX+qFzwb8v5UGBxWwG24ySc04Hy9nWSHCywsi4bFNCoqIpSVie5vAx+nPnc2SmlJjp5tw==", + "license": "Apache-2.0", + "dependencies": { + "final-form": "^4.20.4", + "final-form-arrays": "^3.0.2", + "final-form-focus": "^1.1.2", + "lodash": "^4.17.15", + "prop-types": "^15.7.2", + "react-final-form": "^6.5.0", + "react-final-form-arrays": "^3.1.1" + }, + "peerDependencies": { + "react": "^16.13.1 || ^17.0.2 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.2 || ^18.0.0" + } + }, + "packages/remediations/node_modules/clsx": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz", + "integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==", + "license": "MIT", + "engines": { + "node": ">=6" + } + }, "packages/rule-components": { "name": "@redhat-cloud-services/rule-components", "version": "3.2.30", "license": "Apache-2.0", "dependencies": { - "@patternfly/react-core": "^5.0.0", - "@patternfly/react-icons": "^5.0.0", - "@patternfly/react-table": "^5.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", + "@patternfly/react-table": "^6.0.0", "@redhat-cloud-services/frontend-components": "^5.1.1", "@redhat-cloud-services/frontend-components-utilities": "^5.0.4", "dot": "1.1.3", @@ -39195,6 +39257,34 @@ "history": "^4.10.1" } }, + "packages/types/node_modules/@patternfly/quickstarts": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@patternfly/quickstarts/-/quickstarts-5.4.2.tgz", + "integrity": "sha512-WK0a+tgeCe6GoGSBfv9N9va3Nleboxfdq0L0J1NfenS7Npp8frNAgZymrv9KNtdgsZDxxKvCJf1ZPecIaeDgKA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@patternfly/react-catalog-view-extension": "^5.0.0", + "dompurify": "^3.1.3", + "history": "^5.0.0" + }, + "peerDependencies": { + "@patternfly/react-core": ">=5.0.0", + "marked": "^15.0.6", + "react": ">=16.8.0", + "react-dom": ">=16.8.0" + } + }, + "packages/types/node_modules/@patternfly/quickstarts/node_modules/history": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz", + "integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.7.6" + } + }, "packages/types/node_modules/glob": { "version": "10.3.3", "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.3.tgz", @@ -39237,6 +39327,20 @@ "@pkgjs/parseargs": "^0.11.0" } }, + "packages/types/node_modules/marked": { + "version": "15.0.7", + "resolved": "https://registry.npmjs.org/marked/-/marked-15.0.7.tgz", + "integrity": "sha512-dgLIeKGLx5FwziAnsk4ONoGwHwGPJzselimvlVskE9XLN4Orv9u2VA3GWw/lYUqjfA0rUT/6fqKwfZJapP9BEg==", + "dev": true, + "license": "MIT", + "peer": true, + "bin": { + "marked": "bin/marked.js" + }, + "engines": { + "node": ">= 18" + } + }, "packages/utils": { "name": "@redhat-cloud-services/frontend-components-utilities", "version": "5.0.12", @@ -39259,8 +39363,8 @@ "redux-mock-store": "^1.5.4" }, "peerDependencies": { - "@patternfly/react-core": "^5.0.0", - "@patternfly/react-table": "^5.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-table": "^6.0.0", "react": "^18.2.0", "react-dom": "^18.2.0", "react-redux": "^7.0.0 || ^8.0.0 || ^9.0.0", diff --git a/package.json b/package.json index 4387f9b5a..e95e70bfe 100644 --- a/package.json +++ b/package.json @@ -42,10 +42,10 @@ "@nx/web": "20.0.6", "@nx/webpack": "^20.0.6", "@openshift/dynamic-plugin-sdk-webpack": "^4.1.0", - "@patternfly/quickstarts": "^5.4.1", - "@patternfly/react-core": "^5.4.8", - "@patternfly/react-icons": "^5.4.2", - "@patternfly/react-table": "^5.4.9", + "@patternfly/quickstarts": "^6.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", + "@patternfly/react-table": "^6.0.0", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15", "@simonsmith/cypress-image-snapshot": "^9.1.0", "@swc-node/register": "^1.10.9", diff --git a/packages/advisor-components/cypress/component/ReportDetails/ReportDetails.spec.cy.tsx b/packages/advisor-components/cypress/component/ReportDetails/ReportDetails.spec.cy.tsx index e85e4bb78..598b424c8 100644 --- a/packages/advisor-components/cypress/component/ReportDetails/ReportDetails.spec.cy.tsx +++ b/packages/advisor-components/cypress/component/ReportDetails/ReportDetails.spec.cy.tsx @@ -27,12 +27,12 @@ describe('report details: kba loaded', () => { }); it('renders correct number of headers', () => { - cy.get('.pf-v5-c-card__header').should('have.length', HEADERS.length); - HEADERS.forEach((h) => cy.get('.pf-v5-c-card__header').contains(h).should('have.length', 1)); + cy.get('.pf-v6-c-card__header').should('have.length', HEADERS.length); + HEADERS.forEach((h) => cy.get('.pf-v6-c-card__header').contains(h).should('have.length', 1)); }); it('each header has an icon', () => { - cy.get('.pf-v5-c-card__header-main > .ins-c-report-details__icon').should('have.length', HEADERS.length); + cy.get('.pf-v6-c-card__header-main > .ins-c-report-details__icon').should('have.length', HEADERS.length); }); it('links have an icon', () => { @@ -64,12 +64,12 @@ describe('report details: kba loaded', () => { it('renders three dividers', () => { // TODO: make the assertion number dependant on input test data - cy.get('hr[class=pf-v5-c-divider]').should('have.length', 3); + cy.get('hr[class=pf-v6-c-divider]').should('have.length', 3); }); it('renders a loaded kba link', () => { - cy.get(`${ROOT} .ins-c-report-details__kba .pf-v5-c-card__body`).find('.pf-v5-c-skeleton').should('have.length', 0); - cy.get(`${ROOT} .ins-c-report-details__kba .pf-v5-c-card__body`) + cy.get(`${ROOT} .ins-c-report-details__kba .pf-v6-c-card__body`).find('.pf-v6-c-skeleton').should('have.length', 0); + cy.get(`${ROOT} .ins-c-report-details__kba .pf-v6-c-card__body`) .contains(props.kbaDetail.publishedTitle) .invoke('attr', 'href') .should('eq', props.kbaDetail.view_uri); @@ -82,6 +82,6 @@ describe('report details: kba loading', () => { }); it('renders skeleton instead of a kba link', () => { - cy.get(`${ROOT} .ins-c-report-details__kba .pf-v5-c-card__body`).find('.pf-v5-c-skeleton').should('have.length', 1); + cy.get(`${ROOT} .ins-c-report-details__kba .pf-v6-c-card__body`).find('.pf-v6-c-skeleton').should('have.length', 1); }); }); diff --git a/packages/advisor-components/package.json b/packages/advisor-components/package.json index 6314bda80..ad8cce836 100644 --- a/packages/advisor-components/package.json +++ b/packages/advisor-components/package.json @@ -19,15 +19,15 @@ }, "homepage": "https://github.com/RedHatInsights/frontend-components/tree/master/packages/advisor-components#readme", "peerDependencies": { - "@patternfly/react-core": "^5.0.0", - "@patternfly/react-icons": "^5.0.0", + "@patternfly/react-core": "^6.0.0", + "@patternfly/react-icons": "^6.0.0", "prop-types": "^15.6.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^5.0.0 || ^6.0.0" }, "dependencies": { - "@redhat-cloud-services/frontend-components": "^5.0.1", + "@redhat-cloud-services/frontend-components": "^5.0.2", "dot": "^1.1.3", "lodash": "^4.17.21", "marked": "14.1.2", diff --git a/packages/advisor-components/src/RebootRequired/RebootRequired.scss b/packages/advisor-components/src/RebootRequired/RebootRequired.scss index adfde86cb..2cc5c9676 100644 --- a/packages/advisor-components/src/RebootRequired/RebootRequired.scss +++ b/packages/advisor-components/src/RebootRequired/RebootRequired.scss @@ -7,13 +7,13 @@ .reboot-required-icon { margin-top: 5px; - margin-right: var(--pf-v5-global--spacer--sm); - color: var(--pf-v5-global--palette--red-100); + margin-right: var(--pf-t--global--spacer--sm); + color: var(--pf-t--global--color--status--danger--default); } .no-reboot-required-icon { margin-top: 5px; - margin-right: var(--pf-v5-global--spacer--sm); - color: var(--pf-v5-global--palette--black-400); + margin-right: var(--pf-t--global--spacer--sm); + color: var(--pf-t--global--color--nonstatus--gray--default); } } diff --git a/packages/advisor-components/src/RebootRequired/RebootRequired.tsx b/packages/advisor-components/src/RebootRequired/RebootRequired.tsx index 8552c74f0..6d66ffbee 100644 --- a/packages/advisor-components/src/RebootRequired/RebootRequired.tsx +++ b/packages/advisor-components/src/RebootRequired/RebootRequired.tsx @@ -1,8 +1,9 @@ import './RebootRequired.scss'; import React from 'react'; -import { Icon, Text, TextContent, TextVariants } from '@patternfly/react-core'; -import { PowerOffIcon } from '@patternfly/react-icons'; +import { Icon } from '@patternfly/react-core/dist/js/components/Icon/Icon'; +import { Content, ContentVariants } from '@patternfly/react-core/dist/js/components/Content/Content'; +import { PowerOffIcon } from '@patternfly/react-icons/dist/dynamic/icons/power-off-icon'; import { RuleDetailsMessages } from '../RuleDetails/RuleDetailsMessages'; interface RebootRequiredProps { @@ -15,9 +16,9 @@ const RebootRequired: React.FC = ({ messages, rebootRequire - - {messages.systemReboot} - + + {messages.systemReboot} + ); diff --git a/packages/advisor-components/src/ReportDetails/ReportDetails.scss b/packages/advisor-components/src/ReportDetails/ReportDetails.scss index 98b0e2a87..c88a31e7b 100644 --- a/packages/advisor-components/src/ReportDetails/ReportDetails.scss +++ b/packages/advisor-components/src/ReportDetails/ReportDetails.scss @@ -4,11 +4,11 @@ &__cards-stack { pre { display: block; - color: var(--pf-v5-global--Color--100); + color: var(--pf-t--color--gray--95); word-break: break-all; word-wrap: break-word; - background-color: var(--pf-v5-global--BackgroundColor--light-200); - border: 1px solid var(--pf-v5-global--BorderColor--100); + background-color: var(pf-t--global--background--color--200); + border: 1px solid var(--pf-t--global--border--color--100); border-radius: 4px; @include m.rem('padding', 10px); @include m.rem('margin', (10px, 0)); @@ -42,25 +42,25 @@ h4, h5, h6 { - font-family: var(--pf-v5-global--FontFamily--heading--sans-serif); + font-family: var(--pf-t--global--font--family--heading); line-height: 1.5; } h1 { - font-size: var(--pf-v5-global--FontSize--2xl); + font-size: var(--pf-t--global--font--size--2xl); line-height: 1.3; } h2 { - font-size: var(--pf-v5-global--FontSize--xl); + font-size: var(--pf-t--global--font--size--xl); } h3 { - font-size: var(--pf-v5-global--FontSize--lg); + font-size: var(--pf-t--global--font--size--lg); } h4, h5, h6 { - font-size: var(--pf-v5-global--FontSize--md); + font-size: var(--pf-t--global--font--size--md); } - .pf-v5-c-list { + .pf-v6-c-list { @include m.rem('margin', 5px 0); } @@ -69,7 +69,7 @@ @include m.rem('margin-top', 10px); tr { - border-bottom: 1px solid var(--pf-v5-global--BorderColor--300); + border-bottom: 1px solid var(--pf-t--global--border--color--on-secondary); } th, @@ -80,6 +80,6 @@ } &__icon { - margin-right: var(--pf-v5-global--spacer--sm); + margin-right: var(--pf-t--global--spacer--sm); } } diff --git a/packages/advisor-components/src/ReportDetails/ReportDetails.tsx b/packages/advisor-components/src/ReportDetails/ReportDetails.tsx index 95fc9fa61..5c6f96644 100644 --- a/packages/advisor-components/src/ReportDetails/ReportDetails.tsx +++ b/packages/advisor-components/src/ReportDetails/ReportDetails.tsx @@ -2,8 +2,17 @@ import './ReportDetails.scss'; import React, { useState } from 'react'; -import { Alert, Card, CardBody, CardHeader, Divider, Stack, StackItem } from '@patternfly/react-core'; -import { BullseyeIcon, InfoCircleIcon, LightbulbIcon, ThumbsUpIcon } from '@patternfly/react-icons'; +import { Alert } from '@patternfly/react-core/dist/dynamic/components/Alert'; +import { Card } from '@patternfly/react-core/dist/dynamic/components/Card'; +import { CardBody } from '@patternfly/react-core/dist/dynamic/components/Card'; +import { CardHeader } from '@patternfly/react-core/dist/dynamic/components/Card'; +import { Divider } from '@patternfly/react-core/dist/dynamic/components/Divider'; +import { Stack } from '@patternfly/react-core/dist/dynamic/layouts/Stack'; +import { StackItem } from '@patternfly/react-core/dist/dynamic/layouts/Stack'; +import BullseyeIcon from '@patternfly/react-icons/dist/dynamic/icons/bullseye-icon'; +import InfoCircleIcon from '@patternfly/react-icons/dist/dynamic/icons/info-circle-icon'; +import LightbulbIcon from '@patternfly/react-icons/dist/dynamic/icons/lightbulb-icon'; +import ThumbsUpIcon from '@patternfly/react-icons/dist/dynamic/icons/thumbs-up-icon'; import { Skeleton, SkeletonSize } from '@redhat-cloud-services/frontend-components/Skeleton'; import { RuleContentOcp, RuleContentRhel } from '../types'; diff --git a/packages/advisor-components/src/RuleDescription/RuleDescription.scss b/packages/advisor-components/src/RuleDescription/RuleDescription.scss index 97d0fb903..c72da9d0d 100644 --- a/packages/advisor-components/src/RuleDescription/RuleDescription.scss +++ b/packages/advisor-components/src/RuleDescription/RuleDescription.scss @@ -1,6 +1,6 @@ .ins-c-generic__override { p { margin-top: 0; - margin-bottom: var(--pf-v5-global--spacer--md); + margin-bottom: var(--pf-t--global--spacer--md); } } diff --git a/packages/advisor-components/src/RuleDetails/RuleDetails.scss b/packages/advisor-components/src/RuleDetails/RuleDetails.scss index ab5d61f8d..7fd80ec8a 100644 --- a/packages/advisor-components/src/RuleDetails/RuleDetails.scss +++ b/packages/advisor-components/src/RuleDetails/RuleDetails.scss @@ -1,10 +1,10 @@ .ins-c-line { - border: 0.01rem solid var(--pf-v5-global--BorderColor--100); + border: 0.01rem solid var(--pf-t--global--border--color--100); } .ins-c-rule-details__stack { width: 600px; - .pf-v5-c-content { - font-size: var(--pf-v5-global--FontSize--sm); + .pf-v6-c-content { + font-size: var(--pf-t--global--font--size--sm); } } diff --git a/packages/advisor-components/src/RuleDetails/RuleDetails.tsx b/packages/advisor-components/src/RuleDetails/RuleDetails.tsx index 7d7a87645..ce68324e8 100644 --- a/packages/advisor-components/src/RuleDetails/RuleDetails.tsx +++ b/packages/advisor-components/src/RuleDetails/RuleDetails.tsx @@ -2,8 +2,14 @@ import './RuleDetails.scss'; import React from 'react'; -import { Flex, FlexItem, Icon, Stack, StackItem, Text, TextContent, TextVariants } from '@patternfly/react-core'; -import { ExternalLinkAltIcon } from '@patternfly/react-icons'; +import { Flex } from '@patternfly/react-core/dist/dynamic/layouts/Flex'; +import { FlexItem } from '@patternfly/react-core/dist/dynamic/layouts/Flex'; +import { Icon } from '@patternfly/react-core/dist/dynamic/components/Icon'; +import { Stack } from '@patternfly/react-core/dist/dynamic/layouts/Stack'; +import { StackItem } from '@patternfly/react-core/dist/dynamic/layouts/Stack'; +import { Content } from '@patternfly/react-core/dist/dynamic/components/Content'; +import { ContentVariants } from '@patternfly/react-core/dist/dynamic/components/Content'; +import ExternalLinkAltIcon from '@patternfly/react-icons/dist/dynamic/icons/external-link-alt-icon'; import InsightsLabel from '@redhat-cloud-services/frontend-components/InsightsLabel'; import { SeverityLine } from '@redhat-cloud-services/frontend-components/SeverityLine'; @@ -95,9 +101,9 @@ const RuleDetails: React.FC = ({ - - {messages.rulesDetailsTotalRiskBody} - + + {messages.rulesDetailsTotalRiskBody} + @@ -127,7 +133,7 @@ const RuleDetails: React.FC = ({ {messages.riskOfChange} - + {/* remove pf-m-compact class name once https://github.com/patternfly/patternfly-react/issues/7196 is resolved */} @@ -142,9 +148,9 @@ const RuleDetails: React.FC = ({ - - {resolutionRiskDesc} - + + {resolutionRiskDesc} + {product === AdvisorProduct.rhel && ( diff --git a/packages/advisor-components/src/RuleRating/RuleRating.scss b/packages/advisor-components/src/RuleRating/RuleRating.scss index 2967a9c7b..e0a9f7c11 100644 --- a/packages/advisor-components/src/RuleRating/RuleRating.scss +++ b/packages/advisor-components/src/RuleRating/RuleRating.scss @@ -1,13 +1,13 @@ .ins-c-like { - color: var(--pf-v5-global--success-color--100); + color: var(--pf-t--global--color--status--success--default); } .ins-c-dislike { - color: var(--pf-v5-global--primary-color--100); + color: var(--pf-t--global--text--color--regular); } .ratingSpanOverride { - font-size: var(--pf-v5-global--FontSize--sm) !important; + font-size: var(--pf-t--global--font--size--sm) !important; button { padding: 8px; } diff --git a/packages/advisor-components/src/RuleRating/RuleRating.tsx b/packages/advisor-components/src/RuleRating/RuleRating.tsx index f2b549380..62be6bc3b 100644 --- a/packages/advisor-components/src/RuleRating/RuleRating.tsx +++ b/packages/advisor-components/src/RuleRating/RuleRating.tsx @@ -3,8 +3,12 @@ import './RuleRating.scss'; import React, { useCallback, useState } from 'react'; import debounce from 'lodash/debounce'; -import { Button, Icon } from '@patternfly/react-core'; -import { OutlinedThumbsDownIcon, OutlinedThumbsUpIcon, ThumbsDownIcon, ThumbsUpIcon } from '@patternfly/react-icons'; +import { Button } from '@patternfly/react-core/dist/dynamic/components/Button'; +import { Icon } from '@patternfly/react-core/dist/dynamic/components/Icon'; +import OutlinedThumbsDownIcon from '@patternfly/react-icons/dist/dynamic/icons/outlined-thumbs-down-icon'; +import OutlinedThumbsUpIcon from '@patternfly/react-icons/dist/dynamic/icons/outlined-thumbs-up-icon'; +import ThumbsDownIcon from '@patternfly/react-icons/dist/dynamic/icons/thumbs-down-icon'; +import ThumbsUpIcon from '@patternfly/react-icons/dist/dynamic/icons/thumbs-up-icon'; import { Rating } from '../types'; import { RuleDetailsMessages } from '../RuleDetails/RuleDetailsMessages'; @@ -45,12 +49,20 @@ const RuleRating: React.FC = ({ messages, ruleId, ruleRating, o return ( {messages.ruleHelpful} - - +