From 36675d4abd412968c08fff072a76f91cf7f7a0a8 Mon Sep 17 00:00:00 2001 From: Tomasz Subik Date: Sun, 17 Nov 2024 15:29:19 +0100 Subject: [PATCH] useRouter, withRouter instead of url prop --- components/countries-detail/documentation.js | 9 +- components/help/faqs.js | 13 +- components/help/how-otp-works.js | 13 +- .../help/legislation-and-regulations.js | 13 +- components/help/tutorials.js | 13 +- components/layout/header.js | 15 +- components/layout/layout.js | 7 +- components/operators-detail/documentation.js | 13 +- components/operators-detail/layout.js | 16 +- components/operators-detail/observations.js | 3 +- .../operators-detail/overview/gallery-1.js | 21 +- components/ui/navigation-list.js | 26 +-- pages/_app.js | 2 +- pages/_error.js | 13 +- pages/about.js | 8 +- pages/countries/[id]/[tab].js | 30 ++- pages/database.js | 8 +- pages/help/[tab].js | 36 ++-- pages/index.js | 182 ++++++++---------- pages/newsletter.js | 9 +- pages/newsletter/sign-up.js | 9 +- pages/newsletter/subscription-confirmed.js | 10 +- pages/newsletter/thank-you.js | 10 +- pages/observations.js | 21 +- pages/operator/edit/[[...id]].js | 6 +- pages/operator/new.js | 8 - pages/operators/[id]/[...tab].js | 5 - pages/operators/[id]/documentation.js | 7 +- pages/operators/[id]/fmus.js | 15 +- pages/operators/[id]/observations.js | 5 +- pages/operators/[id]/overview.js | 5 +- pages/operators/edit.js | 6 +- pages/operators/index.js | 1 - pages/privacy-policy.js | 8 +- pages/profile.js | 8 +- pages/reset-password.js | 23 +-- pages/signup.js | 10 +- pages/terms.js | 8 +- 38 files changed, 242 insertions(+), 373 deletions(-) diff --git a/components/countries-detail/documentation.js b/components/countries-detail/documentation.js index a8799c1c..51054187 100644 --- a/components/countries-detail/documentation.js +++ b/components/countries-detail/documentation.js @@ -1,5 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; +import { useRouter } from 'next/router'; // Utils import { HELPERS_DOC } from 'utils/documentation'; @@ -8,7 +9,8 @@ import { HELPERS_DOC } from 'utils/documentation'; import DocumentsByCountry from 'components/countries-detail/documentation/documents-by-country'; import Html from 'components/html'; -function OperatorsDetailDocumentation ({ countryDocumentation, vpaOverview, url }) { +function OperatorsDetailDocumentation ({ countryDocumentation, vpaOverview }) { + const router = useRouter(); const groupedByType = HELPERS_DOC.getGroupedByType(countryDocumentation); return ( @@ -16,7 +18,7 @@ function OperatorsDetailDocumentation ({ countryDocumentation, vpaOverview, url
{vpaOverview && } - +
@@ -25,8 +27,7 @@ function OperatorsDetailDocumentation ({ countryDocumentation, vpaOverview, url OperatorsDetailDocumentation.propTypes = { countryDocumentation: PropTypes.array, - vpaOverview: PropTypes.string, - url: PropTypes.object, + vpaOverview: PropTypes.string }; export default OperatorsDetailDocumentation; diff --git a/components/help/faqs.js b/components/help/faqs.js index 26f3db3f..b9b26b3f 100644 --- a/components/help/faqs.js +++ b/components/help/faqs.js @@ -2,6 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import Spinner from 'components/ui/spinner'; import Html from 'components/html'; +import { withRouter } from 'next/router'; // Intl import { injectIntl } from 'react-intl'; @@ -19,17 +20,17 @@ class HelpFaqs extends React.Component { easing: 'easeOutQuart' }); - if (this.props.url.query.article) { + if (this.props.router.query.article) { setTimeout(() => { - this.triggerScrollTo(`#${this.props.url.query.article}`); + this.triggerScrollTo(`#${this.props.router.query.article}`); }, 250); } } componentDidUpdate() { - if (this.props.url.query.article) { + if (this.props.router.query.article) { setTimeout(() => { - this.triggerScrollTo(`#${this.props.url.query.article}`); + this.triggerScrollTo(`#${this.props.router.query.article}`); }, 250); } } @@ -98,8 +99,8 @@ class HelpFaqs extends React.Component { HelpFaqs.propTypes = { intl: PropTypes.object.isRequired, - url: PropTypes.object.isRequired, + router: PropTypes.object.isRequired, faqs: PropTypes.object }; -export default injectIntl(HelpFaqs); +export default injectIntl(withRouter(HelpFaqs)); diff --git a/components/help/how-otp-works.js b/components/help/how-otp-works.js index ed436a8e..6d708a97 100644 --- a/components/help/how-otp-works.js +++ b/components/help/how-otp-works.js @@ -2,6 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import Spinner from 'components/ui/spinner'; import Html from 'components/html'; +import { withRouter } from 'next/router'; // Intl import { injectIntl } from 'react-intl'; @@ -19,17 +20,17 @@ class HelpHowOTPWorks extends React.Component { easing: 'easeOutQuart' }); - if (this.props.url.query.article) { + if (this.props.router.query.article) { setTimeout(() => { - this.triggerScrollTo(`#${this.props.url.query.article}`); + this.triggerScrollTo(`#${this.props.router.query.article}`); }, 250); } } componentDidUpdate() { - if (this.props.url.query.article) { + if (this.props.router.query.article) { setTimeout(() => { - this.triggerScrollTo(`#${this.props.url.query.article}`); + this.triggerScrollTo(`#${this.props.router.query.article}`); }, 250); } } @@ -98,8 +99,8 @@ class HelpHowOTPWorks extends React.Component { HelpHowOTPWorks.propTypes = { intl: PropTypes.object.isRequired, - url: PropTypes.object.isRequired, + router: PropTypes.object.isRequired, howtos: PropTypes.object }; -export default injectIntl(HelpHowOTPWorks); +export default injectIntl(withRouter(HelpHowOTPWorks)); diff --git a/components/help/legislation-and-regulations.js b/components/help/legislation-and-regulations.js index 17d6315a..8a9f52e6 100644 --- a/components/help/legislation-and-regulations.js +++ b/components/help/legislation-and-regulations.js @@ -2,6 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import Spinner from 'components/ui/spinner'; import Html from 'components/html'; +import { withRouter } from 'next/router'; // Intl import { injectIntl } from 'react-intl'; @@ -19,17 +20,17 @@ class HelpTools extends React.Component { easing: 'easeOutQuart' }); - if (this.props.url.query.article) { + if (this.props.router.query.article) { setTimeout(() => { - this.triggerScrollTo(`#${this.props.url.query.article}`); + this.triggerScrollTo(`#${this.props.router.query.article}`); }, 250); } } componentDidUpdate() { - if (this.props.url.query.article) { + if (this.props.router.query.article) { setTimeout(() => { - this.triggerScrollTo(`#${this.props.url.query.article}`); + this.triggerScrollTo(`#${this.props.router.query.article}`); }, 250); } } @@ -98,8 +99,8 @@ class HelpTools extends React.Component { HelpTools.propTypes = { intl: PropTypes.object.isRequired, - url: PropTypes.object.isRequired, + router: PropTypes.object.isRequired, tools: PropTypes.object }; -export default injectIntl(HelpTools); +export default injectIntl(withRouter(HelpTools)); diff --git a/components/help/tutorials.js b/components/help/tutorials.js index 2e8a999e..ba3139bc 100644 --- a/components/help/tutorials.js +++ b/components/help/tutorials.js @@ -2,6 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import Spinner from 'components/ui/spinner'; import Html from 'components/html'; +import { withRouter } from 'next/router'; // Intl import { injectIntl } from 'react-intl'; @@ -19,17 +20,17 @@ class HelpTutorials extends React.Component { easing: 'easeOutQuart' }); - if (this.props.url.query.article) { + if (this.props.router.query.article) { setTimeout(() => { - this.triggerScrollTo(`#${this.props.url.query.article}`); + this.triggerScrollTo(`#${this.props.router.query.article}`); }, 250); } } componentDidUpdate() { - if (this.props.url.query.article) { + if (this.props.router.query.article) { setTimeout(() => { - this.triggerScrollTo(`#${this.props.url.query.article}`); + this.triggerScrollTo(`#${this.props.router.query.article}`); }, 250); } } @@ -98,8 +99,8 @@ class HelpTutorials extends React.Component { HelpTutorials.propTypes = { intl: PropTypes.object.isRequired, - url: PropTypes.object.isRequired, + router: PropTypes.object.isRequired, tutorials: PropTypes.object }; -export default injectIntl(HelpTutorials); +export default injectIntl(withRouter(HelpTutorials)); diff --git a/components/layout/header.js b/components/layout/header.js index 7f7a89cb..63ad77f0 100644 --- a/components/layout/header.js +++ b/components/layout/header.js @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import PropTypes from 'prop-types'; import classnames from 'classnames'; import Link from 'next/link'; +import { useRouter } from 'next/router'; // Components import NavigationList from 'components/ui/navigation-list'; @@ -14,8 +14,9 @@ import UserDropdown from 'components/ui/user-dropdown'; import useDeviceInfo from 'hooks/use-device-info'; -const Header = ({ url }) => { - const isHomePage = url.pathname === '/'; +const Header = () => { + const router = useRouter(); + const isHomePage = router.pathname === '/'; const [menuOpen, setMenuOpen] = useState(false); const { isDesktop } = useDeviceInfo(); const isMenuOpen = menuOpen && !isDesktop; @@ -40,7 +41,7 @@ const Header = ({ url }) => { )}