diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/EditPage/index.js b/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/EditPage/index.js index c859aeb1be..dcb5c7cc0d 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/EditPage/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/EditPage/index.js @@ -24,7 +24,6 @@ import { useOverlayBlocker, } from '@strapi/helper-plugin'; import { ArrowLeft, Check } from '@strapi/icons'; -import MagicLink from 'ee_else_ce/pages/SettingsPage/pages/Users/components/MagicLink'; import { Formik } from 'formik'; import get from 'lodash/get'; import omit from 'lodash/omit'; @@ -34,7 +33,9 @@ import { useIntl } from 'react-intl'; import { useHistory, useRouteMatch } from 'react-router-dom'; import { useAdminUsers } from '../../../../../hooks/useAdminUsers'; +import { useEnterprise } from '../../../../../hooks/useEnterprise'; import { formatAPIErrors, getFullName } from '../../../../../utils'; +import { MagicLinkCE } from '../components/MagicLink'; import SelectRoles from '../components/SelectRoles'; import { editValidation } from '../utils/validations/users'; @@ -52,11 +53,21 @@ const EditPage = ({ canUpdate }) => { const { setUserDisplayName } = useAppInfo(); const toggleNotification = useNotification(); const { lockApp, unlockApp } = useOverlayBlocker(); + const MagicLink = useEnterprise( + MagicLinkCE, + async () => + ( + await import( + '../../../../../../../ee/admin/pages/SettingsPage/pages/Users/components/MagicLink' + ) + ).MagicLinkEE + ); + useFocusWhenNavigate(); const { users: [user], - isLoading, + isLoading: isLoadingAdminUsers, } = useAdminUsers( { id }, { @@ -125,6 +136,8 @@ const EditPage = ({ canUpdate }) => { unlockApp(); }; + const isLoading = isLoadingAdminUsers || !MagicLink; + const headerLabel = isLoading ? { id: 'app.containers.Users.EditPage.header.label-loading', defaultMessage: 'Edit user' } : { id: 'app.containers.Users.EditPage.header.label', defaultMessage: 'Edit {name}' }; @@ -189,7 +202,7 @@ const EditPage = ({ canUpdate }) => { } loading={isSubmitting} type="submit" diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/ListPage/ModalForm/index.js b/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/ListPage/ModalForm/index.js index 1b73433163..7d9bd16a40 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/ListPage/ModalForm/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/ListPage/ModalForm/index.js @@ -20,13 +20,13 @@ import { useNotification, useOverlayBlocker, } from '@strapi/helper-plugin'; -import MagicLink from 'ee_else_ce/pages/SettingsPage/pages/Users/components/MagicLink'; import { Formik } from 'formik'; import PropTypes from 'prop-types'; import { useIntl } from 'react-intl'; import { useMutation } from 'react-query'; import { useEnterprise } from '../../../../../../hooks/useEnterprise'; +import { MagicLinkCE } from '../../components/MagicLink'; import SelectRoles from '../../components/SelectRoles'; import { FORM_LAYOUT, FORM_SCHEMA, FORM_INITIAL_VALUES, ROLE_LAYOUT, STEPPER } from './constants'; @@ -74,6 +74,15 @@ const ModalForm = ({ onSuccess, onToggle }) => { defaultValue: FORM_INITIAL_VALUES, } ); + const MagicLink = useEnterprise( + MagicLinkCE, + async () => + ( + await import( + '../../../../../../../../ee/admin/pages/SettingsPage/pages/Users/components/MagicLink' + ) + ).MagicLinkEE + ); const postMutation = useMutation( (body) => { return post('/admin/users', body); @@ -142,6 +151,11 @@ const ModalForm = ({ onSuccess, onToggle }) => { ); + // block rendering until the EE component is fully loaded + if (!MagicLink) { + return null; + } + return ( diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/components/MagicLink/index.js b/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/components/MagicLink/index.js index f7ba8435c7..04da6fc8b0 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/components/MagicLink/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Users/components/MagicLink/index.js @@ -7,7 +7,7 @@ import basename from '../../../../../../core/utils/basename'; import MagicLinkWrapper from './MagicLinkWrapper'; -const MagicLink = ({ registrationToken }) => { +export const MagicLinkCE = ({ registrationToken }) => { const { formatMessage } = useIntl(); const target = `${window.location.origin}${basename}auth/register?registrationToken=${registrationToken}`; @@ -21,12 +21,10 @@ const MagicLink = ({ registrationToken }) => { ); }; -MagicLink.defaultProps = { +MagicLinkCE.defaultProps = { registrationToken: '', }; -MagicLink.propTypes = { +MagicLinkCE.propTypes = { registrationToken: PropTypes.string, }; - -export default MagicLink; diff --git a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/components/MagicLink/index.js b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/components/MagicLink/index.js index 7450915c6a..418ba8c531 100644 --- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/components/MagicLink/index.js +++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/components/MagicLink/index.js @@ -7,7 +7,7 @@ import basename from '../../../../../../../../admin/src/core/utils/basename'; import MagicLinkWrapper from '../../../../../../../../admin/src/pages/SettingsPage/pages/Users/components/MagicLink/MagicLinkWrapper'; // FIXME replace with parts compo when ready -const MagicLink = ({ registrationToken }) => { +export const MagicLinkEE = ({ registrationToken }) => { const { formatMessage } = useIntl(); if (registrationToken) { @@ -34,12 +34,10 @@ const MagicLink = ({ registrationToken }) => { ); }; -MagicLink.defaultProps = { +MagicLinkEE.defaultProps = { registrationToken: '', }; -MagicLink.propTypes = { +MagicLinkEE.propTypes = { registrationToken: PropTypes.string, }; - -export default MagicLink;