From cec187c243350882ffcc5089a4ecb0a094a0e9e2 Mon Sep 17 00:00:00 2001 From: daniele-mng Date: Thu, 17 Oct 2024 18:06:35 +0200 Subject: [PATCH 01/22] deps: update mantine v7 --- package-lock.json | 417 ++++++------------ package.json | 4 +- src/web/app.jsx | 5 +- src/web/components/dialog/dialog.jsx | 2 +- src/web/components/error/errorpanel.jsx | 6 +- src/web/components/form/DatePicker.jsx | 2 +- src/web/components/form/button.jsx | 3 +- src/web/components/form/checkbox.jsx | 2 +- src/web/components/form/filefield.jsx | 2 +- src/web/components/form/formgroup.jsx | 2 +- src/web/components/form/passwordfield.jsx | 3 +- src/web/components/form/radio.jsx | 2 +- src/web/components/form/select.jsx | 3 +- src/web/components/form/textarea.jsx | 2 +- src/web/components/form/textfield.jsx | 2 +- src/web/components/menu/menu.jsx | 2 +- .../components/powerfilter/powerfilter.jsx | 3 +- src/web/components/structure/header.jsx | 2 +- .../components/structure/languageswitch.jsx | 3 +- .../performance/startendtimeselection.jsx | 2 +- src/web/pages/schedules/dialog.jsx | 2 +- src/web/pages/targets/__tests__/dialog.jsx | 2 +- src/web/utils/testing.jsx | 7 +- src/web/wizard/advancedtaskwizard.jsx | 2 +- src/web/wizard/modifytaskwizard.jsx | 2 +- 25 files changed, 180 insertions(+), 304 deletions(-) diff --git a/package-lock.json b/package-lock.json index f613382291..3d1cc63abe 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,8 +9,8 @@ "version": "24.0.2-dev1", "license": "AGPL-3.0+", "dependencies": { - "@greenbone/opensight-ui-components": "^0.4.1-alpha9", - "@mantine/core": "^6.0.0", + "@greenbone/opensight-ui-components-mantinev7": "^0.0.5-alpha4", + "@mantine/core": "^7.13.3", "@reduxjs/toolkit": "^2.3.0", "@sentry/react": "^8.39.0", "@visx/axis": "^3.12.0", @@ -2540,26 +2540,52 @@ "@floating-ui/utils": "^0.2.0" } }, + "node_modules/@floating-ui/react": { + "version": "0.26.25", + "resolved": "https://registry.npmjs.org/@floating-ui/react/-/react-0.26.25.tgz", + "integrity": "sha512-hZOmgN0NTOzOuZxI1oIrDu3Gcl8WViIkvPMpB4xdd4QD6xAMtwgwr3VPoiyH/bLtRcS1cDnhxLSD1NsMJmwh/A==", + "dependencies": { + "@floating-ui/react-dom": "^2.1.2", + "@floating-ui/utils": "^0.2.8", + "tabbable": "^6.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0", + "react-dom": ">=16.8.0" + } + }, + "node_modules/@floating-ui/react-dom": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.2.tgz", + "integrity": "sha512-06okr5cgPzMNBy+Ycse2A6udMi4bqwW/zgBF/rwjcNqWkyr82Mcg8b0vjX8OJpZFy/FKjJmw6wV7t44kK6kW7A==", + "dependencies": { + "@floating-ui/dom": "^1.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0", + "react-dom": ">=16.8.0" + } + }, "node_modules/@floating-ui/utils": { - "version": "0.2.1", - "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.1.tgz", - "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==" - }, - "node_modules/@greenbone/opensight-ui-components": { - "version": "0.4.1-alpha9", - "resolved": "https://registry.npmjs.org/@greenbone/opensight-ui-components/-/opensight-ui-components-0.4.1-alpha9.tgz", - "integrity": "sha512-xnZiS5PCK/79cA3q7IyITgR08okxoU9eBgZzK9VOpe3ZY28AlXA2BODRuT9KlpoOV2hUSOSYAU3sCUSjt2Du0Q==", - "dependencies": { - "@mantine/core": "^6.x.x", - "@mantine/dates": "^6.x.x", - "@mantine/hooks": "^6.x.x", - "@mantine/notifications": "^6.x.x", + "version": "0.2.8", + "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.8.tgz", + "integrity": "sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==" + }, + "node_modules/@greenbone/opensight-ui-components-mantinev7": { + "version": "0.0.5-alpha4", + "resolved": "https://registry.npmjs.org/@greenbone/opensight-ui-components-mantinev7/-/opensight-ui-components-mantinev7-0.0.5-alpha4.tgz", + "integrity": "sha512-WnzVEPgguyhsOdgvIK1d36Hc7S+JWpkVmzK9Z+Y3Zn5ZrhKGXonpKsIfReF0BKYzyWiNqK3U8SpubM8l2x/cLg==", + "dependencies": { + "@mantine/core": "^7.12.1", + "@mantine/dates": "^7.12.1", + "@mantine/hooks": "^7.12.1", + "@mantine/notifications": "^7.12.1", "lucide-react": "^0.446.0", "luxon": "^3.5.0", - "react": "^18.3.1", - "react-dom": "^18.3.1", + "react": "^18.x.x", + "react-dom": "^18.x.x", "react-hook-form": "^7", - "react-i18next": "^15.0.2", + "react-i18next": "^15.x.x", "react-select": "^5.8.1", "tiny-invariant": "^1.3.3", "urlcat": "^3", @@ -2571,17 +2597,47 @@ "@swc/core-darwin-arm64": "^1.3.107" }, "peerDependencies": { - "@mantine/core": "^6.x.x", - "@mantine/dates": "^6.x.x", - "@mantine/hooks": "^6.x.x", - "@mantine/notifications": "^6.x.x", - "lucide-react": "^0.344.0", + "@mantine/core": "^7.12.1", + "@mantine/dates": "^7.12.1", + "@mantine/hooks": "^7.12.1", + "@mantine/notifications": "^7.12.1", + "lucide-react": "^0.446.0", "react": "^18.x.x", "react-dom": "^18.x.x", - "react-i18next": "^14.x.x" + "react-i18next": "^15.x.x" } }, - "node_modules/@greenbone/opensight-ui-components/node_modules/lucide-react": { + "node_modules/@greenbone/opensight-ui-components-mantinev7/node_modules/@mantine/dates": { + "version": "7.13.3", + "resolved": "https://registry.npmjs.org/@mantine/dates/-/dates-7.13.3.tgz", + "integrity": "sha512-IjClxPcenDq2/iAxhaZyjrCpMhc9ybLfvh4YwEmjWg+pSfdIDtc9VkMSnXv2aYChLybUjNQmIcPibU7Vdu4Z8w==", + "dependencies": { + "clsx": "^2.1.1" + }, + "peerDependencies": { + "@mantine/core": "7.13.3", + "@mantine/hooks": "7.13.3", + "dayjs": ">=1.0.0", + "react": "^18.2.0", + "react-dom": "^18.2.0" + } + }, + "node_modules/@greenbone/opensight-ui-components-mantinev7/node_modules/@mantine/notifications": { + "version": "7.13.3", + "resolved": "https://registry.npmjs.org/@mantine/notifications/-/notifications-7.13.3.tgz", + "integrity": "sha512-G01Bf0g6zA+K6ZdBOIxhGIlpi3qITs6W5Z0fYTSQkzLcJSfECdR5KgRvNpzcx2ESTT8BfJJMsLySwh+WTzcoxw==", + "dependencies": { + "@mantine/store": "7.13.3", + "react-transition-group": "4.4.5" + }, + "peerDependencies": { + "@mantine/core": "7.13.3", + "@mantine/hooks": "7.13.3", + "react": "^18.2.0", + "react-dom": "^18.2.0" + } + }, + "node_modules/@greenbone/opensight-ui-components-mantinev7/node_modules/lucide-react": { "version": "0.446.0", "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.446.0.tgz", "integrity": "sha512-BU7gy8MfBMqvEdDPH79VhOXSEgyG8TSPOKWaExWGCQVqnGH7wGgDngPbofu+KdtVjPQBWbEmnfMTq90CTiiDRg==", @@ -2589,6 +2645,21 @@ "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0-rc" } }, + "node_modules/@greenbone/opensight-ui-components-mantinev7/node_modules/react-transition-group": { + "version": "4.4.5", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", + "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==", + "dependencies": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + }, + "peerDependencies": { + "react": ">=16.6.0", + "react-dom": ">=16.6.0" + } + }, "node_modules/@humanwhocodes/config-array": { "version": "0.13.0", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz", @@ -2754,119 +2825,48 @@ } }, "node_modules/@mantine/core": { - "version": "6.0.21", - "resolved": "https://registry.npmjs.org/@mantine/core/-/core-6.0.21.tgz", - "integrity": "sha512-Kx4RrRfv0I+cOCIcsq/UA2aWcYLyXgW3aluAuW870OdXnbII6qg7RW28D+r9D76SHPxWFKwIKwmcucAG08Divg==", + "version": "7.13.3", + "resolved": "https://registry.npmjs.org/@mantine/core/-/core-7.13.3.tgz", + "integrity": "sha512-IV8xSr6rFQefKr2iOEhYYkJ6rZTDEp71qNkAfn90toSNjgT/2bgnqOxXwxqZ3bwo9DyNOAbEDzs1EfdIzln5aA==", "dependencies": { - "@floating-ui/react": "^0.19.1", - "@mantine/styles": "6.0.21", - "@mantine/utils": "6.0.21", - "@radix-ui/react-scroll-area": "1.0.2", - "react-remove-scroll": "^2.5.5", - "react-textarea-autosize": "8.3.4" + "@floating-ui/react": "^0.26.9", + "clsx": "^2.1.1", + "react-number-format": "^5.3.1", + "react-remove-scroll": "^2.5.7", + "react-textarea-autosize": "8.5.3", + "type-fest": "^4.12.0" }, "peerDependencies": { - "@mantine/hooks": "6.0.21", - "react": ">=16.8.0", - "react-dom": ">=16.8.0" + "@mantine/hooks": "7.13.3", + "react": "^18.2.0", + "react-dom": "^18.2.0" } }, - "node_modules/@mantine/core/node_modules/@floating-ui/react": { - "version": "0.19.2", - "resolved": "https://registry.npmjs.org/@floating-ui/react/-/react-0.19.2.tgz", - "integrity": "sha512-JyNk4A0Ezirq8FlXECvRtQOX/iBe5Ize0W/pLkrZjfHW9GUV7Xnq6zm6fyZuQzaHHqEnVizmvlA96e1/CkZv+w==", - "dependencies": { - "@floating-ui/react-dom": "^1.3.0", - "aria-hidden": "^1.1.3", - "tabbable": "^6.0.1" - }, - "peerDependencies": { - "react": ">=16.8.0", - "react-dom": ">=16.8.0" - } - }, - "node_modules/@mantine/core/node_modules/@floating-ui/react-dom": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-1.3.0.tgz", - "integrity": "sha512-htwHm67Ji5E/pROEAr7f8IKFShuiCKHwUC/UY4vC3I5jiSvGFAYnSYiZO5MlGmads+QqvUkR9ANHEguGrDv72g==", - "dependencies": { - "@floating-ui/dom": "^1.2.1" - }, - "peerDependencies": { - "react": ">=16.8.0", - "react-dom": ">=16.8.0" - } - }, - "node_modules/@mantine/dates": { - "version": "6.0.21", - "resolved": "https://registry.npmjs.org/@mantine/dates/-/dates-6.0.21.tgz", - "integrity": "sha512-nSX7MxNkHyyDJqEJOT7Wg930jBfgWz+3pnoWo601cYDvFjh5GgcRz66v36rnMJFK1/56k5G9rWzUOzuM94j6hg==", - "dependencies": { - "@mantine/utils": "6.0.21" + "node_modules/@mantine/core/node_modules/type-fest": { + "version": "4.26.1", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.26.1.tgz", + "integrity": "sha512-yOGpmOAL7CkKe/91I5O3gPICmJNLJ1G4zFYVAsRHg7M64biSnPtRj0WNQt++bRkjYOqjWXrhnUw1utzmVErAdg==", + "engines": { + "node": ">=16" }, - "peerDependencies": { - "@mantine/core": "6.0.21", - "@mantine/hooks": "6.0.21", - "dayjs": ">=1.0.0", - "react": ">=16.8.0" + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/@mantine/hooks": { - "version": "6.0.21", - "resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-6.0.21.tgz", - "integrity": "sha512-sYwt5wai25W6VnqHbS5eamey30/HD5dNXaZuaVEAJ2i2bBv8C0cCiczygMDpAFiSYdXoSMRr/SZ2CrrPTzeNew==", - "peerDependencies": { - "react": ">=16.8.0" - } - }, - "node_modules/@mantine/notifications": { - "version": "6.0.21", - "resolved": "https://registry.npmjs.org/@mantine/notifications/-/notifications-6.0.21.tgz", - "integrity": "sha512-qsrqxuJHK8b67sf9Pfk+xyhvpf9jMsivW8vchfnJfjv7yz1lLvezjytMFp4fMDoYhjHnDPOEc/YFockK4muhOw==", - "dependencies": { - "@mantine/utils": "6.0.21", - "react-transition-group": "4.4.2" - }, + "version": "7.13.3", + "resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-7.13.3.tgz", + "integrity": "sha512-r2c+Z8CdvPKFeOwg6mSJmxOp9K/ave5ZFR7eJbgv4wQU8K1CAS5f5ven9K5uUX8Vf9B5dFnSaSgYp9UY3vOWTw==", "peerDependencies": { - "@mantine/core": "6.0.21", - "@mantine/hooks": "6.0.21", - "react": ">=16.8.0", - "react-dom": ">=16.8.0" - } - }, - "node_modules/@mantine/styles": { - "version": "6.0.21", - "resolved": "https://registry.npmjs.org/@mantine/styles/-/styles-6.0.21.tgz", - "integrity": "sha512-PVtL7XHUiD/B5/kZ/QvZOZZQQOj12QcRs3Q6nPoqaoPcOX5+S7bMZLMH0iLtcGq5OODYk0uxlvuJkOZGoPj8Mg==", - "dependencies": { - "clsx": "1.1.1", - "csstype": "3.0.9" - }, - "peerDependencies": { - "@emotion/react": ">=11.9.0", - "react": ">=16.8.0", - "react-dom": ">=16.8.0" - } - }, - "node_modules/@mantine/styles/node_modules/clsx": { - "version": "1.1.1", - "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz", - "integrity": "sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==", - "engines": { - "node": ">=6" + "react": "^18.2.0" } }, - "node_modules/@mantine/styles/node_modules/csstype": { - "version": "3.0.9", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.9.tgz", - "integrity": "sha512-rpw6JPxK6Rfg1zLOYCSwle2GFOOsnjmDYDaBwEcwoOg4qlsIVCN789VkBZDJAGi4T07gI4YSutR43t9Zz4Lzuw==" - }, - "node_modules/@mantine/utils": { - "version": "6.0.21", - "resolved": "https://registry.npmjs.org/@mantine/utils/-/utils-6.0.21.tgz", - "integrity": "sha512-33RVDRop5jiWFao3HKd3Yp7A9mEq4HAJxJPTuYm1NkdqX6aTKOQK7wT8v8itVodBp+sb4cJK6ZVdD1UurK/txQ==", + "node_modules/@mantine/store": { + "version": "7.13.3", + "resolved": "https://registry.npmjs.org/@mantine/store/-/store-7.13.3.tgz", + "integrity": "sha512-95nAgH6APhak1OwP2W3ogdWBiWkIDhDSbQEm2G9LTJLIJxzWSm1mLe5uDWluVEPZW2XFx137McuJb58i1A+QhQ==", "peerDependencies": { - "react": ">=16.8.0" + "react": "^18.2.0" } }, "node_modules/@nicolo-ribaudo/chokidar-2": { @@ -2933,137 +2933,6 @@ "integrity": "sha512-8LduaNlMZGwdZ6qWrKlfa+2M4gahzFkprZiAt2TF8uS0qQgBizKXpXURqvTJ4WtmupWxaLqjRb2UCTe72mu+Aw==", "dev": true }, - "node_modules/@radix-ui/number": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@radix-ui/number/-/number-1.0.0.tgz", - "integrity": "sha512-Ofwh/1HX69ZfJRiRBMTy7rgjAzHmwe4kW9C9Y99HTRUcYLUuVT0KESFj15rPjRgKJs20GPq8Bm5aEDJ8DuA3vA==", - "dependencies": { - "@babel/runtime": "^7.13.10" - } - }, - "node_modules/@radix-ui/primitive": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.0.0.tgz", - "integrity": "sha512-3e7rn8FDMin4CgeL7Z/49smCA3rFYY3Ha2rUQ7HRWFadS5iCRw08ZgVT1LaNTCNqgvrUiyczLflrVrF0SRQtNA==", - "dependencies": { - "@babel/runtime": "^7.13.10" - } - }, - "node_modules/@radix-ui/react-compose-refs": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.0.tgz", - "integrity": "sha512-0KaSv6sx787/hK3eF53iOkiSLwAGlFMx5lotrqD2pTjB18KbybKoEIgkNZTKC60YECDQTKGTRcDBILwZVqVKvA==", - "dependencies": { - "@babel/runtime": "^7.13.10" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0" - } - }, - "node_modules/@radix-ui/react-context": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.0.0.tgz", - "integrity": "sha512-1pVM9RfOQ+n/N5PJK33kRSKsr1glNxomxONs5c49MliinBY6Yw2Q995qfBUUo0/Mbg05B/sGA0gkgPI7kmSHBg==", - "dependencies": { - "@babel/runtime": "^7.13.10" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0" - } - }, - "node_modules/@radix-ui/react-direction": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@radix-ui/react-direction/-/react-direction-1.0.0.tgz", - "integrity": "sha512-2HV05lGUgYcA6xgLQ4BKPDmtL+QbIZYH5fCOTAOOcJ5O0QbWS3i9lKaurLzliYUDhORI2Qr3pyjhJh44lKA3rQ==", - "dependencies": { - "@babel/runtime": "^7.13.10" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0" - } - }, - "node_modules/@radix-ui/react-presence": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.0.0.tgz", - "integrity": "sha512-A+6XEvN01NfVWiKu38ybawfHsBjWum42MRPnEuqPsBZ4eV7e/7K321B5VgYMPv3Xx5An6o1/l9ZuDBgmcmWK3w==", - "dependencies": { - "@babel/runtime": "^7.13.10", - "@radix-ui/react-compose-refs": "1.0.0", - "@radix-ui/react-use-layout-effect": "1.0.0" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0", - "react-dom": "^16.8 || ^17.0 || ^18.0" - } - }, - "node_modules/@radix-ui/react-primitive": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-1.0.1.tgz", - "integrity": "sha512-fHbmislWVkZaIdeF6GZxF0A/NH/3BjrGIYj+Ae6eTmTCr7EB0RQAAVEiqsXK6p3/JcRqVSBQoceZroj30Jj3XA==", - "dependencies": { - "@babel/runtime": "^7.13.10", - "@radix-ui/react-slot": "1.0.1" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0", - "react-dom": "^16.8 || ^17.0 || ^18.0" - } - }, - "node_modules/@radix-ui/react-scroll-area": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/@radix-ui/react-scroll-area/-/react-scroll-area-1.0.2.tgz", - "integrity": "sha512-k8VseTxI26kcKJaX0HPwkvlNBPTs56JRdYzcZ/vzrNUkDlvXBy8sMc7WvCpYzZkHgb+hd72VW9MqkqecGtuNgg==", - "dependencies": { - "@babel/runtime": "^7.13.10", - "@radix-ui/number": "1.0.0", - "@radix-ui/primitive": "1.0.0", - "@radix-ui/react-compose-refs": "1.0.0", - "@radix-ui/react-context": "1.0.0", - "@radix-ui/react-direction": "1.0.0", - "@radix-ui/react-presence": "1.0.0", - "@radix-ui/react-primitive": "1.0.1", - "@radix-ui/react-use-callback-ref": "1.0.0", - "@radix-ui/react-use-layout-effect": "1.0.0" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0", - "react-dom": "^16.8 || ^17.0 || ^18.0" - } - }, - "node_modules/@radix-ui/react-slot": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.0.1.tgz", - "integrity": "sha512-avutXAFL1ehGvAXtPquu0YK5oz6ctS474iM3vNGQIkswrVhdrS52e3uoMQBzZhNRAIE0jBnUyXWNmSjGHhCFcw==", - "dependencies": { - "@babel/runtime": "^7.13.10", - "@radix-ui/react-compose-refs": "1.0.0" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0" - } - }, - "node_modules/@radix-ui/react-use-callback-ref": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.0.tgz", - "integrity": "sha512-GZtyzoHz95Rhs6S63D2t/eqvdFCm7I+yHMLVQheKM7nBD8mbZIt+ct1jz4536MDnaOGKIxynJ8eHTkVGVVkoTg==", - "dependencies": { - "@babel/runtime": "^7.13.10" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0" - } - }, - "node_modules/@radix-ui/react-use-layout-effect": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.0.tgz", - "integrity": "sha512-6Tpkq+R6LOlmQb1R5NNETLG0B4YP0wc+klfXafpUCj6JGyaUc8il7/kUZ7m59rGbXGczE9Bs+iz2qloqsZBduQ==", - "dependencies": { - "@babel/runtime": "^7.13.10" - }, - "peerDependencies": { - "react": "^16.8 || ^17.0 || ^18.0" - } - }, "node_modules/@reduxjs/toolkit": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.3.0.tgz", @@ -4757,17 +4626,6 @@ "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", "dev": true }, - "node_modules/aria-hidden": { - "version": "1.2.4", - "resolved": "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.4.tgz", - "integrity": "sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==", - "dependencies": { - "tslib": "^2.0.0" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/aria-query": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz", @@ -5408,6 +5266,14 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/clsx": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", + "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", + "engines": { + "node": ">=6" + } + }, "node_modules/color-convert": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", @@ -9817,6 +9683,15 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz", "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==" }, + "node_modules/react-number-format": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.4.2.tgz", + "integrity": "sha512-cg//jVdS49PYDgmcYoBnMMHl4XNTMuV723ZnHD2aXYtWWWqbVF3hjQ8iB+UZEuXapLbeA8P8H+1o6ZB1lcw3vg==", + "peerDependencies": { + "react": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/react-redux": { "version": "9.1.2", "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.1.2.tgz", @@ -9966,11 +9841,11 @@ } }, "node_modules/react-textarea-autosize": { - "version": "8.3.4", - "resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-8.3.4.tgz", - "integrity": "sha512-CdtmP8Dc19xL8/R6sWvtknD/eCXkQr30dtvC4VmGInhRsfF8X/ihXCq6+9l9qbxmKRiq407/7z5fxE7cVWQNgQ==", + "version": "8.5.3", + "resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-8.5.3.tgz", + "integrity": "sha512-XT1024o2pqCuZSuBt9FwHlaDeNtVrtCXu0Rnz88t1jUGheCLa3PhjE1GH8Ctm2axEtvdCl5SUHYschyQ0L5QHQ==", "dependencies": { - "@babel/runtime": "^7.10.2", + "@babel/runtime": "^7.20.13", "use-composed-ref": "^1.3.0", "use-latest": "^1.2.1" }, diff --git a/package.json b/package.json index 4d1c8941e0..4d448a13e7 100644 --- a/package.json +++ b/package.json @@ -32,8 +32,8 @@ "node": ">=18.0" }, "dependencies": { - "@greenbone/opensight-ui-components": "^0.4.1-alpha9", - "@mantine/core": "^6.0.0", + "@greenbone/opensight-ui-components-mantinev7": "^0.0.5-alpha4", + "@mantine/core": "^7.13.3", "@reduxjs/toolkit": "^2.3.0", "@sentry/react": "^8.39.0", "@visx/axis": "^3.12.0", diff --git a/src/web/app.jsx b/src/web/app.jsx index d82caee741..7bfc0048b3 100644 --- a/src/web/app.jsx +++ b/src/web/app.jsx @@ -7,7 +7,10 @@ import React from 'react'; import {Provider as StoreProvider} from 'react-redux'; -import {ThemeProvider, theme} from '@greenbone/opensight-ui-components'; +import { + ThemeProvider, + theme, +} from '@greenbone/opensight-ui-components-mantinev7'; import Gmp from 'gmp'; import GmpSettings from 'gmp/gmpsettings'; diff --git a/src/web/components/dialog/dialog.jsx b/src/web/components/dialog/dialog.jsx index 77ddd21c89..c682c6ad11 100644 --- a/src/web/components/dialog/dialog.jsx +++ b/src/web/components/dialog/dialog.jsx @@ -5,7 +5,7 @@ import React, {useCallback} from 'react'; -import {Modal} from '@greenbone/opensight-ui-components'; +import {Modal} from '@greenbone/opensight-ui-components-mantinev7'; import {isDefined, isFunction} from 'gmp/utils/identity'; diff --git a/src/web/components/error/errorpanel.jsx b/src/web/components/error/errorpanel.jsx index 4ccc8a0f6a..d05cc22790 100644 --- a/src/web/components/error/errorpanel.jsx +++ b/src/web/components/error/errorpanel.jsx @@ -3,7 +3,6 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ - import React, {useState} from 'react'; import styled from 'styled-components'; @@ -18,7 +17,7 @@ import PropTypes from 'web/utils/proptypes'; import Theme from 'web/utils/theme'; import ErrorMessage from './errormessage'; -import {Button as OpenSightButton} from '@greenbone/opensight-ui-components'; +import {Button as OpenSightButton} from '@greenbone/opensight-ui-components-mantinev7'; const ErrorDetails = styled.div` margin-top: 10px; @@ -47,8 +46,7 @@ const ErrorPanel = ({error, message, info}) => { > {isDefined(error) && ( ); }; diff --git a/src/web/components/form/textarea.jsx b/src/web/components/form/textarea.jsx index de3710689a..096abf3626 100644 --- a/src/web/components/form/textarea.jsx +++ b/src/web/components/form/textarea.jsx @@ -5,7 +5,7 @@ import React from 'react'; -import {Textarea as GreenboneTextArea} from '@greenbone/opensight-ui-components'; +import {Textarea as GreenboneTextArea} from '@greenbone/opensight-ui-components-mantinev7'; import {isDefined} from 'gmp/utils/identity'; diff --git a/src/web/components/form/textfield.jsx b/src/web/components/form/textfield.jsx index 1a7339dca2..7dc5e73e51 100644 --- a/src/web/components/form/textfield.jsx +++ b/src/web/components/form/textfield.jsx @@ -5,7 +5,7 @@ import React from 'react'; -import {Input} from '@greenbone/opensight-ui-components'; +import {Input} from '@greenbone/opensight-ui-components-mantinev7'; import {isDefined} from 'gmp/utils/identity'; diff --git a/src/web/components/menu/menu.jsx b/src/web/components/menu/menu.jsx index 83bfc9204d..9fba6c44c7 100644 --- a/src/web/components/menu/menu.jsx +++ b/src/web/components/menu/menu.jsx @@ -5,7 +5,7 @@ import React from 'react'; -import {AppNavigation} from '@greenbone/opensight-ui-components'; +import {AppNavigation} from '@greenbone/opensight-ui-components-mantinev7'; import useTranslation from 'web/hooks/useTranslation'; import useCapabilities from 'web/hooks/useCapabilities'; diff --git a/src/web/components/powerfilter/powerfilter.jsx b/src/web/components/powerfilter/powerfilter.jsx index b20f315e09..0b4ee98f9d 100644 --- a/src/web/components/powerfilter/powerfilter.jsx +++ b/src/web/components/powerfilter/powerfilter.jsx @@ -3,7 +3,6 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ - import React from 'react'; import styled from 'styled-components'; @@ -189,7 +188,7 @@ class PowerFilter extends React.Component { { title={titles[nextLanguage]} color="neutral.0" > - {language === LANGUAGES.EN ? : } + {language === LANGUAGES.EN ?
en
:
de
} ); }; diff --git a/src/web/pages/performance/startendtimeselection.jsx b/src/web/pages/performance/startendtimeselection.jsx index 6330ebf588..9cf447b0e1 100644 --- a/src/web/pages/performance/startendtimeselection.jsx +++ b/src/web/pages/performance/startendtimeselection.jsx @@ -12,7 +12,7 @@ import PropTypes from 'web/utils/proptypes'; import Button from 'web/components/form/button'; import DatePicker from 'web/components/form/DatePicker'; import FormGroup from 'web/components/form/formgroup'; -import {TimePicker} from '@greenbone/opensight-ui-components'; +import {TimePicker} from '@greenbone/opensight-ui-components-mantinev7'; import Column from 'web/components/layout/column'; import Row from 'web/components/layout/row'; diff --git a/src/web/pages/schedules/dialog.jsx b/src/web/pages/schedules/dialog.jsx index bf00f9574b..4d3df17ecb 100644 --- a/src/web/pages/schedules/dialog.jsx +++ b/src/web/pages/schedules/dialog.jsx @@ -20,7 +20,7 @@ import Spinner from 'web/components/form/spinner'; import FormGroup from 'web/components/form/formgroup'; import TextField from 'web/components/form/textfield'; import DatePicker from 'web/components/form/DatePicker'; -import {TimePicker} from '@greenbone/opensight-ui-components'; +import {TimePicker} from '@greenbone/opensight-ui-components-mantinev7'; import TimeZoneSelect from 'web/components/form/timezoneselect'; import CheckBox from 'web/components/form/checkbox'; diff --git a/src/web/pages/targets/__tests__/dialog.jsx b/src/web/pages/targets/__tests__/dialog.jsx index 4d693a8452..c1be75f3ed 100644 --- a/src/web/pages/targets/__tests__/dialog.jsx +++ b/src/web/pages/targets/__tests__/dialog.jsx @@ -54,7 +54,7 @@ const credentials = [cred1, cred2, cred3, cred4]; const gmp = {settings: {enableGreenboneSensor: true}}; describe('TargetDialog component tests', () => { - test('should render with default values', () => { + test.only('should render with default values', () => { const handleClose = testing.fn(); const handleChange = testing.fn(); const handleSave = testing.fn(); diff --git a/src/web/utils/testing.jsx b/src/web/utils/testing.jsx index 6eea9d437f..be41122e69 100644 --- a/src/web/utils/testing.jsx +++ b/src/web/utils/testing.jsx @@ -24,7 +24,10 @@ import { } from '@testing-library/react/pure'; import userEvent, {PointerEventsCheckLevel} from '@testing-library/user-event'; -import {ThemeProvider, theme} from '@greenbone/opensight-ui-components'; +import { + ThemeProvider, + theme, +} from '@greenbone/opensight-ui-components-mantinev7'; import {BrowserRouter} from 'react-router-dom'; @@ -100,7 +103,7 @@ export const render = ui => { }), baseElement, container, - element: hasValue(container) ? container.firstChild : undefined, + element: hasValue(container) ? container : undefined, getAllByName: name => getAllByName(baseElement, name), getByName: name => getByName(baseElement, name), queryByName: name => queryByName(baseElement, name), diff --git a/src/web/wizard/advancedtaskwizard.jsx b/src/web/wizard/advancedtaskwizard.jsx index a8022eae8b..52ff3db062 100644 --- a/src/web/wizard/advancedtaskwizard.jsx +++ b/src/web/wizard/advancedtaskwizard.jsx @@ -23,7 +23,7 @@ import TextField from 'web/components/form/textfield'; import Radio from 'web/components/form/radio'; import DatePicker from 'web/components/form/DatePicker'; import TimeZoneSelect from 'web/components/form/timezoneselect'; -import {TimePicker} from '@greenbone/opensight-ui-components'; +import {TimePicker} from '@greenbone/opensight-ui-components-mantinev7'; import {formatSplitTime} from 'web/utils/timePickerHelpers'; import Layout from 'web/components/layout/layout'; diff --git a/src/web/wizard/modifytaskwizard.jsx b/src/web/wizard/modifytaskwizard.jsx index 44eb217ccd..fb553eaefc 100644 --- a/src/web/wizard/modifytaskwizard.jsx +++ b/src/web/wizard/modifytaskwizard.jsx @@ -17,7 +17,7 @@ import Radio from 'web/components/form/radio'; import TextField from 'web/components/form/textfield'; import TimeZoneSelect from 'web/components/form/timezoneselect'; import DatePicker from 'web/components/form/DatePicker'; -import {TimePicker} from '@greenbone/opensight-ui-components'; +import {TimePicker} from '@greenbone/opensight-ui-components-mantinev7'; import Layout from 'web/components/layout/layout'; import Column from 'web/components/layout/column'; From 7b059788265004fac87d1250e9379f1a6612a35b Mon Sep 17 00:00:00 2001 From: daniele-mng Date: Fri, 18 Oct 2024 10:45:58 +0200 Subject: [PATCH 02/22] change: update tests --- .../components/comment/__tests__/comment.jsx | 7 - src/web/components/dialog/__tests__/error.jsx | 5 +- .../error/__tests__/errorboundary.jsx | 5 +- .../components/form/__tests__/filefield.jsx | 14 +- .../components/form/__tests__/multiselect.jsx | 232 +++++++----------- .../components/form/__tests__/numberfield.jsx | 30 +-- src/web/components/form/__tests__/select.jsx | 10 +- src/web/components/form/__tests__/spinner.jsx | 53 +--- src/web/components/form/numberfield.jsx | 113 +++++---- src/web/components/form/select.jsx | 11 +- src/web/components/form/spinner.jsx | 10 +- src/web/components/icon/__tests__/icon.jsx | 13 +- src/web/components/icon/__tests__/svgicon.jsx | 2 +- src/web/components/link/__tests__/link.jsx | 13 +- .../__tests__/__snapshots__/portal.jsx.snap | 59 ++++- .../__tests__/relationselector.jsx | 26 +- .../powerfilter/__tests__/tasktrendgroup.jsx | 6 +- src/web/components/testing.js | 31 +-- src/web/entity/icon/__tests__/createicon.jsx | 4 +- .../entity/icon/__tests__/observericon.jsx | 6 +- .../pages/alerts/__tests__/detailspage.jsx | 28 ++- src/web/pages/alerts/__tests__/listpage.jsx | 4 +- src/web/pages/audits/__tests__/actions.jsx | 2 +- .../pages/audits/__tests__/detailspage.jsx | 40 +-- .../credentials/__tests__/detailspage.jsx | 28 ++- src/web/pages/cves/__tests__/detailspage.jsx | 50 ++-- .../extras/__tests__/cvsscalculatorpage.jsx | 18 +- .../cvssV4/__tests__/cvssV4Calculator.jsx | 24 +- .../pages/extras/cvssV4/__tests__/metrics.jsx | 6 +- src/web/pages/hosts/__tests__/detailspage.jsx | 16 +- src/web/pages/notes/__tests__/detailspage.jsx | 54 ++-- src/web/pages/nvts/__tests__/detailspage.jsx | 134 +++++----- .../pages/overrides/__tests__/detailspage.jsx | 56 +++-- .../pages/policies/__tests__/detailspage.jsx | 60 ++--- src/web/pages/policies/__tests__/listpage.jsx | 4 +- .../reportconfigs/__tests__/component.jsx | 6 +- .../reportconfigs/__tests__/detailspage.jsx | 8 +- .../pages/reportconfigs/__tests__/dialog.jsx | 27 +- .../__tests__/auditdeltadetailspage.jsx | 12 +- .../reports/__tests__/auditdetailscontent.jsx | 16 +- .../reports/__tests__/detailscontent.jsx | 12 +- .../pages/results/__tests__/detailspage.jsx | 16 +- .../scanconfigs/__tests__/detailspage.jsx | 64 +++-- .../__tests__/editnvtdetailsdialog.jsx | 5 +- .../pages/schedules/__tests__/detailspage.jsx | 44 ++-- src/web/pages/schedules/__tests__/dialog.jsx | 6 +- .../pages/targets/__tests__/detailspage.jsx | 66 ++--- src/web/pages/targets/__tests__/dialog.jsx | 16 +- .../__tests__/autodeletereportsgroup.jsx | 22 -- src/web/pages/tasks/__tests__/detailspage.jsx | 44 ++-- .../tasks/icons/__tests__/resumeicon.jsx | 4 +- .../pages/tasks/icons/__tests__/starticon.jsx | 8 +- .../pages/tasks/icons/__tests__/stopicon.jsx | 15 +- .../pages/tickets/__tests__/editdialog.jsx | 6 +- .../tlscertificates/__tests__/detailspage.jsx | 30 ++- src/web/setupTests.js | 4 +- src/web/utils/testing.jsx | 3 +- 57 files changed, 788 insertions(+), 820 deletions(-) diff --git a/src/web/components/comment/__tests__/comment.jsx b/src/web/components/comment/__tests__/comment.jsx index 66dda5b7b0..da8ea26dec 100644 --- a/src/web/components/comment/__tests__/comment.jsx +++ b/src/web/components/comment/__tests__/comment.jsx @@ -3,7 +3,6 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ - import {describe, test, expect} from '@gsa/testing'; import {render} from 'web/utils/testing'; @@ -11,12 +10,6 @@ import {render} from 'web/utils/testing'; import Comment from '../comment'; describe('Comment tests', () => { - test('should render comment', () => { - const {element} = render(); - - expect(element).toMatchSnapshot(); - }); - test('should render children', () => { const {element} = render(Hello World); diff --git a/src/web/components/dialog/__tests__/error.jsx b/src/web/components/dialog/__tests__/error.jsx index 4e445954dc..1b5bfc5679 100644 --- a/src/web/components/dialog/__tests__/error.jsx +++ b/src/web/components/dialog/__tests__/error.jsx @@ -20,9 +20,10 @@ describe('Dialog error tests', () => { }); test('should not render with undefined error', () => { - const {element} = render( {}} />); + const {container} = render( {}} />); - expect(element).toBe(null); + const divElement = container.querySelector('div'); + expect(divElement).not.toBeInTheDocument(); }); test('should call close handler', () => { diff --git a/src/web/components/error/__tests__/errorboundary.jsx b/src/web/components/error/__tests__/errorboundary.jsx index 12a087f09a..2ba4f729c4 100644 --- a/src/web/components/error/__tests__/errorboundary.jsx +++ b/src/web/components/error/__tests__/errorboundary.jsx @@ -3,7 +3,6 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ - /* eslint-disable no-console */ import {describe, test, expect} from '@gsa/testing'; @@ -17,13 +16,13 @@ const ThrowError = () => { describe('ErrorBoundary tests', () => { test('should render children if no error occurs', () => { - const {container, element} = render( + const {element} = render( foo , ); - expect(container.childNodes.length).toEqual(1); + expect(element.childNodes.length).toEqual(1); expect(element.nodeName).toEqual('SPAN'); expect(element).toHaveTextContent('foo'); }); diff --git a/src/web/components/form/__tests__/filefield.jsx b/src/web/components/form/__tests__/filefield.jsx index 6e9cc9b85a..780009aaab 100644 --- a/src/web/components/form/__tests__/filefield.jsx +++ b/src/web/components/form/__tests__/filefield.jsx @@ -19,9 +19,9 @@ describe('FileField tests', () => { test('should call change handler with file', () => { const onChange = testing.fn(); - const {element} = render(); + const {baseElement} = render(); - const input = element.querySelector('input[type=file]'); + const input = baseElement.querySelector('input[type=file]'); fireEvent.change(input, {target: {files: ['bar']}}); @@ -31,9 +31,9 @@ describe('FileField tests', () => { test('should call change handler with file and name', () => { const onChange = testing.fn(); - const {element} = render(); + const {baseElement} = render(); - const input = element.querySelector('input[type=file]'); + const input = baseElement.querySelector('input[type=file]'); fireEvent.change(input, {target: {files: ['bar']}}); @@ -43,9 +43,11 @@ describe('FileField tests', () => { test('should not call change handler if disabled', () => { const onChange = testing.fn(); - const {element} = render(); + const {baseElement} = render( + , + ); - const input = element.querySelector('input[type=file]'); + const input = baseElement.querySelector('input[type=file]'); fireEvent.change(input, {target: {files: ['bar']}}); diff --git a/src/web/components/form/__tests__/multiselect.jsx b/src/web/components/form/__tests__/multiselect.jsx index 8722878177..0038f7e43f 100644 --- a/src/web/components/form/__tests__/multiselect.jsx +++ b/src/web/components/form/__tests__/multiselect.jsx @@ -3,231 +3,177 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ - import {describe, test, expect, testing} from '@gsa/testing'; -import {render, screen} from 'web/utils/testing'; +import {render, screen, userEvent, within} from 'web/utils/testing'; import { - changeSelectInput, clickElement, getMultiSelectElement, - getSelectElement, - getSelectItemElements, getSelectItemElementsForMultiSelect, getSelectedItems, - openMultiSelectElement, - openSelectElement, } from 'web/components/testing'; import MultiSelect from '../multiselect'; describe('MultiSelect tests', () => { test('should render', () => { - const {element} = render(); + render(); - expect(element).toBeVisible(); + const multiSelect = getMultiSelectElement(screen); + expect(multiSelect).toBeVisible(); }); test('should render with items', async () => { const items = [ - { - value: 'bar', - label: 'Bar', - }, - { - value: 'foo', - label: 'Foo', - }, + {value: 'bar', label: 'Bar'}, + {value: 'foo', label: 'Foo'}, ]; render(); - expect(getSelectItemElements().length).toEqual(0); + expect(screen.queryAllByRole('option').length).toEqual(0); + + const multiSelect = getMultiSelectElement(screen); + await clickElement(multiSelect); - const multiSelect = getMultiSelectElement(); - const domItems = await getSelectItemElementsForMultiSelect(multiSelect); - expect(domItems.length).toEqual(2); - expect(domItems[0]).toHaveTextContent('Bar'); - expect(domItems[1]).toHaveTextContent('Foo'); + const options = getSelectItemElementsForMultiSelect(screen); + expect(options.length).toEqual(2); + expect(options[0]).toHaveTextContent('Bar'); + expect(options[1]).toHaveTextContent('Foo'); }); test('should render loading', async () => { - const items = [ - { - value: '0', - label: '--', - }, - ]; + const items = [{value: '0', label: '--'}]; render(); - const element = getSelectElement(); - - expect(element).toHaveAttribute('placeholder', 'Loading...'); + const element = screen.getByPlaceholderText('Loading...'); + expect(screen.queryAllByRole('option').length).toEqual(0); - expect(getSelectItemElements().length).toEqual(0); - - await openSelectElement(element); - - expect(getSelectItemElements().length).toEqual(0); + expect(element).toBeInTheDocument(); + expect(element).toHaveAttribute('readonly'); }); test('should render error', () => { - const items = [ - { - value: '0', - label: '--', - }, - ]; + const items = [{value: '0', label: '--'}]; render(); - getSelectElement(); - expect(screen.getByText('Some Error')).toBeVisible(); }); test('should call onChange handler', async () => { const items = [ - { - value: 'bar', - label: 'Bar', - }, - { - value: 'foo', - label: 'Foo', - }, + {value: 'bar', label: 'Bar'}, + {value: 'foo', label: 'Foo'}, ]; const onChange = testing.fn(); render(); - await openSelectElement(); - - const domItems = getSelectItemElements(); - expect(domItems.length).toEqual(2); - - await clickElement(domItems[1]); + const multiSelect = getMultiSelectElement(screen); + await clickElement(multiSelect); + const options = getSelectItemElementsForMultiSelect(screen); + expect(options.length).toEqual(2); + await clickElement(options[1]); expect(onChange).toHaveBeenCalledWith(['foo'], undefined); }); - test('should call onChange handler with name', async () => { - const items = [ - { - value: 'bar', - label: 'Bar', - }, - { - value: 'foo', - label: 'Foo', - }, - ]; - - const onChange = testing.fn(); - - render(); - - await openSelectElement(); - - const domItems = getSelectItemElements(); - expect(domItems.length).toEqual(2); - - await clickElement(domItems[0]); - - expect(onChange).toHaveBeenCalledWith(['bar'], 'abc'); - }); - test('should change displayed values', async () => { const items = [ - { - value: 'bar', - label: 'Bar', - }, - { - value: 'foo', - label: 'Foo', - }, + {value: 'bar', label: 'Bar'}, + {value: 'foo', label: 'Foo'}, ]; - const {element, rerender} = render( - , - ); + const {rerender} = render(); - let displayedItems = getSelectedItems(element); + let displayedItems = screen.getAllByText('bar'); expect(displayedItems.length).toEqual(1); - expect(displayedItems[0]).toHaveTextContent('Bar'); - - rerender(); + expect(displayedItems[0]).toHaveTextContent('bar'); + + rerender( + , + ); - displayedItems = getSelectedItems(element); + displayedItems = screen.getAllByText('foo'); expect(displayedItems.length).toEqual(1); - expect(displayedItems[0]).toHaveTextContent('Foo'); - - rerender(); + expect(displayedItems[0]).toHaveTextContent('foo'); + + rerender( + , + ); - displayedItems = getSelectedItems(element); + displayedItems = [screen.getByText('foo'), screen.getByText('bar')]; expect(displayedItems.length).toEqual(2); - expect(displayedItems[0]).toHaveTextContent('Foo'); - expect(displayedItems[1]).toHaveTextContent('Bar'); + expect(displayedItems[0]).toHaveTextContent('foo'); + expect(displayedItems[1]).toHaveTextContent('bar'); }); test('should filter items', async () => { const items = [ - { - value: 'bar', - label: 'Bar', - }, - { - value: 'bat', - label: 'Bat', - }, - { - value: 'foo', - label: 'Foo', - }, + {value: 'bar', label: 'Bar'}, + {value: 'bat', label: 'Bat'}, + {value: 'foo', label: 'Foo'}, ]; render(); - const multiSelect = getMultiSelectElement(); - await openMultiSelectElement(multiSelect); + const multiSelect = getMultiSelectElement(screen); + await clickElement(multiSelect); - expect(getSelectItemElements().length).toEqual(3); + expect(getSelectItemElementsForMultiSelect(screen).length).toEqual(3); - changeSelectInput('ba'); - expect(getSelectItemElements().length).toEqual(2); + await userEvent.type(multiSelect, 'ba'); + expect(getSelectItemElementsForMultiSelect(screen).length).toEqual(2); - changeSelectInput('F'); - expect(getSelectItemElements().length).toEqual(1); + await userEvent.clear(multiSelect); + await userEvent.type(multiSelect, 'F'); + expect(getSelectItemElementsForMultiSelect(screen).length).toEqual(1); }); - test('should call onChange handler to remove selected item', async () => { + test('should select and remove items', async () => { const items = [ - { - value: 'bar', - label: 'Bar', - }, - { - value: 'foo', - label: 'Foo', - }, + {value: 'banana', label: 'Banana'}, + {value: 'apple', label: 'Apple'}, ]; - const onChange = testing.fn(); + render(); - const {element} = render( - , - ); + const multiSelect = getMultiSelectElement(screen); + await clickElement(multiSelect); + + const options = getSelectItemElementsForMultiSelect(screen); + await clickElement(options[0]); + await clickElement(options[1]); - const selectedItems = getSelectedItems(element); + let selectedItems = getSelectedItems(document); expect(selectedItems.length).toEqual(2); + expect(selectedItems[0]).toHaveTextContent('Banana'); + expect(selectedItems[1]).toHaveTextContent('Apple'); - const deleteIcon = selectedItems[0].querySelector('button'); - await clickElement(deleteIcon); + const closeBtnElement = within(selectedItems[1]).getByRole('button', { + hidden: true, + }); - expect(onChange).toHaveBeenCalledWith(['foo'], undefined); + await clickElement(closeBtnElement); + + selectedItems = getSelectedItems(document); + expect(selectedItems.length).toEqual(1); + expect(selectedItems[0]).toHaveTextContent('Banana'); }); }); diff --git a/src/web/components/form/__tests__/numberfield.jsx b/src/web/components/form/__tests__/numberfield.jsx index 768d280d85..d5c8dfa644 100644 --- a/src/web/components/form/__tests__/numberfield.jsx +++ b/src/web/components/form/__tests__/numberfield.jsx @@ -5,7 +5,7 @@ import {describe, test, expect, testing} from '@gsa/testing'; -import {render, fireEvent, screen} from 'web/utils/testing'; +import {render, fireEvent, screen, userEvent} from 'web/utils/testing'; import NumberField from '../numberfield'; @@ -112,32 +112,4 @@ describe('NumberField tests', () => { expect(element).toHaveAttribute('value', '3'); }); - - test('should use max if value > max', () => { - const onChange = testing.fn(); - render( - , - ); - - const element = screen.getByTestId('input'); - - fireEvent.change(element, {target: {value: '3'}}); - - expect(onChange).toHaveBeenCalledWith(2, undefined); - expect(element).toHaveAttribute('value', '2'); - }); - - test('should use min if value < min', () => { - const onChange = testing.fn(); - render( - , - ); - - const element = screen.getByTestId('input'); - - fireEvent.change(element, {target: {value: '0'}}); - - expect(onChange).toHaveBeenCalledWith(1, undefined); - expect(element).toHaveAttribute('value', '1'); - }); }); diff --git a/src/web/components/form/__tests__/select.jsx b/src/web/components/form/__tests__/select.jsx index d1ffff55fa..831362186e 100644 --- a/src/web/components/form/__tests__/select.jsx +++ b/src/web/components/form/__tests__/select.jsx @@ -17,12 +17,6 @@ import { import Select, {SelectItem} from '../select'; describe('Select component tests', () => { - test('should render', () => { - const {element} = render(); + const {queryByRole} = render( - - + + + + ({ + label, + value: key, + }))} value={values.defaultDisplays} onChange={onValueChange} /> - + )} ); @@ -137,14 +143,12 @@ const NewDashboardDialog = ({additionalDisplayChoices, onClose, onSave}) => { NewDashboardDialog.propTypes = { additionalDisplayChoices: PropTypes.arrayOf( PropTypes.shape({ - label: PropTypes.toString, - value: PropTypes.array, + label: PropTypes.string.isRequired, + value: PropTypes.array.isRequired, }), - ), + ).isRequired, onClose: PropTypes.func.isRequired, onSave: PropTypes.func.isRequired, }; export default NewDashboardDialog; - -// vim: set ts=2 sw=2 tw=80: From 164d87c926c14efbdac75bfafbbfcc2cd920013f Mon Sep 17 00:00:00 2001 From: daniele-mng Date: Mon, 25 Nov 2024 19:16:32 +0100 Subject: [PATCH 18/22] deps: update opensight version --- package-lock.json | 74 +++++++++++++++++++++-------------------------- package.json | 2 +- vite.config.ts | 2 +- 3 files changed, 35 insertions(+), 43 deletions(-) diff --git a/package-lock.json b/package-lock.json index 6947511e47..56e85a728c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "24.0.2-dev1", "license": "AGPL-3.0+", "dependencies": { - "@greenbone/opensight-ui-components-mantinev7": "^0.0.6", + "@greenbone/opensight-ui-components-mantinev7": "^0.0.7-alpha3", "@mantine/core": "^7.12.1", "@reduxjs/toolkit": "^2.3.0", "@sentry/react": "^8.39.0", @@ -1856,15 +1856,15 @@ "dev": true }, "node_modules/@emotion/babel-plugin": { - "version": "11.12.0", - "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.12.0.tgz", - "integrity": "sha512-y2WQb+oP8Jqvvclh8Q55gLUyb7UFvgv7eJfsj7td5TToBrIUtPay2kMrZi4xjq9qw2vD0ZR5fSho0yqoFgX7Rw==", + "version": "11.13.5", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.13.5.tgz", + "integrity": "sha512-pxHCpT2ex+0q+HH91/zsdHkw/lXd468DIN2zvfvLtPKLLMo6gQj7oLObq8PhkrxOZb/gGCq03S3Z7PDhS8pduQ==", "dependencies": { "@babel/helper-module-imports": "^7.16.7", "@babel/runtime": "^7.18.3", "@emotion/hash": "^0.9.2", "@emotion/memoize": "^0.9.0", - "@emotion/serialize": "^1.2.0", + "@emotion/serialize": "^1.3.3", "babel-plugin-macros": "^3.1.0", "convert-source-map": "^1.5.0", "escape-string-regexp": "^4.0.0", @@ -1879,13 +1879,13 @@ "integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==" }, "node_modules/@emotion/cache": { - "version": "11.13.1", - "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.13.1.tgz", - "integrity": "sha512-iqouYkuEblRcXmylXIwwOodiEK5Ifl7JcX7o6V4jI3iW4mLXX3dmt5xwBtIkJiQEXFAI+pC8X0i67yiPkH9Ucw==", + "version": "11.13.5", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.13.5.tgz", + "integrity": "sha512-Z3xbtJ+UcK76eWkagZ1onvn/wAVb1GOMuR15s30Fm2wrMgC7jzpnO2JZXr4eujTTqoQFUrZIw/rT0c6Zzjca1g==", "dependencies": { "@emotion/memoize": "^0.9.0", "@emotion/sheet": "^1.4.0", - "@emotion/utils": "^1.4.0", + "@emotion/utils": "^1.4.2", "@emotion/weak-memoize": "^0.4.0", "stylis": "4.2.0" } @@ -1914,16 +1914,16 @@ "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==" }, "node_modules/@emotion/react": { - "version": "11.13.3", - "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.3.tgz", - "integrity": "sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==", + "version": "11.13.5", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.5.tgz", + "integrity": "sha512-6zeCUxUH+EPF1s+YF/2hPVODeV/7V07YU5x+2tfuRL8MdW6rv5vb2+CBEGTGwBdux0OIERcOS+RzxeK80k2DsQ==", "dependencies": { "@babel/runtime": "^7.18.3", - "@emotion/babel-plugin": "^11.12.0", - "@emotion/cache": "^11.13.0", - "@emotion/serialize": "^1.3.1", + "@emotion/babel-plugin": "^11.13.5", + "@emotion/cache": "^11.13.5", + "@emotion/serialize": "^1.3.3", "@emotion/use-insertion-effect-with-fallbacks": "^1.1.0", - "@emotion/utils": "^1.4.0", + "@emotion/utils": "^1.4.2", "@emotion/weak-memoize": "^0.4.0", "hoist-non-react-statics": "^3.3.1" }, @@ -1937,14 +1937,14 @@ } }, "node_modules/@emotion/serialize": { - "version": "1.3.2", - "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.2.tgz", - "integrity": "sha512-grVnMvVPK9yUVE6rkKfAJlYZgo0cu3l9iMC77V7DW6E1DUIrU68pSEXRmFZFOFB1QFo57TncmOcvcbMDWsL4yA==", + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.3.tgz", + "integrity": "sha512-EISGqt7sSNWHGI76hC7x1CksiXPahbxEOrC5RjmFRJTqLyEK9/9hZvBbiYn70dw4wuwMKiEMCUlR6ZXTSWQqxA==", "dependencies": { "@emotion/hash": "^0.9.2", "@emotion/memoize": "^0.9.0", "@emotion/unitless": "^0.10.0", - "@emotion/utils": "^1.4.1", + "@emotion/utils": "^1.4.2", "csstype": "^3.0.2" } }, @@ -1967,9 +1967,9 @@ } }, "node_modules/@emotion/utils": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.1.tgz", - "integrity": "sha512-BymCXzCG3r72VKJxaYVwOXATqXIZ85cuvg0YOUDxMGNrKc1DJRZk8MgV5wyXRyEayIMd4FuXJIUgTBXvDNW5cA==" + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.2.tgz", + "integrity": "sha512-3vLclRofFziIa3J2wDh9jjbkUz9qk5Vi3IZ/FSTKViB0k+ef0fPV7dYrUIugbgupYDx7v9ud/SjrtEP8Y4xLoA==" }, "node_modules/@emotion/weak-memoize": { "version": "0.4.0", @@ -2501,28 +2501,28 @@ "integrity": "sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==" }, "node_modules/@greenbone/opensight-ui-components-mantinev7": { - "version": "0.0.6", - "resolved": "https://registry.npmjs.org/@greenbone/opensight-ui-components-mantinev7/-/opensight-ui-components-mantinev7-0.0.6.tgz", - "integrity": "sha512-kx5zHoGb5bbhVG70hJLY7WpLF9Q2A36Pc7GLsm4grUY+JxGEi5ndSa8mrCpHqFj8CLB7D1oZqsp5nJEH7oGFsg==", + "version": "0.0.7-alpha3", + "resolved": "https://registry.npmjs.org/@greenbone/opensight-ui-components-mantinev7/-/opensight-ui-components-mantinev7-0.0.7-alpha3.tgz", + "integrity": "sha512-8fJtNHBJoRcjzvciKjtKyMva2ZvujcHZiRsIBceMB6EJENTcibqyn3hKMbWAdHuwYweUHXyCjR/PuwzcTHOziQ==", "dependencies": { "@mantine/core": "^7.12.1", "@mantine/dates": "^7.12.1", "@mantine/hooks": "^7.12.1", "@mantine/notifications": "^7.12.1", - "lucide-react": "^0.446.0", + "lucide-react": "^0.460.0", "luxon": "^3.5.0", "react": "^18.x.x", "react-dom": "^18.x.x", "react-hook-form": "^7", "react-i18next": "^15.x.x", - "react-select": "^5.8.1", + "react-select": "^5.8.3", "tiny-invariant": "^1.3.3", "urlcat": "^3", "webfontloader": "^1.6.28", "yup": "^1.4.0" }, "optionalDependencies": { - "@reduxjs/toolkit": "^2.2.7", + "@reduxjs/toolkit": "^2.3.0", "@swc/core-darwin-arm64": "^1.3.107" }, "peerDependencies": { @@ -2530,20 +2530,12 @@ "@mantine/dates": "^7.12.1", "@mantine/hooks": "^7.12.1", "@mantine/notifications": "^7.12.1", - "lucide-react": "^0.446.0", + "lucide-react": "^0.460.0", "react": "^18.x.x", "react-dom": "^18.x.x", "react-i18next": "^15.x.x" } }, - "node_modules/@greenbone/opensight-ui-components-mantinev7/node_modules/lucide-react": { - "version": "0.446.0", - "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.446.0.tgz", - "integrity": "sha512-BU7gy8MfBMqvEdDPH79VhOXSEgyG8TSPOKWaExWGCQVqnGH7wGgDngPbofu+KdtVjPQBWbEmnfMTq90CTiiDRg==", - "peerDependencies": { - "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0-rc" - } - }, "node_modules/@humanwhocodes/config-array": { "version": "0.13.0", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz", @@ -9830,9 +9822,9 @@ } }, "node_modules/react-select": { - "version": "5.8.2", - "resolved": "https://registry.npmjs.org/react-select/-/react-select-5.8.2.tgz", - "integrity": "sha512-a/LkOckoI62710gGPQSQqUp7A10fGbH/ya3/IR49qaq3XoBvwymgD5mJgtiHxBDsutyEQfdKNycWVh8Cg8UCjw==", + "version": "5.8.3", + "resolved": "https://registry.npmjs.org/react-select/-/react-select-5.8.3.tgz", + "integrity": "sha512-lVswnIq8/iTj1db7XCG74M/3fbGB6ZaluCzvwPGT5ZOjCdL/k0CLWhEK0vCBLuU5bHTEf6Gj8jtSvi+3v+tO1w==", "dependencies": { "@babel/runtime": "^7.12.0", "@emotion/cache": "^11.4.0", diff --git a/package.json b/package.json index f1d86e2f2d..2ff8b52c66 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "node": ">=18.0" }, "dependencies": { - "@greenbone/opensight-ui-components-mantinev7": "^0.0.6", + "@greenbone/opensight-ui-components-mantinev7": "^0.0.7-alpha3", "@mantine/core": "^7.12.1", "@reduxjs/toolkit": "^2.3.0", "@sentry/react": "^8.39.0", diff --git a/vite.config.ts b/vite.config.ts index 1b108a9fe5..8708d669ae 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -60,7 +60,7 @@ export default defineConfig({ rollupOptions: { output: { manualChunks: { - 'opensight-ui': ['@greenbone/opensight-ui-components'], + 'opensight-ui': ['@greenbone/opensight-ui-components-mantinev7'], }, }, }, From 6d797aa312da8fdff41d80bde413333b3def3541 Mon Sep 17 00:00:00 2001 From: daniele-mng Date: Tue, 26 Nov 2024 18:34:12 +0100 Subject: [PATCH 19/22] fix: edit filter Alerts, Scan Config, Permission --- src/web/components/powerfilter/dialog.jsx | 5 - src/web/pages/alerts/filterdialog.jsx | 86 ++++++++++++ src/web/pages/alerts/listpage.jsx | 99 +++++++------- src/web/pages/permissions/listpage.jsx | 2 +- src/web/pages/scanconfigs/filterdialog.jsx | 77 +++++++++++ src/web/pages/scanconfigs/listpage.jsx | 149 ++++++++++----------- src/web/pages/scanconfigs/table.jsx | 23 ---- 7 files changed, 288 insertions(+), 153 deletions(-) create mode 100644 src/web/pages/alerts/filterdialog.jsx create mode 100644 src/web/pages/scanconfigs/filterdialog.jsx diff --git a/src/web/components/powerfilter/dialog.jsx b/src/web/components/powerfilter/dialog.jsx index ebec58535c..cd06ca0af5 100644 --- a/src/web/components/powerfilter/dialog.jsx +++ b/src/web/components/powerfilter/dialog.jsx @@ -3,10 +3,8 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ - import React from 'react'; -import withFilterDialog from 'web/components/powerfilter/withFilterDialog'; import useCapabilities from 'web/hooks/useCapabilities'; import CreateNamedFilterGroup from './createnamedfiltergroup'; @@ -58,9 +56,6 @@ export const DefaultFilterDialog = ({ DefaultFilterDialog.propTypes = DefaultFilterDialogPropTypes; -export const createFilterDialog = options => - withFilterDialog(options)(DefaultFilterDialog); - export {DefaultFilterDialogPropTypes}; export default DefaultFilterDialog; diff --git a/src/web/pages/alerts/filterdialog.jsx b/src/web/pages/alerts/filterdialog.jsx new file mode 100644 index 0000000000..e32c72a62a --- /dev/null +++ b/src/web/pages/alerts/filterdialog.jsx @@ -0,0 +1,86 @@ +/* SPDX-FileCopyrightText: 2024 Greenbone AG + * + * SPDX-License-Identifier: AGPL-3.0-or-later + */ + +import PropTypes from 'web/utils/proptypes'; + +import DefaultFilterDialog from 'web/components/powerfilter/dialog'; +import FilterDialog from 'web/components/powerfilter/filterdialog'; +import useFilterDialog from 'web/components/powerfilter/useFilterDialog'; +import useFilterDialogSave from 'web/components/powerfilter/useFilterDialogSave'; + +import useTranslation from 'web/hooks/useTranslation'; + +const AlertsFilterDialog = ({ + filter, + onCloseClick, + onClose = onCloseClick, + onFilterChanged, + onFilterCreated, + ...props +}) => { + const [_] = useTranslation(); + const filterDialogProps = useFilterDialog(filter); + const [handleSave] = useFilterDialogSave( + 'alert', + { + onClose, + onFilterChanged, + onFilterCreated, + }, + filterDialogProps, + ); + + const SORT_FIELDS = [ + { + name: 'name', + displayName: _('Name'), + width: '25%', + }, + { + name: 'event', + displayName: _('Event'), + width: '21%', + }, + { + name: 'condition', + displayName: _('Condition'), + width: '21%', + }, + { + name: 'method', + displayName: _('Method'), + width: '10%', + }, + { + name: 'filter', + displayName: _('Filter'), + width: '10%', + }, + { + name: 'active', + displayName: _('Active'), + width: '5%', + }, + ]; + return ( + + + + ); +}; + +AlertsFilterDialog.propTypes = { + filter: PropTypes.filter, + onClose: PropTypes.func, + onCloseClick: PropTypes.func, // should be removed in future + onFilterChanged: PropTypes.func, + onFilterCreated: PropTypes.func, +}; + +export default AlertsFilterDialog; diff --git a/src/web/pages/alerts/listpage.jsx b/src/web/pages/alerts/listpage.jsx index 8319ebb2a6..e397392aaf 100644 --- a/src/web/pages/alerts/listpage.jsx +++ b/src/web/pages/alerts/listpage.jsx @@ -23,15 +23,16 @@ import PageTitle from 'web/components/layout/pagetitle'; import AlertIcon from 'web/components/icon/alerticon'; -import {createFilterDialog} from 'web/components/powerfilter/dialog'; - import { loadEntities, selector as entitiesSelector, } from 'web/store/entities/alerts'; import AlertComponent from './component'; -import AlertTable, {SORT_FIELDS} from './table'; +import AlertTable from './table'; + +import {useTranslation} from 'react-i18next'; +import AlertsFilterDialog from 'web/pages/alerts/filterdialog'; export const ToolBarIcons = withCapabilities( ({capabilities, onAlertCreateClick}) => ( @@ -52,10 +53,6 @@ ToolBarIcons.propTypes = { onAlertCreateClick: PropTypes.func.isRequired, }; -const AlertFilterDialog = createFilterDialog({ - sortFields: SORT_FIELDS, -}); - const AlertsPage = ({ showError, showSuccess, @@ -64,48 +61,52 @@ const AlertsPage = ({ onError, onInteraction, ...props -}) => ( - - {({clone, create, delete: delete_func, download, edit, save, test}) => ( - - - } - table={AlertTable} - title={_('Alerts')} - toolBarIcons={ToolBarIcons} - onAlertCloneClick={clone} - onAlertCreateClick={create} - onAlertDeleteClick={delete_func} - onAlertDownloadClick={download} - onAlertEditClick={edit} - onAlertTestClick={test} - onAlertSaveClick={save} - onError={onError} - onInteraction={onInteraction} - onPermissionChanged={onChanged} - onPermissionDownloaded={onDownloaded} - onPermissionDownloadError={onError} - /> - - )} - -); +}) => { + const [_] = useTranslation(); + + return ( + + {({clone, create, delete: delete_func, download, edit, save, test}) => ( + <> + + } + table={AlertTable} + title={_('Alerts')} + toolBarIcons={ToolBarIcons} + onAlertCloneClick={clone} + onAlertCreateClick={create} + onAlertDeleteClick={delete_func} + onAlertDownloadClick={download} + onAlertEditClick={edit} + onAlertTestClick={test} + onAlertSaveClick={save} + onError={onError} + onInteraction={onInteraction} + onPermissionChanged={onChanged} + onPermissionDownloaded={onDownloaded} + onPermissionDownloadError={onError} + /> + + )} + + ); +}; AlertsPage.propTypes = { showError: PropTypes.func.isRequired, diff --git a/src/web/pages/permissions/listpage.jsx b/src/web/pages/permissions/listpage.jsx index e24698b0b4..d3a2c9358b 100644 --- a/src/web/pages/permissions/listpage.jsx +++ b/src/web/pages/permissions/listpage.jsx @@ -29,7 +29,7 @@ import useTranslation from 'web/hooks/useTranslation'; import Table from './table'; import PermissionComponent from './component'; -import FilterDialog from '../filters/dialog'; +import FilterDialog from 'web/pages/permissions/filterdialog'; const ToolBarIcons = ({onPermissionCreateClick}) => { const capabilities = useCapabilities(); diff --git a/src/web/pages/scanconfigs/filterdialog.jsx b/src/web/pages/scanconfigs/filterdialog.jsx new file mode 100644 index 0000000000..e01eb8adf3 --- /dev/null +++ b/src/web/pages/scanconfigs/filterdialog.jsx @@ -0,0 +1,77 @@ +/* SPDX-FileCopyrightText: 2024 Greenbone AG + * + * SPDX-License-Identifier: AGPL-3.0-or-later + */ + +import PropTypes from 'web/utils/proptypes'; + +import DefaultFilterDialog from 'web/components/powerfilter/dialog'; +import FilterDialog from 'web/components/powerfilter/filterdialog'; +import useFilterDialog from 'web/components/powerfilter/useFilterDialog'; +import useFilterDialogSave from 'web/components/powerfilter/useFilterDialogSave'; + +import useTranslation from 'web/hooks/useTranslation'; + +const ScanConfigFilterDialog = ({ + filter, + onCloseClick, + onClose = onCloseClick, + onFilterChanged, + onFilterCreated, + ...props +}) => { + const [_] = useTranslation(); + const filterDialogProps = useFilterDialog(filter); + const [handleSave] = useFilterDialogSave( + 'config', + { + onClose, + onFilterChanged, + onFilterCreated, + }, + filterDialogProps, + ); + + const SORT_FIELDS = [ + { + name: 'name', + displayName: _('Name'), + }, + { + name: 'families_total', + displayName: _('Families: Total'), + }, + { + name: 'families_trend', + displayName: _('Families: Trend'), + }, + { + name: 'nvts_total', + displayName: _('NVTs: Total'), + }, + { + name: 'nvts_trend', + displayName: _('NVTs: Trend'), + }, + ]; + + return ( + + + + ); +}; + +ScanConfigFilterDialog.propTypes = { + filter: PropTypes.filter, + onClose: PropTypes.func, + onCloseClick: PropTypes.func, // should be removed in future + onFilterChanged: PropTypes.func, + onFilterCreated: PropTypes.func, +}; + +export default ScanConfigFilterDialog; diff --git a/src/web/pages/scanconfigs/listpage.jsx b/src/web/pages/scanconfigs/listpage.jsx index cc8a3c7fb2..b3118e57b8 100644 --- a/src/web/pages/scanconfigs/listpage.jsx +++ b/src/web/pages/scanconfigs/listpage.jsx @@ -5,8 +5,6 @@ import React from 'react'; -import _ from 'gmp/locale'; - import {SCANCONFIGS_FILTER_FILTER} from 'gmp/models/filter'; import PropTypes from 'web/utils/proptypes'; @@ -24,38 +22,41 @@ import PageTitle from 'web/components/layout/pagetitle'; import IconDivider from 'web/components/layout/icondivider'; -import {createFilterDialog} from 'web/components/powerfilter/dialog'; - import { loadEntities, selector as entitiesSelector, } from 'web/store/entities/scanconfigs'; import ScanConfigComponent from './component'; -import Table, {SORT_FIELDS} from './table'; +import Table from './table'; +import useTranslation from 'web/hooks/useTranslation'; +import ScanConfigFilterDialog from 'web/pages/scanconfigs/filterdialog'; export const ToolBarIcons = withCapabilities( - ({capabilities, onScanConfigCreateClick, onScanConfigImportClick}) => ( - - - {capabilities.mayCreate('config') && ( - - )} - {capabilities.mayCreate('config') && ( - { + const [_] = useTranslation(); + return ( + + - )} - - ), + {capabilities.mayCreate('config') && ( + + )} + {capabilities.mayCreate('config') && ( + + )} + + ); + }, ); ToolBarIcons.propTypes = { @@ -63,60 +64,60 @@ ToolBarIcons.propTypes = { onScanConfigImportClick: PropTypes.func.isRequired, }; -const ScanConfigFilterDialog = createFilterDialog({ - sortFields: SORT_FIELDS, -}); - const ScanConfigsPage = ({ onChanged, onDownloaded, onError, onInteraction, ...props -}) => ( - - {({ - clone, - create, - delete: delete_func, - download, - edit, - import: import_func, - }) => ( - - - } - table={Table} - title={_('Scan Configs')} - toolBarIcons={ToolBarIcons} - onError={onError} - onInteraction={onInteraction} - onScanConfigImportClick={import_func} - onScanConfigCloneClick={clone} - onScanConfigCreateClick={create} - onScanConfigDeleteClick={delete_func} - onScanConfigDownloadClick={download} - onScanConfigEditClick={edit} - /> - - )} - -); +}) => { + const [_] = useTranslation(); + + return ( + + {({ + clone, + create, + delete: delete_func, + download, + edit, + import: import_func, + }) => ( + <> + + } + table={Table} + title={_('Scan Configs')} + toolBarIcons={ToolBarIcons} + onError={onError} + onInteraction={onInteraction} + onScanConfigImportClick={import_func} + onScanConfigCloneClick={clone} + onScanConfigCreateClick={create} + onScanConfigDeleteClick={delete_func} + onScanConfigDownloadClick={download} + onScanConfigEditClick={edit} + /> + + )} + + ); +}; ScanConfigsPage.propTypes = { onChanged: PropTypes.func.isRequired, @@ -129,5 +130,3 @@ export default withEntitiesContainer('scanconfig', { entitiesSelector, loadEntities, })(ScanConfigsPage); - -// vim: set ts=2 sw=2 tw=80: diff --git a/src/web/pages/scanconfigs/table.jsx b/src/web/pages/scanconfigs/table.jsx index 8fc6ea2c70..41f2d3daec 100644 --- a/src/web/pages/scanconfigs/table.jsx +++ b/src/web/pages/scanconfigs/table.jsx @@ -13,29 +13,6 @@ import Header from './header'; import Row from './row'; import ScanConfigDetails from './details'; -export const SORT_FIELDS = [ - { - name: 'name', - displayName: _l('Name'), - }, - { - name: 'families_total', - displayName: _l('Families: Total'), - }, - { - name: 'families_trend', - displayName: _l('Families: Trend'), - }, - { - name: 'nvts_total', - displayName: _l('NVTs: Total'), - }, - { - name: 'nvts_trend', - displayName: _l('NVTs: Trend'), - }, -]; - const ScanConfigsTable = createEntitiesTable({ emptyTitle: _l('No Scan Configs available'), header: Header, From 713e0882fd14120321a38b2c987787cb3fa534a1 Mon Sep 17 00:00:00 2001 From: daniele-mng Date: Wed, 27 Nov 2024 13:00:11 +0100 Subject: [PATCH 20/22] deps: remove unused package --- package-lock.json | 50 ----------------------------------------------- package.json | 1 - 2 files changed, 51 deletions(-) diff --git a/package-lock.json b/package-lock.json index 56e85a728c..de6d0c109f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -42,7 +42,6 @@ "react-dom": "^18.3.1", "react-i18next": "^15.1.1", "react-redux": "^9.1.2", - "react-rnd": "^10.4.13", "react-router-dom": "^6.28.0", "redux": "^5.0.1", "redux-logger": "^3.0.6", @@ -9532,15 +9531,6 @@ "resolved": "https://registry.npmjs.org/raf-schd/-/raf-schd-4.0.3.tgz", "integrity": "sha512-tQkJl2GRWh83ui2DiPTJz9wEiMN20syf+5oKfB03yYP7ioZcJwsIK8FjrtLwH1m7C7e+Tt2yYBlrOpdT+dyeIQ==" }, - "node_modules/re-resizable": { - "version": "6.10.0", - "resolved": "https://registry.npmjs.org/re-resizable/-/re-resizable-6.10.0.tgz", - "integrity": "sha512-hysSK0xmA5nz24HBVztlk4yCqCLCvS32E6ZpWxVKop9x3tqCa4yAj1++facrmkOf62JsJHjmjABdKxXofYioCw==", - "peerDependencies": { - "react": "^16.13.1 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0" - } - }, "node_modules/react": { "version": "18.3.1", "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", @@ -9625,27 +9615,6 @@ "react": "^18.3.1" } }, - "node_modules/react-draggable": { - "version": "4.4.6", - "resolved": "https://registry.npmjs.org/react-draggable/-/react-draggable-4.4.6.tgz", - "integrity": "sha512-LtY5Xw1zTPqHkVmtM3X8MUOxNDOUhv/khTgBgrUvwaS064bwVvxT+q5El0uUFNx5IEPKXuRejr7UqLwBIg5pdw==", - "dependencies": { - "clsx": "^1.1.1", - "prop-types": "^15.8.1" - }, - "peerDependencies": { - "react": ">= 16.3.0", - "react-dom": ">= 16.3.0" - } - }, - "node_modules/react-draggable/node_modules/clsx": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz", - "integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==", - "engines": { - "node": ">=6" - } - }, "node_modules/react-hook-form": { "version": "7.53.1", "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.53.1.tgz", @@ -9772,25 +9741,6 @@ } } }, - "node_modules/react-rnd": { - "version": "10.4.13", - "resolved": "https://registry.npmjs.org/react-rnd/-/react-rnd-10.4.13.tgz", - "integrity": "sha512-Vgbf0iihspcQ6nkaFhpOGWfmnuVbhkhoB0hBbYl8aRDA4horsQHESc4E1z7O/P27kFFjK2aqM0u5CGzfr9gEZA==", - "dependencies": { - "re-resizable": "6.10.0", - "react-draggable": "4.4.6", - "tslib": "2.6.2" - }, - "peerDependencies": { - "react": ">=16.3.0", - "react-dom": ">=16.3.0" - } - }, - "node_modules/react-rnd/node_modules/tslib": { - "version": "2.6.2", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", - "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" - }, "node_modules/react-router": { "version": "6.28.0", "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.28.0.tgz", diff --git a/package.json b/package.json index 2ff8b52c66..942d59fb7e 100644 --- a/package.json +++ b/package.json @@ -65,7 +65,6 @@ "react-dom": "^18.3.1", "react-i18next": "^15.1.1", "react-redux": "^9.1.2", - "react-rnd": "^10.4.13", "react-router-dom": "^6.28.0", "redux": "^5.0.1", "redux-logger": "^3.0.6", From 635468d0187a791d78e7dff456122fc1bd16d6e2 Mon Sep 17 00:00:00 2001 From: daniele-mng Date: Thu, 28 Nov 2024 11:03:42 +0100 Subject: [PATCH 21/22] fix: checkbox labels in delta filter dialog --- .../pages/reports/deltaresultsfiltergroup.jsx | 24 +++++++++---------- 1 file changed, 11 insertions(+), 13 deletions(-) diff --git a/src/web/pages/reports/deltaresultsfiltergroup.jsx b/src/web/pages/reports/deltaresultsfiltergroup.jsx index e3c0cfce44..8cbf61ae19 100644 --- a/src/web/pages/reports/deltaresultsfiltergroup.jsx +++ b/src/web/pages/reports/deltaresultsfiltergroup.jsx @@ -3,7 +3,6 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ - import React from 'react'; import _ from 'gmp/locale'; @@ -56,30 +55,29 @@ class DeltaStatesFilterGroup extends React.Component { checked={delta_states.includes('s')} name="s" onChange={this.handleDeltaStatesChange} - > - {_('Same')} - + title={_('Same')} + /> + - {_('New')} - + title={_('New')} + /> + - {_('Gone')} - + title={_('Gone')} + /> + - {_('Changed')} - + title={_('Changed')} + /> ); From 11543e3a66ab29fb8a818398bdbe003e9d4f491f Mon Sep 17 00:00:00 2001 From: daniele-mng Date: Thu, 28 Nov 2024 11:05:13 +0100 Subject: [PATCH 22/22] deps: update 1 dep --- package-lock.json | 58 +++++------------------------------------------ 1 file changed, 6 insertions(+), 52 deletions(-) diff --git a/package-lock.json b/package-lock.json index de6d0c109f..e292874f6f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4274,29 +4274,6 @@ } } }, - "node_modules/@vitest/coverage-v8/node_modules/debug": { - "version": "4.3.7", - "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz", - "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==", - "dev": true, - "dependencies": { - "ms": "^2.1.3" - }, - "engines": { - "node": ">=6.0" - }, - "peerDependenciesMeta": { - "supports-color": { - "optional": true - } - } - }, - "node_modules/@vitest/coverage-v8/node_modules/ms": { - "version": "2.1.3", - "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", - "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==", - "dev": true - }, "node_modules/@vitest/expect": { "version": "2.1.5", "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-2.1.5.tgz", @@ -5265,9 +5242,9 @@ } }, "node_modules/cross-spawn": { - "version": "7.0.3", - "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz", - "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==", + "version": "7.0.6", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", + "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==", "dev": true, "dependencies": { "path-key": "^3.1.0", @@ -6528,9 +6505,9 @@ } }, "node_modules/execa/node_modules/cross-spawn": { - "version": "6.0.5", - "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz", - "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==", + "version": "6.0.6", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.6.tgz", + "integrity": "sha512-VqCUuhcd1iB+dsv8gxPttb5iZh/D0iubSP21g36KXdEuf6I5JiioesUVjpCdHV9MZRUfVFlvwtIUyPfxo5trtw==", "dev": true, "dependencies": { "nice-try": "^1.0.4", @@ -11640,29 +11617,6 @@ } } }, - "node_modules/vitest/node_modules/debug": { - "version": "4.3.7", - "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz", - "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==", - "dev": true, - "dependencies": { - "ms": "^2.1.3" - }, - "engines": { - "node": ">=6.0" - }, - "peerDependenciesMeta": { - "supports-color": { - "optional": true - } - } - }, - "node_modules/vitest/node_modules/ms": { - "version": "2.1.3", - "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", - "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==", - "dev": true - }, "node_modules/void-elements": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz",