Merge pull request #17673 from strapi/chore/refactor-ee-hooks

Chore: Reorganize enterprise hooks
This commit is contained in:
Gustav Hansen 2023-08-15 10:25:56 +02:00 committed by GitHub
commit 28ca828887
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
19 changed files with 49 additions and 176 deletions

View File

@ -1,4 +0,0 @@
// eslint-disable-next-line import/prefer-default-export
export { default as useAuthProviders } from './useAuthProviders';
export { default as useLicenseLimitNotification } from './useLicenseLimitNotification';
export { useLicenseLimits } from './useLicenseLimits';

View File

@ -3,8 +3,8 @@ import React from 'react';
import { renderHook } from '@testing-library/react';
import { IntlProvider } from 'react-intl';
import useLicenseLimitNotification from '..';
import { useLicenseLimits } from '../../useLicenseLimits';
import { useLicenseLimitNotification } from '../useLicenseLimitNotification';
import { useLicenseLimits } from '../useLicenseLimits';
const baseLicenseInfo = {
enforcementUserCount: 5,

View File

@ -8,7 +8,7 @@ import { QueryClient, QueryClientProvider } from 'react-query';
import { Provider } from 'react-redux';
import { createStore } from 'redux';
import { useLicenseLimits } from '..';
import { useLicenseLimits } from '../useLicenseLimits';
const server = setupServer(
...[

View File

@ -0,0 +1,18 @@
import { useFetchClient } from '@strapi/helper-plugin';
import { useQuery } from 'react-query';
export const useAuthProviders = (queryOptions = {}) => {
const { get } = useFetchClient();
const { data, isLoading } = useQuery(
['ee', 'providers'],
async () => {
const { data } = await get('/admin/providers');
return data;
},
queryOptions
);
return { data, isLoading };
};

View File

@ -1,50 +0,0 @@
import { useEffect, useReducer } from 'react';
import { useFetchClient, useNotification } from '@strapi/helper-plugin';
import reducer, { initialState } from './reducer';
const useAuthProviders = ({ ssoEnabled }) => {
const [state, dispatch] = useReducer(reducer, initialState);
const toggleNotification = useNotification();
const { get } = useFetchClient();
useEffect(() => {
const fetchAuthProviders = async () => {
try {
if (!ssoEnabled) {
dispatch({
type: 'GET_DATA_SUCCEEDED',
data: [],
});
return;
}
const { data } = await get('/admin/providers');
dispatch({
type: 'GET_DATA_SUCCEEDED',
data,
});
} catch (err) {
console.error(err);
dispatch({
type: 'GET_DATA_ERROR',
});
toggleNotification({
type: 'warning',
message: { id: 'notification.error' },
});
}
};
fetchAuthProviders();
}, [get, ssoEnabled, toggleNotification]);
return state;
};
export default useAuthProviders;

View File

@ -1,26 +0,0 @@
/* eslint-disable consistent-return */
import produce from 'immer';
export const initialState = {
data: [],
isLoading: true,
};
const reducer = (state, action) =>
produce(state, (draftState) => {
switch (action.type) {
case 'GET_DATA_SUCCEEDED': {
draftState.data = action.data;
draftState.isLoading = false;
break;
}
case 'GET_DATA_ERROR': {
draftState.isLoading = false;
break;
}
default:
return draftState;
}
});
export default reducer;

View File

@ -1,72 +0,0 @@
import reducer from '../reducer';
describe('ADMIN | HOOKS | USEFETCHROLE | reducer', () => {
describe('DEFAULT_ACTION', () => {
it('should return the initialState', () => {
const state = {
test: true,
};
expect(reducer(state, {})).toEqual(state);
});
});
describe('GET_DATA_ERROR', () => {
it('should set isLoading to false is an error occured', () => {
const action = {
type: 'GET_DATA_ERROR',
};
const initialState = {
data: [],
isLoading: true,
};
const expected = {
data: [],
isLoading: false,
};
expect(reducer(initialState, action)).toEqual(expected);
});
});
describe('GET_DATA_SUCCEEDED', () => {
it('should return the state with the data', () => {
const action = {
type: 'GET_DATA_SUCCEEDED',
data: [
{
uid: 'provider1',
displayName: 'Provider 1',
icon: 'icon1',
},
{
uid: 'provider2',
displayName: 'Provider 2',
icon: 'icon2',
},
],
};
const initialState = {
data: [],
isLoading: true,
};
const expected = {
data: [
{
uid: 'provider1',
displayName: 'Provider 1',
icon: 'icon1',
},
{
uid: 'provider2',
displayName: 'Provider 2',
icon: 'icon2',
},
],
isLoading: false,
};
expect(reducer(initialState, action)).toEqual(expected);
});
});
});

View File

@ -10,14 +10,14 @@ import isNil from 'lodash/isNil';
import { useIntl } from 'react-intl';
import { useLocation } from 'react-router-dom';
import { useLicenseLimits } from '../useLicenseLimits';
import { useLicenseLimits } from './useLicenseLimits';
const STORAGE_KEY_PREFIX = 'strapi-notification-seat-limit';
const BILLING_STRAPI_CLOUD_URL = 'https://cloud.strapi.io/profile/billing';
const BILLING_SELF_HOSTED_URL = 'https://strapi.io/billing/request-seats';
const useLicenseLimitNotification = () => {
export const useLicenseLimitNotification = () => {
const { formatMessage } = useIntl();
let { license, isError, isLoading } = useLicenseLimits();
const toggleNotification = useNotification();
@ -97,5 +97,3 @@ const useLicenseLimitNotification = () => {
isError,
]);
};
export default useLicenseLimitNotification;

View File

@ -19,7 +19,10 @@ export function useLicenseLimits({ enabled } = { enabled: true }) {
}
);
const license = data ?? {};
// this needs memoization, because a default value of `{}`
// would lead to infinite rendering loops, when used as
// effect dependency
const license = React.useMemo(() => data ?? {}, [data]);
const getFeature = React.useCallback(
(name) => {

View File

@ -1 +0,0 @@
export { useLicenseLimits } from './useLicenseLimits';

View File

@ -7,7 +7,7 @@ import styled from 'styled-components';
import UnauthenticatedLayout from '../../../../../../admin/src/layouts/UnauthenticatedLayout';
import BaseLogin from '../../../../../../admin/src/pages/AuthPage/components/Login/BaseLogin';
import { useAuthProviders } from '../../../../hooks';
import { useAuthProviders } from '../../../../hooks/useAuthProviders';
import SSOProviders from '../Providers/SSOProviders';
const DividerFull = styled(Divider)`
@ -15,11 +15,15 @@ const DividerFull = styled(Divider)`
`;
export const LoginEE = (loginProps) => {
const ssoEnabled = window.strapi.features.isEnabled(window.strapi.features.SSO);
const { isLoading, data: providers } = useAuthProviders({ ssoEnabled });
const { formatMessage } = useIntl();
const { isLoading, data: providers } = useAuthProviders({
enabled: window.strapi.features.isEnabled(window.strapi.features.SSO),
});
if (!ssoEnabled || (!isLoading && providers.length === 0)) {
if (
!window.strapi.features.isEnabled(window.strapi.features.SSO) ||
(!isLoading && providers.length === 0)
) {
return (
<UnauthenticatedLayout>
<BaseLogin {...loginProps} />

View File

@ -11,7 +11,7 @@ import UnauthenticatedLayout, {
Column,
LayoutContent,
} from '../../../../../../admin/src/layouts/UnauthenticatedLayout';
import { useAuthProviders } from '../../../../hooks';
import { useAuthProviders } from '../../../../hooks/useAuthProviders';
import SSOProviders from './SSOProviders';
@ -20,17 +20,20 @@ const DividerFull = styled(Divider)`
`;
const Providers = () => {
const ssoEnabled = window.strapi.features.isEnabled(window.strapi.features.SSO);
const { push } = useHistory();
const { formatMessage } = useIntl();
const { isLoading, data: providers } = useAuthProviders({ ssoEnabled });
const { isLoading, data: providers } = useAuthProviders({
enabled: window.strapi.features.isEnabled(window.strapi.features.SSO),
});
const handleClick = () => {
push('/auth/login');
};
if (!ssoEnabled || (!isLoading && providers.length === 0)) {
if (
!window.strapi.features.isEnabled(window.strapi.features.SSO) ||
(!isLoading && providers.length === 0)
) {
return <Redirect to="/auth/login" />;
}

View File

@ -2,7 +2,7 @@ import * as React from 'react';
// eslint-disable-next-line import/no-cycle
import { HomePageCE } from '../../../../admin/src/pages/HomePage';
import { useLicenseLimitNotification } from '../../hooks';
import { useLicenseLimitNotification } from '../../hooks/useLicenseLimitNotification';
export function HomePageEE() {
useLicenseLimitNotification();

View File

@ -17,7 +17,7 @@ import { useHistory } from 'react-router-dom';
import { useContentTypes } from '../../../../../../../../admin/src/hooks/useContentTypes';
import { useInjectReducer } from '../../../../../../../../admin/src/hooks/useInjectReducer';
import { useLicenseLimits } from '../../../../../../hooks';
import { useLicenseLimits } from '../../../../../../hooks/useLicenseLimits';
import { addStage, resetWorkflow } from '../../actions';
import * as Layout from '../../components/Layout';
import * as LimitsModal from '../../components/LimitsModal';

View File

@ -19,7 +19,7 @@ import { useParams } from 'react-router-dom';
import { useContentTypes } from '../../../../../../../../admin/src/hooks/useContentTypes';
import { useInjectReducer } from '../../../../../../../../admin/src/hooks/useInjectReducer';
import { selectAdminPermissions } from '../../../../../../../../admin/src/pages/App/selectors';
import { useLicenseLimits } from '../../../../../../hooks';
import { useLicenseLimits } from '../../../../../../hooks/useLicenseLimits';
import { resetWorkflow, setWorkflow } from '../../actions';
import * as Layout from '../../components/Layout';
import * as LimitsModal from '../../components/LimitsModal';

View File

@ -35,7 +35,7 @@ import styled from 'styled-components';
import { useContentTypes } from '../../../../../../../../admin/src/hooks/useContentTypes';
import { selectAdminPermissions } from '../../../../../../../../admin/src/pages/App/selectors';
import { useLicenseLimits } from '../../../../../../hooks';
import { useLicenseLimits } from '../../../../../../hooks/useLicenseLimits';
import * as Layout from '../../components/Layout';
import * as LimitsModal from '../../components/LimitsModal';
import { CHARGEBEE_WORKFLOW_ENTITLEMENT_NAME } from '../../constants';

View File

@ -6,7 +6,7 @@ import isNil from 'lodash/isNil';
import PropTypes from 'prop-types';
import { useIntl } from 'react-intl';
import { useLicenseLimits } from '../../../../../../hooks';
import { useLicenseLimits } from '../../../../../../hooks/useLicenseLimits';
export const CreateActionEE = ({ onClick }) => {
const { formatMessage } = useIntl();

View File

@ -2,7 +2,7 @@ import * as React from 'react';
// eslint-disable-next-line import/no-cycle
import { UserListPageCE } from '../../../../../../../admin/src/pages/SettingsPage/pages/Users/ListPage';
import { useLicenseLimitNotification } from '../../../../../hooks';
import { useLicenseLimitNotification } from '../../../../../hooks/useLicenseLimitNotification';
function UserListPageEE() {
useLicenseLimitNotification();