From 36c2c3290877bb53feef61ff0b7baf3d42bcd5f7 Mon Sep 17 00:00:00 2001 From: Zak Burke Date: Wed, 22 May 2024 23:00:36 -0400 Subject: [PATCH] STCOR-842 refactor away from deprecated getChildContext `getChildContext` will be deprecated in React v19. `AddContext` can be eliminated completely; it duplicates the functionality offered by `StripesContext`. Refs STCOR-842 --- CHANGELOG.md | 3 +- src/AddContext.js | 27 --------- src/AppRoutes.js | 29 +++++----- src/{moduleRoutes.js => ModuleRoutes.js} | 0 src/RootWithIntl.js | 2 +- .../BadRequestScreen/BadRequestScreen.js | 58 +++++++++---------- src/components/Front.js | 13 ++--- .../NoPermissionScreen/NoPermissionScreen.js | 28 ++++----- .../ResetPasswordNotAvailableScreen.js | 46 +++++++-------- src/components/Root/Root.js | 13 ----- src/components/Settings/Settings.js | 9 +-- 11 files changed, 81 insertions(+), 147 deletions(-) delete mode 100644 src/AddContext.js rename src/{moduleRoutes.js => ModuleRoutes.js} (100%) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4e3b4f004..503c03181 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,7 +10,8 @@ * Make branding optional. Refs STCOR-847. * Idle-session timeout and "Keep working?" modal. Refs STCOR-776. * Implement password validation for Login Page. Refs STCOR-741. -* Avoid deprecated `defaultProps` for functional components. Refs STCOR-844.. +* Avoid deprecated `defaultProps` for functional components. Refs STCOR-844. +* Avoid deprecated `getChildContext`. Refs STCOR-842. ## [10.1.0](https://github.com/folio-org/stripes-core/tree/v10.1.0) (2024-03-12) [Full Changelog](https://github.com/folio-org/stripes-core/compare/v10.0.0...v10.1.0) diff --git a/src/AddContext.js b/src/AddContext.js deleted file mode 100644 index 15c717730..000000000 --- a/src/AddContext.js +++ /dev/null @@ -1,27 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -class AddContext extends React.Component { - static propTypes = { - context: PropTypes.object.isRequired, - children: PropTypes.oneOfType([ - PropTypes.object, - PropTypes.array, - ]), - }; - - static childContextTypes = { - // It seems wrong that we have to tell this generic component what specific properties to put in the context - stripes: PropTypes.object, - }; - - getChildContext() { - return this.props.context; - } - - render() { - return this.props.children; - } -} - -export default AddContext; diff --git a/src/AppRoutes.js b/src/AppRoutes.js index 0b901d034..d2cf919b4 100644 --- a/src/AppRoutes.js +++ b/src/AppRoutes.js @@ -5,7 +5,6 @@ import PropTypes from 'prop-types'; import { connectFor } from '@folio/stripes-connect'; import { StripesContext } from './StripesContext'; -import AddContext from './AddContext'; import TitleManager from './components/TitleManager'; import RouteErrorBoundary from './components/RouteErrorBoundary'; import { getEventHandlers } from './handlerService'; @@ -62,21 +61,19 @@ const AppRoutes = ({ modules, stripes }) => { return ( - - -
- - - - - -
- - + +
+ + + + + +
+ ); }} diff --git a/src/moduleRoutes.js b/src/ModuleRoutes.js similarity index 100% rename from src/moduleRoutes.js rename to src/ModuleRoutes.js diff --git a/src/RootWithIntl.js b/src/RootWithIntl.js index ebbd7449d..8658fd941 100644 --- a/src/RootWithIntl.js +++ b/src/RootWithIntl.js @@ -10,7 +10,7 @@ import { CookiesProvider } from 'react-cookie'; import { connectFor } from '@folio/stripes-connect'; import { Callout, HotKeys } from '@folio/stripes-components'; -import ModuleRoutes from './moduleRoutes'; +import ModuleRoutes from './ModuleRoutes'; import events from './events'; import { diff --git a/src/components/BadRequestScreen/BadRequestScreen.js b/src/components/BadRequestScreen/BadRequestScreen.js index e9d0082d2..67e709330 100644 --- a/src/components/BadRequestScreen/BadRequestScreen.js +++ b/src/components/BadRequestScreen/BadRequestScreen.js @@ -3,44 +3,38 @@ import { FormattedMessage } from 'react-intl'; import { Headline } from '@folio/stripes-components'; -import AddContext from '../../AddContext'; import Pluggable from '../../Pluggable'; -import { useStripes } from '../../StripesContext'; import css from './BadRequestScreen.css'; const BadRequestScreen = () => { - const stripes = useStripes(); - return ( - - -
- - - - - , - }} - /> - -
- - + +
+ + + + + , + }} + /> + +
+ ); }; diff --git a/src/components/Front.js b/src/components/Front.js index aa02a6beb..edfea5321 100644 --- a/src/components/Front.js +++ b/src/components/Front.js @@ -7,19 +7,16 @@ import { FormattedMessage } from 'react-intl'; import Pluggable from '../Pluggable'; import css from './Front.css'; -import AddContext from '../AddContext'; const Front = ({ stripes }) => { const tag = get(stripes, 'config.welcomeMessage') || 'stripes-core.front.welcome'; return ( - - -
- -
- - + +
+ +
+ ); }; diff --git a/src/components/NoPermissionScreen/NoPermissionScreen.js b/src/components/NoPermissionScreen/NoPermissionScreen.js index 0e1ba7c9c..de53e0feb 100644 --- a/src/components/NoPermissionScreen/NoPermissionScreen.js +++ b/src/components/NoPermissionScreen/NoPermissionScreen.js @@ -3,29 +3,23 @@ import { FormattedMessage } from 'react-intl'; import { Headline } from '@folio/stripes-components'; -import AddContext from '../../AddContext'; import Pluggable from '../../Pluggable'; -import { useStripes } from '../../StripesContext'; import css from './NoPermissionScreen.css'; const NoPermissionScreen = () => { - const stripes = useStripes(); - return ( - - -
- - - -
- - + +
+ + + +
+ ); }; diff --git a/src/components/ResetPasswordNotAvailableScreen/ResetPasswordNotAvailableScreen.js b/src/components/ResetPasswordNotAvailableScreen/ResetPasswordNotAvailableScreen.js index a7c5c62da..bc6247dfe 100644 --- a/src/components/ResetPasswordNotAvailableScreen/ResetPasswordNotAvailableScreen.js +++ b/src/components/ResetPasswordNotAvailableScreen/ResetPasswordNotAvailableScreen.js @@ -3,38 +3,32 @@ import { FormattedMessage } from 'react-intl'; import { Headline } from '@folio/stripes-components'; -import AddContext from '../../AddContext'; import Pluggable from '../../Pluggable'; -import { useStripes } from '../../StripesContext'; import css from './ResetPasswordNotAvailableScreen.css'; const ResetPasswordNotAvailableScreen = () => { - const stripes = useStripes(); - return ( - - -
- - - - - - -
- - + +
+ + + + + + +
+ ); }; diff --git a/src/components/Root/Root.js b/src/components/Root/Root.js index cddcaedae..fc7f3bccf 100644 --- a/src/components/Root/Root.js +++ b/src/components/Root/Root.js @@ -11,10 +11,6 @@ import { ApolloProvider } from '@apollo/client'; import { ErrorBoundary } from '@folio/stripes-components'; import { metadata, icons } from 'stripes-config'; -/* ConnectContext - formerly known as RootContext, now comes from stripes-connect, so stripes-connect -* is providing the infrastructure for store connectivity to the system. This eliminates a circular -* dependency between stripes-connect and stripes-core. STCON-76 -*/ import { ConnectContext } from '@folio/stripes-connect'; import initialReducers from '../../initialReducers'; import enhanceReducer from '../../enhanceReducer'; @@ -80,10 +76,6 @@ class Root extends Component { } } - getChildContext() { - return { addReducer: this.addReducer, addEpic: this.addEpic }; - } - componentDidMount() { const { okapi, store, locale, defaultTranslations } = this.props; if (this.withOkapi) checkOkapiSession(okapi.url, store, okapi.tenant); @@ -198,11 +190,6 @@ class Root extends Component { } } -Root.childContextTypes = { - addReducer: PropTypes.func, - addEpic: PropTypes.func, -}; - Root.propTypes = { store: PropTypes.shape({ subscribe: PropTypes.func.isRequired, diff --git a/src/components/Settings/Settings.js b/src/components/Settings/Settings.js index fe8f6158c..3d687ae30 100644 --- a/src/components/Settings/Settings.js +++ b/src/components/Settings/Settings.js @@ -26,7 +26,6 @@ import { import About from '../About'; import { StripesContext } from '../../StripesContext'; -import AddContext from '../../AddContext'; import { useModules } from '../../ModulesContext'; import { stripesShape } from '../../Stripes'; import AppIcon from '../AppIcon'; @@ -102,11 +101,9 @@ const Settings = ({ stripes }) => { render={(props2) => ( - - - - - + + + {props2.match.isExact ?
: null}