From a25fd821febdd5f6a123e40e551ae7daff757fa8 Mon Sep 17 00:00:00 2001 From: Gustav Hansen Date: Tue, 15 Aug 2023 09:33:31 +0200 Subject: [PATCH] Chore: Reorganize ee hooks --- .../useLicenseLimits.js} | 0 packages/core/admin/ee/admin/hooks/index.js | 4 -- .../useLicenseLimitNotification.js} | 4 +- .../useLicenseLimits.test.js} | 2 +- .../admin/ee/admin/hooks/useAuthProviders.js | 18 +++++ .../ee/admin/hooks/useAuthProviders/index.js | 50 ------------- .../admin/hooks/useAuthProviders/reducer.js | 26 ------- .../useAuthProviders/tests/reducer.test.js | 72 ------------------- ...ndex.js => useLicenseLimitNotification.js} | 6 +- .../useLicenseLimits.js | 5 +- .../ee/admin/hooks/useLicenseLimits/index.js | 1 - .../pages/AuthPage/components/Login/index.js | 12 ++-- .../AuthPage/components/Providers/index.js | 13 ++-- .../admin/ee/admin/pages/HomePage/index.js | 2 +- .../pages/CreateView/CreateView.js | 2 +- .../pages/EditView/EditView.js | 2 +- .../pages/ListView/ListView.js | 2 +- .../Users/ListPage/CreateAction/index.js | 2 +- .../pages/Users/ListPage/index.js | 2 +- 19 files changed, 49 insertions(+), 176 deletions(-) rename packages/core/admin/ee/admin/hooks/{useLicenseLimits/__mocks__/index.js => __mocks__/useLicenseLimits.js} (100%) delete mode 100644 packages/core/admin/ee/admin/hooks/index.js rename packages/core/admin/ee/admin/hooks/{useLicenseLimitNotification/tests/index.test.js => tests/useLicenseLimitNotification.js} (96%) rename packages/core/admin/ee/admin/hooks/{useLicenseLimits/tests/index.test.js => tests/useLicenseLimits.test.js} (97%) create mode 100644 packages/core/admin/ee/admin/hooks/useAuthProviders.js delete mode 100644 packages/core/admin/ee/admin/hooks/useAuthProviders/index.js delete mode 100644 packages/core/admin/ee/admin/hooks/useAuthProviders/reducer.js delete mode 100644 packages/core/admin/ee/admin/hooks/useAuthProviders/tests/reducer.test.js rename packages/core/admin/ee/admin/hooks/{useLicenseLimitNotification/index.js => useLicenseLimitNotification.js} (95%) rename packages/core/admin/ee/admin/hooks/{useLicenseLimits => }/useLicenseLimits.js (79%) delete mode 100644 packages/core/admin/ee/admin/hooks/useLicenseLimits/index.js diff --git a/packages/core/admin/ee/admin/hooks/useLicenseLimits/__mocks__/index.js b/packages/core/admin/ee/admin/hooks/__mocks__/useLicenseLimits.js similarity index 100% rename from packages/core/admin/ee/admin/hooks/useLicenseLimits/__mocks__/index.js rename to packages/core/admin/ee/admin/hooks/__mocks__/useLicenseLimits.js diff --git a/packages/core/admin/ee/admin/hooks/index.js b/packages/core/admin/ee/admin/hooks/index.js deleted file mode 100644 index bcb6669500..0000000000 --- a/packages/core/admin/ee/admin/hooks/index.js +++ /dev/null @@ -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'; diff --git a/packages/core/admin/ee/admin/hooks/useLicenseLimitNotification/tests/index.test.js b/packages/core/admin/ee/admin/hooks/tests/useLicenseLimitNotification.js similarity index 96% rename from packages/core/admin/ee/admin/hooks/useLicenseLimitNotification/tests/index.test.js rename to packages/core/admin/ee/admin/hooks/tests/useLicenseLimitNotification.js index 893146b667..5fde8e8b1a 100644 --- a/packages/core/admin/ee/admin/hooks/useLicenseLimitNotification/tests/index.test.js +++ b/packages/core/admin/ee/admin/hooks/tests/useLicenseLimitNotification.js @@ -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, diff --git a/packages/core/admin/ee/admin/hooks/useLicenseLimits/tests/index.test.js b/packages/core/admin/ee/admin/hooks/tests/useLicenseLimits.test.js similarity index 97% rename from packages/core/admin/ee/admin/hooks/useLicenseLimits/tests/index.test.js rename to packages/core/admin/ee/admin/hooks/tests/useLicenseLimits.test.js index ad3d5b8764..1b71c94002 100644 --- a/packages/core/admin/ee/admin/hooks/useLicenseLimits/tests/index.test.js +++ b/packages/core/admin/ee/admin/hooks/tests/useLicenseLimits.test.js @@ -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( ...[ diff --git a/packages/core/admin/ee/admin/hooks/useAuthProviders.js b/packages/core/admin/ee/admin/hooks/useAuthProviders.js new file mode 100644 index 0000000000..b0059b4f42 --- /dev/null +++ b/packages/core/admin/ee/admin/hooks/useAuthProviders.js @@ -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 }; +}; diff --git a/packages/core/admin/ee/admin/hooks/useAuthProviders/index.js b/packages/core/admin/ee/admin/hooks/useAuthProviders/index.js deleted file mode 100644 index 4bb91c3eab..0000000000 --- a/packages/core/admin/ee/admin/hooks/useAuthProviders/index.js +++ /dev/null @@ -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; diff --git a/packages/core/admin/ee/admin/hooks/useAuthProviders/reducer.js b/packages/core/admin/ee/admin/hooks/useAuthProviders/reducer.js deleted file mode 100644 index 83d1e4c31f..0000000000 --- a/packages/core/admin/ee/admin/hooks/useAuthProviders/reducer.js +++ /dev/null @@ -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; diff --git a/packages/core/admin/ee/admin/hooks/useAuthProviders/tests/reducer.test.js b/packages/core/admin/ee/admin/hooks/useAuthProviders/tests/reducer.test.js deleted file mode 100644 index f898f06300..0000000000 --- a/packages/core/admin/ee/admin/hooks/useAuthProviders/tests/reducer.test.js +++ /dev/null @@ -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); - }); - }); -}); diff --git a/packages/core/admin/ee/admin/hooks/useLicenseLimitNotification/index.js b/packages/core/admin/ee/admin/hooks/useLicenseLimitNotification.js similarity index 95% rename from packages/core/admin/ee/admin/hooks/useLicenseLimitNotification/index.js rename to packages/core/admin/ee/admin/hooks/useLicenseLimitNotification.js index 6f267f81b4..213acf54d3 100644 --- a/packages/core/admin/ee/admin/hooks/useLicenseLimitNotification/index.js +++ b/packages/core/admin/ee/admin/hooks/useLicenseLimitNotification.js @@ -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; diff --git a/packages/core/admin/ee/admin/hooks/useLicenseLimits/useLicenseLimits.js b/packages/core/admin/ee/admin/hooks/useLicenseLimits.js similarity index 79% rename from packages/core/admin/ee/admin/hooks/useLicenseLimits/useLicenseLimits.js rename to packages/core/admin/ee/admin/hooks/useLicenseLimits.js index 774d49c9dc..cfa9195554 100644 --- a/packages/core/admin/ee/admin/hooks/useLicenseLimits/useLicenseLimits.js +++ b/packages/core/admin/ee/admin/hooks/useLicenseLimits.js @@ -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) => { diff --git a/packages/core/admin/ee/admin/hooks/useLicenseLimits/index.js b/packages/core/admin/ee/admin/hooks/useLicenseLimits/index.js deleted file mode 100644 index 25f339fbe2..0000000000 --- a/packages/core/admin/ee/admin/hooks/useLicenseLimits/index.js +++ /dev/null @@ -1 +0,0 @@ -export { useLicenseLimits } from './useLicenseLimits'; diff --git a/packages/core/admin/ee/admin/pages/AuthPage/components/Login/index.js b/packages/core/admin/ee/admin/pages/AuthPage/components/Login/index.js index cfc1f1ee64..64f7fb1bf7 100644 --- a/packages/core/admin/ee/admin/pages/AuthPage/components/Login/index.js +++ b/packages/core/admin/ee/admin/pages/AuthPage/components/Login/index.js @@ -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 ( diff --git a/packages/core/admin/ee/admin/pages/AuthPage/components/Providers/index.js b/packages/core/admin/ee/admin/pages/AuthPage/components/Providers/index.js index 30e726dd55..a8fa3ee0b9 100644 --- a/packages/core/admin/ee/admin/pages/AuthPage/components/Providers/index.js +++ b/packages/core/admin/ee/admin/pages/AuthPage/components/Providers/index.js @@ -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 ; } diff --git a/packages/core/admin/ee/admin/pages/HomePage/index.js b/packages/core/admin/ee/admin/pages/HomePage/index.js index 695ba70e9c..c509487262 100644 --- a/packages/core/admin/ee/admin/pages/HomePage/index.js +++ b/packages/core/admin/ee/admin/pages/HomePage/index.js @@ -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(); diff --git a/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/CreateView/CreateView.js b/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/CreateView/CreateView.js index 466fe26091..2b620838c7 100644 --- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/CreateView/CreateView.js +++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/CreateView/CreateView.js @@ -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'; diff --git a/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/EditView/EditView.js b/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/EditView/EditView.js index e86286af07..450fd43b70 100644 --- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/EditView/EditView.js +++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/EditView/EditView.js @@ -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'; diff --git a/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/ListView/ListView.js b/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/ListView/ListView.js index 1b2efe3022..624329ffea 100644 --- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/ListView/ListView.js +++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/pages/ListView/ListView.js @@ -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'; diff --git a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/ListPage/CreateAction/index.js b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/ListPage/CreateAction/index.js index 37feaed274..03b66d630d 100644 --- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/ListPage/CreateAction/index.js +++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/ListPage/CreateAction/index.js @@ -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(); diff --git a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/ListPage/index.js b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/ListPage/index.js index 8f0cc7b55c..b255d76b2a 100644 --- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/ListPage/index.js +++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Users/ListPage/index.js @@ -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();