From 2af7813bdf3748601d65ab7b35b099639e0735ad Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Fri, 10 Jan 2025 10:48:14 -0500 Subject: [PATCH 01/18] Update: remove Redirect inside Switch Signed-off-by: Kaung Zin Hein --- .../App/__snapshots__/index.test.js.snap | 21 ++++++------------- .../jaeger-ui/src/components/App/index.jsx | 16 ++++++-------- 2 files changed, 12 insertions(+), 25 deletions(-) diff --git a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap index 43b9a0ebe6..b1877b1f79 100644 --- a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap +++ b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap @@ -142,27 +142,18 @@ exports[`JaegerUIApp does not explode 1`] = ` - - + render={[Function]} + /> - - + render={[Function]} + /> - - + render={[Function]} + /> diff --git a/packages/jaeger-ui/src/components/App/index.jsx b/packages/jaeger-ui/src/components/App/index.jsx index 64a192b318..765f0db66e 100644 --- a/packages/jaeger-ui/src/components/App/index.jsx +++ b/packages/jaeger-ui/src/components/App/index.jsx @@ -114,16 +114,12 @@ export default class JaegerUIApp extends Component { - - - - - - - - - - + }/> + + }/> + + }/> + From 154c7c0c7748d8c0009d489fb6b67c063074e5f9 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Fri, 10 Jan 2025 10:57:56 -0500 Subject: [PATCH 02/18] Update: install react-router-dom v6 latest Signed-off-by: Kaung Zin Hein --- package-lock.json | 76 ++++++++++++++++++--------------- packages/jaeger-ui/package.json | 3 +- 2 files changed, 42 insertions(+), 37 deletions(-) diff --git a/package-lock.json b/package-lock.json index e5a26e1471..8a581eef8d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4548,13 +4548,6 @@ "@types/node": "*" } }, - "node_modules/@types/history": { - "version": "4.7.11", - "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz", - "integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==", - "dev": true, - "license": "MIT" - }, "node_modules/@types/hoist-non-react-statics": { "version": "3.3.5", "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz", @@ -4747,29 +4740,6 @@ "@types/react": "*" } }, - "node_modules/@types/react-router": { - "version": "5.1.20", - "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz", - "integrity": "sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==", - "dev": true, - "license": "MIT", - "dependencies": { - "@types/history": "^4.7.11", - "@types/react": "*" - } - }, - "node_modules/@types/react-router-dom": { - "version": "5.3.3", - "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.3.tgz", - "integrity": "sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==", - "dev": true, - "license": "MIT", - "dependencies": { - "@types/history": "^4.7.11", - "@types/react": "*", - "@types/react-router": "*" - } - }, "node_modules/@types/react-window": { "version": "1.8.8", "resolved": "https://registry.npmjs.org/@types/react-window/-/react-window-1.8.8.tgz", @@ -14895,6 +14865,7 @@ "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.9.0.tgz", "integrity": "sha512-xIp7/apCFJuUHdDLWe8O1HIkb0kQrOMb/0u6FXQjemHn/ii5LrIzU6bdECnsiTF/GjZkMEKg1xdiZwNqDYlZ6g==", "license": "MIT", + "peer": true, "dependencies": { "isarray": "0.0.1" } @@ -14903,7 +14874,8 @@ "version": "0.0.1", "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz", "integrity": "sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ==", - "license": "MIT" + "license": "MIT", + "peer": true }, "node_modules/path-type": { "version": "4.0.0", @@ -16407,6 +16379,7 @@ "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.3.4.tgz", "integrity": "sha512-Ys9K+ppnJah3QuaRiLxk+jDWOR1MekYQrlytiXxC1RyfbdsZkS5pvKAzCCr031xHixZwpnsYNT5xysdFHQaYsA==", "license": "MIT", + "peer": true, "dependencies": { "@babel/runtime": "^7.12.13", "history": "^4.9.0", @@ -16427,6 +16400,7 @@ "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.3.4.tgz", "integrity": "sha512-m4EqFMHv/Ih4kpcBCONHbkT68KoAeHN4p3lAGoNryfHi0dMy0kCzEZakiKRsvg5wHZ/JLrLW8o8KomWiz/qbYQ==", "license": "MIT", + "peer": true, "dependencies": { "@babel/runtime": "^7.12.13", "history": "^4.9.0", @@ -16487,7 +16461,8 @@ "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "license": "MIT" + "license": "MIT", + "peer": true }, "node_modules/react-shallow-renderer": { "version": "16.15.0", @@ -20087,7 +20062,7 @@ "@ant-design/compatible": "^5.1.3", "@jaegertracing/plexus": "0.2.0", "@pyroscope/flamegraph": "0.21.4", - "@sentry/browser": "^8.48.0", + "@sentry/browser": "^8.18.0", "antd": "^5.21.3", "chance": "^1.0.10", "classnames": "^2.5.1", @@ -20115,7 +20090,7 @@ "react-is": "^18.2.0", "react-json-view-lite": "2.1.0", "react-redux": "^8.1.2", - "react-router-dom": "5.3.4", + "react-router-dom": "^6.28.1", "react-router-dom-v5-compat": "^6.24.0", "react-vis": "1.11.12", "react-vis-force": "^0.3.1", @@ -20142,7 +20117,6 @@ "@types/object-hash": "^3.0.2", "@types/react": "^18.3.11", "@types/react-helmet": "^6.1.5", - "@types/react-router-dom": "^5.1.0", "@types/react-window": "^1.8.0", "@types/redux-actions": "2.2.1", "@types/redux-form": "^8.3.10", @@ -20344,6 +20318,38 @@ "node": "^10 || ^12 || >=14" } }, + "packages/jaeger-ui/node_modules/react-router-dom": { + "version": "6.28.1", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.28.1.tgz", + "integrity": "sha512-YraE27C/RdjcZwl5UCqF/ffXnZDxpJdk9Q6jw38SZHjXs7NNdpViq2l2c7fO7+4uWaEfcwfGCv3RSg4e1By/fQ==", + "license": "MIT", + "dependencies": { + "@remix-run/router": "1.21.0", + "react-router": "6.28.1" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, + "packages/jaeger-ui/node_modules/react-router-dom/node_modules/react-router": { + "version": "6.28.1", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.28.1.tgz", + "integrity": "sha512-2omQTA3rkMljmrvvo6WtewGdVh45SpL9hGiCI9uUrwGGfNFDIvGK4gYJsKlJoNVi6AQZcopSCballL+QGOm7fA==", + "license": "MIT", + "dependencies": { + "@remix-run/router": "1.21.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, "packages/jaeger-ui/node_modules/vite": { "version": "6.0.7", "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.7.tgz", diff --git a/packages/jaeger-ui/package.json b/packages/jaeger-ui/package.json index b8ee6d5168..5ce314c791 100644 --- a/packages/jaeger-ui/package.json +++ b/packages/jaeger-ui/package.json @@ -22,7 +22,6 @@ "@types/object-hash": "^3.0.2", "@types/react": "^18.3.11", "@types/react-helmet": "^6.1.5", - "@types/react-router-dom": "^5.1.0", "@types/react-window": "^1.8.0", "@types/redux-actions": "2.2.1", "@types/redux-form": "^8.3.10", @@ -77,7 +76,7 @@ "react-is": "^18.2.0", "react-json-view-lite": "2.1.0", "react-redux": "^8.1.2", - "react-router-dom": "5.3.4", + "react-router-dom": "^6.28.1", "react-router-dom-v5-compat": "^6.24.0", "react-vis": "1.11.12", "react-vis-force": "^0.3.1", From 2455d904df75c3975148e1b86598a74221995d58 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Fri, 10 Jan 2025 11:16:32 -0500 Subject: [PATCH 03/18] Reinstall @types/history as some app modules depend on it Signed-off-by: Kaung Zin Hein --- package-lock.json | 8 ++++++++ packages/jaeger-ui/package.json | 1 + 2 files changed, 9 insertions(+) diff --git a/package-lock.json b/package-lock.json index 8a581eef8d..965da9d975 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4548,6 +4548,13 @@ "@types/node": "*" } }, + "node_modules/@types/history": { + "version": "4.7.11", + "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz", + "integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/hoist-non-react-statics": { "version": "3.3.5", "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz", @@ -20113,6 +20120,7 @@ "@testing-library/jest-dom": "^6.4.5", "@testing-library/react": "^15.0.7", "@types/deep-freeze": "^0.1.1", + "@types/history": "^4.7.11", "@types/lodash": "^4.17.0", "@types/object-hash": "^3.0.2", "@types/react": "^18.3.11", diff --git a/packages/jaeger-ui/package.json b/packages/jaeger-ui/package.json index 5ce314c791..bf9a9dc1dd 100644 --- a/packages/jaeger-ui/package.json +++ b/packages/jaeger-ui/package.json @@ -18,6 +18,7 @@ "@testing-library/jest-dom": "^6.4.5", "@testing-library/react": "^15.0.7", "@types/deep-freeze": "^0.1.1", + "@types/history": "^4.7.11", "@types/lodash": "^4.17.0", "@types/object-hash": "^3.0.2", "@types/react": "^18.3.11", From 8a408273ec458da0ec2bfd3323d34a4032bf5785 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Fri, 10 Jan 2025 11:47:46 -0500 Subject: [PATCH 04/18] Revert "Update: install react-router-dom v6 latest" This reverts commit 154c7c0c7748d8c0009d489fb6b67c063074e5f9. Signed-off-by: Kaung Zin Hein --- package-lock.json | 69 +++++++++++++-------------------- packages/jaeger-ui/package.json | 3 +- 2 files changed, 30 insertions(+), 42 deletions(-) diff --git a/package-lock.json b/package-lock.json index 965da9d975..0822766671 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4747,6 +4747,29 @@ "@types/react": "*" } }, + "node_modules/@types/react-router": { + "version": "5.1.20", + "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz", + "integrity": "sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/history": "^4.7.11", + "@types/react": "*" + } + }, + "node_modules/@types/react-router-dom": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.3.tgz", + "integrity": "sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/history": "^4.7.11", + "@types/react": "*", + "@types/react-router": "*" + } + }, "node_modules/@types/react-window": { "version": "1.8.8", "resolved": "https://registry.npmjs.org/@types/react-window/-/react-window-1.8.8.tgz", @@ -14872,7 +14895,6 @@ "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.9.0.tgz", "integrity": "sha512-xIp7/apCFJuUHdDLWe8O1HIkb0kQrOMb/0u6FXQjemHn/ii5LrIzU6bdECnsiTF/GjZkMEKg1xdiZwNqDYlZ6g==", "license": "MIT", - "peer": true, "dependencies": { "isarray": "0.0.1" } @@ -14881,8 +14903,7 @@ "version": "0.0.1", "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz", "integrity": "sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ==", - "license": "MIT", - "peer": true + "license": "MIT" }, "node_modules/path-type": { "version": "4.0.0", @@ -16386,7 +16407,6 @@ "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.3.4.tgz", "integrity": "sha512-Ys9K+ppnJah3QuaRiLxk+jDWOR1MekYQrlytiXxC1RyfbdsZkS5pvKAzCCr031xHixZwpnsYNT5xysdFHQaYsA==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.12.13", "history": "^4.9.0", @@ -16407,7 +16427,6 @@ "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.3.4.tgz", "integrity": "sha512-m4EqFMHv/Ih4kpcBCONHbkT68KoAeHN4p3lAGoNryfHi0dMy0kCzEZakiKRsvg5wHZ/JLrLW8o8KomWiz/qbYQ==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.12.13", "history": "^4.9.0", @@ -16468,8 +16487,7 @@ "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "license": "MIT", - "peer": true + "license": "MIT" }, "node_modules/react-shallow-renderer": { "version": "16.15.0", @@ -20069,7 +20087,7 @@ "@ant-design/compatible": "^5.1.3", "@jaegertracing/plexus": "0.2.0", "@pyroscope/flamegraph": "0.21.4", - "@sentry/browser": "^8.18.0", + "@sentry/browser": "^8.48.0", "antd": "^5.21.3", "chance": "^1.0.10", "classnames": "^2.5.1", @@ -20097,7 +20115,7 @@ "react-is": "^18.2.0", "react-json-view-lite": "2.1.0", "react-redux": "^8.1.2", - "react-router-dom": "^6.28.1", + "react-router-dom": "5.3.4", "react-router-dom-v5-compat": "^6.24.0", "react-vis": "1.11.12", "react-vis-force": "^0.3.1", @@ -20125,6 +20143,7 @@ "@types/object-hash": "^3.0.2", "@types/react": "^18.3.11", "@types/react-helmet": "^6.1.5", + "@types/react-router-dom": "^5.1.0", "@types/react-window": "^1.8.0", "@types/redux-actions": "2.2.1", "@types/redux-form": "^8.3.10", @@ -20326,38 +20345,6 @@ "node": "^10 || ^12 || >=14" } }, - "packages/jaeger-ui/node_modules/react-router-dom": { - "version": "6.28.1", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.28.1.tgz", - "integrity": "sha512-YraE27C/RdjcZwl5UCqF/ffXnZDxpJdk9Q6jw38SZHjXs7NNdpViq2l2c7fO7+4uWaEfcwfGCv3RSg4e1By/fQ==", - "license": "MIT", - "dependencies": { - "@remix-run/router": "1.21.0", - "react-router": "6.28.1" - }, - "engines": { - "node": ">=14.0.0" - }, - "peerDependencies": { - "react": ">=16.8", - "react-dom": ">=16.8" - } - }, - "packages/jaeger-ui/node_modules/react-router-dom/node_modules/react-router": { - "version": "6.28.1", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.28.1.tgz", - "integrity": "sha512-2omQTA3rkMljmrvvo6WtewGdVh45SpL9hGiCI9uUrwGGfNFDIvGK4gYJsKlJoNVi6AQZcopSCballL+QGOm7fA==", - "license": "MIT", - "dependencies": { - "@remix-run/router": "1.21.0" - }, - "engines": { - "node": ">=14.0.0" - }, - "peerDependencies": { - "react": ">=16.8" - } - }, "packages/jaeger-ui/node_modules/vite": { "version": "6.0.7", "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.7.tgz", diff --git a/packages/jaeger-ui/package.json b/packages/jaeger-ui/package.json index bf9a9dc1dd..b429dcd324 100644 --- a/packages/jaeger-ui/package.json +++ b/packages/jaeger-ui/package.json @@ -23,6 +23,7 @@ "@types/object-hash": "^3.0.2", "@types/react": "^18.3.11", "@types/react-helmet": "^6.1.5", + "@types/react-router-dom": "^5.1.0", "@types/react-window": "^1.8.0", "@types/redux-actions": "2.2.1", "@types/redux-form": "^8.3.10", @@ -77,7 +78,7 @@ "react-is": "^18.2.0", "react-json-view-lite": "2.1.0", "react-redux": "^8.1.2", - "react-router-dom": "^6.28.1", + "react-router-dom": "5.3.4", "react-router-dom-v5-compat": "^6.24.0", "react-vis": "1.11.12", "react-vis-force": "^0.3.1", From 2743cca0b97a294e9f5b766807c1c9584bd1ab37 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Fri, 10 Jan 2025 11:58:34 -0500 Subject: [PATCH 05/18] Replace Route with CompatRoute for incremental migration Signed-off-by: Kaung Zin Hein --- .../App/__snapshots__/index.test.js.snap | 38 ++++++++--------- .../jaeger-ui/src/components/App/index.jsx | 41 ++++++++++--------- 2 files changed, 40 insertions(+), 39 deletions(-) diff --git a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap index b1877b1f79..60af5e6f96 100644 --- a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap +++ b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap @@ -104,59 +104,59 @@ exports[`JaegerUIApp does not explode 1`] = ` > - - - + - - + - - + - - + - - + - - + - - + - - - + - + diff --git a/packages/jaeger-ui/src/components/App/index.jsx b/packages/jaeger-ui/src/components/App/index.jsx index 765f0db66e..240cbc22ac 100644 --- a/packages/jaeger-ui/src/components/App/index.jsx +++ b/packages/jaeger-ui/src/components/App/index.jsx @@ -14,7 +14,8 @@ import React, { Component } from 'react'; import { Provider } from 'react-redux'; -import { Route, Redirect, Switch, Router } from 'react-router-dom'; +import { Redirect, Switch, Router } from 'react-router-dom'; +import { CompatRoute } from "react-router-dom-v5-compat"; import { ConfigProvider } from 'antd'; import { defaultTheme } from '@ant-design/compatible'; @@ -92,37 +93,37 @@ export default class JaegerUIApp extends Component { - + - - + + - - + + - - + + - - + + - - + + - - + + - + - }/> + }/> - }/> + }/> - }/> + }/> - + - + From 3ee644552531d0c6da3fe251046b40568ec793f4 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 09:47:59 -0500 Subject: [PATCH 06/18] Update: Replace react-router-dom imports with compat imports Signed-off-by: Kaung Zin Hein --- .../src/components/App/TopNav.test.js | 2 +- .../jaeger-ui/src/components/App/TopNav.tsx | 2 +- .../components/App/TraceIDSearchInput.test.js | 6 +- .../jaeger-ui/src/components/App/index.jsx | 62 ++++++------------- .../src/components/App/index.test.js | 2 +- .../SearchTracePage/SearchResults/index.tsx | 2 +- .../components/SearchTracePage/index.test.js | 29 ++++++--- packages/jaeger-ui/src/index.jsx | 3 +- .../src/utils/withRouteProps.test.js | 8 +-- .../jaeger-ui/src/utils/withRouteProps.tsx | 2 +- 10 files changed, 52 insertions(+), 66 deletions(-) diff --git a/packages/jaeger-ui/src/components/App/TopNav.test.js b/packages/jaeger-ui/src/components/App/TopNav.test.js index 9a86f3ccd1..eda79f1c11 100644 --- a/packages/jaeger-ui/src/components/App/TopNav.test.js +++ b/packages/jaeger-ui/src/components/App/TopNav.test.js @@ -14,7 +14,7 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; -import { BrowserRouter } from 'react-router-dom'; +import { BrowserRouter } from 'react-router-dom-v5-compat'; import '@testing-library/jest-dom'; import { mapStateToProps, TopNavImpl as TopNav } from './TopNav'; diff --git a/packages/jaeger-ui/src/components/App/TopNav.tsx b/packages/jaeger-ui/src/components/App/TopNav.tsx index 83e87f470f..79a149514b 100644 --- a/packages/jaeger-ui/src/components/App/TopNav.tsx +++ b/packages/jaeger-ui/src/components/App/TopNav.tsx @@ -17,7 +17,7 @@ import { Dropdown, Menu, MenuProps } from 'antd'; import { IoChevronDown } from 'react-icons/io5'; import _has from 'lodash/has'; import { connect } from 'react-redux'; -import { Link } from 'react-router-dom'; +import { Link } from 'react-router-dom-v5-compat'; import TraceIDSearchInput from './TraceIDSearchInput'; import * as dependencyGraph from '../DependencyGraph/url'; diff --git a/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js b/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js index 8763d0ffe2..2c91ce0edc 100644 --- a/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js +++ b/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js @@ -18,7 +18,7 @@ import React from 'react'; import { createMemoryHistory } from 'history'; import { render, screen, fireEvent } from '@testing-library/react'; import '@testing-library/jest-dom'; -import { Router } from 'react-router-dom'; +import { BrowserRouter } from 'react-router-dom-v5-compat'; import TraceIDSearchInput from './TraceIDSearchInput'; import { HistoryProvider } from '../../utils/useHistory'; @@ -29,9 +29,9 @@ describe('', () => { history = createMemoryHistory(); render( - + - + ); }); diff --git a/packages/jaeger-ui/src/components/App/index.jsx b/packages/jaeger-ui/src/components/App/index.jsx index 240cbc22ac..27aab2ffe5 100644 --- a/packages/jaeger-ui/src/components/App/index.jsx +++ b/packages/jaeger-ui/src/components/App/index.jsx @@ -14,8 +14,7 @@ import React, { Component } from 'react'; import { Provider } from 'react-redux'; -import { Redirect, Switch, Router } from 'react-router-dom'; -import { CompatRoute } from "react-router-dom-v5-compat"; +import { Route, Routes, Navigate } from 'react-router-dom-v5-compat'; import { ConfigProvider } from 'antd'; import { defaultTheme } from '@ant-design/compatible'; @@ -31,7 +30,7 @@ import SearchTracePage from '../SearchTracePage'; import { ROUTE_PATH as searchPath } from '../SearchTracePage/url'; import TraceDiff from '../TraceDiff'; import { ROUTE_PATH as traceDiffPath } from '../TraceDiff/url'; -import TracePage from '../TracePage'; +import TracePage from '../TracePage/index'; import { ROUTE_PATH as tracePath } from '../TracePage/url'; import MonitorATMPage from '../Monitor'; import { ROUTE_PATH as monitorATMPath } from '../Monitor/url'; @@ -43,8 +42,7 @@ import '../common/vars.css'; import '../common/utils.css'; import 'antd/dist/reset.css'; import './index.css'; -import { history, store } from '../../utils/configure-store'; -import { HistoryProvider } from '../../utils/useHistory'; +import { store } from '../../utils/configure-store'; const jaegerTheme = { token: { @@ -89,45 +87,23 @@ export default class JaegerUIApp extends Component { return ( - - - - - - - - - - - - - - - - - - - - - - - - - + + + } /> + } /> + } /> + } /> + } /> + } /> + } /> - }/> - - }/> - - }/> - - - - - - - - + } /> + } /> + } /> + + } /> + + ); diff --git a/packages/jaeger-ui/src/components/App/index.test.js b/packages/jaeger-ui/src/components/App/index.test.js index 2a28a9af14..1297676ad6 100644 --- a/packages/jaeger-ui/src/components/App/index.test.js +++ b/packages/jaeger-ui/src/components/App/index.test.js @@ -18,7 +18,7 @@ import shallow from '../../utils/ReactShallowRenderer.test'; import JaegerUIApp from './index'; describe('JaegerUIApp', () => { - it('does not explode', () => { + it.skip('does not explode', () => { const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx index 185db53aa5..8c4d7fc6bf 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx +++ b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx @@ -17,7 +17,7 @@ import * as React from 'react'; import { Select } from 'antd'; import { History as RouterHistory, Location } from 'history'; -import { Link } from 'react-router-dom'; +import { Link } from 'react-router-dom-v5-compat'; import { Field, formValueSelector, reduxForm } from 'redux-form'; import queryString from 'query-string'; diff --git a/packages/jaeger-ui/src/components/SearchTracePage/index.test.js b/packages/jaeger-ui/src/components/SearchTracePage/index.test.js index 00139e5fe5..5448f3838b 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/index.test.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/index.test.js @@ -12,7 +12,8 @@ // See the License for the specific language governing permissions and // limitations under the License. -import { BrowserRouter, MemoryRouter } from 'react-router-dom'; +import { Routes, Route, CompatRouter } from 'react-router-dom-v5-compat'; +import { MemoryRouter } from 'react-router-dom'; jest.mock('redux-form', () => { function reduxForm() { @@ -43,11 +44,15 @@ import transformTraceData from '../../model/transform-trace-data'; import { store as globalStore } from '../../utils/configure-store'; const AllProvider = ({ children }) => ( - - - {children} - - + + + + + + + + + ); describe('', () => { @@ -99,7 +104,9 @@ describe('', () => { store.get = jest.fn(() => ({ service: 'svc-b' })); wrapper = mount( - + + + ); expect(props.fetchServices.mock.calls.length).toBe(1); @@ -115,7 +122,9 @@ describe('', () => { store.get = jest.fn(() => ({ service: 'svc-b' })); wrapper = mount( - + + + ); expect(props.fetchServices.mock.calls.length).toBe(1); @@ -131,7 +140,9 @@ describe('', () => { const historyMock = { push: historyPush }; wrapper = mount( - + + + ); wrapper.find(SearchTracePage).first().instance().goToTrace(traceID); diff --git a/packages/jaeger-ui/src/index.jsx b/packages/jaeger-ui/src/index.jsx index 75476a90c2..bee93d11c4 100644 --- a/packages/jaeger-ui/src/index.jsx +++ b/packages/jaeger-ui/src/index.jsx @@ -18,8 +18,7 @@ import './site-prefix'; import React from 'react'; -import { BrowserRouter } from 'react-router-dom'; -import { CompatRouter } from 'react-router-dom-v5-compat'; +import { CompatRouter, BrowserRouter } from 'react-router-dom-v5-compat'; import { createRoot } from 'react-dom/client'; import JaegerUIApp from './components/App'; diff --git a/packages/jaeger-ui/src/utils/withRouteProps.test.js b/packages/jaeger-ui/src/utils/withRouteProps.test.js index c9dfdad0f0..916868d396 100644 --- a/packages/jaeger-ui/src/utils/withRouteProps.test.js +++ b/packages/jaeger-ui/src/utils/withRouteProps.test.js @@ -14,7 +14,7 @@ import React from 'react'; import { render } from '@testing-library/react'; -import { MemoryRouter, Route } from 'react-router-dom'; +import { MemoryRouter, Route, Routes } from 'react-router-dom-v5-compat'; import withRouteProps from './withRouteProps'; import { useHistory, HistoryProvider } from './useHistory'; @@ -38,9 +38,9 @@ describe('withRouteProps', () => { render( - - - + + } /> + ); diff --git a/packages/jaeger-ui/src/utils/withRouteProps.tsx b/packages/jaeger-ui/src/utils/withRouteProps.tsx index ddb4565415..7c91970e82 100644 --- a/packages/jaeger-ui/src/utils/withRouteProps.tsx +++ b/packages/jaeger-ui/src/utils/withRouteProps.tsx @@ -13,7 +13,7 @@ // limitations under the License. import React from 'react'; -import { useLocation, useParams } from 'react-router-dom'; +import { useLocation, useParams } from 'react-router-dom-v5-compat'; import { History, Location } from 'history'; import { useHistory } from './useHistory'; From d5eb9856bdf3e751adefc05f86d5de414ca847e0 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 10:57:03 -0500 Subject: [PATCH 07/18] Update: Replace compat imports with react-router-dom-v6 imports Signed-off-by: Kaung Zin Hein --- package-lock.json | 166 ++++-------------- packages/jaeger-ui/package.json | 3 +- .../src/components/App/TopNav.test.js | 2 +- .../jaeger-ui/src/components/App/TopNav.tsx | 2 +- .../components/App/TraceIDSearchInput.test.js | 2 +- .../jaeger-ui/src/components/App/index.jsx | 2 +- .../components/DeepDependencies/url.test.js | 6 +- .../src/components/DeepDependencies/url.tsx | 4 +- .../src/components/DependencyGraph/url.tsx | 4 +- .../jaeger-ui/src/components/Monitor/url.tsx | 4 +- .../src/components/QualityMetrics/url.test.js | 6 +- .../src/components/QualityMetrics/url.tsx | 4 +- .../SearchTracePage/SearchResults/index.tsx | 2 +- .../components/SearchTracePage/index.test.js | 27 +-- .../components/SearchTracePage/url.test.js | 6 +- .../src/components/SearchTracePage/url.tsx | 4 +- .../src/components/TraceDiff/url.test.js | 6 +- .../src/components/TraceDiff/url.tsx | 4 +- packages/jaeger-ui/src/index.jsx | 10 +- packages/jaeger-ui/src/types/index.tsx | 2 +- .../src/utils/withRouteProps.test.js | 2 +- .../jaeger-ui/src/utils/withRouteProps.tsx | 2 +- 22 files changed, 65 insertions(+), 205 deletions(-) diff --git a/package-lock.json b/package-lock.json index 573c86c99a..e6cd383e5c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -60,7 +60,6 @@ "resolved": "https://registry.npmjs.org/@ant-design/colors/-/colors-7.1.0.tgz", "integrity": "sha512-MMoDGWn1y9LdQJQSHiCC20x3uZ3CwQnv9QMz6pCmJOrqdgM9YxsoVVY0wtrdXbmfSgnV0KNk6zi09NAhMR2jvg==", "license": "MIT", - "peer": true, "dependencies": { "@ctrl/tinycolor": "^3.6.1" } @@ -96,7 +95,6 @@ "resolved": "https://registry.npmjs.org/@ant-design/cssinjs/-/cssinjs-1.21.1.tgz", "integrity": "sha512-tyWnlK+XH7Bumd0byfbCiZNK43HEubMoCcu9VxwsAwiHdHTgWa+tMN0/yvxa+e8EzuFP1WdUNNPclRpVtD33lg==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.11.1", "@emotion/hash": "^0.8.0", @@ -116,7 +114,6 @@ "resolved": "https://registry.npmjs.org/@ant-design/cssinjs-utils/-/cssinjs-utils-1.1.0.tgz", "integrity": "sha512-E9nOWObXx7Dy7hdyuYlOFaer/LtPO7oyZVxZphh0CYEslr5EmhJPM3WI0Q2RBHRtYg6dSNqeSK73kvZjPN3IMQ==", "license": "MIT", - "peer": true, "dependencies": { "@ant-design/cssinjs": "^1.21.0", "@babel/runtime": "^7.23.2", @@ -144,7 +141,6 @@ "resolved": "https://registry.npmjs.org/@ant-design/icons/-/icons-5.5.1.tgz", "integrity": "sha512-0UrM02MA2iDIgvLatWrj6YTCYe0F/cwXvVE0E2SqGrL7PZireQwgEKTKBisWpZyal5eXZLvuM98kju6YtYne8w==", "license": "MIT", - "peer": true, "dependencies": { "@ant-design/colors": "^7.0.0", "@ant-design/icons-svg": "^4.4.0", @@ -2208,7 +2204,6 @@ "resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.6.1.tgz", "integrity": "sha512-SITSV6aIXsuVNV3f3O0f2n/cgyEDWoSqtZMYiAmcsYHydcKrOz3gUxB/iXd/Qf08+IZX4KpgNbvUdMBmWz+kcA==", "license": "MIT", - "peer": true, "engines": { "node": ">=10" } @@ -5713,7 +5708,6 @@ "resolved": "https://registry.npmjs.org/antd/-/antd-5.21.3.tgz", "integrity": "sha512-Yby3gU6jfuvhNFRPsrHB4Yc/G3LHLNHHy0kShwNmmZf1QTCiW5TmqP3DT5m/NHbJsTgEwJpwo3AaOWo+KQyEjw==", "license": "MIT", - "peer": true, "dependencies": { "@ant-design/colors": "^7.1.0", "@ant-design/cssinjs": "^1.21.1", @@ -5867,8 +5861,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/array-tree-filter/-/array-tree-filter-2.1.0.tgz", "integrity": "sha512-4ROwICNlNw/Hqa9v+rk5h22KjmzB1JGTMVKP2AKJBOCgb0yL0ASf0+YvCcLNNwquOHNX48jkeZIJ3a+oOQqKcw==", - "license": "MIT", - "peer": true + "license": "MIT" }, "node_modules/array-union": { "version": "2.1.0", @@ -14886,21 +14879,6 @@ "node": "20 || >=22" } }, - "node_modules/path-to-regexp": { - "version": "1.9.0", - "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.9.0.tgz", - "integrity": "sha512-xIp7/apCFJuUHdDLWe8O1HIkb0kQrOMb/0u6FXQjemHn/ii5LrIzU6bdECnsiTF/GjZkMEKg1xdiZwNqDYlZ6g==", - "license": "MIT", - "dependencies": { - "isarray": "0.0.1" - } - }, - "node_modules/path-to-regexp/node_modules/isarray": { - "version": "0.0.1", - "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz", - "integrity": "sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ==", - "license": "MIT" - }, "node_modules/path-type": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", @@ -15601,7 +15579,6 @@ "resolved": "https://registry.npmjs.org/rc-cascader/-/rc-cascader-3.28.1.tgz", "integrity": "sha512-9+8oHIMWVLHxuaapDiqFNmD9KSyKN/P4bo9x/MBuDbyTqP8f2/POmmZxdXWBO3yq/uE3pKyQCXYNUxrNfHRv2A==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.12.5", "array-tree-filter": "^2.1.0", @@ -15620,7 +15597,6 @@ "resolved": "https://registry.npmjs.org/rc-checkbox/-/rc-checkbox-3.3.0.tgz", "integrity": "sha512-Ih3ZaAcoAiFKJjifzwsGiT/f/quIkxJoklW4yKGho14Olulwn8gN7hOBve0/WGDg5o/l/5mL0w7ff7/YGvefVw==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "classnames": "^2.3.2", @@ -15636,7 +15612,6 @@ "resolved": "https://registry.npmjs.org/rc-collapse/-/rc-collapse-3.8.0.tgz", "integrity": "sha512-YVBkssrKPBG09TGfcWWGj8zJBYD9G3XuTy89t5iUmSXrIXEAnO1M+qjUxRW6b4Qi0+wNWG6MHJF/+US+nmIlzA==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "classnames": "2.x", @@ -15687,7 +15662,6 @@ "resolved": "https://registry.npmjs.org/rc-dropdown/-/rc-dropdown-4.2.0.tgz", "integrity": "sha512-odM8Ove+gSh0zU27DUj5cG1gNKg7mLWBYzB5E4nNLrLwBmYEgYP43vHKDGOVZcJSVElQBI0+jTQgjnq0NfLjng==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.18.3", "@rc-component/trigger": "^2.0.0", @@ -15704,7 +15678,6 @@ "resolved": "https://registry.npmjs.org/rc-field-form/-/rc-field-form-2.4.0.tgz", "integrity": "sha512-XZ/lF9iqf9HXApIHQHqzJK5v2w4mkUMsVqAzOyWVzoiwwXEavY6Tpuw7HavgzIoD+huVff4JghSGcgEfX6eycg==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.18.0", "@rc-component/async-validator": "^5.0.3", @@ -15780,7 +15753,6 @@ "resolved": "https://registry.npmjs.org/rc-input/-/rc-input-1.6.3.tgz", "integrity": "sha512-wI4NzuqBS8vvKr8cljsvnTUqItMfG1QbJoxovCgL+DX4eVUcHIjVwharwevIxyy7H/jbLryh+K7ysnJr23aWIA==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.11.1", "classnames": "^2.2.1", @@ -15796,7 +15768,6 @@ "resolved": "https://registry.npmjs.org/rc-input-number/-/rc-input-number-9.2.0.tgz", "integrity": "sha512-5XZFhBCV5f9UQ62AZ2hFbEY8iZT/dm23Q1kAg0H8EvOgD3UDbYYJAayoVIkM3lQaCqYAW5gV0yV3vjw1XtzWHg==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "@rc-component/mini-decimal": "^1.0.1", @@ -15814,7 +15785,6 @@ "resolved": "https://registry.npmjs.org/rc-mentions/-/rc-mentions-2.16.1.tgz", "integrity": "sha512-GnhSTGP9Mtv6pqFFGQze44LlrtWOjHNrUUAcsdo9DnNAhN4pwVPEWy4z+2jpjkiGlJ3VoXdvMHcNDQdfI9fEaw==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.22.5", "@rc-component/trigger": "^2.0.0", @@ -15834,7 +15804,6 @@ "resolved": "https://registry.npmjs.org/rc-menu/-/rc-menu-9.15.1.tgz", "integrity": "sha512-UKporqU6LPfHnpPmtP6hdEK4iO5Q+b7BRv/uRpxdIyDGplZy9jwUjsnpev5bs3PQKB0H0n34WAPDfjAfn3kAPA==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "@rc-component/trigger": "^2.0.0", @@ -15903,7 +15872,6 @@ "resolved": "https://registry.npmjs.org/rc-pagination/-/rc-pagination-4.3.0.tgz", "integrity": "sha512-UubEWA0ShnroQ1tDa291Fzw6kj0iOeF26IsUObxYTpimgj4/qPCWVFl18RLZE+0Up1IZg0IK4pMn6nB3mjvB7g==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "classnames": "^2.3.2", @@ -15919,7 +15887,6 @@ "resolved": "https://registry.npmjs.org/rc-picker/-/rc-picker-4.6.15.tgz", "integrity": "sha512-OWZ1yrMie+KN2uEUfYCfS4b2Vu6RC1FWwNI0s+qypsc3wRt7g+peuZKVIzXCTaJwyyZruo80+akPg2+GmyiJjw==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.24.7", "@rc-component/trigger": "^2.0.0", @@ -16008,7 +15975,6 @@ "resolved": "https://registry.npmjs.org/rc-segmented/-/rc-segmented-2.5.0.tgz", "integrity": "sha512-B28Fe3J9iUFOhFJET3RoXAPFJ2u47QvLSYcZWC4tFYNGPEjug5LAxEasZlA/PpAxhdOPqGWsGbSj7ftneukJnw==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.11.1", "classnames": "^2.2.1", @@ -16025,7 +15991,6 @@ "resolved": "https://registry.npmjs.org/rc-select/-/rc-select-14.15.2.tgz", "integrity": "sha512-oNoXlaFmpqXYcQDzcPVLrEqS2J9c+/+oJuGrlXeVVX/gVgrbHa5YcyiRUXRydFjyuA7GP3elRuLF7Y3Tfwltlw==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "@rc-component/trigger": "^2.1.1", @@ -16048,7 +16013,6 @@ "resolved": "https://registry.npmjs.org/rc-slider/-/rc-slider-11.1.7.tgz", "integrity": "sha512-ytYbZei81TX7otdC0QvoYD72XSlxvTihNth5OeZ6PMXyEDq/vHdWFulQmfDGyXK1NwKwSlKgpvINOa88uT5g2A==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "classnames": "^2.2.5", @@ -16100,7 +16064,6 @@ "resolved": "https://registry.npmjs.org/rc-table/-/rc-table-7.47.5.tgz", "integrity": "sha512-fzq+V9j/atbPIcvs3emuclaEoXulwQpIiJA6/7ey52j8+9cJ4P8DGmp4YzfUVDrb3qhgedcVeD6eRgUrokwVEQ==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "@rc-component/context": "^1.4.0", @@ -16122,7 +16085,6 @@ "resolved": "https://registry.npmjs.org/rc-tabs/-/rc-tabs-15.3.0.tgz", "integrity": "sha512-lzE18r+zppT/jZWOAWS6ntdkDUKHOLJzqMi5UAij1LeKwOaQaupupAoI9Srn73GRzVpmGznkECMRrzkRusC40A==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.11.2", "classnames": "2.x", @@ -16145,7 +16107,6 @@ "resolved": "https://registry.npmjs.org/rc-textarea/-/rc-textarea-1.8.2.tgz", "integrity": "sha512-UFAezAqltyR00a8Lf0IPAyTd29Jj9ee8wt8DqXyDMal7r/Cg/nDt3e1OOv3Th4W6mKaZijjgwuPXhAfVNTN8sw==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "classnames": "^2.2.1", @@ -16163,7 +16124,6 @@ "resolved": "https://registry.npmjs.org/rc-tooltip/-/rc-tooltip-6.2.1.tgz", "integrity": "sha512-rws0duD/3sHHsD905Nex7FvoUGy2UBQRhTkKxeEvr2FB+r21HsOxcDJI0TzyO8NHhnAA8ILr8pfbSBg5Jj5KBg==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.11.2", "@rc-component/trigger": "^2.0.0", @@ -16179,7 +16139,6 @@ "resolved": "https://registry.npmjs.org/rc-tree/-/rc-tree-5.9.0.tgz", "integrity": "sha512-CPrgOvm9d/9E+izTONKSngNzQdIEjMox2PBufWjS1wf7vxtvmCWzK1SlpHbRY6IaBfJIeZ+88RkcIevf729cRg==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "classnames": "2.x", @@ -16200,7 +16159,6 @@ "resolved": "https://registry.npmjs.org/rc-tree-select/-/rc-tree-select-5.23.0.tgz", "integrity": "sha512-aQGi2tFSRw1WbXv0UVXPzHm09E0cSvUVZMLxQtMv3rnZZpNmdRXWrnd9QkLNlVH31F+X5rgghmdSFF3yZW0N9A==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.10.1", "classnames": "2.x", @@ -16418,93 +16376,6 @@ "node": ">=0.10.0" } }, - "node_modules/react-router": { - "version": "5.3.4", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.3.4.tgz", - "integrity": "sha512-Ys9K+ppnJah3QuaRiLxk+jDWOR1MekYQrlytiXxC1RyfbdsZkS5pvKAzCCr031xHixZwpnsYNT5xysdFHQaYsA==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.12.13", - "history": "^4.9.0", - "hoist-non-react-statics": "^3.1.0", - "loose-envify": "^1.3.1", - "path-to-regexp": "^1.7.0", - "prop-types": "^15.6.2", - "react-is": "^16.6.0", - "tiny-invariant": "^1.0.2", - "tiny-warning": "^1.0.0" - }, - "peerDependencies": { - "react": ">=15" - } - }, - "node_modules/react-router-dom": { - "version": "5.3.4", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.3.4.tgz", - "integrity": "sha512-m4EqFMHv/Ih4kpcBCONHbkT68KoAeHN4p3lAGoNryfHi0dMy0kCzEZakiKRsvg5wHZ/JLrLW8o8KomWiz/qbYQ==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.12.13", - "history": "^4.9.0", - "loose-envify": "^1.3.1", - "prop-types": "^15.6.2", - "react-router": "5.3.4", - "tiny-invariant": "^1.0.2", - "tiny-warning": "^1.0.0" - }, - "peerDependencies": { - "react": ">=15" - } - }, - "node_modules/react-router-dom-v5-compat": { - "version": "6.28.0", - "resolved": "https://registry.npmjs.org/react-router-dom-v5-compat/-/react-router-dom-v5-compat-6.28.0.tgz", - "integrity": "sha512-KrTxsn2vibvoTeGstcBMEuchuT+BxXGftfa7njf1vNSlzO8t+4Y5oN2h3WeAq2rK7MyA5mFUXrE/+lMOR0ay9Q==", - "license": "MIT", - "dependencies": { - "@remix-run/router": "1.21.0", - "history": "^5.3.0", - "react-router": "6.28.0" - }, - "engines": { - "node": ">=14.0.0" - }, - "peerDependencies": { - "react": ">=16.8", - "react-dom": ">=16.8", - "react-router-dom": "4 || 5" - } - }, - "node_modules/react-router-dom-v5-compat/node_modules/history": { - "version": "5.3.0", - "resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz", - "integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.7.6" - } - }, - "node_modules/react-router-dom-v5-compat/node_modules/react-router": { - "version": "6.28.0", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.28.0.tgz", - "integrity": "sha512-HrYdIFqdrnhDw0PqG/AKjAqEqM7AvxCz0DQ4h2W8k6nqmc5uRBYDag0SBxx9iYz5G8gnuNVLzUe13wl9eAsXXg==", - "license": "MIT", - "dependencies": { - "@remix-run/router": "1.21.0" - }, - "engines": { - "node": ">=14.0.0" - }, - "peerDependencies": { - "react": ">=16.8" - } - }, - "node_modules/react-router/node_modules/react-is": { - "version": "16.13.1", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "license": "MIT" - }, "node_modules/react-shallow-renderer": { "version": "16.15.0", "resolved": "https://registry.npmjs.org/react-shallow-renderer/-/react-shallow-renderer-16.15.0.tgz", @@ -20131,8 +20002,7 @@ "react-is": "^18.2.0", "react-json-view-lite": "2.1.0", "react-redux": "^8.1.2", - "react-router-dom": "5.3.4", - "react-router-dom-v5-compat": "^6.24.0", + "react-router-dom": "^6.28.1", "react-vis": "1.11.12", "react-vis-force": "^0.3.1", "react-window": "^1.8.10", @@ -20360,6 +20230,38 @@ "node": "^10 || ^12 || >=14" } }, + "packages/jaeger-ui/node_modules/react-router-dom": { + "version": "6.28.1", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.28.1.tgz", + "integrity": "sha512-YraE27C/RdjcZwl5UCqF/ffXnZDxpJdk9Q6jw38SZHjXs7NNdpViq2l2c7fO7+4uWaEfcwfGCv3RSg4e1By/fQ==", + "license": "MIT", + "dependencies": { + "@remix-run/router": "1.21.0", + "react-router": "6.28.1" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, + "packages/jaeger-ui/node_modules/react-router-dom/node_modules/react-router": { + "version": "6.28.1", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.28.1.tgz", + "integrity": "sha512-2omQTA3rkMljmrvvo6WtewGdVh45SpL9hGiCI9uUrwGGfNFDIvGK4gYJsKlJoNVi6AQZcopSCballL+QGOm7fA==", + "license": "MIT", + "dependencies": { + "@remix-run/router": "1.21.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, "packages/jaeger-ui/node_modules/vite": { "version": "6.0.7", "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.7.tgz", diff --git a/packages/jaeger-ui/package.json b/packages/jaeger-ui/package.json index 99afac9222..fcf33e26fc 100644 --- a/packages/jaeger-ui/package.json +++ b/packages/jaeger-ui/package.json @@ -77,8 +77,7 @@ "react-is": "^18.2.0", "react-json-view-lite": "2.1.0", "react-redux": "^8.1.2", - "react-router-dom": "5.3.4", - "react-router-dom-v5-compat": "^6.24.0", + "react-router-dom": "^6.28.1", "react-vis": "1.11.12", "react-vis-force": "^0.3.1", "react-window": "^1.8.10", diff --git a/packages/jaeger-ui/src/components/App/TopNav.test.js b/packages/jaeger-ui/src/components/App/TopNav.test.js index eda79f1c11..9a86f3ccd1 100644 --- a/packages/jaeger-ui/src/components/App/TopNav.test.js +++ b/packages/jaeger-ui/src/components/App/TopNav.test.js @@ -14,7 +14,7 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; -import { BrowserRouter } from 'react-router-dom-v5-compat'; +import { BrowserRouter } from 'react-router-dom'; import '@testing-library/jest-dom'; import { mapStateToProps, TopNavImpl as TopNav } from './TopNav'; diff --git a/packages/jaeger-ui/src/components/App/TopNav.tsx b/packages/jaeger-ui/src/components/App/TopNav.tsx index 79a149514b..83e87f470f 100644 --- a/packages/jaeger-ui/src/components/App/TopNav.tsx +++ b/packages/jaeger-ui/src/components/App/TopNav.tsx @@ -17,7 +17,7 @@ import { Dropdown, Menu, MenuProps } from 'antd'; import { IoChevronDown } from 'react-icons/io5'; import _has from 'lodash/has'; import { connect } from 'react-redux'; -import { Link } from 'react-router-dom-v5-compat'; +import { Link } from 'react-router-dom'; import TraceIDSearchInput from './TraceIDSearchInput'; import * as dependencyGraph from '../DependencyGraph/url'; diff --git a/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js b/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js index 2c91ce0edc..1b118097d0 100644 --- a/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js +++ b/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js @@ -18,7 +18,7 @@ import React from 'react'; import { createMemoryHistory } from 'history'; import { render, screen, fireEvent } from '@testing-library/react'; import '@testing-library/jest-dom'; -import { BrowserRouter } from 'react-router-dom-v5-compat'; +import { BrowserRouter } from 'react-router-dom'; import TraceIDSearchInput from './TraceIDSearchInput'; import { HistoryProvider } from '../../utils/useHistory'; diff --git a/packages/jaeger-ui/src/components/App/index.jsx b/packages/jaeger-ui/src/components/App/index.jsx index 27aab2ffe5..ab69900da5 100644 --- a/packages/jaeger-ui/src/components/App/index.jsx +++ b/packages/jaeger-ui/src/components/App/index.jsx @@ -14,7 +14,7 @@ import React, { Component } from 'react'; import { Provider } from 'react-redux'; -import { Route, Routes, Navigate } from 'react-router-dom-v5-compat'; +import { Route, Routes, Navigate } from 'react-router-dom'; import { ConfigProvider } from 'antd'; import { defaultTheme } from '@ant-design/compatible'; diff --git a/packages/jaeger-ui/src/components/DeepDependencies/url.test.js b/packages/jaeger-ui/src/components/DeepDependencies/url.test.js index 0e9f6386a7..5484468583 100644 --- a/packages/jaeger-ui/src/components/DeepDependencies/url.test.js +++ b/packages/jaeger-ui/src/components/DeepDependencies/url.test.js @@ -32,11 +32,7 @@ describe('DeepDependencyGraph/url', () => { it('calls matchPath with expected arguments', () => { matches(path); - expect(matchPathSpy).toHaveBeenLastCalledWith(path, { - path: ROUTE_PATH, - strict: true, - exact: true, - }); + expect(matchPathSpy).toHaveBeenLastCalledWith(path, ROUTE_PATH); }); it("returns truthiness of matchPath's return value", () => { diff --git a/packages/jaeger-ui/src/components/DeepDependencies/url.tsx b/packages/jaeger-ui/src/components/DeepDependencies/url.tsx index 1fe6ecfbf0..7b4717dc4a 100644 --- a/packages/jaeger-ui/src/components/DeepDependencies/url.tsx +++ b/packages/jaeger-ui/src/components/DeepDependencies/url.tsx @@ -23,10 +23,8 @@ import prefixUrl from '../../utils/prefix-url'; export const ROUTE_PATH = prefixUrl('/deep-dependencies'); -const ROUTE_MATCHER = { path: ROUTE_PATH, strict: true, exact: true }; - export function matches(path: string) { - return Boolean(matchPath(path, ROUTE_MATCHER)); + return Boolean(matchPath(path, ROUTE_PATH)); } export function getUrl(args?: { [key: string]: unknown; showOp?: boolean }, baseUrl: string = ROUTE_PATH) { diff --git a/packages/jaeger-ui/src/components/DependencyGraph/url.tsx b/packages/jaeger-ui/src/components/DependencyGraph/url.tsx index 99c3fd46d6..75f6df005d 100644 --- a/packages/jaeger-ui/src/components/DependencyGraph/url.tsx +++ b/packages/jaeger-ui/src/components/DependencyGraph/url.tsx @@ -18,10 +18,8 @@ import prefixUrl from '../../utils/prefix-url'; export const ROUTE_PATH = prefixUrl('/dependencies'); -const ROUTE_MATCHER = { path: ROUTE_PATH, strict: true, exact: true }; - export function matches(path: string) { - return Boolean(matchPath(path, ROUTE_MATCHER)); + return Boolean(matchPath(path, ROUTE_PATH)); } export function getUrl() { diff --git a/packages/jaeger-ui/src/components/Monitor/url.tsx b/packages/jaeger-ui/src/components/Monitor/url.tsx index 89d6f6e46a..cd5569eeba 100644 --- a/packages/jaeger-ui/src/components/Monitor/url.tsx +++ b/packages/jaeger-ui/src/components/Monitor/url.tsx @@ -18,10 +18,8 @@ import prefixUrl from '../../utils/prefix-url'; export const ROUTE_PATH = prefixUrl('/monitor'); -const ROUTE_MATCHER = { path: ROUTE_PATH, strict: true, exact: true }; - export function matches(path: string) { - return Boolean(matchPath(path, ROUTE_MATCHER)); + return Boolean(matchPath(path, ROUTE_PATH)); } export function getUrl() { diff --git a/packages/jaeger-ui/src/components/QualityMetrics/url.test.js b/packages/jaeger-ui/src/components/QualityMetrics/url.test.js index e3ebf4e470..d11e7916b3 100644 --- a/packages/jaeger-ui/src/components/QualityMetrics/url.test.js +++ b/packages/jaeger-ui/src/components/QualityMetrics/url.test.js @@ -34,11 +34,7 @@ describe('TraceDiff/url', () => { it('calls matchPath with expected arguments', () => { matches(path); - expect(matchPathSpy).toHaveBeenLastCalledWith(path, { - path: ROUTE_PATH, - strict: true, - exact: true, - }); + expect(matchPathSpy).toHaveBeenLastCalledWith(path, ROUTE_PATH); }); it("returns truthiness of matchPath's return value", () => { diff --git a/packages/jaeger-ui/src/components/QualityMetrics/url.tsx b/packages/jaeger-ui/src/components/QualityMetrics/url.tsx index e4608b0823..274940a2ce 100644 --- a/packages/jaeger-ui/src/components/QualityMetrics/url.tsx +++ b/packages/jaeger-ui/src/components/QualityMetrics/url.tsx @@ -20,10 +20,8 @@ import prefixUrl from '../../utils/prefix-url'; export const ROUTE_PATH = prefixUrl('/quality-metrics'); -const ROUTE_MATCHER = { path: ROUTE_PATH, strict: true, exact: true }; - export function matches(path: string) { - return Boolean(matchPath(path, ROUTE_MATCHER)); + return Boolean(matchPath(path, ROUTE_PATH)); } export function getUrl(queryParams?: Record) { diff --git a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx index 3de8a403ff..56117dedbf 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx +++ b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx @@ -17,7 +17,7 @@ import * as React from 'react'; import { Select } from 'antd'; import { History as RouterHistory, Location } from 'history'; -import { Link } from 'react-router-dom-v5-compat'; +import { Link } from 'react-router-dom'; import { Field, formValueSelector, reduxForm } from 'redux-form'; import queryString from 'query-string'; diff --git a/packages/jaeger-ui/src/components/SearchTracePage/index.test.js b/packages/jaeger-ui/src/components/SearchTracePage/index.test.js index e6b2540c91..b98d910833 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/index.test.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/index.test.js @@ -12,8 +12,7 @@ // See the License for the specific language governing permissions and // limitations under the License. -import { Routes, Route, CompatRouter } from 'react-router-dom-v5-compat'; -import { MemoryRouter } from 'react-router-dom'; +import { Routes, Route, MemoryRouter } from 'react-router-dom'; jest.mock('redux-form', () => { function reduxForm() { @@ -45,13 +44,11 @@ import { store as globalStore } from '../../utils/configure-store'; const AllProvider = ({ children }) => ( - - - - - - - + + + + + ); @@ -104,9 +101,7 @@ describe('', () => { store.get = jest.fn(() => ({ service: 'svc-b' })); wrapper = mount( - - - + ); expect(props.fetchServices.mock.calls.length).toBe(1); @@ -122,9 +117,7 @@ describe('', () => { store.get = jest.fn(() => ({ service: 'svc-b' })); wrapper = mount( - - - + ); expect(props.fetchServices.mock.calls.length).toBe(1); @@ -152,9 +145,7 @@ describe('', () => { const historyMock = { push: historyPush }; wrapper = mount( - - - + ); wrapper.find(SearchTracePage).first().instance().goToTrace(traceID); diff --git a/packages/jaeger-ui/src/components/SearchTracePage/url.test.js b/packages/jaeger-ui/src/components/SearchTracePage/url.test.js index 8e2aec9e61..275b0d93fd 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/url.test.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/url.test.js @@ -39,11 +39,7 @@ describe('SearchTracePage/url', () => { it('calls matchPath with expected arguments', () => { matches(path); - expect(matchPathSpy).toHaveBeenLastCalledWith(path, { - path: ROUTE_PATH, - strict: true, - exact: true, - }); + expect(matchPathSpy).toHaveBeenLastCalledWith(path, ROUTE_PATH); }); it("returns truthiness of matchPath's return value", () => { diff --git a/packages/jaeger-ui/src/components/SearchTracePage/url.tsx b/packages/jaeger-ui/src/components/SearchTracePage/url.tsx index 04f75c23f3..e402fe576d 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/url.tsx +++ b/packages/jaeger-ui/src/components/SearchTracePage/url.tsx @@ -28,10 +28,8 @@ function eqEq(a: string | number | null | undefined, b: string | number | null | export const ROUTE_PATH = prefixUrl('/search'); -const ROUTE_MATCHER = { path: ROUTE_PATH, strict: true, exact: true }; - export function matches(path: string) { - return Boolean(matchPath(path, ROUTE_MATCHER)); + return Boolean(matchPath(path, ROUTE_PATH)); } type TUrlState = Record> & { diff --git a/packages/jaeger-ui/src/components/TraceDiff/url.test.js b/packages/jaeger-ui/src/components/TraceDiff/url.test.js index 05743a5bdc..43b8e13c46 100644 --- a/packages/jaeger-ui/src/components/TraceDiff/url.test.js +++ b/packages/jaeger-ui/src/components/TraceDiff/url.test.js @@ -31,11 +31,7 @@ describe('TraceDiff/url', () => { it('calls matchPath with expected arguments', () => { matches(path); - expect(matchPathSpy).toHaveBeenLastCalledWith(path, { - path: ROUTE_PATH, - strict: true, - exact: true, - }); + expect(matchPathSpy).toHaveBeenLastCalledWith(path, ROUTE_PATH); }); it("returns truthiness of matchPath's return value", () => { diff --git a/packages/jaeger-ui/src/components/TraceDiff/url.tsx b/packages/jaeger-ui/src/components/TraceDiff/url.tsx index f4965baef2..5567936236 100644 --- a/packages/jaeger-ui/src/components/TraceDiff/url.tsx +++ b/packages/jaeger-ui/src/components/TraceDiff/url.tsx @@ -26,10 +26,8 @@ export type TDiffRouteParams = { export const ROUTE_PATH = prefixUrl('/trace/:a?\\.\\.\\.:b?'); -const ROUTE_MATCHER = { path: ROUTE_PATH, strict: true, exact: true }; - export function matches(path: string) { - return Boolean(matchPath(path, ROUTE_MATCHER)); + return Boolean(matchPath(path, ROUTE_PATH)); } export function getUrl(state: TTraceDiffState) { diff --git a/packages/jaeger-ui/src/index.jsx b/packages/jaeger-ui/src/index.jsx index bee93d11c4..069664f1df 100644 --- a/packages/jaeger-ui/src/index.jsx +++ b/packages/jaeger-ui/src/index.jsx @@ -18,8 +18,8 @@ import './site-prefix'; import React from 'react'; -import { CompatRouter, BrowserRouter } from 'react-router-dom-v5-compat'; import { createRoot } from 'react-dom/client'; +import { BrowserRouter } from 'react-router-dom'; import JaegerUIApp from './components/App'; import { context as trackingContext } from './utils/tracking'; @@ -41,18 +41,14 @@ if (typeof trackingContext === 'object' && trackingContext !== null) { trackingContext.context(() => { root.render( - - - + ); }); } else { root.render( - - - + ); } diff --git a/packages/jaeger-ui/src/types/index.tsx b/packages/jaeger-ui/src/types/index.tsx index f4f592b695..3dacee34b9 100644 --- a/packages/jaeger-ui/src/types/index.tsx +++ b/packages/jaeger-ui/src/types/index.tsx @@ -56,7 +56,7 @@ export type ReduxState = { error: ApiError | TNil; }; embedded: EmbeddedState; - router: Router & { + router: typeof Router & { location: Location; }; services: { diff --git a/packages/jaeger-ui/src/utils/withRouteProps.test.js b/packages/jaeger-ui/src/utils/withRouteProps.test.js index 916868d396..e38c604a10 100644 --- a/packages/jaeger-ui/src/utils/withRouteProps.test.js +++ b/packages/jaeger-ui/src/utils/withRouteProps.test.js @@ -14,7 +14,7 @@ import React from 'react'; import { render } from '@testing-library/react'; -import { MemoryRouter, Route, Routes } from 'react-router-dom-v5-compat'; +import { MemoryRouter, Route, Routes } from 'react-router-dom'; import withRouteProps from './withRouteProps'; import { useHistory, HistoryProvider } from './useHistory'; diff --git a/packages/jaeger-ui/src/utils/withRouteProps.tsx b/packages/jaeger-ui/src/utils/withRouteProps.tsx index 7c91970e82..ddb4565415 100644 --- a/packages/jaeger-ui/src/utils/withRouteProps.tsx +++ b/packages/jaeger-ui/src/utils/withRouteProps.tsx @@ -13,7 +13,7 @@ // limitations under the License. import React from 'react'; -import { useLocation, useParams } from 'react-router-dom-v5-compat'; +import { useLocation, useParams } from 'react-router-dom'; import { History, Location } from 'history'; import { useHistory } from './useHistory'; From 93c2181f261ab35670292e84f9a66e51eeed4682 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 11:04:48 -0500 Subject: [PATCH 08/18] Fix: Use `useLocation` hook in functional TopNav component Signed-off-by: Kaung Zin Hein --- packages/jaeger-ui/src/components/App/TopNav.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/jaeger-ui/src/components/App/TopNav.tsx b/packages/jaeger-ui/src/components/App/TopNav.tsx index 83e87f470f..1fd8806aba 100644 --- a/packages/jaeger-ui/src/components/App/TopNav.tsx +++ b/packages/jaeger-ui/src/components/App/TopNav.tsx @@ -17,7 +17,7 @@ import { Dropdown, Menu, MenuProps } from 'antd'; import { IoChevronDown } from 'react-icons/io5'; import _has from 'lodash/has'; import { connect } from 'react-redux'; -import { Link } from 'react-router-dom'; +import { Link, useLocation } from 'react-router-dom'; import TraceIDSearchInput from './TraceIDSearchInput'; import * as dependencyGraph from '../DependencyGraph/url'; @@ -119,8 +119,9 @@ const itemsGlobalLeft: MenuProps['items'] = [ ]; export function TopNavImpl(props: Props) { - const { config, router } = props; - const { pathname } = router.location; + const location = useLocation(); + const { config } = props; + const { pathname } = location; const menuItems = Array.isArray(config.menu) ? config.menu : []; const itemsGlobalRight: MenuProps['items'] = [ From 52793ea30ccd26a7bfea9e341b2c2d6ce3ba3483 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 11:24:14 -0500 Subject: [PATCH 09/18] Fix: Snapshot for rrd-v6 Signed-off-by: Kaung Zin Hein --- .../App/__snapshots__/index.test.js.snap | 163 ++++++------------ .../src/components/App/index.test.js | 2 +- 2 files changed, 58 insertions(+), 107 deletions(-) diff --git a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap index 60af5e6f96..ac252480bf 100644 --- a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap +++ b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap @@ -52,115 +52,66 @@ exports[`JaegerUIApp does not explode 1`] = ` } } > - - - - - - - - - - - - - - - - - - - - - - - - - - + + } + path="/search" + /> + } + path="/trace/:a?\\\\.\\\\.\\\\.:b?" + /> + } + path="/trace/:id" + /> + } + path="/dependencies" + /> + } + path="/deep-dependencies" + /> + } + path="/quality-metrics" + /> + } + path="/monitor" + /> + - + - + - - - - - - - + } + path="/" + /> + } + path="*" + /> + + `; diff --git a/packages/jaeger-ui/src/components/App/index.test.js b/packages/jaeger-ui/src/components/App/index.test.js index 1297676ad6..2a28a9af14 100644 --- a/packages/jaeger-ui/src/components/App/index.test.js +++ b/packages/jaeger-ui/src/components/App/index.test.js @@ -18,7 +18,7 @@ import shallow from '../../utils/ReactShallowRenderer.test'; import JaegerUIApp from './index'; describe('JaegerUIApp', () => { - it.skip('does not explode', () => { + it('does not explode', () => { const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); From aa98700bce5c7f19c286baa14d10b80d9d9af568 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 13:06:45 -0500 Subject: [PATCH 10/18] Fix: Lint tsc Signed-off-by: Kaung Zin Hein --- .../src/components/SearchTracePage/SearchResults/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx index 56117dedbf..63fc7c5a30 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx +++ b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx @@ -18,7 +18,6 @@ import * as React from 'react'; import { Select } from 'antd'; import { History as RouterHistory, Location } from 'history'; import { Link } from 'react-router-dom'; -import { Field, formValueSelector, reduxForm } from 'redux-form'; import queryString from 'query-string'; import AltViewOptions from './AltViewOptions'; From c1eaadddc597f485083fca51b30c04985460a992 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 13:23:43 -0500 Subject: [PATCH 11/18] Update: Remove `@types/react-router-dom` Signed-off-by: Kaung Zin Hein --- package-lock.json | 24 ------------------------ packages/jaeger-ui/package.json | 3 +-- 2 files changed, 1 insertion(+), 26 deletions(-) diff --git a/package-lock.json b/package-lock.json index e6cd383e5c..067126c3fe 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4747,29 +4747,6 @@ "@types/react": "*" } }, - "node_modules/@types/react-router": { - "version": "5.1.20", - "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz", - "integrity": "sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==", - "dev": true, - "license": "MIT", - "dependencies": { - "@types/history": "^4.7.11", - "@types/react": "*" - } - }, - "node_modules/@types/react-router-dom": { - "version": "5.3.3", - "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.3.tgz", - "integrity": "sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==", - "dev": true, - "license": "MIT", - "dependencies": { - "@types/history": "^4.7.11", - "@types/react": "*", - "@types/react-router": "*" - } - }, "node_modules/@types/react-window": { "version": "1.8.8", "resolved": "https://registry.npmjs.org/@types/react-window/-/react-window-1.8.8.tgz", @@ -20029,7 +20006,6 @@ "@types/object-hash": "^3.0.2", "@types/react": "^18.3.11", "@types/react-helmet": "^6.1.5", - "@types/react-router-dom": "^5.1.0", "@types/react-window": "^1.8.0", "@types/redux-actions": "2.2.1", "@vitejs/plugin-legacy": "^6.0.0", diff --git a/packages/jaeger-ui/package.json b/packages/jaeger-ui/package.json index fcf33e26fc..560f575861 100644 --- a/packages/jaeger-ui/package.json +++ b/packages/jaeger-ui/package.json @@ -23,7 +23,6 @@ "@types/object-hash": "^3.0.2", "@types/react": "^18.3.11", "@types/react-helmet": "^6.1.5", - "@types/react-router-dom": "^5.1.0", "@types/react-window": "^1.8.0", "@types/redux-actions": "2.2.1", "@vitejs/plugin-legacy": "^6.0.0", @@ -49,7 +48,7 @@ "@ant-design/compatible": "^5.1.3", "@jaegertracing/plexus": "0.2.0", "@pyroscope/flamegraph": "0.21.4", - "@sentry/browser": "^8.18.0", + "@sentry/browser": "^8.48.0", "antd": "^5.21.3", "chance": "^1.0.10", "classnames": "^2.5.1", From 188ae81f83f5877212d28b6da7be1d872c729d64 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 17:40:46 -0500 Subject: [PATCH 12/18] Update: Applied review changes Signed-off-by: Kaung Zin Hein --- package-lock.json | 2 +- packages/jaeger-ui/package.json | 2 +- .../jaeger-ui/src/components/App/TraceIDSearchInput.test.js | 2 +- packages/jaeger-ui/src/components/App/index.jsx | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index 067126c3fe..3d150a9b48 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19951,7 +19951,7 @@ "@ant-design/compatible": "^5.1.3", "@jaegertracing/plexus": "0.2.0", "@pyroscope/flamegraph": "0.21.4", - "@sentry/browser": "^8.48.0", + "@sentry/browser": "^8.18.0", "antd": "^5.21.3", "chance": "^1.0.10", "classnames": "^2.5.1", diff --git a/packages/jaeger-ui/package.json b/packages/jaeger-ui/package.json index 560f575861..b62a4ff434 100644 --- a/packages/jaeger-ui/package.json +++ b/packages/jaeger-ui/package.json @@ -48,7 +48,7 @@ "@ant-design/compatible": "^5.1.3", "@jaegertracing/plexus": "0.2.0", "@pyroscope/flamegraph": "0.21.4", - "@sentry/browser": "^8.48.0", + "@sentry/browser": "^8.18.0", "antd": "^5.21.3", "chance": "^1.0.10", "classnames": "^2.5.1", diff --git a/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js b/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js index 1b118097d0..d88635197d 100644 --- a/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js +++ b/packages/jaeger-ui/src/components/App/TraceIDSearchInput.test.js @@ -29,7 +29,7 @@ describe('', () => { history = createMemoryHistory(); render( - + diff --git a/packages/jaeger-ui/src/components/App/index.jsx b/packages/jaeger-ui/src/components/App/index.jsx index ab69900da5..31c2646877 100644 --- a/packages/jaeger-ui/src/components/App/index.jsx +++ b/packages/jaeger-ui/src/components/App/index.jsx @@ -30,7 +30,7 @@ import SearchTracePage from '../SearchTracePage'; import { ROUTE_PATH as searchPath } from '../SearchTracePage/url'; import TraceDiff from '../TraceDiff'; import { ROUTE_PATH as traceDiffPath } from '../TraceDiff/url'; -import TracePage from '../TracePage/index'; +import TracePage from '../TracePage'; import { ROUTE_PATH as tracePath } from '../TracePage/url'; import MonitorATMPage from '../Monitor'; import { ROUTE_PATH as monitorATMPath } from '../Monitor/url'; From 8aebf4cec5f8ee804d8cc22ab698dd28e7b12f3c Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 18:15:36 -0500 Subject: [PATCH 13/18] Update: Use `Outlet` in `Page` Signed-off-by: Kaung Zin Hein --- .../jaeger-ui/src/components/App/Page.tsx | 5 ++- .../App/__snapshots__/index.test.js.snap | 31 +++++++------------ .../jaeger-ui/src/components/App/index.jsx | 12 +++---- 3 files changed, 20 insertions(+), 28 deletions(-) diff --git a/packages/jaeger-ui/src/components/App/Page.tsx b/packages/jaeger-ui/src/components/App/Page.tsx index 810bcabc61..a93b0393e7 100644 --- a/packages/jaeger-ui/src/components/App/Page.tsx +++ b/packages/jaeger-ui/src/components/App/Page.tsx @@ -17,6 +17,7 @@ import { Layout } from 'antd'; import cx from 'classnames'; import Helmet from 'react-helmet'; import { connect } from 'react-redux'; +import { Outlet } from 'react-router-dom'; import TopNav from './TopNav'; import { ReduxState } from '../../types'; @@ -62,7 +63,9 @@ export class PageImpl extends React.Component { )} - {this.props.children} + + + ); diff --git a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap index ac252480bf..93650188fe 100644 --- a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap +++ b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap @@ -52,8 +52,15 @@ exports[`JaegerUIApp does not explode 1`] = ` } } > - - + + } + path="/" + > + } + index={true} + /> } path="/search" @@ -82,14 +89,6 @@ exports[`JaegerUIApp does not explode 1`] = ` element={} path="/monitor" /> - - } - path="/" - /> - - } - path="/" - /> } path="*" /> - - + + `; diff --git a/packages/jaeger-ui/src/components/App/index.jsx b/packages/jaeger-ui/src/components/App/index.jsx index 31c2646877..8bba8dc8a6 100644 --- a/packages/jaeger-ui/src/components/App/index.jsx +++ b/packages/jaeger-ui/src/components/App/index.jsx @@ -87,8 +87,9 @@ export default class JaegerUIApp extends Component { return ( - - + + }> + } /> } /> } /> } /> @@ -97,13 +98,10 @@ export default class JaegerUIApp extends Component { } /> } /> - } /> } /> - } /> - } /> - - + + ); From 375bed28c8c285af58a2da47c2842cd9416ac065 Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 19:06:18 -0500 Subject: [PATCH 14/18] Update: Revert BrowserRouter usage in test Signed-off-by: Kaung Zin Hein --- .../components/SearchTracePage/index.test.js | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/jaeger-ui/src/components/SearchTracePage/index.test.js b/packages/jaeger-ui/src/components/SearchTracePage/index.test.js index b98d910833..0c21fb5ee1 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/index.test.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/index.test.js @@ -12,7 +12,7 @@ // See the License for the specific language governing permissions and // limitations under the License. -import { Routes, Route, MemoryRouter } from 'react-router-dom'; +import { Routes, Route, BrowserRouter } from 'react-router-dom'; jest.mock('redux-form', () => { function reduxForm() { @@ -43,13 +43,13 @@ import transformTraceData from '../../model/transform-trace-data'; import { store as globalStore } from '../../utils/configure-store'; const AllProvider = ({ children }) => ( - + - + ); describe('', () => { @@ -100,9 +100,9 @@ describe('', () => { const oldFn = store.get; store.get = jest.fn(() => ({ service: 'svc-b' })); wrapper = mount( - + - + ); expect(props.fetchServices.mock.calls.length).toBe(1); expect(props.fetchServiceOperations.mock.calls.length).toBe(1); @@ -116,9 +116,9 @@ describe('', () => { const oldFn = store.get; store.get = jest.fn(() => ({ service: 'svc-b' })); wrapper = mount( - + - + ); expect(props.fetchServices.mock.calls.length).toBe(1); expect(props.fetchServiceOperations.mock.calls.length).toBe(1); @@ -144,9 +144,9 @@ describe('', () => { const historyPush = jest.fn(); const historyMock = { push: historyPush }; wrapper = mount( - + - + ); wrapper.find(SearchTracePage).first().instance().goToTrace(traceID); expect(historyPush.mock.calls.length).toBe(1); From 9e691d6c4caa088153cc0e50af46f898b099c85c Mon Sep 17 00:00:00 2001 From: Kaung Zin Hein Date: Mon, 13 Jan 2025 20:21:13 -0500 Subject: [PATCH 15/18] Fix: Update regex route path matching to optional parameters Signed-off-by: Kaung Zin Hein --- .../src/components/App/__snapshots__/index.test.js.snap | 2 +- .../SearchResults/__snapshots__/DiffSelection.test.js.snap | 2 +- packages/jaeger-ui/src/components/TraceDiff/url.test.js | 6 +++--- packages/jaeger-ui/src/components/TraceDiff/url.tsx | 5 +++-- 4 files changed, 8 insertions(+), 7 deletions(-) diff --git a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap index 93650188fe..d9b2ffa716 100644 --- a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap +++ b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap @@ -67,7 +67,7 @@ exports[`JaegerUIApp does not explode 1`] = ` /> } - path="/trace/:a?\\\\.\\\\.\\\\.:b?" + path="/trace-diff/:a?/:b?" /> } diff --git a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/__snapshots__/DiffSelection.test.js.snap b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/__snapshots__/DiffSelection.test.js.snap index b25a77dd74..98b70ee6a6 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/__snapshots__/DiffSelection.test.js.snap +++ b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/__snapshots__/DiffSelection.test.js.snap @@ -93,7 +93,7 @@ exports[`DiffSelection renders multiple traces as expected 1`] = ` className="DiffSelection--message" >