yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-08-02 13:58:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add useContentManagerInitData hook

Browse Source
This commit is contained in:
Rémi de Juvigny 2023-04-13 12:14:43 +02:00
parent 660349845d
commit 0ab74b0799
5 changed files with 40 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
packages/core/admin/admin/src/content-manager/pages/App/actions.js
View File

@ -1,12 +1,18 @@
import { GET_DATA, RESET_PROPS, SET_CONTENT_TYPE_LINKS } from './constants'; import { GET_INIT_DATA, RESET_INIT_DATA, SET_INIT_DATA } from './constants';
export const getData = () => ({ export const getInitData = () => ({
type: GET_DATA, type: GET_INIT_DATA,
}); });
export const resetProps = () => ({ type: RESET_PROPS }); export const resetInitData = () => ({ type: RESET_INIT_DATA });
export const setContentTypeLinks = (authorizedCtLinks, authorizedStLinks, models, components) => ({ export const setInitData = ({
type: SET_CONTENT_TYPE_LINKS, authorizedCtLinks,
data: { authorizedCtLinks, authorizedStLinks, components, contentTypeSchemas: models }, authorizedStLinks,
contentTypeSchemas,
components,
fieldSizes,
}) => ({
type: SET_INIT_DATA,
data: { authorizedCtLinks, authorizedStLinks, components, contentTypeSchemas, fieldSizes },
}); });

6
packages/core/admin/admin/src/content-manager/pages/App/constants.js
View File

@ -1,3 +1,3 @@
export const GET_DATA = 'ContentManager/App/GET_DATA'; export const GET_INIT_DATA = 'ContentManager/App/GET_INIT_DATA';
export const RESET_PROPS = 'ContentManager/App/RESET_PROPS'; export const RESET_INIT_DATA = 'ContentManager/App/RESET_INIT_DATA';
export const SET_CONTENT_TYPE_LINKS = 'ContentManager/App/SET_CONTENT_TYPE_LINKS'; export const SET_INIT_DATA = 'ContentManager/App/SET_INIT_DATA';

5
packages/core/admin/admin/src/content-manager/pages/App/index.js
View File

