diff --git a/CHANGELOG.md b/CHANGELOG.md index f2a4eba7..e4fcaa94 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,11 @@ # CHANGELOG +# 3.0.0 + +### Breaking Changes +- uses `@okta/okta-react` 4 +- requires `react-router` 6 beta + ## 2.0.0 ### Breaking Changes diff --git a/custom-login/package.json b/custom-login/package.json index 7a42603d..b273e4a6 100644 --- a/custom-login/package.json +++ b/custom-login/package.json @@ -3,8 +3,8 @@ "version": "0.2.0", "private": true, "dependencies": { + "@okta/okta-react": "github:okta/okta-react#OKTA-318565-react-router-6", "@okta/okta-auth-js": "^4.2.0", - "@okta/okta-react": "^4.0.0", "@okta/okta-signin-widget": "^5.0.0", "colors": "^1.1.2", "cross-env": "^5.1.3", @@ -12,7 +12,8 @@ "jquery": "^3.4.1", "react": "^16.8.0", "react-dom": "^16.8.0", - "react-router-dom": "^5.0.0", + "history": "^5.0.0", + "react-router-dom": "^6.0.0-beta.0", "react-scripts": "^4.0.0", "semantic-ui-css": "^2.2.12", "semantic-ui-react": "^2.0.1", diff --git a/custom-login/src/App.jsx b/custom-login/src/App.jsx index a09b9b41..0149bf6c 100644 --- a/custom-login/src/App.jsx +++ b/custom-login/src/App.jsx @@ -11,7 +11,7 @@ */ import React from 'react'; -import { Route, useHistory, Switch } from 'react-router-dom'; +import { BrowserRouter as Router, Route, Routes, useNavigate } from 'react-router-dom'; import { OktaAuth } from '@okta/okta-auth-js'; import { Security, SecureRoute, LoginCallback } from '@okta/okta-react'; import { Container } from 'semantic-ui-react'; @@ -25,11 +25,11 @@ import Profile from './Profile'; const oktaAuth = new OktaAuth(config.oidc); const App = () => { - const history = useHistory(); // example from react-router + const navigate = useNavigate(); // example from react-router const customAuthHandler = () => { // Redirect to the /login page that has a CustomLoginComponent - history.push('/login'); + navigate('/login'); }; return ( @@ -39,13 +39,13 @@ const App = () => { > - - - - - - - + + } /> + } /> + } /> + } /> + } /> + ); diff --git a/okta-hosted-login/package-lock.json b/okta-hosted-login/package-lock.json index 2ae0f60a..6be285f8 100644 --- a/okta-hosted-login/package-lock.json +++ b/okta-hosted-login/package-lock.json @@ -1874,9 +1874,8 @@ } }, "@okta/okta-react": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/@okta/okta-react/-/okta-react-4.0.0.tgz", - "integrity": "sha512-MDl+r97ReS3BQ6ntT1WkW4kcOp0TagoIITs7s4zCXvQOPxsJ97aKqIhcftAr7E6B0XTKvVsi+WzNgIkdehKgKw==", + "version": "github:okta/okta-react#89209c2ffe2461d9b3ed61c857a69b318de053eb", + "from": "github:okta/okta-react#OKTA-318565-react-router-6", "requires": { "@babel/runtime": "^7.11.2" } @@ -6962,16 +6961,11 @@ "integrity": "sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ==" }, "history": { - "version": "4.10.1", - "resolved": "https://registry.npmjs.org/history/-/history-4.10.1.tgz", - "integrity": "sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew==", + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/history/-/history-5.0.0.tgz", + "integrity": "sha512-3NyRMKIiFSJmIPdq7FxkNMJkQ7ZEtVblOQ38VtKaA0zZMW1Eo6Q6W8oDKEflr1kNNTItSnk4JMCO1deeSgbLLg==", "requires": { - "@babel/runtime": "^7.1.2", - "loose-envify": "^1.2.0", - "resolve-pathname": "^3.0.0", - "tiny-invariant": "^1.0.2", - "tiny-warning": "^1.0.0", - "value-equal": "^1.0.1" + "@babel/runtime": "^7.7.6" } }, "hmac-drbg": { @@ -6984,14 +6978,6 @@ "minimalistic-crypto-utils": "^1.0.1" } }, - "hoist-non-react-statics": { - "version": "3.3.2", - "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", - "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", - "requires": { - "react-is": "^16.7.0" - } - }, "hoopy": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz", @@ -7839,11 +7825,6 @@ "is-docker": "^2.0.0" } }, - "isarray": { - "version": "0.0.1", - "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz", - "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=" - }, "isexe": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", @@ -9922,15 +9903,6 @@ "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz", "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==" }, - "mini-create-react-context": { - "version": "0.4.0", - "resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.4.0.tgz", - "integrity": "sha512-b0TytUgFSbgFJGzJqXPKCFCBWigAjpjo+Fl7Vf7ZbKRDptszpppKxXH6DRXEABZ/gcEQczeb0iZ7JvL8e8jjCA==", - "requires": { - "@babel/runtime": "^7.5.5", - "tiny-warning": "^1.0.3" - } - }, "mini-css-extract-plugin": { "version": "0.11.3", "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.11.3.tgz", @@ -10807,14 +10779,6 @@ "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz", "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==" }, - "path-to-regexp": { - "version": "1.8.0", - "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz", - "integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==", - "requires": { - "isarray": "0.0.1" - } - }, "path-type": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", @@ -12392,34 +12356,20 @@ "integrity": "sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg==" }, "react-router": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz", - "integrity": "sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw==", + "version": "6.0.0-beta.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.0.0-beta.0.tgz", + "integrity": "sha512-VgMdfpVcmFQki/LZuLh8E/MNACekDetz4xqft+a6fBZvvJnVqKbLqebF7hyoawGrV1HcO5tVaUang2Og4W2j1Q==", "requires": { - "@babel/runtime": "^7.1.2", - "history": "^4.9.0", - "hoist-non-react-statics": "^3.1.0", - "loose-envify": "^1.3.1", - "mini-create-react-context": "^0.4.0", - "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" + "prop-types": "^15.7.2" } }, "react-router-dom": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.2.0.tgz", - "integrity": "sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA==", + "version": "6.0.0-beta.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.0.0-beta.0.tgz", + "integrity": "sha512-36yNNGMT8RB9FRPL9nKJi6HKDkgOakU+o/2hHpSzR6e37gN70MpOU6QQlmif4oAWWBwjyGc3ZNOMFCsFuHUY5w==", "requires": { - "@babel/runtime": "^7.1.2", - "history": "^4.9.0", - "loose-envify": "^1.3.1", - "prop-types": "^15.6.2", - "react-router": "5.2.0", - "tiny-invariant": "^1.0.2", - "tiny-warning": "^1.0.0" + "prop-types": "^15.7.2", + "react-router": "6.0.0-beta.0" } }, "react-scripts": { @@ -12868,11 +12818,6 @@ "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz", "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==" }, - "resolve-pathname": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/resolve-pathname/-/resolve-pathname-3.0.0.tgz", - "integrity": "sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng==" - }, "resolve-url": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz", @@ -14672,16 +14617,6 @@ "resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-1.1.0.tgz", "integrity": "sha1-q0BaIf/tgUp2wZc5ZICT1wZU/ss=" }, - "tiny-invariant": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.1.0.tgz", - "integrity": "sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw==" - }, - "tiny-warning": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz", - "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" - }, "tmp": { "version": "0.0.33", "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz", @@ -15140,11 +15075,6 @@ "spdx-expression-parse": "^3.0.0" } }, - "value-equal": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz", - "integrity": "sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw==" - }, "vary": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz", diff --git a/okta-hosted-login/package.json b/okta-hosted-login/package.json index d958269e..e167ac2f 100644 --- a/okta-hosted-login/package.json +++ b/okta-hosted-login/package.json @@ -4,13 +4,14 @@ "private": true, "dependencies": { "@okta/okta-auth-js": "^4.2.0", - "@okta/okta-react": "^4.0.0", + "@okta/okta-react": "github:okta/okta-react#OKTA-318565-react-router-6", "colors": "^1.4.0", "cross-env": "^7.0.2", "dotenv": "^8.2.0", "react": "^16.13.1", "react-dom": "^16.13.1", - "react-router-dom": "^5.2.0", + "history": "^5.0.0", + "react-router-dom": "^6.0.0-beta.0", "react-scripts": "^4.0.0", "semantic-ui-css": "^2.4.1", "semantic-ui-react": "^1.2.1", diff --git a/okta-hosted-login/src/App.jsx b/okta-hosted-login/src/App.jsx index 671e9a37..d3d42d38 100644 --- a/okta-hosted-login/src/App.jsx +++ b/okta-hosted-login/src/App.jsx @@ -11,7 +11,7 @@ */ import React from 'react'; -import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; +import { Route, Routes } from 'react-router-dom'; import { OktaAuth } from '@okta/okta-auth-js'; import { Security, SecureRoute, LoginCallback } from '@okta/okta-react'; import { Container } from 'semantic-ui-react'; @@ -24,18 +24,16 @@ import Profile from './Profile'; const oktaAuth = new OktaAuth(config.oidc); const App = () => ( - - - - - - - - - - - - - + + + + + } /> + } /> + } /> + } /> + + + ); export default App; diff --git a/okta-hosted-login/src/index.js b/okta-hosted-login/src/index.js index 72c81034..8ab330d9 100644 --- a/okta-hosted-login/src/index.js +++ b/okta-hosted-login/src/index.js @@ -12,6 +12,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; +import { BrowserRouter as Router } from 'react-router-dom'; import 'semantic-ui-css/semantic.min.css'; import './polyfills'; import App from './App'; @@ -19,5 +20,10 @@ import './index.css'; import registerServiceWorker from './registerServiceWorker'; /* eslint-disable react/jsx-filename-extension */ -ReactDOM.render(, document.getElementById('root')); +ReactDOM.render( + + + , + document.getElementById('root'), +); registerServiceWorker();