Chore: Use useEnterprise to load EE Login component

This commit is contained in:
Gustav Hansen 2023-07-06 13:36:48 +02:00 committed by Josh
parent d5c6ac94f4
commit 1be9debbc3
4 changed files with 27 additions and 13 deletions

View File

@ -6,7 +6,7 @@ import UnauthenticatedLayout from '../../../../layouts/UnauthenticatedLayout';
import BaseLogin from './BaseLogin'; import BaseLogin from './BaseLogin';
const Login = (loginProps) => { export const LoginCE = (loginProps) => {
return ( return (
<UnauthenticatedLayout> <UnauthenticatedLayout>
<BaseLogin {...loginProps} /> <BaseLogin {...loginProps} />
@ -14,12 +14,10 @@ const Login = (loginProps) => {
); );
}; };
Login.defaultProps = { LoginCE.defaultProps = {
onSubmit: (e) => e.preventDefault(), onSubmit: (e) => e.preventDefault(),
}; };
Login.propTypes = { LoginCE.propTypes = {
onSubmit: PropTypes.func, onSubmit: PropTypes.func,
}; };
export default Login;

View File

@ -1,5 +1,4 @@
import { translatedErrors } from '@strapi/helper-plugin'; import { translatedErrors } from '@strapi/helper-plugin';
import Login from 'ee_else_ce/pages/AuthPage/components/Login';
import * as yup from 'yup'; import * as yup from 'yup';
import ForgotPassword from './components/ForgotPassword'; import ForgotPassword from './components/ForgotPassword';
@ -27,8 +26,10 @@ export const FORMS = {
schema: null, schema: null,
inputsPrefix: '', inputsPrefix: '',
}, },
// the `Component` attribute is set after all forms and CE/EE components are loaded, but since we
// are here outside of a React component we can not use the hook directly
login: { login: {
Component: Login,
endPoint: 'login', endPoint: 'login',
fieldsToDisable: [], fieldsToDisable: [],
fieldsToOmit: ['rememberMe'], fieldsToOmit: ['rememberMe'],

View File

@ -13,6 +13,7 @@ import useLocalesProvider from '../../components/LocalesProvider/useLocalesProvi
import { useEnterprise } from '../../hooks/useEnterprise'; import { useEnterprise } from '../../hooks/useEnterprise';
import formatAPIErrors from '../../utils/formatAPIErrors'; import formatAPIErrors from '../../utils/formatAPIErrors';
import { LoginCE } from './components/Login';
import { FORMS } from './constants'; import { FORMS } from './constants';
import init from './init'; import init from './init';
import { initialState, reducer } from './reducer'; import { initialState, reducer } from './reducer';
@ -29,6 +30,10 @@ const AuthPage = ({ hasAdmin, setHasAdmin }) => {
params: { authType }, params: { authType },
} = useRouteMatch('/auth/:authType'); } = useRouteMatch('/auth/:authType');
const query = useQuery(); const query = useQuery();
const Login = useEnterprise(
LoginCE,
async () => (await import('../../../../ee/admin/pages/AuthPage/components/Login')).LoginEE
);
const forms = useEnterprise( const forms = useEnterprise(
FORMS, FORMS,
async () => (await import('../../../../ee/admin/pages/AuthPage/constants')).FORMS, async () => (await import('../../../../ee/admin/pages/AuthPage/constants')).FORMS,
@ -50,7 +55,7 @@ const AuthPage = ({ hasAdmin, setHasAdmin }) => {
); );
const CancelToken = axios.CancelToken; const CancelToken = axios.CancelToken;
const source = CancelToken.source(); const source = CancelToken.source();
const { Component, endPoint, fieldsToDisable, fieldsToOmit, inputsPrefix, schema, ...rest } = const { endPoint, fieldsToDisable, fieldsToOmit, inputsPrefix, schema, ...rest } =
forms?.[authType] ?? {}; forms?.[authType] ?? {};
useEffect(() => { useEffect(() => {
@ -274,6 +279,18 @@ const AuthPage = ({ hasAdmin, setHasAdmin }) => {
); );
} }
if (Login) {
// Assign the component to render for the login form
forms.login.Component = Login;
}
// block rendering until the Login EE component is fully loaded
if (!Login) {
return null;
}
const { Component } = forms?.[authType] ?? {};
return ( return (
<Component <Component
{...rest} {...rest}

View File

@ -14,7 +14,7 @@ const DividerFull = styled(Divider)`
flex: 1; flex: 1;
`; `;
const Login = (loginProps) => { export const LoginEE = (loginProps) => {
const ssoEnabled = window.strapi.features.isEnabled(window.strapi.features.SSO); const ssoEnabled = window.strapi.features.isEnabled(window.strapi.features.SSO);
const { isLoading, data: providers } = useAuthProviders({ ssoEnabled }); const { isLoading, data: providers } = useAuthProviders({ ssoEnabled });
const { formatMessage } = useIntl(); const { formatMessage } = useIntl();
@ -49,17 +49,15 @@ const Login = (loginProps) => {
); );
}; };
Login.defaultProps = { LoginEE.defaultProps = {
onSubmit: (e) => e.preventDefault(), onSubmit: (e) => e.preventDefault(),
requestError: null, requestError: null,
}; };
Login.propTypes = { LoginEE.propTypes = {
formErrors: PropTypes.object.isRequired, formErrors: PropTypes.object.isRequired,
modifiedData: PropTypes.object.isRequired, modifiedData: PropTypes.object.isRequired,
onChange: PropTypes.func.isRequired, onChange: PropTypes.func.isRequired,
onSubmit: PropTypes.func, onSubmit: PropTypes.func,
requestError: PropTypes.object, requestError: PropTypes.object,
}; };
export default Login;