@ -20,13 +20,14 @@ import NoContentType from '../NoContentType';
import NoPermissions from '../NoPermissions'; import NoPermissions from '../NoPermissions';
import SingleTypeRecursivePath from '../SingleTypeRecursivePath'; import SingleTypeRecursivePath from '../SingleTypeRecursivePath';
import LeftMenu from './LeftMenu'; import LeftMenu from './LeftMenu';
import useModels from './useModels'; import useContentManagerInitData from './useContentManagerInitData';
const cmPermissions = permissions.contentManager; const cmPermissions = permissions.contentManager;
const App = () => { const App = () => {
const contentTypeMatch = useRouteMatch(`/content-manager/:kind/:uid`); const contentTypeMatch = useRouteMatch(`/content-manager/:kind/:uid`);
const { status, collectionTypeLinks, singleTypeLinks, models, refetchData } = useModels(); const { status, collectionTypeLinks, singleTypeLinks, models, refetchData, fieldSizes } =
useContentManagerInitData();
const authorisedModels = sortBy([...collectionTypeLinks, ...singleTypeLinks], (model) => const authorisedModels = sortBy([...collectionTypeLinks, ...singleTypeLinks], (model) =>
model.title.toLowerCase() model.title.toLowerCase()
); );

9
packages/core/admin/admin/src/content-manager/pages/App/reducer.js
View File

@ -4,7 +4,7 @@
*/ */
/* eslint-disable consistent-return */ /* eslint-disable consistent-return */
import produce from 'immer'; import produce from 'immer';
import { GET_DATA, RESET_PROPS, SET_CONTENT_TYPE_LINKS } from './constants'; import { GET_INIT_DATA, RESET_INIT_DATA, SET_INIT_DATA } from './constants';
const initialState = { const initialState = {
components: [], components: [],
@ -20,14 +20,14 @@ const initialState = {
const mainReducer = (state = initialState, action) => const mainReducer = (state = initialState, action) =>
produce(state, (draftState) => { produce(state, (draftState) => {
switch (action.type) { switch (action.type) {
case GET_DATA: { case GET_INIT_DATA: {
draftState.status = 'loading'; draftState.status = 'loading';
break; break;
} }
case RESET_PROPS: { case RESET_INIT_DATA: {
return initialState; return initialState;
} }
case SET_CONTENT_TYPE_LINKS: { case SET_INIT_DATA: {
draftState.collectionTypeLinks = action.data.authorizedCtLinks.filter( draftState.collectionTypeLinks = action.data.authorizedCtLinks.filter(
({ isDisplayed }) => isDisplayed ({ isDisplayed }) => isDisplayed
); );
@ -36,6 +36,7 @@ const mainReducer = (state = initialState, action) =>
); );
draftState.components = action.data.components; draftState.components = action.data.components;
draftState.models = action.data.contentTypeSchemas; draftState.models = action.data.contentTypeSchemas;
draftState.fieldSizes = action.data.fieldSizes;
draftState.status = 'resolved'; draftState.status = 'resolved';
break; break;
} }

23
packages/core/admin/admin/src/content-manager/pages/App/useModels.js → packages/core/admin/admin/src/content-manager/pages/App/useContentManagerInitData.js
View File

@ -11,11 +11,11 @@ import axios from 'axios';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
import { MUTATE_COLLECTION_TYPES_LINKS, MUTATE_SINGLE_TYPES_LINKS } from '../../../exposedHooks'; import { MUTATE_COLLECTION_TYPES_LINKS, MUTATE_SINGLE_TYPES_LINKS } from '../../../exposedHooks';
import { getRequestUrl, getTrad } from '../../utils'; import { getRequestUrl, getTrad } from '../../utils';
import { getData, resetProps, setContentTypeLinks } from './actions'; import { getInitData, resetInitData, setInitData } from './actions';
import { selectAppDomain } from './selectors'; import { selectAppDomain } from './selectors';
import getContentTypeLinks from './utils/getContentTypeLinks'; import getContentTypeLinks from './utils/getContentTypeLinks';
const useModels = () => { const useContentManagerInitData = () => {
const dispatch = useDispatch(); const dispatch = useDispatch();
const toggleNotification = useNotification(); const toggleNotification = useNotification();
const state = useSelector(selectAppDomain()); const state = useSelector(selectAppDomain());
@ -29,7 +29,7 @@ const useModels = () => {
const { get } = useFetchClient(); const { get } = useFetchClient();
const fetchData = async () => { const fetchData = async () => {
dispatch(getData()); dispatch(getInitData());
try { try {
const [ const [
@ -39,8 +39,11 @@ const useModels = () => {
{ {
data: { data: models }, data: { data: models },
}, },
{
data: { data: initData },
},
] = await Promise.all( ] = await Promise.all(
['components', 'content-types'].map((endPoint) => ['components', 'content-types', 'init'].map((endPoint) =>
get(getRequestUrl(endPoint), { cancelToken: source.token }) get(getRequestUrl(endPoint), { cancelToken: source.token })
) )
); );
@ -67,7 +70,13 @@ const useModels = () => {
models, models,
}); });
const actionToDispatch = setContentTypeLinks(ctLinks, stLinks, models, components); const actionToDispatch = setInitData({
authorizedCtLinks: ctLinks,
authorizedStLinks: stLinks,
contentTypeSchemas: models,
components,
fieldSizes: initData.fieldSizes,
});
dispatch(actionToDispatch); dispatch(actionToDispatch);
} catch (err) { } catch (err) {
@ -88,7 +97,7 @@ const useModels = () => {
return () => { return () => {
source.cancel('Operation canceled by the user.'); source.cancel('Operation canceled by the user.');
dispatch(resetProps()); dispatch(resetInitData());
}; };
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [dispatch, toggleNotification]); }, [dispatch, toggleNotification]);
@ -96,4 +105,4 @@ const useModels = () => {
return { ...state, refetchData: fetchDataRef.current }; return { ...state, refetchData: fetchDataRef.current };
}; };
export default useModels; export default useContentManagerInitData;