From 2268a0633a85b0a912d16c49fa9d5cd322e1444a Mon Sep 17 00:00:00 2001 From: Dan Labrecque Date: Thu, 1 Jun 2023 10:52:37 -0400 Subject: [PATCH] PatternFly v5 package update https://issues.redhat.com/browse/COST-3931 --- .../components/dataToolbar/workloadType.tsx | 7 +- .eslintrc.json | 2 + fec.config.js | 8 +- package-lock.json | 1271 ++++++++++++----- package.json | 28 +- .../drawers/exports/exportActions.tsx | 4 +- .../drawers/exports/exportsContent.tsx | 2 +- .../drawers/exports/exportsLink.tsx | 2 +- .../drawers/exports/exportsTable.tsx | 24 +- .../drawers/optimzations/optimizations.scss | 10 +- .../optimzations/optimizationsContent.tsx | 12 +- .../optimzations/optimizationsLink.tsx | 6 +- .../inactiveSources/inactiveSources.scss | 8 +- .../charts/chartTheme/theme-utils.ts | 2 +- .../historicalCostChart.test.tsx.snap | 64 +- .../historicalCostChart.tsx | 3 +- .../historicalTrendChart.test.tsx.snap | 58 +- .../historicalUsageChart.test.tsx.snap | 36 +- .../historicalUsageChart.tsx | 3 +- .../__snapshots__/trendChart.test.tsx.snap | 28 +- .../__snapshots__/usageChart.test.tsx.snap | 28 +- .../costDistribution/costDistribution.scss | 4 +- .../costDistribution/costDistribution.tsx | 11 +- src/routes/components/costType/costType.scss | 4 +- src/routes/components/costType/costType.tsx | 11 +- src/routes/components/currency/currency.scss | 2 +- src/routes/components/currency/currency.tsx | 11 +- .../components/dataTable/dataTable.scss | 12 +- src/routes/components/dataTable/dataTable.tsx | 27 +- .../components/dataTable/selectableTable.tsx | 30 +- .../components/dataToolbar/basicToolbar.tsx | 4 +- .../dataToolbar/costCategoryValue.tsx | 58 +- .../components/dataToolbar/customSelect.tsx | 16 +- .../components/dataToolbar/dataKebab.tsx | 2 +- .../components/dataToolbar/dataToolbar.scss | 6 +- .../components/dataToolbar/dataToolbar.tsx | 15 +- .../components/dataToolbar/tagValue.tsx | 58 +- .../components/dataToolbar/utils/actions.tsx | 2 +- .../dataToolbar/utils/bulkSelect.tsx | 6 +- .../components/dataToolbar/utils/category.tsx | 79 +- .../dataToolbar/utils/costCategory.tsx | 15 +- .../components/dataToolbar/utils/exclude.tsx | 11 +- .../dataToolbar/utils/orgUntits.tsx | 10 +- .../components/dataToolbar/utils/tags.tsx | 13 +- src/routes/components/export/exportModal.tsx | 24 +- src/routes/components/groupBy/groupBy.tsx | 11 +- src/routes/components/groupBy/groupByOrg.tsx | 10 +- .../components/groupBy/groupBySelect.tsx | 12 +- .../optimizations/optimizationsTable.tsx | 2 +- .../components/page/noData/noDataState.tsx | 27 +- .../noOptimizations/noOptimizationsState.tsx | 14 +- .../page/noProviders/noProvidersState.tsx | 31 +- .../perspective/perspectiveSelect.tsx | 11 +- .../reportSummaryItems.test.tsx.snap | 24 +- .../reports/reportSummary/reportSummary.scss | 10 +- .../reportSummary/reportSummaryAlt.scss | 14 +- .../reportSummary/reportSummaryCost.scss | 2 +- .../reportSummary/reportSummaryDailyCost.scss | 2 +- .../reportSummaryDailyTrend.scss | 2 +- .../reportSummary/reportSummaryDetails.scss | 30 +- .../reportSummary/reportSummaryItem.scss | 2 +- .../reportSummary/reportSummaryItems.scss | 2 +- .../reportSummary/reportSummaryTrend.scss | 2 +- .../reportSummary/reportSummaryUsage.scss | 2 +- .../resourceTypeahead/resourceInput.tsx | 14 +- .../emptyFilterState/emptyFilterState.tsx | 7 +- .../emptyValueState/emptyValueState.scss | 2 +- .../state/errorState/errorState.tsx | 10 +- .../state/loadingState/loadingState.tsx | 8 +- src/routes/details/awsDetails/awsDetails.tsx | 2 +- .../details/azureDetails/azureDetails.tsx | 2 +- .../details/components/actions/actions.tsx | 4 +- .../components/breakdown/breakdownHeader.scss | 8 +- .../components/breakdown/breakdownHeader.tsx | 6 +- .../components/cluster/clusterModal.scss | 6 +- .../columnManagementModal.tsx | 2 +- .../components/summary/summaryModal.scss | 6 +- src/routes/details/gcpDetails/gcpDetails.tsx | 2 +- src/routes/details/ibmDetails/ibmDetails.tsx | 2 +- src/routes/details/ociDetails/ociDetails.tsx | 2 +- .../ocpBreakdown/optimizationsBreakdown.tsx | 2 +- src/routes/details/ocpDetails/ocpDetails.tsx | 2 +- .../details/rhelDetails/rhelDetails.tsx | 2 +- src/routes/explorer/explorer.tsx | 2 +- src/routes/explorer/explorerDateRange.tsx | 10 +- src/routes/explorer/explorerFilter.scss | 2 +- src/routes/explorer/explorerTable.scss | 8 +- src/routes/explorer/explorerTable.tsx | 27 +- src/routes/optimizations/optimizations.tsx | 2 +- .../overview/components/chartComparison.tsx | 10 +- .../optimizationsSummary.scss | 4 +- src/routes/overview/overview.scss | 4 +- .../settings/costCategory/costCategory.tsx | 2 +- .../__snapshots__/rateTable.test.tsx.snap | 12 +- .../__snapshots__/warningIcon.test.tsx.snap | 5 +- .../costModels/components/errorState.tsx | 17 +- .../costModels/components/forms/form.tsx | 10 +- .../components/inputs/rateInput.tsx | 48 +- .../costModels/components/inputs/selector.tsx | 23 +- .../components/inputs/simpleInput.tsx | 24 +- .../components/paginationToolbarTemplate.tsx | 12 +- .../components/priceListToolbar.tsx | 2 +- .../components/rateForm/rateForm.tsx | 10 +- .../components/rateForm/taggingRatesForm.tsx | 6 +- .../costModels/components/rateTable.tsx | 15 +- .../components/toolbar/checkboxSelector.tsx | 2 +- .../components/toolbar/primarySelector.tsx | 2 +- .../__snapshots__/dialog.test.tsx.snap | 9 +- .../costModels/costModel/addSourceStep.tsx | 18 +- .../costModel/assignSourcesModalToolbar.tsx | 33 +- .../costModels/costModel/costModelInfo.tsx | 12 +- .../costModels/costModel/distribution.tsx | 51 +- .../settings/costModels/costModel/header.tsx | 6 +- .../settings/costModels/costModel/markup.tsx | 51 +- .../costModels/costModel/priceListTable.tsx | 32 +- .../costModels/costModel/sourcesTable.tsx | 9 +- .../costModels/costModel/sourcesToolbar.tsx | 34 +- .../settings/costModels/costModel/table.tsx | 18 +- .../costModels/costModel/updateCostModel.tsx | 4 +- .../costModel/updateDistributionDialog.tsx | 6 +- .../costModel/updateMarkupDialog.tsx | 45 +- .../costModelWizard/assignSourcesToolbar.tsx | 33 +- .../costModels/costModelWizard/context.ts | 8 +- .../costModelWizard/costModelWizard.tsx | 36 +- .../costModelWizard/generalInformation.tsx | 41 +- .../costModels/costModelWizard/markup.tsx | 41 +- .../costModelWizard/priceListTable.tsx | 22 +- .../costModels/costModelWizard/review.tsx | 25 +- .../costModels/costModelWizard/table.tsx | 12 +- .../costModelsDetails/bottomPagination.tsx | 2 +- .../costModelsDetails/emptyStateBase.tsx | 9 +- .../costModels/costModelsDetails/table.tsx | 9 +- .../costModelsDetails/utils/filters.tsx | 48 +- .../costModelsDetails/utils/table.tsx | 6 +- .../costModelsDetails/utils/toolbar.tsx | 7 +- .../platformProjects/platformProjects.tsx | 2 +- src/routes/settings/settings.scss | 4 +- src/routes/settings/tagDetails/tagDetails.tsx | 2 +- src/styles/global.css | 4 +- src/styles/revert.css | 12 +- src/typings/frontend-components.ts | 1 + 141 files changed, 1930 insertions(+), 1317 deletions(-) diff --git a/.archive/routes/components/dataToolbar/workloadType.tsx b/.archive/routes/components/dataToolbar/workloadType.tsx index 8ba61f9777..2d358ef924 100644 --- a/.archive/routes/components/dataToolbar/workloadType.tsx +++ b/.archive/routes/components/dataToolbar/workloadType.tsx @@ -1,7 +1,8 @@ import './dataToolbar.scss'; -import type { SelectOptionObject, ToolbarChipGroup } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant } from '@patternfly/react-core'; +import type { ToolbarChipGroup } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import messages from 'locales/messages'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -60,8 +61,8 @@ class WorkloadTypeBase extends React.Component this.onToggle(isExpanded)} selections={selections} isOpen={isWorkloadTypeExpanded} placeholderText={intl.formatMessage(messages.chooseValuePlaceholder)} diff --git a/.eslintrc.json b/.eslintrc.json index 43002e2546..714910baad 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -136,6 +136,8 @@ "react/prop-types": 0, "simple-import-sort/imports": "error", "spaced-comment": "error", + "rulesdir/disallow-pf-migrated-components": "off", + "rulesdir/forbid-pf-relative-imports": "off", "testing-library/await-async-queries": "error", "testing-library/no-await-sync-queries": "error", "testing-library/no-debugging-utils": "warn", diff --git a/fec.config.js b/fec.config.js index dd95b1d9cd..e2424f8bb5 100644 --- a/fec.config.js +++ b/fec.config.js @@ -37,6 +37,8 @@ module.exports = { interceptChromeConfig: false, // Change to false after your app is registered in configuration files proxyVerbose: true, sassPrefix: `.${moduleName}`, + // sassPrefix: 'body', // For PF v5 testing only + // bundlePfModules: true, // For PF v5 testing only stats, standalone: process.env.LOCAL_API_PORT ? true : false, useCache: true, @@ -61,9 +63,9 @@ module.exports = { './RootApp': path.resolve(__dirname, './src/appEntry.tsx'), }, shared: [ - { 'react-redux': { requiredVersion: dependencies['react-redux'] } }, - { 'react-router-dom': { import: false, requiredVersion: '*', singleton: true } }, - { '@unleash/proxy-client-react': { requiredVersion: '*', singleton: true } }, + { 'react-redux': { version: dependencies['react-redux'] } }, + { 'react-router-dom': { version: dependencies['react-router-dom'], import: false, singleton: true } }, + { '@unleash/proxy-client-react': { version: dependencies['@unleash/proxy-client-react'], singleton: true } }, ], }, /** diff --git a/package-lock.json b/package-lock.json index acc98cd2b4..0441cf8860 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,17 +10,16 @@ "hasInstallScript": true, "license": "GNU AGPLv3", "dependencies": { - "@patternfly/patternfly": "4.224.2", - "@patternfly/react-charts": "6.94.19", - "@patternfly/react-core": "4.276.8", - "@patternfly/react-icons": "4.93.6", - "@patternfly/react-styles": "4.92.6", - "@patternfly/react-table": "4.113.0", - "@patternfly/react-tokens": "4.94.6", - "@redhat-cloud-services/frontend-components": "^3.11.5", - "@redhat-cloud-services/frontend-components-notifications": "^3.2.16", + "@patternfly/patternfly": "5.0.4", + "@patternfly/react-charts": "7.0.1", + "@patternfly/react-core": "5.0.1", + "@patternfly/react-icons": "5.0.1", + "@patternfly/react-table": "5.0.1", + "@patternfly/react-tokens": "5.0.1", + "@redhat-cloud-services/frontend-components": "^4.0.8", + "@redhat-cloud-services/frontend-components-notifications": "^4.0.2", "@redhat-cloud-services/frontend-components-translations": "^3.2.7", - "@redhat-cloud-services/frontend-components-utilities": "^3.7.6", + "@redhat-cloud-services/frontend-components-utilities": "^4.0.2", "@redhat-cloud-services/rbac-client": "^1.2.8", "@unleash/proxy-client-react": "^3.6.0", "axios": "^1.5.0", @@ -43,8 +42,9 @@ }, "devDependencies": { "@formatjs/cli": "^6.1.5", - "@redhat-cloud-services/eslint-config-redhat-cloud-services": "^1.3.0", - "@redhat-cloud-services/frontend-components-config": "^5.1.1", + "@redhat-cloud-services/eslint-config-redhat-cloud-services": "^2.0.2", + "@redhat-cloud-services/frontend-components-config": "^6.0.4", + "@redhat-cloud-services/tsc-transform-imports": "^1.0.4", "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.4.3", "@types/jest": "^29.5.4", @@ -713,6 +713,19 @@ "node": ">=10.0.0" } }, + "node_modules/@emotion/is-prop-valid": { + "version": "0.7.3", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.7.3.tgz", + "integrity": "sha512-uxJqm/sqwXw3YPA5GXX365OBcJGFtxUVkB6WyezqFHlNe9jqUWH5ur2O2M8dGBz61kn1g3ZBlzUunFQXQIClhA==", + "dependencies": { + "@emotion/memoize": "0.7.1" + } + }, + "node_modules/@emotion/memoize": { + "version": "0.7.1", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.1.tgz", + "integrity": "sha512-Qv4LTqO11jepd5Qmlp3M1YEjBumoTHcHFdgPTQ+sFlIL5myi/7xu/POwP7IRu6odBdmLXdtIs1D6TuW6kbwbbg==" + }, "node_modules/@es-joy/jsdoccomment": { "version": "0.40.1", "resolved": "https://registry.npmjs.org/@es-joy/jsdoccomment/-/jsdoccomment-0.40.1.tgz", @@ -2099,95 +2112,112 @@ "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==" }, "node_modules/@patternfly/patternfly": { - "version": "4.224.2", - "resolved": "https://registry.npmjs.org/@patternfly/patternfly/-/patternfly-4.224.2.tgz", - "integrity": "sha512-HGNV26uyHSIECuhjPg/WGn0mXbAotcs6ODfhAOkfYjIgGylddgiwElxUe1rpEHV5mQJJ2rMn4OdeJIIpzRX61g==" + "version": "5.0.4", + "resolved": "https://registry.npmjs.org/@patternfly/patternfly/-/patternfly-5.0.4.tgz", + "integrity": "sha512-8akdWzFpG384Q6Es8lzkfuhAlzVGrNK7TJqXGecHDAg8u1JsYn3+Nw6gLRviI88z8Kjxmg5YKirILjpclGxkIA==" }, "node_modules/@patternfly/react-charts": { - "version": "6.94.19", - "resolved": "https://registry.npmjs.org/@patternfly/react-charts/-/react-charts-6.94.19.tgz", - "integrity": "sha512-+yYwXAy/GBH2bTHFzMpdVKc8LUJCCNEqqS7bqovNkNLd0m3FP3q9fKJ22QxNnP9NeFHK6UFa4KfouQAb2fInfQ==", + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/@patternfly/react-charts/-/react-charts-7.0.1.tgz", + "integrity": "sha512-CwzRWzQhsEuWDJaCA2k7DvCaEqX1hA6UteNlYU/9Oh7z4mfWIbE89DRdxBc1AFnWRZbbZQW9TXBU3IPe/qAdqQ==", "dependencies": { - "@patternfly/react-styles": "^4.92.6", - "@patternfly/react-tokens": "^4.94.6", + "@patternfly/react-styles": "^5.0.1", + "@patternfly/react-tokens": "^5.0.1", "hoist-non-react-statics": "^3.3.0", "lodash": "^4.17.19", - "tslib": "^2.0.0", - "victory-area": "^36.6.7", - "victory-axis": "^36.6.7", - "victory-bar": "^36.6.7", - "victory-chart": "^36.6.7", - "victory-core": "^36.6.7", - "victory-create-container": "^36.6.7", - "victory-cursor-container": "^36.6.7", - "victory-group": "^36.6.7", - "victory-legend": "^36.6.7", - "victory-line": "^36.6.7", - "victory-pie": "^36.6.7", - "victory-scatter": "^36.6.7", - "victory-stack": "^36.6.7", - "victory-tooltip": "^36.6.7", - "victory-voronoi-container": "^36.6.7", - "victory-zoom-container": "^36.6.7" + "tslib": "^2.5.0", + "victory-area": "^36.6.11", + "victory-axis": "^36.6.11", + "victory-bar": "^36.6.11", + "victory-box-plot": "^36.6.11", + "victory-chart": "^36.6.11", + "victory-core": "^36.6.11", + "victory-create-container": "^36.6.11", + "victory-cursor-container": "^36.6.11", + "victory-group": "^36.6.11", + "victory-legend": "^36.6.11", + "victory-line": "^36.6.11", + "victory-pie": "^36.6.11", + "victory-scatter": "^36.6.11", + "victory-stack": "^36.6.11", + "victory-tooltip": "^36.6.11", + "victory-voronoi-container": "^36.6.11", + "victory-zoom-container": "^36.6.11" }, "peerDependencies": { - "react": "^16.8 || ^17 || ^18", - "react-dom": "^16.8 || ^17 || ^18" + "react": "^17 || ^18", + "react-dom": "^17 || ^18" } }, - "node_modules/@patternfly/react-core": { - "version": "4.276.8", - "resolved": "https://registry.npmjs.org/@patternfly/react-core/-/react-core-4.276.8.tgz", - "integrity": "sha512-dn322rEzBeiVztZEuCZMUUittNb8l1hk30h9ZN31FLZLLVtXGlThFNV9ieqOJYA9zrYxYZrHMkTnOxSWVacMZg==", + "node_modules/@patternfly/react-component-groups": { + "version": "1.0.15", + "resolved": "https://registry.npmjs.org/@patternfly/react-component-groups/-/react-component-groups-1.0.15.tgz", + "integrity": "sha512-yphWgM8RVxcbrHUtiQ0uGQ8ArOFlrES+3LRZYxbEkoK7s4taTMY1RTp6OVf3Kekfqw7QavKkVWXY/qTyfFm/Kw==", "dependencies": { - "@patternfly/react-icons": "^4.93.6", - "@patternfly/react-styles": "^4.92.6", - "@patternfly/react-tokens": "^4.94.6", - "focus-trap": "6.9.2", - "react-dropzone": "9.0.0", - "tippy.js": "5.1.2", - "tslib": "^2.0.0" + "@patternfly/react-core": "^5.0.0", + "@patternfly/react-icons": "^5.0.0", + "classnames": "^2.2.5", + "react-jss": "^10.9.2", + "react-router": "^6.3.0", + "react-router-dom": "^6.3.0" }, "peerDependencies": { - "react": "^16.8 || ^17 || ^18", - "react-dom": "^16.8 || ^17 || ^18" + "react": "^17 || ^18", + "react-dom": "^17 || ^18" + } + }, + "node_modules/@patternfly/react-core": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@patternfly/react-core/-/react-core-5.0.1.tgz", + "integrity": "sha512-Eevd+8ACLFV733J+cpo4FRgNtRBObIgmUcrqLjf9H99jZ1hFpBgacFyHiALFi2cuoNVGmdEzskFl+4c7Uo0n+w==", + "dependencies": { + "@patternfly/react-icons": "^5.0.1", + "@patternfly/react-styles": "^5.0.1", + "@patternfly/react-tokens": "^5.0.1", + "focus-trap": "7.4.3", + "react-dropzone": "^14.2.3", + "tslib": "^2.5.0" + }, + "peerDependencies": { + "react": "^17 || ^18", + "react-dom": "^17 || ^18" } }, "node_modules/@patternfly/react-icons": { - "version": "4.93.6", - "resolved": "https://registry.npmjs.org/@patternfly/react-icons/-/react-icons-4.93.6.tgz", - "integrity": "sha512-ZrXegc/81oiuTIeWvoHb3nG/eZODbB4rYmekBEsrbiysyO7m/sUFoi/RLvgFINrRoh6YCJqL5fj06Jg6d7jX1g==", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@patternfly/react-icons/-/react-icons-5.0.1.tgz", + "integrity": "sha512-MduetDRzve3eRlKAioM/UxmVuPyFccdeBWAKhbN4SBn7RaZWS7kO7/xZzNkpeT5pqQIeAACvz3uiV2/3uAf38w==", "peerDependencies": { - "react": "^16.8 || ^17 || ^18", - "react-dom": "^16.8 || ^17 || ^18" + "react": "^17 || ^18", + "react-dom": "^17 || ^18" } }, "node_modules/@patternfly/react-styles": { - "version": "4.92.6", - "resolved": "https://registry.npmjs.org/@patternfly/react-styles/-/react-styles-4.92.6.tgz", - "integrity": "sha512-b8uQdEReMyeoMzjpMri845QxqtupY/tIFFYfVeKoB2neno8gkcW1RvDdDe62LF88q45OktCwAe/8A99ker10Iw==" + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@patternfly/react-styles/-/react-styles-5.0.1.tgz", + "integrity": "sha512-kHP/lbvmhBnNfWiqJJLNwOQZnkcl6wfwAesRp22s4Lj941EWe0oFIqn925/uORIOAOz2du1121t7T4UTfLZg4w==" }, "node_modules/@patternfly/react-table": { - "version": "4.113.0", - "resolved": "https://registry.npmjs.org/@patternfly/react-table/-/react-table-4.113.0.tgz", - "integrity": "sha512-qxa3NWCdYasqQQL1rqEd8DyNa8oWr6HNveNW5YJRakE7imWZhUPG2Nd6Op60+KYX8kbCSl7gwSmgAZAYMBMZkQ==", - "dependencies": { - "@patternfly/react-core": "^4.276.8", - "@patternfly/react-icons": "^4.93.6", - "@patternfly/react-styles": "^4.92.6", - "@patternfly/react-tokens": "^4.94.6", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@patternfly/react-table/-/react-table-5.0.1.tgz", + "integrity": "sha512-2YbM6XvgG9ubJE4caPQKPMFBkcf7zYzLUFbHnkyfInpWeVNBs/+ZDAP2wnIHce7uaPLnJ1t0FVzGwaD/UuPwkg==", + "dependencies": { + "@patternfly/react-core": "^5.0.1", + "@patternfly/react-icons": "^5.0.1", + "@patternfly/react-styles": "^5.0.1", + "@patternfly/react-tokens": "^5.0.1", "lodash": "^4.17.19", - "tslib": "^2.0.0" + "tslib": "^2.5.0" }, "peerDependencies": { - "react": "^16.8 || ^17 || ^18", - "react-dom": "^16.8 || ^17 || ^18" + "react": "^17 || ^18", + "react-dom": "^17 || ^18" } }, "node_modules/@patternfly/react-tokens": { - "version": "4.94.6", - "resolved": "https://registry.npmjs.org/@patternfly/react-tokens/-/react-tokens-4.94.6.tgz", - "integrity": "sha512-tm7C6nat+uKMr1hrapis7hS3rN9cr41tpcCKhx6cod6FLU8KwF2Yt5KUxakhIOCEcE/M/EhXhAw/qejp8w0r7Q==" + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@patternfly/react-tokens/-/react-tokens-5.0.1.tgz", + "integrity": "sha512-YafAGJYvxDP4GaQ0vMybalWmx7MJ+etUf1cGoaMh0wRD2eswltT/RckygtEBKR/M61qXbgG+CxKmMyY8leoiDw==" }, "node_modules/@pkgjs/parseargs": { "version": "0.11.0", @@ -2299,9 +2329,9 @@ } }, "node_modules/@redhat-cloud-services/eslint-config-redhat-cloud-services": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/@redhat-cloud-services/eslint-config-redhat-cloud-services/-/eslint-config-redhat-cloud-services-1.3.0.tgz", - "integrity": "sha512-/ceH7UeLMN+AoFdPDN0PeNgufiUKivU7wJ8ypqXINV1fKDVQf71mn48RjkdDCZ12/QHItHwaXFVpdnktBvRYHQ==", + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/@redhat-cloud-services/eslint-config-redhat-cloud-services/-/eslint-config-redhat-cloud-services-2.0.2.tgz", + "integrity": "sha512-cGTkfwGn5P8jVGvT3OCkkxxXwFnIXPmdoXO4ODJGfmTbq2Z84MplL5WdLWPwmXJmhapsQkVVv1PK0326riDn0w==", "dev": true, "dependencies": { "@babel/eslint-parser": "^7.19.1", @@ -2353,41 +2383,43 @@ } }, "node_modules/@redhat-cloud-services/frontend-components": { - "version": "3.11.8", - "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components/-/frontend-components-3.11.8.tgz", - "integrity": "sha512-zgBMLMxYOjRH66YGiRGJBhT6WatHiBWMNvZ/cStKdw6WxKBVCF5k4Bk2Bw8fi+xabc/RkR2PetqaUABOvtJuYA==", + "version": "4.0.8", + "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components/-/frontend-components-4.0.8.tgz", + "integrity": "sha512-ynJ//LipUaKeqbBQLpcwOn4hMDHrsIAAoQQMSz/8HFWlPKX/FecuwhBkGYRinMtKNSG1AIuO3VqQLS0HzZHaaQ==", "dependencies": { - "@redhat-cloud-services/frontend-components-utilities": "^3.2.25", + "@patternfly/react-component-groups": "^1.0.13", + "@redhat-cloud-services/frontend-components-utilities": "^4.0.0", "@redhat-cloud-services/types": "^0.0.24", "@scalprum/core": "^0.5.1", "@scalprum/react-core": "^0.5.1", "sanitize-html": "^2.7.2" }, "peerDependencies": { - "@patternfly/react-core": "^4.18.5", - "@patternfly/react-icons": "^4.53.16", - "@patternfly/react-table": "^4.5.7", + "@patternfly/react-core": "^5.0.0", + "@patternfly/react-icons": "^5.0.0", + "@patternfly/react-table": "^5.0.0", "classnames": "^2.2.5", "lodash": "^4.17.15", "prop-types": "^15.6.2", - "react": "^16.14.0 || ^17.0.0 || ^18.0.0", + "react": "^18.2.0", "react-content-loader": "^6.2.0", - "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^18.2.0", "react-redux": ">=7.0.0", "react-router-dom": "^5.0.0 || ^6.0.0" } }, "node_modules/@redhat-cloud-services/frontend-components-config": { - "version": "5.1.1", - "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components-config/-/frontend-components-config-5.1.1.tgz", - "integrity": "sha512-13vZTD06IO5TxSy+1+Y4flpReC45gJTOci3b1QmR5+HvWL5nY0pB7TmmGMWxr5JeVk45v3EYOlXzdLWQuy0pOw==", + "version": "6.0.4", + "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components-config/-/frontend-components-config-6.0.4.tgz", + "integrity": "sha512-Ft9OqrZp1KsOpV+HcwN3LUl16MTscpVgJRj9nqNc4dx3gardNK69t0+DRmqJpPmiMaKg1eXENSNPZCD6R1Mj4w==", "dev": true, "dependencies": { "@pmmmwh/react-refresh-webpack-plugin": "^0.5.8", - "@redhat-cloud-services/frontend-components-config-utilities": "^2.0.3", + "@redhat-cloud-services/frontend-components-config-utilities": "^3.0.1", + "@redhat-cloud-services/tsc-transform-imports": "^1.0.3", + "@swc/core": "^1.3.76", "assert": "^2.0.0", "axios": "^0.27.2", - "babel-loader": "^8.2.5", "browserify-zlib": "^0.2.0", "buffer": "^6.0.3", "chalk": "^4.1.2", @@ -2414,7 +2446,8 @@ "sass-loader": "^11.1.1", "source-map-loader": "^3.0.1", "stream-browserify": "^3.0.0", - "ts-loader": "^8.4.0", + "swc-loader": "^0.2.3", + "ts-loader": "^9.4.4", "url": "^0.11.0", "util": "^0.12.4", "webpack": "^5.88.0", @@ -2427,9 +2460,9 @@ } }, "node_modules/@redhat-cloud-services/frontend-components-config-utilities": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components-config-utilities/-/frontend-components-config-utilities-2.1.0.tgz", - "integrity": "sha512-RQcXn+0WEVzBk98XHHOA3SIatT7qw30h/7UW/oWAYfGGceXeE5/5IjdRIZmuUaNym9v24nv1F4M9+RTdvXrWPA==", + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components-config-utilities/-/frontend-components-config-utilities-3.0.3.tgz", + "integrity": "sha512-kDlBTea+XsU665+E5MK5U8vm7MdfbcgdnbKjnDJ1mZQB7f/oCAcP0YAvNHXeY4SXpCC+/pfI46lxmXezOC08iQ==", "dev": true, "dependencies": { "@openshift/dynamic-plugin-sdk-webpack": "^3.0.0", @@ -2600,20 +2633,20 @@ } }, "node_modules/@redhat-cloud-services/frontend-components-notifications": { - "version": "3.2.16", - "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components-notifications/-/frontend-components-notifications-3.2.16.tgz", - "integrity": "sha512-MpuUip15IPuRjZK+FePnVZespKJ/NpUbIimy5BKyE0JcvXS79nCMRvf6I9Xak+5R3fnsX+TStLC6vC2s5WkxRg==", + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components-notifications/-/frontend-components-notifications-4.0.2.tgz", + "integrity": "sha512-xivlLFmlAhn+WNwaKuHXXQhSeVW+EkuApAErhvYanC5SZ32H9cIzp4aF61ZoLv7A1pjTSu/QcZ+BxvfTKCNrUQ==", "dependencies": { - "@redhat-cloud-services/frontend-components": "*", - "@redhat-cloud-services/frontend-components-utilities": "*", + "@redhat-cloud-services/frontend-components": "^4.0.0", + "@redhat-cloud-services/frontend-components-utilities": "^4.0.0", "redux-promise-middleware": "6.1.3" }, "peerDependencies": { - "@patternfly/react-core": "^4.18.5", - "@patternfly/react-icons": "^4.3.5", + "@patternfly/react-core": "^5.0.0", + "@patternfly/react-icons": "^5.0.0", "prop-types": "^15.6.2", - "react": "^16.14.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0", + "react": "^18.2.0", + "react-dom": "^18.2.0", "react-redux": ">=7.2.9", "redux": ">=4.2.0" } @@ -2632,10 +2665,75 @@ "react-intl": "^6.4.4" } }, - "node_modules/@redhat-cloud-services/frontend-components-utilities": { + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/@patternfly/react-core": { + "version": "4.276.12", + "resolved": "https://registry.npmjs.org/@patternfly/react-core/-/react-core-4.276.12.tgz", + "integrity": "sha512-bBN2BMFhWjl/27zmTG5z3+6aH7XMO8our9nsaryxuzN5wFn6S8cIDILsw5NY7N8SLOOtmqbFJUgcM5GAn1ZAXg==", + "optional": true, + "peer": true, + "dependencies": { + "@patternfly/react-icons": "^4.93.7", + "@patternfly/react-styles": "^4.92.8", + "@patternfly/react-tokens": "^4.94.7", + "focus-trap": "6.9.2", + "react-dropzone": "9.0.0", + "tippy.js": "5.1.2", + "tslib": "^2.0.0" + }, + "peerDependencies": { + "react": "^16.8 || ^17 || ^18", + "react-dom": "^16.8 || ^17 || ^18" + } + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/@patternfly/react-icons": { + "version": "4.93.7", + "resolved": "https://registry.npmjs.org/@patternfly/react-icons/-/react-icons-4.93.7.tgz", + "integrity": "sha512-3kr35dgba7Qz5CSzmfH0rIjSvBC5xkmiknf3SvVUVxaiVA7KRowID8viYHeZlf3v/Oa3sEewaH830Q0t+nWsZQ==", + "optional": true, + "peer": true, + "peerDependencies": { + "react": "^16.8 || ^17 || ^18", + "react-dom": "^16.8 || ^17 || ^18" + } + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/@patternfly/react-styles": { + "version": "4.92.8", + "resolved": "https://registry.npmjs.org/@patternfly/react-styles/-/react-styles-4.92.8.tgz", + "integrity": "sha512-K4lUU8O4HiCX9NeuNUIrPgN3wlGERCxJVio+PAjd8hpJD/PKnjFfOJ9u6/Cii3qLy/5ZviWPRNHbGiwA/+YUhg==", + "optional": true, + "peer": true + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/@patternfly/react-table": { + "version": "4.113.4", + "resolved": "https://registry.npmjs.org/@patternfly/react-table/-/react-table-4.113.4.tgz", + "integrity": "sha512-WN00JBlJR8VVXpNH/IBmuTj70/Ww4vNQwB67mJ8yPzZ0refgAMqMGHCsp9yo5GImJhcBqQr4xlQNpHpeJIKphQ==", + "optional": true, + "peer": true, + "dependencies": { + "@patternfly/react-core": "^4.276.12", + "@patternfly/react-icons": "^4.93.7", + "@patternfly/react-styles": "^4.92.8", + "@patternfly/react-tokens": "^4.94.7", + "lodash": "^4.17.19", + "tslib": "^2.0.0" + }, + "peerDependencies": { + "react": "^16.8 || ^17 || ^18", + "react-dom": "^16.8 || ^17 || ^18" + } + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/@patternfly/react-tokens": { + "version": "4.94.7", + "resolved": "https://registry.npmjs.org/@patternfly/react-tokens/-/react-tokens-4.94.7.tgz", + "integrity": "sha512-h+ducOLDMSxcuec3+YY3x+stM5ZUSnrl/lC/eVmjypil2El08NuE2MNEPMQWdhrod6VRRZFMNqZw/m82iv6U1A==", + "optional": true, + "peer": true + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/@redhat-cloud-services/frontend-components-utilities": { "version": "3.7.6", "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components-utilities/-/frontend-components-utilities-3.7.6.tgz", "integrity": "sha512-qXevUW8Clj1AoBLwfZAmS+oFJCWKZaMp8O33cyUhkoGjrwkQaL5eJg28zjLVa1uQhdJAvAdwTNtE+Gt3hJTC1g==", + "optional": true, "dependencies": { "@redhat-cloud-services/types": "^0.0.24", "@sentry/browser": "^5.30.0", @@ -2656,6 +2754,102 @@ "react-router-dom": "^5.0.0 || ^6.0.0" } }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/attr-accept": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-1.1.3.tgz", + "integrity": "sha512-iT40nudw8zmCweivz6j58g+RT33I4KbaIvRUhjNmDwO2WmsQUxFEZZYZ5w3vXe5x5MX9D7mfvA/XaLOZYFR9EQ==", + "optional": true, + "peer": true, + "dependencies": { + "core-js": "^2.5.0" + }, + "engines": { + "node": ">=4" + } + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/axios": { + "version": "0.27.2", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", + "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==", + "optional": true, + "dependencies": { + "follow-redirects": "^1.14.9", + "form-data": "^4.0.0" + } + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/file-selector": { + "version": "0.1.19", + "resolved": "https://registry.npmjs.org/file-selector/-/file-selector-0.1.19.tgz", + "integrity": "sha512-kCWw3+Aai8Uox+5tHCNgMFaUdgidxvMnLWO6fM5sZ0hA2wlHP5/DHGF0ECe84BiB95qdJbKNEJhWKVDvMN+JDQ==", + "optional": true, + "peer": true, + "dependencies": { + "tslib": "^2.0.1" + }, + "engines": { + "node": ">= 10" + } + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/focus-trap": { + "version": "6.9.2", + "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-6.9.2.tgz", + "integrity": "sha512-gBEuXOPNOKPrLdZpMFUSTyIo1eT2NSZRrwZ9r/0Jqw5tmT3Yvxfmu8KBHw8xW2XQkw6E/JoG+OlEq7UDtSUNgw==", + "optional": true, + "peer": true, + "dependencies": { + "tabbable": "^5.3.2" + } + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/react-dropzone": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-9.0.0.tgz", + "integrity": "sha512-wZ2o9B2qkdE3RumWhfyZT9swgJYJPeU5qHEcMU8weYpmLex1eeWX0CC32/Y0VutB+BBi2D+iePV/YZIiB4kZGw==", + "optional": true, + "peer": true, + "dependencies": { + "attr-accept": "^1.1.3", + "file-selector": "^0.1.8", + "prop-types": "^15.6.2", + "prop-types-extra": "^1.1.0" + }, + "engines": { + "node": ">= 6" + }, + "peerDependencies": { + "react": ">=0.14.0" + } + }, + "node_modules/@redhat-cloud-services/frontend-components-translations/node_modules/tabbable": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-5.3.3.tgz", + "integrity": "sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA==", + "optional": true, + "peer": true + }, + "node_modules/@redhat-cloud-services/frontend-components-utilities": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/@redhat-cloud-services/frontend-components-utilities/-/frontend-components-utilities-4.0.2.tgz", + "integrity": "sha512-LUAaJwpi8EmyrNrGum53HcSpO0rrwvXkdEmaXjfooRlvVtLz8twsjaiM2jFfqWXbZMq43gQufn/wy8nquRoq6w==", + "dependencies": { + "@redhat-cloud-services/types": "^0.0.24", + "@sentry/browser": "^5.30.0", + "awesome-debounce-promise": "^2.1.0", + "axios": "^0.27.2", + "commander": "^2.20.3", + "mkdirp": "^1.0.4", + "react-content-loader": "^6.2.0" + }, + "peerDependencies": { + "@patternfly/react-core": "^5.0.0", + "@patternfly/react-table": "^5.0.0", + "@redhat-cloud-services/rbac-client": "^1.0.100", + "cypress": ">=12.0.0 < 14.0.0", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-redux": ">=7.0.0", + "react-router-dom": "^5.0.0 || ^6.0.0" + } + }, "node_modules/@redhat-cloud-services/frontend-components-utilities/node_modules/axios": { "version": "0.27.2", "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", @@ -2682,6 +2876,64 @@ "form-data": "^4.0.0" } }, + "node_modules/@redhat-cloud-services/tsc-transform-imports": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/@redhat-cloud-services/tsc-transform-imports/-/tsc-transform-imports-1.0.4.tgz", + "integrity": "sha512-5qI4QYSZqH4dSTfMqxLaVHGTRqocHVaXGGUK6JXei4/sP6ZMq3liJmLmnvXMe9gSziMVz0I8ij4wuKpB0FuC8A==", + "dev": true, + "dependencies": { + "glob": "10.3.3" + }, + "peerDependencies": { + "typescript": "^5.0.0" + } + }, + "node_modules/@redhat-cloud-services/tsc-transform-imports/node_modules/brace-expansion": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", + "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", + "dev": true, + "dependencies": { + "balanced-match": "^1.0.0" + } + }, + "node_modules/@redhat-cloud-services/tsc-transform-imports/node_modules/glob": { + "version": "10.3.3", + "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.3.tgz", + "integrity": "sha512-92vPiMb/iqpmEgsOoIDvTjc50wf9CCCvMzsi6W0JLPeUKE8TWP1a73PgqSrqy7iAZxaSD1YdzU7QZR5LF51MJw==", + "dev": true, + "dependencies": { + "foreground-child": "^3.1.0", + "jackspeak": "^2.0.3", + "minimatch": "^9.0.1", + "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0", + "path-scurry": "^1.10.1" + }, + "bin": { + "glob": "dist/cjs/src/bin.js" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/@redhat-cloud-services/tsc-transform-imports/node_modules/minimatch": { + "version": "9.0.3", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz", + "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==", + "dev": true, + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, "node_modules/@redhat-cloud-services/types": { "version": "0.0.24", "resolved": "https://registry.npmjs.org/@redhat-cloud-services/types/-/types-0.0.24.tgz", @@ -2880,6 +3132,203 @@ "@sinonjs/commons": "^3.0.0" } }, + "node_modules/@swc/core": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.3.83.tgz", + "integrity": "sha512-PccHDgGQlFjpExgJxH91qA3a4aifR+axCFJ4RieCoiI0m5gURE4nBhxzTBY5YU/YKTBmPO8Gc5Q6inE3+NquWg==", + "dev": true, + "hasInstallScript": true, + "dependencies": { + "@swc/types": "^0.1.4" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/swc" + }, + "optionalDependencies": { + "@swc/core-darwin-arm64": "1.3.83", + "@swc/core-darwin-x64": "1.3.83", + "@swc/core-linux-arm-gnueabihf": "1.3.83", + "@swc/core-linux-arm64-gnu": "1.3.83", + "@swc/core-linux-arm64-musl": "1.3.83", + "@swc/core-linux-x64-gnu": "1.3.83", + "@swc/core-linux-x64-musl": "1.3.83", + "@swc/core-win32-arm64-msvc": "1.3.83", + "@swc/core-win32-ia32-msvc": "1.3.83", + "@swc/core-win32-x64-msvc": "1.3.83" + }, + "peerDependencies": { + "@swc/helpers": "^0.5.0" + }, + "peerDependenciesMeta": { + "@swc/helpers": { + "optional": true + } + } + }, + "node_modules/@swc/core-darwin-arm64": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.3.83.tgz", + "integrity": "sha512-Plz2IKeveVLivbXTSCC3OZjD2MojyKYllhPrn9RotkDIZEFRYJZtW5/Ik1tJW/2rzu5HVKuGYrDKdScVVTbOxQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-darwin-x64": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.3.83.tgz", + "integrity": "sha512-FBGVg5IPF/8jQ6FbK60iDUHjv0H5+LwfpJHKH6wZnRaYWFtm7+pzYgreLu3NTsm3m7/1a7t0+7KURwBGUaJCCw==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-arm-gnueabihf": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.3.83.tgz", + "integrity": "sha512-EZcsuRYhGkzofXtzwDjuuBC/suiX9s7zeg2YYXOVjWwyebb6BUhB1yad3mcykFQ20rTLO9JUyIaiaMYDHGobqw==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-arm64-gnu": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.3.83.tgz", + "integrity": "sha512-khI41szLHrCD/cFOcN4p2SYvZgHjhhHlcMHz5BksRrDyteSJKu0qtWRZITVom0N/9jWoAleoFhMnFTUs0H8IWA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-arm64-musl": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.3.83.tgz", + "integrity": "sha512-zgT7yNOdbjHcGAwvys79mbfNLK65KBlPJWzeig+Yk7I8TVzmaQge7B6ZS/gwF9/p+8TiLYo/tZ5aF2lqlgdSVw==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-x64-gnu": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.3.83.tgz", + "integrity": "sha512-x+mH0Y3NC/G0YNlFmGi3vGD4VOm7IPDhh+tGrx6WtJp0BsShAbOpxtfU885rp1QweZe4qYoEmGqiEjE2WrPIdA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-x64-musl": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.3.83.tgz", + "integrity": "sha512-s5AYhAOmetUwUZwS5g9qb92IYgNHHBGiY2mTLImtEgpAeBwe0LPDj6WrujxCBuZnaS55mKRLLOuiMZE5TpjBNA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-win32-arm64-msvc": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.3.83.tgz", + "integrity": "sha512-yw2rd/KVOGs95lRRB+killLWNaO1dy4uVa8Q3/4wb5txlLru07W1m041fZLzwOg/1Sh0TMjJgGxj0XHGR3ZXhQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-win32-ia32-msvc": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.3.83.tgz", + "integrity": "sha512-POW+rgZ6KWqBpwPGIRd2/3pcf46P+UrKBm4HLt5IwbHvekJ4avIM8ixJa9kK0muJNVJcDpaZgxaU1ELxtJ1j8w==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-win32-x64-msvc": { + "version": "1.3.83", + "resolved": "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.3.83.tgz", + "integrity": "sha512-CiWQtkFnZElXQUalaHp+Wacw0Jd+24ncRYhqaJ9YKnEQP1H82CxIIuQqLM8IFaLpn5dpY6SgzaeubWF46hjcLA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=10" + } + }, "node_modules/@swc/helpers": { "version": "0.5.2", "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.2.tgz", @@ -2888,6 +3337,12 @@ "tslib": "^2.4.0" } }, + "node_modules/@swc/types": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/@swc/types/-/types-0.1.4.tgz", + "integrity": "sha512-z/G02d+59gyyUb7KYhKi9jOhicek6QD2oMaotUyG+lUkybpXoV49dY9bj7Ah5Q+y7knK2jU67UTX9FyfGzaxQg==", + "dev": true + }, "node_modules/@testing-library/dom": { "version": "9.3.1", "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.3.1.tgz", @@ -4715,12 +5170,9 @@ } }, "node_modules/attr-accept": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-1.1.3.tgz", - "integrity": "sha512-iT40nudw8zmCweivz6j58g+RT33I4KbaIvRUhjNmDwO2WmsQUxFEZZYZ5w3vXe5x5MX9D7mfvA/XaLOZYFR9EQ==", - "dependencies": { - "core-js": "^2.5.0" - }, + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-2.2.2.tgz", + "integrity": "sha512-7prDjvt9HmqiZ0cl5CRjtS84sEyhsHP2coDkaZKRKVfCDo9s7iw7ChVmar78Gu9pC4SoR/28wFu/G5JJhTnqEg==", "engines": { "node": ">=4" } @@ -4789,9 +5241,9 @@ "peer": true }, "node_modules/axe-core": { - "version": "4.8.0", - "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.8.0.tgz", - "integrity": "sha512-ZtlVZobOeDQhb/y2lMK6mznDw7TJHDNcKx5/bbBkFvArIQ5CVFhSI6hWWQnMx9I8cNmNmZ30wpDyOC2E2nvgbQ==", + "version": "4.8.1", + "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.8.1.tgz", + "integrity": "sha512-9l850jDDPnKq48nbad8SiEelCv4OrUWrKab/cPj0GScVg6cb6NbCCt/Ulk26QEq5jP9NnGr04Bit1BHyV6r5CQ==", "dev": true, "engines": { "node": ">=4" @@ -4907,43 +5359,6 @@ "node": ">=8" } }, - "node_modules/babel-loader": { - "version": "8.3.0", - "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-8.3.0.tgz", - "integrity": "sha512-H8SvsMF+m9t15HNLMipppzkC+Y2Yq+v3SonZyU70RBL/h1gxPkH08Ot8pEE9Z4Kd+czyWJClmFS8qzIP9OZ04Q==", - "dev": true, - "dependencies": { - "find-cache-dir": "^3.3.1", - "loader-utils": "^2.0.0", - "make-dir": "^3.1.0", - "schema-utils": "^2.6.5" - }, - "engines": { - "node": ">= 8.9" - }, - "peerDependencies": { - "@babel/core": "^7.0.0", - "webpack": ">=2" - } - }, - "node_modules/babel-loader/node_modules/schema-utils": { - "version": "2.7.1", - "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.1.tgz", - "integrity": "sha512-SHiNtMOUGWBQJwzISiVYKu82GiV4QYGePp3odlY1tuKO7gPtphAT5R/py0fA6xtbgLL/RvtJZnU9b8s0F1q0Xg==", - "dev": true, - "dependencies": { - "@types/json-schema": "^7.0.5", - "ajv": "^6.12.4", - "ajv-keywords": "^3.5.2" - }, - "engines": { - "node": ">= 8.9.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/webpack" - } - }, "node_modules/babel-plugin-istanbul": { "version": "6.1.1", "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-6.1.1.tgz", @@ -5940,12 +6355,6 @@ "node": ">=4.0.0" } }, - "node_modules/commondir": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz", - "integrity": "sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==", - "dev": true - }, "node_modules/compressible": { "version": "2.0.18", "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz", @@ -6293,7 +6702,9 @@ "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz", "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==", "deprecated": "core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.", - "hasInstallScript": true + "hasInstallScript": true, + "optional": true, + "peer": true }, "node_modules/core-js-pure": { "version": "3.32.2", @@ -6450,6 +6861,16 @@ "isobject": "^3.0.1" } }, + "node_modules/css-jss": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/css-jss/-/css-jss-10.10.0.tgz", + "integrity": "sha512-YyMIS/LsSKEGXEaVJdjonWe18p4vXLo8CMA4FrW/kcaEyqdIGKCFXao31gbJddXEdIxSXFFURWrenBJPlKTgAA==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "^10.10.0", + "jss-preset-default": "^10.10.0" + } + }, "node_modules/css-loader": { "version": "5.2.7", "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-5.2.7.tgz", @@ -6527,6 +6948,15 @@ "url": "https://github.com/sponsors/fb55" } }, + "node_modules/css-vendor": { + "version": "2.0.8", + "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz", + "integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==", + "dependencies": { + "@babel/runtime": "^7.8.3", + "is-in-browser": "^1.0.2" + } + }, "node_modules/css-what": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz", @@ -7679,26 +8109,16 @@ } }, "node_modules/enhanced-resolve": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.5.0.tgz", - "integrity": "sha512-Nv9m36S/vxpsI+Hc4/ZGRs0n9mXqSWGGq49zxb/cJfPAQMbUtttJAlNPS4AQzaBdw/pKskw5bMbekT/Y7W/Wlg==", + "version": "5.15.0", + "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.15.0.tgz", + "integrity": "sha512-LXYT42KJ7lpIKECr2mAXIaMldcNCh/7E0KBKOu4KSfkHmP+mZmSs+8V5gBAqisWBy0OO4W5Oyys0GO1Y8KtdKg==", "dev": true, "dependencies": { - "graceful-fs": "^4.1.2", - "memory-fs": "^0.5.0", - "tapable": "^1.0.0" + "graceful-fs": "^4.2.4", + "tapable": "^2.2.0" }, "engines": { - "node": ">=6.9.0" - } - }, - "node_modules/enhanced-resolve/node_modules/tapable": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/tapable/-/tapable-1.1.3.tgz", - "integrity": "sha512-4WK/bYZmj8xLr+HUCODHGF1ZFzsYffasLUgEiMBY4fgtltdO6B4WJtlSbPaDTLpYTcGVwM2qLnFTICEcNxs3kA==", - "dev": true, - "engines": { - "node": ">=6" + "node": ">=10.13.0" } }, "node_modules/enquirer": { @@ -7737,18 +8157,6 @@ "node": ">=4" } }, - "node_modules/errno": { - "version": "0.1.8", - "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.8.tgz", - "integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==", - "dev": true, - "dependencies": { - "prr": "~1.0.1" - }, - "bin": { - "errno": "cli.js" - } - }, "node_modules/error-ex": { "version": "1.3.2", "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz", @@ -9855,14 +10263,14 @@ } }, "node_modules/file-selector": { - "version": "0.1.19", - "resolved": "https://registry.npmjs.org/file-selector/-/file-selector-0.1.19.tgz", - "integrity": "sha512-kCWw3+Aai8Uox+5tHCNgMFaUdgidxvMnLWO6fM5sZ0hA2wlHP5/DHGF0ECe84BiB95qdJbKNEJhWKVDvMN+JDQ==", + "version": "0.6.0", + "resolved": "https://registry.npmjs.org/file-selector/-/file-selector-0.6.0.tgz", + "integrity": "sha512-QlZ5yJC0VxHxQQsQhXvBaC7VRJ2uaxTf+Tfpu4Z/OcVQJVpZO+DGU0rkoVW5ce2SccxugvpBJoMvUs59iILYdw==", "dependencies": { - "tslib": "^2.0.1" + "tslib": "^2.4.0" }, "engines": { - "node": ">= 10" + "node": ">= 12" } }, "node_modules/fill-range": { @@ -9904,29 +10312,12 @@ "ms": "2.0.0" } }, - "node_modules/finalhandler/node_modules/ms": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", - "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==", - "dev": true - }, - "node_modules/find-cache-dir": { - "version": "3.3.2", - "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-3.3.2.tgz", - "integrity": "sha512-wXZV5emFEjrridIgED11OoUKLxiYjAcqot/NJdAkOhlJ+vGzwhOAfcG5OX1jP+S0PcjEn8bdMJv+g2jwQ3Onig==", - "dev": true, - "dependencies": { - "commondir": "^1.0.1", - "make-dir": "^3.0.2", - "pkg-dir": "^4.1.0" - }, - "engines": { - "node": ">=8" - }, - "funding": { - "url": "https://github.com/avajs/find-cache-dir?sponsor=1" - } - }, + "node_modules/finalhandler/node_modules/ms": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==", + "dev": true + }, "node_modules/find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -9979,11 +10370,11 @@ "dev": true }, "node_modules/focus-trap": { - "version": "6.9.2", - "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-6.9.2.tgz", - "integrity": "sha512-gBEuXOPNOKPrLdZpMFUSTyIo1eT2NSZRrwZ9r/0Jqw5tmT3Yvxfmu8KBHw8xW2XQkw6E/JoG+OlEq7UDtSUNgw==", + "version": "7.4.3", + "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.4.3.tgz", + "integrity": "sha512-BgSSbK4GPnS2VbtZ50VtOv1Sti6DIkj3+LkVjiWMNjLeAp1SH1UlLx3ULu/DCu4vq5R4/uvTm+zrvsMsuYmGLg==", "dependencies": { - "tabbable": "^5.3.2" + "tabbable": "^6.1.2" } }, "node_modules/follow-redirects": { @@ -11064,8 +11455,7 @@ "node_modules/hyphenate-style-name": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz", - "integrity": "sha512-ygGZLjmXfPHj+ZWh6LwbC37l43MhfztxetbFCoYTM2VjkIUpeHgSNn7QIyVFj7YQ1Wl9Cbw5sholVJPzWvC2MQ==", - "dev": true + "integrity": "sha512-ygGZLjmXfPHj+ZWh6LwbC37l43MhfztxetbFCoYTM2VjkIUpeHgSNn7QIyVFj7YQ1Wl9Cbw5sholVJPzWvC2MQ==" }, "node_modules/iconv-lite": { "version": "0.4.24", @@ -11646,6 +12036,11 @@ "url": "https://github.com/sponsors/wooorm" } }, + "node_modules/is-in-browser": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz", + "integrity": "sha512-FeXIBgG/CPGd/WUxuEyvgGTEfwiG9Z4EKGxjNMRqviiIIfsmgrpnHLffEDdwUHqNva1VEW91o3xBT/m8Elgl9g==" + }, "node_modules/is-inside-container": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/is-inside-container/-/is-inside-container-1.0.0.tgz", @@ -12095,48 +12490,6 @@ "node": ">=8" } }, - "node_modules/istanbul-lib-report/node_modules/lru-cache": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", - "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==", - "dev": true, - "dependencies": { - "yallist": "^4.0.0" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/istanbul-lib-report/node_modules/make-dir": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz", - "integrity": "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==", - "dev": true, - "dependencies": { - "semver": "^7.5.3" - }, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/istanbul-lib-report/node_modules/semver": { - "version": "7.5.4", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", - "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "bin": { - "semver": "bin/semver.js" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/istanbul-lib-report/node_modules/supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", @@ -12149,12 +12502,6 @@ "node": ">=8" } }, - "node_modules/istanbul-lib-report/node_modules/yallist": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", - "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", - "dev": true - }, "node_modules/istanbul-lib-source-maps": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-4.0.1.tgz", @@ -14388,6 +14735,158 @@ "verror": "1.10.0" } }, + "node_modules/jss": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss/-/jss-10.10.0.tgz", + "integrity": "sha512-cqsOTS7jqPsPMjtKYDUpdFC0AbhYFLTcuGRqymgmdJIeQ8cH7+AgX7YSgQy79wXloZq2VvATYxUOUQEvS1V/Zw==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "csstype": "^3.0.2", + "is-in-browser": "^1.1.3", + "tiny-warning": "^1.0.2" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/jss" + } + }, + "node_modules/jss-plugin-camel-case": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.10.0.tgz", + "integrity": "sha512-z+HETfj5IYgFxh1wJnUAU8jByI48ED+v0fuTuhKrPR+pRBYS2EDwbusU8aFOpCdYhtRc9zhN+PJ7iNE8pAWyPw==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "hyphenate-style-name": "^1.0.3", + "jss": "10.10.0" + } + }, + "node_modules/jss-plugin-compose": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-compose/-/jss-plugin-compose-10.10.0.tgz", + "integrity": "sha512-F5kgtWpI2XfZ3Z8eP78tZEYFdgTIbpA/TMuX3a8vwrNolYtN1N4qJR/Ob0LAsqIwCMLojtxN7c7Oo/+Vz6THow==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0", + "tiny-warning": "^1.0.2" + } + }, + "node_modules/jss-plugin-default-unit": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.10.0.tgz", + "integrity": "sha512-SvpajxIECi4JDUbGLefvNckmI+c2VWmP43qnEy/0eiwzRUsafg5DVSIWSzZe4d2vFX1u9nRDP46WCFV/PXVBGQ==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0" + } + }, + "node_modules/jss-plugin-expand": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-expand/-/jss-plugin-expand-10.10.0.tgz", + "integrity": "sha512-ymT62W2OyDxBxr7A6JR87vVX9vTq2ep5jZLIdUSusfBIEENLdkkc0lL/Xaq8W9s3opUq7R0sZQpzRWELrfVYzA==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0" + } + }, + "node_modules/jss-plugin-extend": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-extend/-/jss-plugin-extend-10.10.0.tgz", + "integrity": "sha512-sKYrcMfr4xxigmIwqTjxNcHwXJIfvhvjTNxF+Tbc1NmNdyspGW47Ey6sGH8BcQ4FFQhLXctpWCQSpDwdNmXSwg==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0", + "tiny-warning": "^1.0.2" + } + }, + "node_modules/jss-plugin-global": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.10.0.tgz", + "integrity": "sha512-icXEYbMufiNuWfuazLeN+BNJO16Ge88OcXU5ZDC2vLqElmMybA31Wi7lZ3lf+vgufRocvPj8443irhYRgWxP+A==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0" + } + }, + "node_modules/jss-plugin-nested": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.10.0.tgz", + "integrity": "sha512-9R4JHxxGgiZhurDo3q7LdIiDEgtA1bTGzAbhSPyIOWb7ZubrjQe8acwhEQ6OEKydzpl8XHMtTnEwHXCARLYqYA==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0", + "tiny-warning": "^1.0.2" + } + }, + "node_modules/jss-plugin-props-sort": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.10.0.tgz", + "integrity": "sha512-5VNJvQJbnq/vRfje6uZLe/FyaOpzP/IH1LP+0fr88QamVrGJa0hpRRyAa0ea4U/3LcorJfBFVyC4yN2QC73lJg==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0" + } + }, + "node_modules/jss-plugin-rule-value-function": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.10.0.tgz", + "integrity": "sha512-uEFJFgaCtkXeIPgki8ICw3Y7VMkL9GEan6SqmT9tqpwM+/t+hxfMUdU4wQ0MtOiMNWhwnckBV0IebrKcZM9C0g==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0", + "tiny-warning": "^1.0.2" + } + }, + "node_modules/jss-plugin-rule-value-observable": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-observable/-/jss-plugin-rule-value-observable-10.10.0.tgz", + "integrity": "sha512-ZLMaYrR3QE+vD7nl3oNXuj79VZl9Kp8/u6A1IbTPDcuOu8b56cFdWRZNZ0vNr8jHewooEeq2doy8Oxtymr2ZPA==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0", + "symbol-observable": "^1.2.0" + } + }, + "node_modules/jss-plugin-template": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-template/-/jss-plugin-template-10.10.0.tgz", + "integrity": "sha512-ocXZBIOJOA+jISPdsgkTs8wwpK6UbsvtZK5JI7VUggTD6LWKbtoxUzadd2TpfF+lEtlhUmMsCkTRNkITdPKa6w==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0", + "tiny-warning": "^1.0.2" + } + }, + "node_modules/jss-plugin-vendor-prefixer": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.10.0.tgz", + "integrity": "sha512-UY/41WumgjW8r1qMCO8l1ARg7NHnfRVWRhZ2E2m0DMYsr2DD91qIXLyNhiX83hHswR7Wm4D+oDYNC1zWCJWtqg==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "css-vendor": "^2.0.8", + "jss": "10.10.0" + } + }, + "node_modules/jss-preset-default": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/jss-preset-default/-/jss-preset-default-10.10.0.tgz", + "integrity": "sha512-GL175Wt2FGhjE+f+Y3aWh+JioL06/QWFgZp53CbNNq6ZkVU0TDplD8Bxm9KnkotAYn3FlplNqoW5CjyLXcoJ7Q==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "jss": "10.10.0", + "jss-plugin-camel-case": "10.10.0", + "jss-plugin-compose": "10.10.0", + "jss-plugin-default-unit": "10.10.0", + "jss-plugin-expand": "10.10.0", + "jss-plugin-extend": "10.10.0", + "jss-plugin-global": "10.10.0", + "jss-plugin-nested": "10.10.0", + "jss-plugin-props-sort": "10.10.0", + "jss-plugin-rule-value-function": "10.10.0", + "jss-plugin-rule-value-observable": "10.10.0", + "jss-plugin-template": "10.10.0", + "jss-plugin-vendor-prefixer": "10.10.0" + } + }, "node_modules/jsx-ast-utils": { "version": "3.3.5", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz", @@ -14954,20 +15453,53 @@ } }, "node_modules/make-dir": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz", - "integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz", + "integrity": "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==", "dev": true, "dependencies": { - "semver": "^6.0.0" + "semver": "^7.5.3" }, "engines": { - "node": ">=8" + "node": ">=10" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/make-dir/node_modules/lru-cache": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", + "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==", + "dev": true, + "dependencies": { + "yallist": "^4.0.0" + }, + "engines": { + "node": ">=10" + } + }, + "node_modules/make-dir/node_modules/semver": { + "version": "7.5.4", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", + "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", + "dev": true, + "dependencies": { + "lru-cache": "^6.0.0" + }, + "bin": { + "semver": "bin/semver.js" + }, + "engines": { + "node": ">=10" + } + }, + "node_modules/make-dir/node_modules/yallist": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", + "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", + "dev": true + }, "node_modules/makeerror": { "version": "1.0.12", "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.12.tgz", @@ -15025,55 +15557,6 @@ "node": ">= 4.0.0" } }, - "node_modules/memory-fs": { - "version": "0.5.0", - "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.5.0.tgz", - "integrity": "sha512-jA0rdU5KoQMC0e6ppoNRtpp6vjFq6+NY7r8hywnC7V+1Xj/MtHwGIbB1QaK/dunyjWteJzmkpd7ooeWg10T7GA==", - "dev": true, - "dependencies": { - "errno": "^0.1.3", - "readable-stream": "^2.0.1" - }, - "engines": { - "node": ">=4.3.0 <5.0.0 || >=5.10" - } - }, - "node_modules/memory-fs/node_modules/isarray": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", - "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==", - "dev": true - }, - "node_modules/memory-fs/node_modules/readable-stream": { - "version": "2.3.8", - "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz", - "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==", - "dev": true, - "dependencies": { - "core-util-is": "~1.0.0", - "inherits": "~2.0.3", - "isarray": "~1.0.0", - "process-nextick-args": "~2.0.0", - "safe-buffer": "~5.1.1", - "string_decoder": "~1.1.1", - "util-deprecate": "~1.0.1" - } - }, - "node_modules/memory-fs/node_modules/safe-buffer": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", - "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", - "dev": true - }, - "node_modules/memory-fs/node_modules/string_decoder": { - "version": "1.1.1", - "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", - "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", - "dev": true, - "dependencies": { - "safe-buffer": "~5.1.0" - } - }, "node_modules/memorystream": { "version": "0.3.1", "resolved": "https://registry.npmjs.org/memorystream/-/memorystream-0.3.1.tgz", @@ -16339,6 +16822,8 @@ "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==", "deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1", + "optional": true, + "peer": true, "funding": { "type": "opencollective", "url": "https://opencollective.com/popperjs" @@ -16655,12 +17140,6 @@ "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" }, - "node_modules/prr": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz", - "integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==", - "dev": true - }, "node_modules/psl": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", @@ -16823,6 +17302,11 @@ "react": ">=16.0.0" } }, + "node_modules/react-display-name": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/react-display-name/-/react-display-name-0.2.5.tgz", + "integrity": "sha512-I+vcaK9t4+kypiSgaiVWAipqHRXYmZIuAiS8vzFvXHHXVigg/sMKwlRgLy6LH2i3rmP+0Vzfl5lFsFRwF1r3pg==" + }, "node_modules/react-dom": { "version": "18.2.0", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", @@ -16836,20 +17320,19 @@ } }, "node_modules/react-dropzone": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-9.0.0.tgz", - "integrity": "sha512-wZ2o9B2qkdE3RumWhfyZT9swgJYJPeU5qHEcMU8weYpmLex1eeWX0CC32/Y0VutB+BBi2D+iePV/YZIiB4kZGw==", + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-14.2.3.tgz", + "integrity": "sha512-O3om8I+PkFKbxCukfIR3QAGftYXDZfOE2N1mr/7qebQJHs7U+/RSL/9xomJNpRg9kM5h9soQSdf0Gc7OHF5Fug==", "dependencies": { - "attr-accept": "^1.1.3", - "file-selector": "^0.1.8", - "prop-types": "^15.6.2", - "prop-types-extra": "^1.1.0" + "attr-accept": "^2.2.2", + "file-selector": "^0.6.0", + "prop-types": "^15.8.1" }, "engines": { - "node": ">= 6" + "node": ">= 10.13" }, "peerDependencies": { - "react": ">=0.14.0" + "react": ">= 16.8 || 18.0.0" } }, "node_modules/react-fast-compare": { @@ -16888,6 +17371,27 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, + "node_modules/react-jss": { + "version": "10.10.0", + "resolved": "https://registry.npmjs.org/react-jss/-/react-jss-10.10.0.tgz", + "integrity": "sha512-WLiq84UYWqNBF6579/uprcIUnM1TSywYq6AIjKTTTG5ziJl9Uy+pwuvpN3apuyVwflMbD60PraeTKT7uWH9XEQ==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "@emotion/is-prop-valid": "^0.7.3", + "css-jss": "10.10.0", + "hoist-non-react-statics": "^3.2.0", + "is-in-browser": "^1.1.3", + "jss": "10.10.0", + "jss-preset-default": "10.10.0", + "prop-types": "^15.6.0", + "shallow-equal": "^1.2.0", + "theming": "^3.3.0", + "tiny-warning": "^1.0.2" + }, + "peerDependencies": { + "react": ">=16.8.6" + } + }, "node_modules/react-lifecycles-compat": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", @@ -17885,6 +18389,11 @@ "node": ">=8" } }, + "node_modules/shallow-equal": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/shallow-equal/-/shallow-equal-1.2.1.tgz", + "integrity": "sha512-S4vJDjHHMBaiZuT9NPb616CSmLf618jawtv3sufLl6ivK8WocjAo58cXwbRV1cgqxH0Qbv+iUt6m05eqEa2IRA==" + }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -18469,6 +18978,24 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/swc-loader": { + "version": "0.2.3", + "resolved": "https://registry.npmjs.org/swc-loader/-/swc-loader-0.2.3.tgz", + "integrity": "sha512-D1p6XXURfSPleZZA/Lipb3A8pZ17fP4NObZvFCDjK/OKljroqDpPmsBdTraWhVBqUNpcWBQY1imWdoPScRlQ7A==", + "dev": true, + "peerDependencies": { + "@swc/core": "^1.2.147", + "webpack": ">=2" + } + }, + "node_modules/symbol-observable": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz", + "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/symbol-tree": { "version": "3.2.4", "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz", @@ -18498,9 +19025,9 @@ } }, "node_modules/tabbable": { - "version": "5.3.3", - "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-5.3.3.tgz", - "integrity": "sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA==" + "version": "6.2.0", + "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz", + "integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==" }, "node_modules/tapable": { "version": "2.2.1", @@ -18640,6 +19167,23 @@ "integrity": "sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==", "dev": true }, + "node_modules/theming": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/theming/-/theming-3.3.0.tgz", + "integrity": "sha512-u6l4qTJRDaWZsqa8JugaNt7Xd8PPl9+gonZaIe28vAhqgHMIG/DOyFPqiKN/gQLQYj05tHv+YQdNILL4zoiAVA==", + "dependencies": { + "hoist-non-react-statics": "^3.3.0", + "prop-types": "^15.5.8", + "react-display-name": "^0.2.4", + "tiny-warning": "^1.0.2" + }, + "engines": { + "node": ">=8" + }, + "peerDependencies": { + "react": ">=16.3" + } + }, "node_modules/throttleit": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz", @@ -18662,10 +19206,17 @@ "resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz", "integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==" }, + "node_modules/tiny-warning": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz", + "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" + }, "node_modules/tippy.js": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/tippy.js/-/tippy.js-5.1.2.tgz", "integrity": "sha512-Qtrv2wqbRbaKMUb6bWWBQWPayvcDKNrGlvihxtsyowhT7RLGEh1STWuy6EMXC6QLkfKPB2MLnf8W2mzql9VDAw==", + "optional": true, + "peer": true, "dependencies": { "popper.js": "^1.16.0" } @@ -18815,23 +19366,22 @@ } }, "node_modules/ts-loader": { - "version": "8.4.0", - "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-8.4.0.tgz", - "integrity": "sha512-6nFY3IZ2//mrPc+ImY3hNWx1vCHyEhl6V+wLmL4CZcm6g1CqX7UKrkc6y0i4FwcfOhxyMPCfaEvh20f4r9GNpw==", + "version": "9.4.4", + "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-9.4.4.tgz", + "integrity": "sha512-MLukxDHBl8OJ5Dk3y69IsKVFRA/6MwzEqBgh+OXMPB/OD01KQuWPFd1WAQP8a5PeSCAxfnkhiuWqfmFJzJQt9w==", "dev": true, "dependencies": { "chalk": "^4.1.0", - "enhanced-resolve": "^4.0.0", - "loader-utils": "^2.0.0", + "enhanced-resolve": "^5.0.0", "micromatch": "^4.0.0", "semver": "^7.3.4" }, "engines": { - "node": ">=10.0.0" + "node": ">=12.0.0" }, "peerDependencies": { "typescript": "*", - "webpack": "*" + "webpack": "^5.0.0" } }, "node_modules/ts-loader/node_modules/ansi-styles": { @@ -19571,6 +20121,20 @@ "react": ">=16.6.0" } }, + "node_modules/victory-box-plot": { + "version": "36.6.11", + "resolved": "https://registry.npmjs.org/victory-box-plot/-/victory-box-plot-36.6.11.tgz", + "integrity": "sha512-+J7Hb0Vf6cQe+qZyRhm6sM7V7AMS43jSTXnrFtRP7Bn+HdAb7p2S7h8abtgUhg3uVeTQa9UUqJBmC/maP8V3Nw==", + "dependencies": { + "lodash": "^4.17.19", + "prop-types": "^15.8.1", + "victory-core": "^36.6.11", + "victory-vendor": "^36.6.11" + }, + "peerDependencies": { + "react": ">=16.6.0" + } + }, "node_modules/victory-brush-container": { "version": "36.6.11", "resolved": "https://registry.npmjs.org/victory-brush-container/-/victory-brush-container-36.6.11.tgz", @@ -20352,19 +20916,6 @@ "node": ">=10.13.0" } }, - "node_modules/webpack/node_modules/enhanced-resolve": { - "version": "5.15.0", - "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.15.0.tgz", - "integrity": "sha512-LXYT42KJ7lpIKECr2mAXIaMldcNCh/7E0KBKOu4KSfkHmP+mZmSs+8V5gBAqisWBy0OO4W5Oyys0GO1Y8KtdKg==", - "dev": true, - "dependencies": { - "graceful-fs": "^4.2.4", - "tapable": "^2.2.0" - }, - "engines": { - "node": ">=10.13.0" - } - }, "node_modules/websocket-driver": { "version": "0.7.4", "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz", diff --git a/package.json b/package.json index 9b6609fc3d..567747b0b8 100644 --- a/package.json +++ b/package.json @@ -19,13 +19,15 @@ "check:milestone": "npx npm-check-updates -t newest -f '/^(@patternfly|@redhat-cloud-services)/'", "check:milestone:update": "npx npm-check-updates -t newest -f '/^(@patternfly|@redhat-cloud-services)/' -u", "clean": "rimraf dist .cache", + "codemods": "npx @patternfly/pf-codemods@latest src", "deploy": "npm-run-all build lint test", "install:pkgs": "npm install", + "install:pkgs:force": "npm install --force", "lint": "npm-run-all lint:*", "lint:ts": "eslint src", "lint:ts:fix": "eslint src --fix", "patch:hosts": "fec patch-etc-hosts", - "postinstall": "rm -rf .cache", + "postinstall": "ts-patch install && rm -rf .cache", "start": "HMR=true fec dev", "start:csc": "CLOUD_SERVICES_CONFIG_PORT=8889 npm start", "start:ephemeral": "EPHEMERAL_PORT=8000 npm start", @@ -45,17 +47,16 @@ "verify": "npm-run-all build lint test" }, "dependencies": { - "@patternfly/patternfly": "4.224.2", - "@patternfly/react-charts": "6.94.19", - "@patternfly/react-core": "4.276.8", - "@patternfly/react-icons": "4.93.6", - "@patternfly/react-styles": "4.92.6", - "@patternfly/react-table": "4.113.0", - "@patternfly/react-tokens": "4.94.6", - "@redhat-cloud-services/frontend-components": "^3.11.5", - "@redhat-cloud-services/frontend-components-notifications": "^3.2.16", + "@patternfly/patternfly": "5.0.4", + "@patternfly/react-charts": "7.0.1", + "@patternfly/react-core": "5.0.1", + "@patternfly/react-icons": "5.0.1", + "@patternfly/react-table": "5.0.1", + "@patternfly/react-tokens": "5.0.1", + "@redhat-cloud-services/frontend-components": "^4.0.8", + "@redhat-cloud-services/frontend-components-notifications": "^4.0.2", "@redhat-cloud-services/frontend-components-translations": "^3.2.7", - "@redhat-cloud-services/frontend-components-utilities": "^3.7.6", + "@redhat-cloud-services/frontend-components-utilities": "^4.0.2", "@redhat-cloud-services/rbac-client": "^1.2.8", "@unleash/proxy-client-react": "^3.6.0", "axios": "^1.5.0", @@ -78,8 +79,9 @@ }, "devDependencies": { "@formatjs/cli": "^6.1.5", - "@redhat-cloud-services/eslint-config-redhat-cloud-services": "^1.3.0", - "@redhat-cloud-services/frontend-components-config": "^5.1.1", + "@redhat-cloud-services/eslint-config-redhat-cloud-services": "^2.0.2", + "@redhat-cloud-services/frontend-components-config": "^6.0.4", + "@redhat-cloud-services/tsc-transform-imports": "^1.0.4", "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.4.3", "@types/jest": "^29.5.4", diff --git a/src/components/drawers/exports/exportActions.tsx b/src/components/drawers/exports/exportActions.tsx index 308771e97d..03e80819bb 100644 --- a/src/components/drawers/exports/exportActions.tsx +++ b/src/components/drawers/exports/exportActions.tsx @@ -1,4 +1,4 @@ -import { Dropdown, DropdownItem, KebabToggle } from '@patternfly/react-core'; +import { Dropdown, DropdownItem, KebabToggle } from '@patternfly/react-core/deprecated'; import messages from 'locales/messages'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -61,7 +61,7 @@ class ExportsActionsBase extends React.Component } + toggle={ this.handleOnToggle(isOpen)} />} isOpen={isDropdownOpen} isPlain position="right" diff --git a/src/components/drawers/exports/exportsContent.tsx b/src/components/drawers/exports/exportsContent.tsx index e6ea9c8257..9df5e1bec6 100644 --- a/src/components/drawers/exports/exportsContent.tsx +++ b/src/components/drawers/exports/exportsContent.tsx @@ -82,7 +82,7 @@ class ExportsContentBase extends React.Component { // @redhat-cloud-services/frontend-components-notifications does not expose PatternFly's actionLinks prop if (isActionLink) { return ( -
+
{intl.formatMessage(messages.exportsTitle)}
); diff --git a/src/components/drawers/exports/exportsTable.tsx b/src/components/drawers/exports/exportsTable.tsx index aabbba3608..1c879327b1 100644 --- a/src/components/drawers/exports/exportsTable.tsx +++ b/src/components/drawers/exports/exportsTable.tsx @@ -4,19 +4,20 @@ import { ButtonVariant, EmptyState, EmptyStateBody, + EmptyStateFooter, + EmptyStateHeader, EmptyStateIcon, Label, Popover, Spinner, - Title, - TitleSizes, } from '@patternfly/react-core'; import { DownloadIcon } from '@patternfly/react-icons/dist/esm/icons/download-icon'; import { ExclamationCircleIcon } from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon'; import { OutlinedClockIcon } from '@patternfly/react-icons/dist/esm/icons/outlined-clock-icon'; import { PlusCircleIcon } from '@patternfly/react-icons/dist/esm/icons/plus-circle-icon'; import { SyncIcon } from '@patternfly/react-icons/dist/esm/icons/sync-icon'; -import { sortable, SortByDirection, Table, TableBody, TableHeader, TableVariant } from '@patternfly/react-table'; +import { sortable, SortByDirection, TableVariant } from '@patternfly/react-table'; +import { Table, TableBody, TableHeader } from '@patternfly/react-table/deprecated'; import type { Query } from 'api/queries/query'; import { getQuery } from 'api/queries/query'; import type { Report } from 'api/reports/report'; @@ -169,14 +170,17 @@ class ExportsTableBase extends React.Component - - - {intl.formatMessage(messages.noExportsStateTitle)} - + {intl.formatMessage(messages.noExportsStateTitle)}} + icon={} + headingLevel="h5" + /> {intl.formatMessage(messages.exportsEmptyState)} - + + + ); }; diff --git a/src/components/drawers/optimzations/optimizations.scss b/src/components/drawers/optimzations/optimizations.scss index fea98da1d8..91ae5bbaf6 100644 --- a/src/components/drawers/optimzations/optimizations.scss +++ b/src/components/drawers/optimzations/optimizations.scss @@ -4,13 +4,13 @@ div { display: block; margin-right: 0; - margin-bottom: var(--pf-global--spacer--xs); + margin-bottom: var(--pf-v5-global--spacer--xs); &.iconOverride { &.decrease { - // color: var(--pf-global--success-color--100); + // color: var(--pf-v5-global--success-color--100); } &.increase { - // color: var(--pf-global--danger-color--100); + // color: var(--pf-v5-global--danger-color--100); } .fa-equals { margin-left: 25px; @@ -27,10 +27,10 @@ top: -3px; } .fa-sort-up::before { - // color: var(--pf-global--danger-color--100); + // color: var(--pf-v5-global--danger-color--100); } .fa-sort-down::before { - // color: var(--pf-global--success-color--100); + // color: var(--pf-v5-global--success-color--100); } span { margin-right: -17px !important; diff --git a/src/components/drawers/optimzations/optimizationsContent.tsx b/src/components/drawers/optimzations/optimizationsContent.tsx index 30cc66403a..fb673705fb 100644 --- a/src/components/drawers/optimzations/optimizationsContent.tsx +++ b/src/components/drawers/optimzations/optimizationsContent.tsx @@ -13,7 +13,7 @@ import { TextListVariants, } from '@patternfly/react-core'; import { ExclamationTriangleIcon } from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon'; -import { TableComposable, TableVariant, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table'; +import { Table, TableVariant, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table'; import type { RecommendationItem, RecommendationReportData } from 'api/ros/recommendations'; import { RosPathsType, RosType } from 'api/ros/ros'; import type { AxiosError } from 'axios'; @@ -265,10 +265,9 @@ class OptimizationsContentBase extends React.Component @@ -313,7 +312,7 @@ class OptimizationsContentBase extends React.Component{this.getChangeValue(memVariation, memVariationUnits)} - + ); }; @@ -377,10 +376,9 @@ class OptimizationsContentBase extends React.Component @@ -425,7 +423,7 @@ class OptimizationsContentBase extends React.Component{this.getChangeValue(memVariation, memVariationUnits)} - + ); }; diff --git a/src/components/drawers/optimzations/optimizationsLink.tsx b/src/components/drawers/optimzations/optimizationsLink.tsx index f9dac93876..b2f98d5e72 100644 --- a/src/components/drawers/optimzations/optimizationsLink.tsx +++ b/src/components/drawers/optimzations/optimizationsLink.tsx @@ -111,11 +111,7 @@ class OptimizationsLinkBase extends React.Component ); if (isDisabled) { - return ( - - {buttonComponent} - - ); + return {buttonComponent}; } return buttonComponent; } diff --git a/src/components/inactiveSources/inactiveSources.scss b/src/components/inactiveSources/inactiveSources.scss index 242012ffad..b46cf0a92e 100644 --- a/src/components/inactiveSources/inactiveSources.scss +++ b/src/components/inactiveSources/inactiveSources.scss @@ -1,8 +1,8 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .alert { - background-color: var(--pf-global--BackgroundColor--light-100); - padding-left: var(--pf-global--spacer--lg); - padding-right: var(--pf-global--spacer--lg); - padding-top: var(--pf-global--spacer--lg); + background-color: var(--pf-v5-global--BackgroundColor--light-100); + padding-left: var(--pf-v5-global--spacer--lg); + padding-right: var(--pf-v5-global--spacer--lg); + padding-top: var(--pf-v5-global--spacer--lg); } diff --git a/src/routes/components/charts/chartTheme/theme-utils.ts b/src/routes/components/charts/chartTheme/theme-utils.ts index a496be99f2..e8df95739f 100644 --- a/src/routes/components/charts/chartTheme/theme-utils.ts +++ b/src/routes/components/charts/chartTheme/theme-utils.ts @@ -3,6 +3,6 @@ import { ChartThemeColor, getCustomTheme } from '@patternfly/react-charts'; import { default as ChartTheme } from './theme-koku'; // Applies theme color and variant to base theme -const getTheme = () => getCustomTheme(ChartThemeColor.default, null, ChartTheme); +const getTheme = () => getCustomTheme(ChartThemeColor.default, ChartTheme); export default getTheme; diff --git a/src/routes/components/charts/historicalCostChart/__snapshots__/historicalCostChart.test.tsx.snap b/src/routes/components/charts/historicalCostChart/__snapshots__/historicalCostChart.test.tsx.snap index 6401aa7c68..4bc66bb906 100644 --- a/src/routes/components/charts/historicalCostChart/__snapshots__/historicalCostChart.test.tsx.snap +++ b/src/routes/components/charts/historicalCostChart/__snapshots__/historicalCostChart.test.tsx.snap @@ -6,9 +6,9 @@ exports[`null previous and current reports are handled 1`] = ` class="chartOverride" >

@@ -22,7 +22,7 @@ exports[`null previous and current reports are handled 1`] = ` style="height: 100px; width: 0px;" >
@@ -139,7 +139,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -160,7 +160,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -181,7 +181,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -196,7 +196,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -234,7 +234,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -255,7 +255,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -276,7 +276,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -297,7 +297,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -318,7 +318,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -368,7 +368,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -385,7 +385,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -417,9 +417,9 @@ exports[`reports are formatted to datums 1`] = ` class="chartOverride" >

@@ -433,7 +433,7 @@ exports[`reports are formatted to datums 1`] = ` style="height: 100px; width: 0px;" >
@@ -550,7 +550,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -571,7 +571,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -592,7 +592,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -607,7 +607,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -645,7 +645,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -666,7 +666,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -687,7 +687,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -737,7 +737,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -754,7 +754,7 @@ exports[`reports are formatted to datums 1`] = ` diff --git a/src/routes/components/charts/historicalCostChart/historicalCostChart.tsx b/src/routes/components/charts/historicalCostChart/historicalCostChart.tsx index c0eaf79698..392697493a 100644 --- a/src/routes/components/charts/historicalCostChart/historicalCostChart.tsx +++ b/src/routes/components/charts/historicalCostChart/historicalCostChart.tsx @@ -16,8 +16,7 @@ import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; import { injectIntl } from 'react-intl'; import { default as ChartTheme } from 'routes/components/charts/chartTheme'; -import { getCostRangeString, getCostRangeTooltip } from 'routes/components/charts/common/chartDatum'; -import { getDateRange } from 'routes/components/charts/common/chartDatum'; +import { getCostRangeString, getCostRangeTooltip, getDateRange } from 'routes/components/charts/common/chartDatum'; import type { ChartSeries } from 'routes/components/charts/common/chartUtils'; import { getChartNames, diff --git a/src/routes/components/charts/historicalTrendChart/__snapshots__/historicalTrendChart.test.tsx.snap b/src/routes/components/charts/historicalTrendChart/__snapshots__/historicalTrendChart.test.tsx.snap index 97fffa9ec6..91c0fbe30f 100644 --- a/src/routes/components/charts/historicalTrendChart/__snapshots__/historicalTrendChart.test.tsx.snap +++ b/src/routes/components/charts/historicalTrendChart/__snapshots__/historicalTrendChart.test.tsx.snap @@ -5,9 +5,9 @@ exports[`null previous and current reports are handled 1`] = ` class="chartOverride" >

@@ -21,7 +21,7 @@ exports[`null previous and current reports are handled 1`] = ` style="height: 100px; width: 0px;" >
@@ -142,7 +142,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -163,7 +163,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -178,7 +178,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -219,7 +219,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -240,7 +240,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -261,7 +261,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -282,7 +282,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -332,7 +332,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -349,7 +349,7 @@ exports[`null previous and current reports are handled 1`] = ` @@ -379,9 +379,9 @@ exports[`reports are formatted to datums 1`] = ` class="chartOverride" >

@@ -395,7 +395,7 @@ exports[`reports are formatted to datums 1`] = ` style="height: 100px; width: 0px;" >
@@ -516,7 +516,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -537,7 +537,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -552,7 +552,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -593,7 +593,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -614,7 +614,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -635,7 +635,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -685,7 +685,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -702,7 +702,7 @@ exports[`reports are formatted to datums 1`] = ` diff --git a/src/routes/components/charts/historicalUsageChart/__snapshots__/historicalUsageChart.test.tsx.snap b/src/routes/components/charts/historicalUsageChart/__snapshots__/historicalUsageChart.test.tsx.snap index 15de8cfb3f..6f07f85bae 100644 --- a/src/routes/components/charts/historicalUsageChart/__snapshots__/historicalUsageChart.test.tsx.snap +++ b/src/routes/components/charts/historicalUsageChart/__snapshots__/historicalUsageChart.test.tsx.snap @@ -5,9 +5,9 @@ exports[`reports are formatted to datums 1`] = ` class="chartOverride" >

@@ -21,7 +21,7 @@ exports[`reports are formatted to datums 1`] = ` style="height: 100px; width: 0px;" >
@@ -266,7 +266,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -287,7 +287,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -302,7 +302,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -343,7 +343,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -364,7 +364,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -385,7 +385,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -495,7 +495,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -512,7 +512,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -529,7 +529,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -546,7 +546,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -563,7 +563,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -580,7 +580,7 @@ exports[`reports are formatted to datums 1`] = ` diff --git a/src/routes/components/charts/historicalUsageChart/historicalUsageChart.tsx b/src/routes/components/charts/historicalUsageChart/historicalUsageChart.tsx index f01c567ca0..e89bb92435 100644 --- a/src/routes/components/charts/historicalUsageChart/historicalUsageChart.tsx +++ b/src/routes/components/charts/historicalUsageChart/historicalUsageChart.tsx @@ -16,8 +16,7 @@ import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; import { injectIntl } from 'react-intl'; import { default as ChartTheme } from 'routes/components/charts/chartTheme'; -import { getDateRange, getUsageRangeTooltip } from 'routes/components/charts/common/chartDatum'; -import { getUsageRangeString } from 'routes/components/charts/common/chartDatum'; +import { getDateRange, getUsageRangeString, getUsageRangeTooltip } from 'routes/components/charts/common/chartDatum'; import type { ChartSeries } from 'routes/components/charts/common/chartUtils'; import { getChartNames, diff --git a/src/routes/components/charts/trendChart/__snapshots__/trendChart.test.tsx.snap b/src/routes/components/charts/trendChart/__snapshots__/trendChart.test.tsx.snap index caccd3d0be..7a5992bc87 100644 --- a/src/routes/components/charts/trendChart/__snapshots__/trendChart.test.tsx.snap +++ b/src/routes/components/charts/trendChart/__snapshots__/trendChart.test.tsx.snap @@ -3,9 +3,9 @@ exports[`reports are formatted to datums 1`] = `

Example Trend Title @@ -19,7 +19,7 @@ exports[`reports are formatted to datums 1`] = ` style="height: 100px; width: 0px;" >
@@ -146,7 +146,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -167,7 +167,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -182,7 +182,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -223,7 +223,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -244,7 +244,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -265,7 +265,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -315,7 +315,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -332,7 +332,7 @@ exports[`reports are formatted to datums 1`] = ` diff --git a/src/routes/components/charts/usageChart/__snapshots__/usageChart.test.tsx.snap b/src/routes/components/charts/usageChart/__snapshots__/usageChart.test.tsx.snap index 93a9910b45..bae2eb6d2c 100644 --- a/src/routes/components/charts/usageChart/__snapshots__/usageChart.test.tsx.snap +++ b/src/routes/components/charts/usageChart/__snapshots__/usageChart.test.tsx.snap @@ -6,7 +6,7 @@ exports[`reports are formatted to datums 1`] = ` style="height: 100px; width: 0px;" >
@@ -193,7 +193,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -214,7 +214,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -229,7 +229,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -270,7 +270,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -291,7 +291,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -312,7 +312,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -402,7 +402,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -419,7 +419,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -436,7 +436,7 @@ exports[`reports are formatted to datums 1`] = ` @@ -453,7 +453,7 @@ exports[`reports are formatted to datums 1`] = ` diff --git a/src/routes/components/costDistribution/costDistribution.scss b/src/routes/components/costDistribution/costDistribution.scss index 8c47570820..9a3ce90478 100644 --- a/src/routes/components/costDistribution/costDistribution.scss +++ b/src/routes/components/costDistribution/costDistribution.scss @@ -2,8 +2,8 @@ // Workaround for https://github.com/patternfly/patternfly-react/issues/6371 .selectOverride { - &.pf-c-select { - .pf-c-select__menu-item-description { + &.pf-v5-c-select { + .pf-v5-c-select__menu-item-description { width: max-content; } } diff --git a/src/routes/components/costDistribution/costDistribution.tsx b/src/routes/components/costDistribution/costDistribution.tsx index 8a8dcbd432..8c9aca6851 100644 --- a/src/routes/components/costDistribution/costDistribution.tsx +++ b/src/routes/components/costDistribution/costDistribution.tsx @@ -1,8 +1,9 @@ import './costDistribution.scss'; import type { MessageDescriptor } from '@formatjs/intl/src/types'; -import type { SelectOptionObject } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, Title, TitleSizes } from '@patternfly/react-core'; +import { Title, TitleSizes } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import messages from 'locales/messages'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -70,8 +71,8 @@ class CostDistributionBase extends React.Component this.handleSelect(value)} + onToggle={(_evt, isExpanded) => this.handleToggle(isExpanded)} selections={selection} variant={SelectVariant.single} > @@ -96,7 +97,7 @@ class CostDistributionBase extends React.Component { + private handleSelect = (selection: CostDistributionOption) => { const { onSelect } = this.props; setCostDistribution(selection.value); // Set cost distribution in local storage diff --git a/src/routes/components/costType/costType.scss b/src/routes/components/costType/costType.scss index 8c47570820..9a3ce90478 100644 --- a/src/routes/components/costType/costType.scss +++ b/src/routes/components/costType/costType.scss @@ -2,8 +2,8 @@ // Workaround for https://github.com/patternfly/patternfly-react/issues/6371 .selectOverride { - &.pf-c-select { - .pf-c-select__menu-item-description { + &.pf-v5-c-select { + .pf-v5-c-select__menu-item-description { width: max-content; } } diff --git a/src/routes/components/costType/costType.tsx b/src/routes/components/costType/costType.tsx index 73341ef046..4a65e6c69d 100644 --- a/src/routes/components/costType/costType.tsx +++ b/src/routes/components/costType/costType.tsx @@ -1,8 +1,9 @@ import './costType.scss'; import type { MessageDescriptor } from '@formatjs/intl/src/types'; -import type { SelectOptionObject } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, Title, TitleSizes } from '@patternfly/react-core'; +import { Title, TitleSizes } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import messages from 'locales/messages'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -77,8 +78,8 @@ class CostTypeBase extends React.Component { id="costTypeSelect" isDisabled={isDisabled} isOpen={isSelectOpen} - onSelect={this.handleOnSelect} - onToggle={this.handleOnToggle} + onSelect={(_evt, value) => this.handleOnSelect(value)} + onToggle={(_evt, isExpanded) => this.handleOnToggle(isExpanded)} selections={selection} variant={SelectVariant.single} > @@ -104,7 +105,7 @@ class CostTypeBase extends React.Component { return options; }; - private handleOnSelect = (event, selection: CostTypeOption) => { + private handleOnSelect = (selection: CostTypeOption) => { const { isLocalStorage = true, onSelect } = this.props; // Set cost type in local storage diff --git a/src/routes/components/currency/currency.scss b/src/routes/components/currency/currency.scss index 374ceb421f..eafea7f5d4 100644 --- a/src/routes/components/currency/currency.scss +++ b/src/routes/components/currency/currency.scss @@ -2,7 +2,7 @@ // Workaround for missing "position" property .currencyOverride { - .pf-c-select__menu { + .pf-v5-c-select__menu { right: 0; } } diff --git a/src/routes/components/currency/currency.tsx b/src/routes/components/currency/currency.tsx index 51a364d989..7788c562f4 100644 --- a/src/routes/components/currency/currency.tsx +++ b/src/routes/components/currency/currency.tsx @@ -1,8 +1,9 @@ import './currency.scss'; import type { MessageDescriptor } from '@formatjs/intl/src/types'; -import type { SelectOptionObject } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, Title, TitleSizes } from '@patternfly/react-core'; +import { Title, TitleSizes } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import messages from 'locales/messages'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -80,8 +81,8 @@ class CurrencyBase extends React.Component { id="currencySelect" isDisabled={isDisabled} isOpen={isSelectOpen} - onSelect={this.handleOnSelect} - onToggle={this.handleOnToggle} + onSelect={(_evt, value) => this.handleOnSelect(value)} + onToggle={(_evt, isExpanded) => this.handleOnToggle(isExpanded)} selections={selection} variant={SelectVariant.single} > @@ -106,7 +107,7 @@ class CurrencyBase extends React.Component { return options; }; - private handleOnSelect = (event, selection: CurrencyOption) => { + private handleOnSelect = (selection: CurrencyOption) => { const { isLocalStorage = true, onSelect } = this.props; // Set currency units via local storage diff --git a/src/routes/components/dataTable/dataTable.scss b/src/routes/components/dataTable/dataTable.scss index ef5b85fd80..d97c63d360 100644 --- a/src/routes/components/dataTable/dataTable.scss +++ b/src/routes/components/dataTable/dataTable.scss @@ -4,13 +4,13 @@ div { display: block; margin-right: 0; - margin-bottom: var(--pf-global--spacer--xs); + margin-bottom: var(--pf-v5-global--spacer--xs); &.iconOverride { &.decrease { - color: var(--pf-global--success-color--100); + color: var(--pf-v5-global--success-color--100); } &.increase { - color: var(--pf-global--danger-color--100); + color: var(--pf-v5-global--danger-color--100); } .fa-sort-up { margin-left: 10px; @@ -19,10 +19,10 @@ margin-left: 10px; } .fa-sort-up::before { - color: var(--pf-global--danger-color--100); + color: var(--pf-v5-global--danger-color--100); } .fa-sort-down::before { - color: var(--pf-global--success-color--100); + color: var(--pf-v5-global--success-color--100); } span { margin-right: -17px !important; @@ -32,7 +32,7 @@ } .tableOverride { - &.pf-c-table tbody .pf-c-table__check input { + &.pf-v5-c-table tbody .pf-v5-c-table__check input { margin-top: .40rem; } } diff --git a/src/routes/components/dataTable/dataTable.tsx b/src/routes/components/dataTable/dataTable.tsx index 47d3226619..8fab3a86eb 100644 --- a/src/routes/components/dataTable/dataTable.tsx +++ b/src/routes/components/dataTable/dataTable.tsx @@ -1,9 +1,16 @@ import './dataTable.scss'; -import { Bullseye, EmptyState, EmptyStateBody, EmptyStateIcon, Spinner } from '@patternfly/react-core'; +import { + Bullseye, + EmptyState, + EmptyStateBody, + EmptyStateHeader, + EmptyStateIcon, + Spinner, +} from '@patternfly/react-core'; import { CalculatorIcon } from '@patternfly/react-icons/dist/esm/icons/calculator-icon'; import type { ThProps } from '@patternfly/react-table'; -import { SortByDirection, TableComposable, TableVariant, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table'; +import { SortByDirection, Table, TableVariant, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table'; import messages from 'locales/messages'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -48,7 +55,7 @@ class DataTable extends React.Component { } return ( - + } /> {intl.formatMessage(messages.detailsEmptyState)} ); @@ -70,12 +77,12 @@ class DataTable extends React.Component { private getSortParams = (index: number): ThProps['sort'] => { return { sortBy: this.getSortBy(index), - onSort: this.handleOnSort, + onSort: (_evt, i, direction) => this.handleOnSort(i, direction), columnIndex: index, }; }; - private handleOnSelect = (event, isSelected, rowId) => { + private handleOnSelect = (isSelected, rowId) => { const { onSelected, rows } = this.props; let newRows; @@ -97,7 +104,7 @@ class DataTable extends React.Component { }); }; - private handleOnSort = (event, index, direction) => { + private handleOnSort = (index, direction) => { const { columns, onSort } = this.props; if (onSort) { @@ -112,7 +119,7 @@ class DataTable extends React.Component { return ( <> - { key={`cell-${cellIndex}-${rowIndex}`} modifier="nowrap" select={{ - disable: row.selectionDisabled, // Disable select for "no-project" + isDisabled: row.selectionDisabled, // Disable select for "no-project" isSelected: row.selected, - onSelect: (_event, isSelected) => this.handleOnSelect(_event, isSelected, rowIndex), + onSelect: (_evt, isSelected) => this.handleOnSelect(isSelected, rowIndex), rowIndex, }} style={item.style} @@ -176,7 +183,7 @@ class DataTable extends React.Component { )) )} - + {rows.length === 0 &&
{this.getEmptyState()}
} ); diff --git a/src/routes/components/dataTable/selectableTable.tsx b/src/routes/components/dataTable/selectableTable.tsx index 83bb60d615..a9cb610747 100644 --- a/src/routes/components/dataTable/selectableTable.tsx +++ b/src/routes/components/dataTable/selectableTable.tsx @@ -1,7 +1,14 @@ -import { Bullseye, EmptyState, EmptyStateBody, EmptyStateIcon, Spinner } from '@patternfly/react-core'; +import { + Bullseye, + EmptyState, + EmptyStateBody, + EmptyStateHeader, + EmptyStateIcon, + Spinner, +} from '@patternfly/react-core'; import { CalculatorIcon } from '@patternfly/react-icons/dist/esm/icons/calculator-icon'; import type { ThProps } from '@patternfly/react-table'; -import { SortByDirection, TableComposable, TableVariant, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table'; +import { SortByDirection, Table, TableVariant, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table'; import messages from 'locales/messages'; import type { ReactNode } from 'react'; import React from 'react'; @@ -18,7 +25,7 @@ interface SelectableTableOwnProps { filterBy: any; isLoading?: boolean; onSort(value: string, isSortAscending: boolean); - onRowClick(event: React.KeyboardEvent | React.MouseEvent, rowIndex: number); + onRowClick(rowIndex: number); orderBy: any; rows?: any[]; } @@ -47,7 +54,7 @@ class SelectableTable extends React.Component { } return ( - + } /> {intl.formatMessage(messages.detailsEmptyState)} ); @@ -74,7 +81,7 @@ class SelectableTable extends React.Component { }; }; - private handleOnSort = (event, index, direction) => { + private handleOnSort = (index, direction) => { const { columns, onSort } = this.props; if (onSort) { @@ -84,7 +91,7 @@ class SelectableTable extends React.Component { } }; - private handleOnRowClick = (event, rowIndex) => { + private handleOnRowClick = (rowIndex: number) => { const { onRowClick, rows } = this.props; rows.map(row => (row.selected = false)); @@ -92,7 +99,7 @@ class SelectableTable extends React.Component { this.setState({ rows }, () => { if (onRowClick) { - onRowClick(event, rowIndex); + onRowClick(rowIndex); } }); }; @@ -102,10 +109,9 @@ class SelectableTable extends React.Component { return ( <> - @@ -138,9 +144,9 @@ class SelectableTable extends React.Component { this.handleOnRowClick(_event, rowIndex)} + onRowClick={() => this.handleOnRowClick(rowIndex)} key={`row-${rowIndex}`} > {row.cells.map((item, cellIndex) => @@ -169,7 +175,7 @@ class SelectableTable extends React.Component { )) )} - + {rows.length === 0 &&
{this.getEmptyState()}
} ); diff --git a/src/routes/components/dataToolbar/basicToolbar.tsx b/src/routes/components/dataToolbar/basicToolbar.tsx index c3c45cc7f6..cb8b3bbf96 100644 --- a/src/routes/components/dataToolbar/basicToolbar.tsx +++ b/src/routes/components/dataToolbar/basicToolbar.tsx @@ -194,7 +194,7 @@ export class BasicToolbarBase extends React.Component { + private handleOnCategorySelect = (selection: CategoryOption) => { this.setState({ categoryInput: '', currentCategory: selection.value, @@ -359,7 +359,7 @@ export class BasicToolbarBase extends React.Component )} {actions && {actions}} - + {pagination} diff --git a/src/routes/components/dataToolbar/costCategoryValue.tsx b/src/routes/components/dataToolbar/costCategoryValue.tsx index 9b55647024..5b212bca6a 100644 --- a/src/routes/components/dataToolbar/costCategoryValue.tsx +++ b/src/routes/components/dataToolbar/costCategoryValue.tsx @@ -1,13 +1,7 @@ -import type { SelectOptionObject, ToolbarChipGroup } from '@patternfly/react-core'; -import { - Button, - ButtonVariant, - InputGroup, - Select, - SelectOption, - SelectVariant, - TextInput, -} from '@patternfly/react-core'; +import type { ToolbarChipGroup } from '@patternfly/react-core'; +import { Button, ButtonVariant, InputGroup, InputGroupItem, TextInput } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import { SearchIcon } from '@patternfly/react-icons/dist/esm/icons/search-icon'; import type { Query } from 'api/queries/query'; import { getQuery, parseQuery } from 'api/queries/query'; @@ -141,8 +135,8 @@ class CostCategoryValueBase extends React.Component this.onCostCategoryValueToggle(isExpanded)} selections={selections} isOpen={isCostCategoryValueExpanded} placeholderText={intl.formatMessage(messages.chooseValuePlaceholder)} @@ -153,25 +147,29 @@ class CostCategoryValueBase extends React.Component - onCostCategoryValueInput(evt)} - /> - + + this.onCostCategoryValueChange(value)} + value={costCategoryKeyValue} + placeholder={intl.formatMessage(messages.filterByValuePlaceholder)} + onKeyDown={evt => onCostCategoryValueInput(evt)} + /> + + + + ); } diff --git a/src/routes/components/dataToolbar/customSelect.tsx b/src/routes/components/dataToolbar/customSelect.tsx index e9e3147d0e..8ef166633d 100644 --- a/src/routes/components/dataToolbar/customSelect.tsx +++ b/src/routes/components/dataToolbar/customSelect.tsx @@ -1,7 +1,7 @@ import './dataToolbar.scss'; -import type { SelectOptionObject } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import messages from 'locales/messages'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -28,7 +28,7 @@ interface CustomSelectDispatchProps { } interface CustomSelectState { - isExpanded?: boolean; + isCustomSelectExpanded?: boolean; } export interface SelectOptionObjectExt extends SelectOptionObject { @@ -40,13 +40,13 @@ type CustomSelectProps = CustomSelectOwnProps & CustomSelectStateProps & CustomS class CustomSelectBase extends React.Component { protected defaultState: CustomSelectState = { - isExpanded: false, + isCustomSelectExpanded: false, }; public state: CustomSelectState = { ...this.defaultState }; private onCustomSelectToggle = isOpen => { this.setState({ - isExpanded: isOpen, + isCustomSelectExpanded: isOpen, }); }; @@ -66,7 +66,7 @@ class CustomSelectBase extends React.Component { @@ -79,10 +79,10 @@ class CustomSelectBase extends React.Component this.onCustomSelectToggle(isExpanded)} onSelect={onSelect} selections={selections} - isOpen={isExpanded} + isOpen={isCustomSelectExpanded} placeholderText={intl.formatMessage(messages.chooseValuePlaceholder)} > {selectOptions.map(option => ( diff --git a/src/routes/components/dataToolbar/dataKebab.tsx b/src/routes/components/dataToolbar/dataKebab.tsx index 995f4f7a0f..ca31796c1d 100644 --- a/src/routes/components/dataToolbar/dataKebab.tsx +++ b/src/routes/components/dataToolbar/dataKebab.tsx @@ -1,5 +1,5 @@ import type { MessageDescriptor } from '@formatjs/intl/src/types'; -import { Dropdown, DropdownItem, DropdownPosition, KebabToggle } from '@patternfly/react-core'; +import { Dropdown, DropdownItem, DropdownPosition, KebabToggle } from '@patternfly/react-core/deprecated'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; import { injectIntl } from 'react-intl'; diff --git a/src/routes/components/dataToolbar/dataToolbar.scss b/src/routes/components/dataToolbar/dataToolbar.scss index 63c426fdbf..7502b8ca36 100644 --- a/src/routes/components/dataToolbar/dataToolbar.scss +++ b/src/routes/components/dataToolbar/dataToolbar.scss @@ -3,15 +3,15 @@ // Workaround for https://github.com/patternfly/patternfly-react/issues/4477 // and https://github.com/patternfly/patternfly-react/issues/6371 .selectOverride { - &.pf-c-select { + &.pf-v5-c-select { min-width: 250px; } } .toolbarOverride { - .pf-c-button.pf-m-control::after { + .pf-v5-c-button.pf-m-control::after { border-left: none; } // Alternative workaround to overriding table sticky style - // --pf-c-toolbar--ZIndex: auto; z-index: 301; + // --pf-v5-c-toolbar--ZIndex: auto; z-index: 301; } diff --git a/src/routes/components/dataToolbar/dataToolbar.tsx b/src/routes/components/dataToolbar/dataToolbar.tsx index cc5340281a..df712830d9 100644 --- a/src/routes/components/dataToolbar/dataToolbar.tsx +++ b/src/routes/components/dataToolbar/dataToolbar.tsx @@ -5,8 +5,7 @@ import { FilterIcon } from '@patternfly/react-icons/dist/esm/icons/filter-icon'; import type { Org } from 'api/orgs/org'; import type { Query } from 'api/queries/query'; import type { Resource, ResourcePathsType } from 'api/resources/resource'; -import type { Tag } from 'api/tags/tag'; -import type { TagPathsType } from 'api/tags/tag'; +import type { Tag, TagPathsType } from 'api/tags/tag'; import { cloneDeep } from 'lodash'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -234,7 +233,7 @@ export class DataToolbarBase extends React.Component { + private handleOnCategorySelect = (selection: CategoryOption) => { this.setState({ categoryInput: '', currentCategory: selection.value, @@ -278,7 +277,7 @@ export class DataToolbarBase extends React.Component { + private handleOnCategoryInput = (event: React.FormEvent, key) => { const { onFilterAdded } = this.props; const { categoryInput, currentCategory, currentExclude, filters: currentFilters } = this.state; @@ -354,7 +353,7 @@ export class DataToolbarBase extends React.Component { + private handleOnCostCategoryKeySelect = selection => { this.setState({ currentCostCategoryKey: selection, isCostCategoryKeySelectExpanded: !this.state.isCostCategoryKeySelectExpanded, @@ -514,7 +513,7 @@ export class DataToolbarBase extends React.Component { + private handleOnExcludeSelect = (selection: ExcludeOption) => { this.setState({ currentExclude: selection.value, isExcludeSelectOpen: !this.state.isExcludeSelectOpen, @@ -605,7 +604,7 @@ export class DataToolbarBase extends React.Component { + private handleOnTagKeySelect = selection => { this.setState({ currentTagKey: selection, isTagKeySelectExpanded: !this.state.isTagKeySelectExpanded, @@ -836,7 +835,7 @@ export class DataToolbarBase extends React.Component )} - + {pagination} diff --git a/src/routes/components/dataToolbar/tagValue.tsx b/src/routes/components/dataToolbar/tagValue.tsx index 484c6a1791..ba3e91f14f 100644 --- a/src/routes/components/dataToolbar/tagValue.tsx +++ b/src/routes/components/dataToolbar/tagValue.tsx @@ -1,13 +1,7 @@ -import type { SelectOptionObject, ToolbarChipGroup } from '@patternfly/react-core'; -import { - Button, - ButtonVariant, - InputGroup, - Select, - SelectOption, - SelectVariant, - TextInput, -} from '@patternfly/react-core'; +import type { ToolbarChipGroup } from '@patternfly/react-core'; +import { Button, ButtonVariant, InputGroup, InputGroupItem, TextInput } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import { SearchIcon } from '@patternfly/react-icons/dist/esm/icons/search-icon'; import type { Query } from 'api/queries/query'; import { getQuery, parseQuery } from 'api/queries/query'; @@ -140,8 +134,8 @@ class TagValueBase extends React.Component { isDisabled={isDisabled} variant={SelectVariant.checkbox} aria-label={intl.formatMessage(messages.filterByTagValueAriaLabel)} - onToggle={this.onTagValueToggle} onSelect={onTagValueSelect} + onToggle={(_evt, isExpanded) => this.onTagValueToggle(isExpanded)} selections={selections} isOpen={isTagValueExpanded} placeholderText={intl.formatMessage(messages.chooseValuePlaceholder)} @@ -152,25 +146,29 @@ class TagValueBase extends React.Component { } return ( - onTagValueInput(evt)} - /> - + + this.onTagValueChange(value)} + value={tagKeyValue} + placeholder={intl.formatMessage(messages.filterByValuePlaceholder)} + onKeyDown={evt => onTagValueInput(evt)} + /> + + + + ); } diff --git a/src/routes/components/dataToolbar/utils/actions.tsx b/src/routes/components/dataToolbar/utils/actions.tsx index dae5af2d5e..40997a9c93 100644 --- a/src/routes/components/dataToolbar/utils/actions.tsx +++ b/src/routes/components/dataToolbar/utils/actions.tsx @@ -70,7 +70,7 @@ export const getPlatformCosts = ({ label={intl.formatMessage(messages.sumPlatformCosts)} isChecked={isPlatformCostsChecked} isDisabled={isDisabled} - onChange={onPlatformCostsChanged} + onChange={(_evt, checked) => onPlatformCostsChanged(checked)} /> ); diff --git a/src/routes/components/dataToolbar/utils/bulkSelect.tsx b/src/routes/components/dataToolbar/utils/bulkSelect.tsx index ba77de447d..e49c4e5275 100644 --- a/src/routes/components/dataToolbar/utils/bulkSelect.tsx +++ b/src/routes/components/dataToolbar/utils/bulkSelect.tsx @@ -1,11 +1,11 @@ +import { Tooltip } from '@patternfly/react-core'; import { Dropdown, DropdownItem, DropdownPosition, DropdownToggle, DropdownToggleCheckbox, - Tooltip, -} from '@patternfly/react-core'; +} from '@patternfly/react-core/deprecated'; import { intl } from 'components/i18n'; import messages from 'locales/messages'; import React from 'react'; @@ -82,7 +82,7 @@ export const getBulkSelect = ({ }} />, ]} - onToggle={onBulkSelectToggle} + onToggle={(_evt, isOpen) => onBulkSelectToggle(isOpen)} > {numSelected !== 0 && ( {intl.formatMessage(messages.selected, { value: numSelected })} diff --git a/src/routes/components/dataToolbar/utils/category.tsx b/src/routes/components/dataToolbar/utils/category.tsx index 6380ceca46..ffc08f23bf 100644 --- a/src/routes/components/dataToolbar/utils/category.tsx +++ b/src/routes/components/dataToolbar/utils/category.tsx @@ -1,19 +1,18 @@ -import type { SelectOptionObject, ToolbarChipGroup } from '@patternfly/react-core'; +import type { ToolbarChipGroup } from '@patternfly/react-core'; import { Button, ButtonVariant, InputGroup, - Select, - SelectOption, - SelectVariant, + InputGroupItem, TextInput, ToolbarFilter, ToolbarItem, } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import { FilterIcon } from '@patternfly/react-icons/dist/esm/icons/filter-icon'; import { SearchIcon } from '@patternfly/react-icons/dist/esm/icons/search-icon'; -import type { ResourceType } from 'api/resources/resource'; -import type { ResourcePathsType } from 'api/resources/resource'; +import type { ResourcePathsType, ResourceType } from 'api/resources/resource'; import { isResourceTypeValid } from 'api/resources/resourceUtils'; import { intl } from 'components/i18n'; import messages from 'locales/messages'; @@ -70,39 +69,41 @@ export const getCategoryInput = ({ showToolbarItem={currentCategory === categoryOption.key} > - {isResourceTypeValid(resourcePathsType, categoryOption.key as ResourceType) ? ( - onCategoryInputSelect(value, categoryOption.key)} - placeholder={intl.formatMessage(messages.filterByPlaceholder, { value: placeholderKey })} - resourcePathsType={resourcePathsType} - resourceType={categoryOption.key as ResourceType} - /> - ) : ( - <> - + {isResourceTypeValid(resourcePathsType, categoryOption.key as ResourceType) ? ( + onCategoryInputSelect(value, categoryOption.key)} placeholder={intl.formatMessage(messages.filterByPlaceholder, { value: placeholderKey })} - onKeyDown={evt => onCategoryInput(evt, categoryOption.key)} - size={intl.formatMessage(messages.filterByPlaceholder, { value: placeholderKey }).length} + resourcePathsType={resourcePathsType} + resourceType={categoryOption.key as ResourceType} /> - - - )} + ) : ( + <> + onCategoryInputChange(value)} + value={categoryInput} + placeholder={intl.formatMessage(messages.filterByPlaceholder, { value: placeholderKey })} + onKeyDown={evt => onCategoryInput(evt, categoryOption.key)} + size={intl.formatMessage(messages.filterByPlaceholder, { value: placeholderKey }).length} + /> + + + )} + ); @@ -205,7 +206,7 @@ export const getCategorySelect = ({ currentCategory?: string; filters?: Filters; isDisabled?: boolean; - onCategorySelect?: (event, selection: CategoryOption) => void; + onCategorySelect?: (selection: CategoryOption) => void; onCategoryToggle?: (isOpen: boolean) => void; isCategorySelectOpen?: boolean; }) => { @@ -222,8 +223,8 @@ export const getCategorySelect = ({ id="category-select" isDisabled={isDisabled && !hasFilters(filters)} isOpen={isCategorySelectOpen} - onSelect={onCategorySelect} - onToggle={onCategoryToggle} + onSelect={(_evt, value) => onCategorySelect(value)} + onToggle={(_evt, isExpanded) => onCategoryToggle(isExpanded)} selections={selection} toggleIcon={} variant={SelectVariant.single} diff --git a/src/routes/components/dataToolbar/utils/costCategory.tsx b/src/routes/components/dataToolbar/utils/costCategory.tsx index 7bf27aea36..e48e405b40 100644 --- a/src/routes/components/dataToolbar/utils/costCategory.tsx +++ b/src/routes/components/dataToolbar/utils/costCategory.tsx @@ -1,7 +1,8 @@ import type { ToolbarChipGroup } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, ToolbarFilter, ToolbarItem } from '@patternfly/react-core'; -import type { Resource } from 'api/resources/resource'; -import type { ResourcePathsType } from 'api/resources/resource'; +import { ToolbarFilter, ToolbarItem } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; +import type { Resource, ResourcePathsType } from 'api/resources/resource'; import { intl } from 'components/i18n'; import messages from 'locales/messages'; import { cloneDeep, uniq, uniqBy } from 'lodash'; @@ -32,7 +33,7 @@ export const getCostCategoryKeySelect = ({ isCostCategoryKeySelectExpanded?: boolean; isDisabled?: boolean; onCostCategoryKeyClear?: () => void; - onCostCategoryKeySelect?: (event, selection) => void; + onCostCategoryKeySelect?: (selection: SelectOptionObject) => void; onCostCategoryKeyToggle?: (isOpen: boolean) => void; resourceReport?: Resource; }) => { @@ -50,10 +51,10 @@ export const getCostCategoryKeySelect = ({ isDisabled={isDisabled && !hasFilters(filters)} variant={SelectVariant.typeahead} typeAheadAriaLabel={intl.formatMessage(messages.filterByCostCategoryKeyAriaLabel)} - onClear={onCostCategoryKeyClear} - onToggle={onCostCategoryKeyToggle} - onSelect={onCostCategoryKeySelect} isOpen={isCostCategoryKeySelectExpanded} + onClear={onCostCategoryKeyClear} + onSelect={(_evt, value) => onCostCategoryKeySelect(value)} + onToggle={(_evt, isExpanded) => onCostCategoryKeyToggle(isExpanded)} placeholderText={intl.formatMessage(messages.chooseKeyPlaceholder)} selections={currentCostCategoryKey} > diff --git a/src/routes/components/dataToolbar/utils/exclude.tsx b/src/routes/components/dataToolbar/utils/exclude.tsx index 2af24681b4..f093e975e9 100644 --- a/src/routes/components/dataToolbar/utils/exclude.tsx +++ b/src/routes/components/dataToolbar/utils/exclude.tsx @@ -1,5 +1,6 @@ -import type { SelectOptionObject } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, ToolbarItem } from '@patternfly/react-core'; +import { ToolbarItem } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import { intl } from 'components/i18n'; import messages from 'locales/messages'; import React from 'react'; @@ -32,7 +33,7 @@ export const getExcludeSelect = ({ filters?: Filters; isDisabled?: boolean; isExcludeSelectOpen?: boolean; - onExcludeSelect: (event: any, selection: ExcludeOption) => void; + onExcludeSelect: (selection: ExcludeOption) => void; onExcludeToggle: (isOpen: boolean) => void; }) => { const selectOptions = getExcludeSelectOptions(); @@ -44,8 +45,8 @@ export const getExcludeSelect = ({ id="exclude-select" isDisabled={isDisabled && !hasFilters(filters)} isOpen={isExcludeSelectOpen} - onSelect={onExcludeSelect} - onToggle={onExcludeToggle} + onSelect={(_evt, value) => onExcludeSelect(value)} + onToggle={(_evt, isExpanded) => onExcludeToggle(isExpanded)} selections={selection} variant={SelectVariant.single} > diff --git a/src/routes/components/dataToolbar/utils/orgUntits.tsx b/src/routes/components/dataToolbar/utils/orgUntits.tsx index 04f412393b..d678f2de9c 100644 --- a/src/routes/components/dataToolbar/utils/orgUntits.tsx +++ b/src/routes/components/dataToolbar/utils/orgUntits.tsx @@ -1,5 +1,7 @@ -import type { SelectOptionObject, ToolbarChipGroup } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, ToolbarFilter } from '@patternfly/react-core'; +import type { ToolbarChipGroup } from '@patternfly/react-core'; +import { ToolbarFilter } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import type { Org } from 'api/orgs/org'; import { intl } from 'components/i18n'; import messages from 'locales/messages'; @@ -32,7 +34,7 @@ export const getOrgUnitSelect = ({ isDisabled?: boolean; isOrgUnitSelectExpanded?: boolean; onDelete?: (type: any, chip: any) => void; - onOrgUnitSelect?: (event, selection: string) => void; + onOrgUnitSelect?: (event: React.MouseEvent, selection: string) => void; onOrgUnitToggle?: (isOpen: boolean) => void; orgReport: Org; }) => { @@ -78,8 +80,8 @@ export const getOrgUnitSelect = ({ className="selectOverride" variant={SelectVariant.checkbox} aria-label={intl.formatMessage(messages.filterByOrgUnitAriaLabel)} - onToggle={onOrgUnitToggle} onSelect={onOrgUnitSelect} + onToggle={(_evt, isExpanded) => onOrgUnitToggle(isExpanded)} selections={selections} isOpen={isOrgUnitSelectExpanded} placeholderText={intl.formatMessage(messages.filterByOrgUnitPlaceholder)} diff --git a/src/routes/components/dataToolbar/utils/tags.tsx b/src/routes/components/dataToolbar/utils/tags.tsx index a49a1f0705..b49e586325 100644 --- a/src/routes/components/dataToolbar/utils/tags.tsx +++ b/src/routes/components/dataToolbar/utils/tags.tsx @@ -1,7 +1,8 @@ import type { ToolbarChipGroup } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, ToolbarFilter, ToolbarItem } from '@patternfly/react-core'; -import type { Tag } from 'api/tags/tag'; -import type { TagPathsType } from 'api/tags/tag'; +import { ToolbarFilter, ToolbarItem } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; +import type { Tag, TagPathsType } from 'api/tags/tag'; import { intl } from 'components/i18n'; import messages from 'locales/messages'; import { cloneDeep, uniq, uniqBy } from 'lodash'; @@ -30,7 +31,7 @@ export const getTagKeySelect = ({ isDisabled?: boolean; isTagKeySelectExpanded?: boolean; onTagKeyClear?: () => void; - onTagKeySelect?: (event, selection) => void; + onTagKeySelect?: (value: SelectOptionObject) => void; onTagKeyToggle?: (isOpen: boolean) => void; tagReport?: Tag; }) => { @@ -49,8 +50,8 @@ export const getTagKeySelect = ({ variant={SelectVariant.typeahead} typeAheadAriaLabel={intl.formatMessage(messages.filterByTagKeyAriaLabel)} onClear={onTagKeyClear} - onToggle={onTagKeyToggle} - onSelect={onTagKeySelect} + onSelect={(_evt, value) => onTagKeySelect(value)} + onToggle={(_evt, isExpanded) => onTagKeyToggle(isExpanded)} isOpen={isTagKeySelectExpanded} placeholderText={intl.formatMessage(messages.chooseKeyPlaceholder)} selections={currentTagKey} diff --git a/src/routes/components/export/exportModal.tsx b/src/routes/components/export/exportModal.tsx index 96c644e814..ad3afd5e1e 100644 --- a/src/routes/components/export/exportModal.tsx +++ b/src/routes/components/export/exportModal.tsx @@ -7,6 +7,8 @@ import { FormGroup, Grid, GridItem, + HelperText, + HelperTextItem, Modal, Radio, TextInput, @@ -108,19 +110,19 @@ export class ExportModalBase extends React.Component { + private handleOnMonthChange = event => { this.setState({ timeScope: event.currentTarget.value }); }; - private handleOnNameChange = (_, event) => { + private handleOnNameChange = event => { this.setState({ name: event.currentTarget.value }); }; - private handleOnResolutionChange = (_, event) => { + private handleOnResolutionChange = event => { this.setState({ resolution: event.currentTarget.value }); }; - private handleOnTypeChange = (_, event) => { + private handleOnTypeChange = event => { this.setState({ formatType: event.currentTarget.value }); }; @@ -227,13 +229,7 @@ export class ExportModalBase extends React.Component {isExportsFeatureEnabled && ( - + + {validated === 'error' && ( + + {intl.formatMessage(helpText)} + + )} )} diff --git a/src/routes/components/groupBy/groupBy.tsx b/src/routes/components/groupBy/groupBy.tsx index edc8311fb2..79277857de 100644 --- a/src/routes/components/groupBy/groupBy.tsx +++ b/src/routes/components/groupBy/groupBy.tsx @@ -1,5 +1,6 @@ -import type { SelectOptionObject } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, Title } from '@patternfly/react-core'; +import { Title } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import type { Org, OrgPathsType } from 'api/orgs/org'; import { OrgType } from 'api/orgs/org'; import type { Query } from 'api/queries/query'; @@ -196,8 +197,8 @@ class GroupByBase extends React.Component { id="groupBySelect" isDisabled={isDisabled} isOpen={isGroupByOpen} - onSelect={this.handleOnSelect} - onToggle={this.handleOnToggle} + onSelect={(_evt, value) => this.handleOnSelect(value)} + onToggle={(_evt, isExpanded) => this.handleOnToggle(isExpanded)} selections={selection} variant={SelectVariant.single} > @@ -237,7 +238,7 @@ class GroupByBase extends React.Component { }); }; - private handleOnSelect = (event, selection: GroupByOption) => { + private handleOnSelect = (selection: GroupByOption) => { const { onSelected } = this.props; if (selection.value === orgUnitIdKey || selection.value === awsCategoryKey || selection.value === tagKey) { diff --git a/src/routes/components/groupBy/groupByOrg.tsx b/src/routes/components/groupBy/groupByOrg.tsx index 65bc374319..4511f3b715 100644 --- a/src/routes/components/groupBy/groupByOrg.tsx +++ b/src/routes/components/groupBy/groupByOrg.tsx @@ -1,5 +1,5 @@ -import type { SelectOptionObject } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import type { Org } from 'api/orgs/org'; import type { Query } from 'api/queries/query'; import { parseQuery } from 'api/queries/query'; @@ -120,7 +120,7 @@ class GroupByOrgBase extends React.Component { }); }; - private handleOnSelect = (event, selection: GroupByOrgOption) => { + private handleOnSelect = (selection: GroupByOrgOption) => { const { onSelected } = this.props; this.setState({ @@ -149,8 +149,8 @@ class GroupByOrgBase extends React.Component { aria-label={intl.formatMessage(messages.filterByOrgUnitAriaLabel)} isDisabled={isDisabled} onClear={this.handleOnClear} - onToggle={this.handleOnToggle} - onSelect={this.handleOnSelect} + onSelect={(_evt, value) => this.handleOnSelect(value)} + onToggle={(_evt, isExpanded) => this.handleOnToggle(isExpanded)} isOpen={isGroupByOpen} placeholderText={intl.formatMessage(messages.filterByOrgUnitPlaceholder)} selections={selection} diff --git a/src/routes/components/groupBy/groupBySelect.tsx b/src/routes/components/groupBy/groupBySelect.tsx index 8e3d5657b7..50e4720db6 100644 --- a/src/routes/components/groupBy/groupBySelect.tsx +++ b/src/routes/components/groupBy/groupBySelect.tsx @@ -1,4 +1,4 @@ -import { Select, SelectOption, SelectVariant } from '@patternfly/react-core'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import type { Query } from 'api/queries/query'; import { parseQuery } from 'api/queries/query'; import type { Resource } from 'api/resources/resource'; @@ -120,16 +120,16 @@ class GroupBySelectBase extends React.Component { + private handleOnSelected = value => { const { onSelected } = this.props; const { prefix } = this.state; this.setState({ - currentItem: selection, + currentItem: value, isGroupByOpen: false, }); if (onSelected) { - onSelected(`${prefix}${selection}`); + onSelected(`${prefix}${value}`); } }; @@ -149,8 +149,8 @@ class GroupBySelectBase extends React.Component this.handleOnSelected(value)} + onToggle={(_evt, isExpanded) => this.handleOnToggle(isExpanded)} isOpen={isGroupByOpen} placeholderText={intl.formatMessage(messages.chooseKeyPlaceholder)} selections={currentItem} diff --git a/src/routes/components/optimizations/optimizationsTable.tsx b/src/routes/components/optimizations/optimizationsTable.tsx index 613126eb26..d73d03a3b3 100644 --- a/src/routes/components/optimizations/optimizationsTable.tsx +++ b/src/routes/components/optimizations/optimizationsTable.tsx @@ -174,7 +174,7 @@ class OptimizationsTableBase extends React.Component { + private handleOnRowClick = (rowIndex: number) => { const { closeOptimizationsDrawer, isOpen, openOptimizationsDrawer } = this.props; const { currentRow, rows } = this.state; diff --git a/src/routes/components/page/noData/noDataState.tsx b/src/routes/components/page/noData/noDataState.tsx index 10560d6257..6912fff878 100644 --- a/src/routes/components/page/noData/noDataState.tsx +++ b/src/routes/components/page/noData/noDataState.tsx @@ -2,10 +2,10 @@ import { Button, EmptyState, EmptyStateBody, + EmptyStateFooter, + EmptyStateHeader, EmptyStateIcon, EmptyStateVariant, - Title, - TitleSizes, } from '@patternfly/react-core'; import { PlusCircleIcon } from '@patternfly/react-icons/dist/esm/icons/plus-circle-icon'; import messages from 'locales/messages'; @@ -24,17 +24,20 @@ class NoDataStateBase extends React.Component { const { intl, showReload = true } = this.props; return ( - - - - {intl.formatMessage(messages.noDataStateTitle)} - + + {intl.formatMessage(messages.noDataStateTitle)}} + icon={} + headingLevel="h5" + /> {intl.formatMessage(messages.noDataStateDesc)} - {showReload && ( - - )} + + {showReload && ( + + )} + ); } diff --git a/src/routes/components/page/noOptimizations/noOptimizationsState.tsx b/src/routes/components/page/noOptimizations/noOptimizationsState.tsx index 2cf0d3df80..771c8275f9 100644 --- a/src/routes/components/page/noOptimizations/noOptimizationsState.tsx +++ b/src/routes/components/page/noOptimizations/noOptimizationsState.tsx @@ -1,10 +1,9 @@ import { EmptyState, EmptyStateBody, + EmptyStateHeader, EmptyStateIcon, EmptyStateVariant, - Title, - TitleSizes, } from '@patternfly/react-core'; import messages from 'locales/messages'; import React from 'react'; @@ -23,11 +22,12 @@ class NoOptimizationsStateBase extends React.Component - - - {intl.formatMessage(messages.noOptimizationsTitle)} - + + {intl.formatMessage(messages.noOptimizationsTitle)}} + icon={} + headingLevel="h1" + /> {intl.formatMessage(messages.noOptimizationsDesc)} ); diff --git a/src/routes/components/page/noProviders/noProvidersState.tsx b/src/routes/components/page/noProviders/noProvidersState.tsx index 31faf92eb5..175364ee1f 100644 --- a/src/routes/components/page/noProviders/noProvidersState.tsx +++ b/src/routes/components/page/noProviders/noProvidersState.tsx @@ -3,10 +3,10 @@ import { Button, EmptyState, EmptyStateBody, + EmptyStateFooter, + EmptyStateHeader, EmptyStateIcon, EmptyStateVariant, - Title, - TitleSizes, } from '@patternfly/react-core'; import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/esm/icons/external-link-alt-icon'; import { PlusCircleIcon } from '@patternfly/react-icons/dist/esm/icons/plus-circle-icon'; @@ -82,19 +82,22 @@ class NoProvidersStateBase extends React.Component { icon = CostIcon; } return ( - - - - {intl.formatMessage(titleKey)} - + + {intl.formatMessage(titleKey)}} + icon={} + headingLevel="h1" + /> {intl.formatMessage(descKey)} - {docUrlKey && textKey ? ( -
{this.getDocLink(textKey, docUrlKey)}
- ) : ( - - )} + + {docUrlKey && textKey ? ( +
{this.getDocLink(textKey, docUrlKey)}
+ ) : ( + + )} +
); } diff --git a/src/routes/components/perspective/perspectiveSelect.tsx b/src/routes/components/perspective/perspectiveSelect.tsx index a036b356a0..cb7c069e63 100644 --- a/src/routes/components/perspective/perspectiveSelect.tsx +++ b/src/routes/components/perspective/perspectiveSelect.tsx @@ -1,6 +1,7 @@ import type { MessageDescriptor } from '@formatjs/intl/src/types'; -import type { SelectOptionObject } from '@patternfly/react-core'; -import { Select, SelectOption, SelectVariant, Title } from '@patternfly/react-core'; +import { Title } from '@patternfly/react-core'; +import type { SelectOptionObject } from '@patternfly/react-core/deprecated'; +import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated'; import messages from 'locales/messages'; import React from 'react'; import type { WrappedComponentProps } from 'react-intl'; @@ -73,8 +74,8 @@ class PerspectiveSelectBase extends React.Component this.handleSelect(value)} + onToggle={(_evt, isExpanded) => this.handleToggle(isExpanded)} selections={selection} variant={SelectVariant.single} > @@ -85,7 +86,7 @@ class PerspectiveSelectBase extends React.Component { + private handleSelect = (selection: PerspectiveOption) => { const { onSelected } = this.props; if (onSelected) { diff --git a/src/routes/components/reports/reportSummary/__snapshots__/reportSummaryItems.test.tsx.snap b/src/routes/components/reports/reportSummary/__snapshots__/reportSummaryItems.test.tsx.snap index ff9e4a88d0..71e2bd5e47 100644 --- a/src/routes/components/reports/reportSummary/__snapshots__/reportSummaryItems.test.tsx.snap +++ b/src/routes/components/reports/reportSummary/__snapshots__/reportSummaryItems.test.tsx.snap @@ -3,35 +3,35 @@ exports[`contains skeleton readers if in progress 1`] = `
diff --git a/src/routes/components/reports/reportSummary/reportSummary.scss b/src/routes/components/reports/reportSummary/reportSummary.scss index 52822992fd..e556562823 100644 --- a/src/routes/components/reports/reportSummary/reportSummary.scss +++ b/src/routes/components/reports/reportSummary/reportSummary.scss @@ -2,12 +2,12 @@ .chartSkeleton { height: 125px; - margin-bottom: var(--pf-global--spacer--md); - margin-top: var(--pf-global--spacer--md); + margin-bottom: var(--pf-v5-global--spacer--md); + margin-top: var(--pf-v5-global--spacer--md); } .legendSkeleton { - margin-top: var(--pf-global--spacer--md), + margin-top: var(--pf-v5-global--spacer--md), } .reportSummary { @@ -16,7 +16,7 @@ .subtitle { display: inline-block; - font-size: var(--pf-global--FontSize--xs); - color: var(--pf-global--Color--200); + font-size: var(--pf-v5-global--FontSize--xs); + color: var(--pf-v5-global--Color--200); margin-bottom: 0; } diff --git a/src/routes/components/reports/reportSummary/reportSummaryAlt.scss b/src/routes/components/reports/reportSummary/reportSummaryAlt.scss index 6d6ca62d8a..c73fe7209f 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryAlt.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryAlt.scss @@ -2,18 +2,18 @@ .chartSkeleton { height: 175px; - margin-bottom: var(--pf-global--spacer--md); - margin-top: var(--pf-global--spacer--md); + margin-bottom: var(--pf-v5-global--spacer--md); + margin-top: var(--pf-v5-global--spacer--md); } .cost { flex-grow: 1; min-height: 470px; - margin-tight: var(--pf-global--spacer--md); + margin-tight: var(--pf-v5-global--spacer--md); } .legendSkeleton { - margin-top: var(--pf-global--spacer--md), + margin-top: var(--pf-v5-global--spacer--md), } .reportSummary { @@ -22,11 +22,11 @@ .subtitle { display: inline-block; - font-size: var(--pf-global--FontSize--xs); - color: var(--pf-global--Color--200); + font-size: var(--pf-v5-global--FontSize--xs); + color: var(--pf-v5-global--Color--200); margin-bottom: 0; } .tops { - margin-top: var(--pf-global--spacer--lg), + margin-top: var(--pf-v5-global--spacer--lg), } diff --git a/src/routes/components/reports/reportSummary/reportSummaryCost.scss b/src/routes/components/reports/reportSummary/reportSummaryCost.scss index c9f1e03a97..22b63d7963 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryCost.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryCost.scss @@ -1,5 +1,5 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .chart { - margin-bottom: var(--pf-global--spacer--sm); + margin-bottom: var(--pf-v5-global--spacer--sm); } diff --git a/src/routes/components/reports/reportSummary/reportSummaryDailyCost.scss b/src/routes/components/reports/reportSummary/reportSummaryDailyCost.scss index c9f1e03a97..22b63d7963 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryDailyCost.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryDailyCost.scss @@ -1,5 +1,5 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .chart { - margin-bottom: var(--pf-global--spacer--sm); + margin-bottom: var(--pf-v5-global--spacer--sm); } diff --git a/src/routes/components/reports/reportSummary/reportSummaryDailyTrend.scss b/src/routes/components/reports/reportSummary/reportSummaryDailyTrend.scss index 0a23f9d307..47363e31f4 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryDailyTrend.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryDailyTrend.scss @@ -1,5 +1,5 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .chart { - margin-nottom: var(--pf-global--spacer--sm); + margin-nottom: var(--pf-v5-global--spacer--sm); } diff --git a/src/routes/components/reports/reportSummary/reportSummaryDetails.scss b/src/routes/components/reports/reportSummary/reportSummaryDetails.scss index f7bac986d2..c569b949f7 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryDetails.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryDetails.scss @@ -1,40 +1,40 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .reportSummaryDetails { - margin-bottom: var(--pf-global--spacer--md); + margin-bottom: var(--pf-v5-global--spacer--md); display: flex; align-Items: flex-end; } .text { - padding-bottom: var(--pf-global--spacer--sm); - line-height: var(--pf-global--LineHeight--sm); - font-size: var(--pf-global--FontSize--xs); + padding-bottom: var(--pf-v5-global--spacer--sm); + line-height: var(--pf-v5-global--LineHeight--sm); + font-size: var(--pf-v5-global--FontSize--xs); } .units { - padding-left: var(--pf-global--spacer--xs); - padding-bottom: var(--pf-global--spacer--sm); - line-height: var(--pf-global--LineHeight--sm); - font-size: var(--pf-global--FontSize--xs); + padding-left: var(--pf-v5-global--spacer--xs); + padding-bottom: var(--pf-v5-global--spacer--sm); + line-height: var(--pf-v5-global--LineHeight--sm); + font-size: var(--pf-v5-global--FontSize--xs); white-space: nowrap; } .value { - color: var(--pf-global--Color--100); - margin-right: var(--pf-global--spacer--sm); - font-size: var(--pf-global--FontSize--2xl); + color: var(--pf-v5-global--Color--100); + margin-right: var(--pf-v5-global--spacer--sm); + font-size: var(--pf-v5-global--FontSize--2xl); } .valueAlt { - color: var(--pf-global--Color--100); - margin-right: var(--pf-global--spacer--sm); - font-size: var(--pf-global--FontSize--4xl); + color: var(--pf-v5-global--Color--100); + margin-right: var(--pf-v5-global--spacer--sm); + font-size: var(--pf-v5-global--FontSize--4xl); } .valueContainer { display: inline-block; - margin-bottom: var(--pf-global--spacer--md); + margin-bottom: var(--pf-v5-global--spacer--md); width: 50%; word-Wrap: break-word; } diff --git a/src/routes/components/reports/reportSummary/reportSummaryItem.scss b/src/routes/components/reports/reportSummary/reportSummaryItem.scss index 418c0e6c9a..7bcc047b70 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryItem.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryItem.scss @@ -1,5 +1,5 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .reportSummaryItem:not(:last-child) { - margin-bottom: var(--pf-global--spacer--md); + margin-bottom: var(--pf-v5-global--spacer--md); } diff --git a/src/routes/components/reports/reportSummary/reportSummaryItems.scss b/src/routes/components/reports/reportSummary/reportSummaryItems.scss index 63a966fc8b..b8f585f231 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryItems.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryItems.scss @@ -1,5 +1,5 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .skeleton { - margin-top: var(--pf-global--spacer--md); + margin-top: var(--pf-v5-global--spacer--md); } diff --git a/src/routes/components/reports/reportSummary/reportSummaryTrend.scss b/src/routes/components/reports/reportSummary/reportSummaryTrend.scss index 0a23f9d307..47363e31f4 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryTrend.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryTrend.scss @@ -1,5 +1,5 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .chart { - margin-nottom: var(--pf-global--spacer--sm); + margin-nottom: var(--pf-v5-global--spacer--sm); } diff --git a/src/routes/components/reports/reportSummary/reportSummaryUsage.scss b/src/routes/components/reports/reportSummary/reportSummaryUsage.scss index c9f1e03a97..22b63d7963 100644 --- a/src/routes/components/reports/reportSummary/reportSummaryUsage.scss +++ b/src/routes/components/reports/reportSummary/reportSummaryUsage.scss @@ -1,5 +1,5 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .chart { - margin-bottom: var(--pf-global--spacer--sm); + margin-bottom: var(--pf-v5-global--spacer--sm); } diff --git a/src/routes/components/resourceTypeahead/resourceInput.tsx b/src/routes/components/resourceTypeahead/resourceInput.tsx index 54db5163bd..f6220ee970 100644 --- a/src/routes/components/resourceTypeahead/resourceInput.tsx +++ b/src/routes/components/resourceTypeahead/resourceInput.tsx @@ -124,17 +124,13 @@ class ResourceInputBase extends React.Component { - const { search } = this.props; - return (
- {search && search.length && ( - - - {this.getMenuItems()} - - - )} + + + {this.getMenuItems()} + +
); }; diff --git a/src/routes/components/state/emptyFilterState/emptyFilterState.tsx b/src/routes/components/state/emptyFilterState/emptyFilterState.tsx index 6da659ebab..bd1e3dc70c 100644 --- a/src/routes/components/state/emptyFilterState/emptyFilterState.tsx +++ b/src/routes/components/state/emptyFilterState/emptyFilterState.tsx @@ -1,6 +1,5 @@ import type { MessageDescriptor } from '@formatjs/intl/src/types'; -import { EmptyState, EmptyStateBody, EmptyStateIcon, Title, TitleSizes } from '@patternfly/react-core'; -import { Bullseye } from '@patternfly/react-core'; +import { Bullseye, EmptyState, EmptyStateBody, EmptyStateHeader, EmptyStateIcon } from '@patternfly/react-core'; import { SearchIcon } from '@patternfly/react-icons/dist/esm/icons/search-icon'; import type { Query } from 'api/queries/query'; import { parseQuery } from 'api/queries/query'; @@ -115,9 +114,7 @@ const EmptyFilterStateBase: React.FC = ({ > {getItem()} - - {intl.formatMessage(title)} - + {intl.formatMessage(title)}} headingLevel="h2" /> {intl.formatMessage(subTitle)}
diff --git a/src/routes/components/state/emptyValueState/emptyValueState.scss b/src/routes/components/state/emptyValueState/emptyValueState.scss index 11de799fab..ada2615611 100644 --- a/src/routes/components/state/emptyValueState/emptyValueState.scss +++ b/src/routes/components/state/emptyValueState/emptyValueState.scss @@ -1,5 +1,5 @@ @import url("~@patternfly/patternfly/base/patternfly-variables.css"); .emptyValueContainer { - font-size: var(--pf-global--FontSize--sm); + font-size: var(--pf-v5-global--FontSize--sm); } diff --git a/src/routes/components/state/errorState/errorState.tsx b/src/routes/components/state/errorState/errorState.tsx index 579bb821eb..9daa76d01a 100644 --- a/src/routes/components/state/errorState/errorState.tsx +++ b/src/routes/components/state/errorState/errorState.tsx @@ -1,10 +1,9 @@ import { EmptyState, EmptyStateBody, + EmptyStateHeader, EmptyStateIcon, EmptyStateVariant, - Title, - TitleSizes, } from '@patternfly/react-core'; import { ErrorCircleOIcon } from '@patternfly/react-icons/dist/esm/icons/error-circle-o-icon'; import { LockIcon } from '@patternfly/react-icons/dist/esm/icons/lock-icon'; @@ -30,11 +29,8 @@ const ErrorStateBase: React.FC = ({ error, icon = ErrorCircleOI } return ( - - - - {title} - + + {title}} icon={} headingLevel="h5" /> {subTitle} ); diff --git a/src/routes/components/state/loadingState/loadingState.tsx b/src/routes/components/state/loadingState/loadingState.tsx index 6e2eb0ca3b..eed2a95d8f 100644 --- a/src/routes/components/state/loadingState/loadingState.tsx +++ b/src/routes/components/state/loadingState/loadingState.tsx @@ -1,4 +1,4 @@ -import { EmptyState, EmptyStateBody, EmptyStateVariant, Spinner, Title, TitleSizes } from '@patternfly/react-core'; +import { EmptyState, EmptyStateBody, EmptyStateHeader, EmptyStateVariant, Spinner } from '@patternfly/react-core'; import { intl as defaultIntl } from 'components/i18n'; import messages from 'locales/messages'; import React from 'react'; @@ -19,11 +19,9 @@ const LoadingStateBase: React.FC = ({ heading = intl.formatMessage(messages.loadingStateTitle), }) => { return ( - + - - {heading} - + {heading}} headingLevel="h5" /> {body} ); diff --git a/src/routes/details/awsDetails/awsDetails.tsx b/src/routes/details/awsDetails/awsDetails.tsx index 600036b5ff..a615066300 100644 --- a/src/routes/details/awsDetails/awsDetails.tsx +++ b/src/routes/details/awsDetails/awsDetails.tsx @@ -204,7 +204,7 @@ class AwsDetails extends React.Component { page={page} perPage={limit} titles={{ - paginationTitle: intl.formatMessage(messages.paginationTitle, { + paginationAriaLabel: intl.formatMessage(messages.paginationTitle, { title: intl.formatMessage(messages.aws), placement: isBottom ? 'bottom' : 'top', }), diff --git a/src/routes/details/azureDetails/azureDetails.tsx b/src/routes/details/azureDetails/azureDetails.tsx index 869a2fad1c..6704c0b51e 100644 --- a/src/routes/details/azureDetails/azureDetails.tsx +++ b/src/routes/details/azureDetails/azureDetails.tsx @@ -191,7 +191,7 @@ class AzureDetails extends React.Component page={page} perPage={limit} titles={{ - paginationTitle: intl.formatMessage(messages.paginationTitle, { + paginationAriaLabel: intl.formatMessage(messages.paginationTitle, { title: intl.formatMessage(messages.azure), placement: isBottom ? 'bottom' : 'top', }), diff --git a/src/routes/details/components/actions/actions.tsx b/src/routes/details/components/actions/actions.tsx index 1544553046..a25d1914dd 100644 --- a/src/routes/details/components/actions/actions.tsx +++ b/src/routes/details/components/actions/actions.tsx @@ -1,4 +1,4 @@ -import { Dropdown, DropdownItem, KebabToggle } from '@patternfly/react-core'; +import { Dropdown, DropdownItem, KebabToggle } from '@patternfly/react-core/deprecated'; import type { ProviderType } from 'api/providers'; import type { ReportPathsType } from 'api/reports/report'; import messages from 'locales/messages'; @@ -125,7 +125,7 @@ class DetailsActionsBase extends React.Component } + toggle={ this.handleOnToggle(isOpen)} />} isOpen={this.state.isDropdownOpen} isPlain position="right" diff --git a/src/routes/details/components/breakdown/breakdownHeader.scss b/src/routes/details/components/breakdown/breakdownHeader.scss index 2c20d57eba..44af568377 100644 --- a/src/routes/details/components/breakdown/breakdownHeader.scss +++ b/src/routes/details/components/breakdown/breakdownHeader.scss @@ -1,11 +1,11 @@ .breadcrumbOverride { - .pf-c-breadcrumb__item:not(:last-child) { - margin-left: var(--pf-c-breadcrumb__item--MarginRight); + .pf-v5-c-breadcrumb__item:not(:last-child) { + margin-left: var(--pf-v5-c-breadcrumb__item--MarginRight); margin-right: 0; } - .pf-c-breadcrumb__item-divider { + .pf-v5-c-breadcrumb__item-divider { margin-left: 0; - margin-right: var(--pf-c-breadcrumb__item-divider--MarginLeft); + margin-right: var(--pf-v5-c-breadcrumb__item-divider--MarginLeft); } } diff --git a/src/routes/details/components/breakdown/breakdownHeader.tsx b/src/routes/details/components/breakdown/breakdownHeader.tsx index f26473e49f..dacbf57929 100644 --- a/src/routes/details/components/breakdown/breakdownHeader.tsx +++ b/src/routes/details/components/breakdown/breakdownHeader.tsx @@ -163,9 +163,9 @@ class BreakdownHeader extends React.Component {
- ) : undefined, + tooltipProps: { + content: !isWritePermission ? ( +
{intl.formatMessage(messages.readOnlyPermissions)}
+ ) : undefined, + }, onClick: (_evt, _rowIndex, rowData) => { this.setState({ deleteRate: null, @@ -329,9 +331,11 @@ class PriceListTable extends React.Component{intl.formatMessage(messages.readOnlyPermissions)}
- ) : undefined, + tooltipProps: { + content: !isWritePermission ? ( +
{intl.formatMessage(messages.readOnlyPermissions)}
+ ) : undefined, + }, onClick: (_evt, _rowIndex, rowData) => { const rowIndex = rowData.data.stateIndex; this.setState({ @@ -372,7 +376,7 @@ class PriceListTable extends React.Component = ({ canWrite, costModels, intl, const rows: (IRow | string[])[] = costModels.length > 0 ? costModels[0].sources : []; return ( - = ({ canWrite, costModels, intl,