mirror of
				https://github.com/strapi/strapi.git
				synced 2025-11-04 03:43:34 +00:00 
			
		
		
		
	Add useContentManagerInitData hook
This commit is contained in:
		
							parent
							
								
									660349845d
								
							
						
					
					
						commit
						0ab74b0799
					
				@ -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 = () => ({
 | 
			
		||||
  type: GET_DATA,
 | 
			
		||||
export const getInitData = () => ({
 | 
			
		||||
  type: GET_INIT_DATA,
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
export const resetProps = () => ({ type: RESET_PROPS });
 | 
			
		||||
export const resetInitData = () => ({ type: RESET_INIT_DATA });
 | 
			
		||||
 | 
			
		||||
export const setContentTypeLinks = (authorizedCtLinks, authorizedStLinks, models, components) => ({
 | 
			
		||||
  type: SET_CONTENT_TYPE_LINKS,
 | 
			
		||||
  data: { authorizedCtLinks, authorizedStLinks, components, contentTypeSchemas: models },
 | 
			
		||||
export const setInitData = ({
 | 
			
		||||
  authorizedCtLinks,
 | 
			
		||||
  authorizedStLinks,
 | 
			
		||||
  contentTypeSchemas,
 | 
			
		||||
  components,
 | 
			
		||||
  fieldSizes,
 | 
			
		||||
}) => ({
 | 
			
		||||
  type: SET_INIT_DATA,
 | 
			
		||||
  data: { authorizedCtLinks, authorizedStLinks, components, contentTypeSchemas, fieldSizes },
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
@ -1,3 +1,3 @@
 | 
			
		||||
export const GET_DATA = 'ContentManager/App/GET_DATA';
 | 
			
		||||
export const RESET_PROPS = 'ContentManager/App/RESET_PROPS';
 | 
			
		||||
export const SET_CONTENT_TYPE_LINKS = 'ContentManager/App/SET_CONTENT_TYPE_LINKS';
 | 
			
		||||
export const GET_INIT_DATA = 'ContentManager/App/GET_INIT_DATA';
 | 
			
		||||
export const RESET_INIT_DATA = 'ContentManager/App/RESET_INIT_DATA';
 | 
			
		||||
export const SET_INIT_DATA = 'ContentManager/App/SET_INIT_DATA';
 | 
			
		||||
 | 
			
		||||
@ -20,13 +20,14 @@ import NoContentType from '../NoContentType';
 | 
			
		||||
import NoPermissions from '../NoPermissions';
 | 
			
		||||
import SingleTypeRecursivePath from '../SingleTypeRecursivePath';
 | 
			
		||||
import LeftMenu from './LeftMenu';
 | 
			
		||||
import useModels from './useModels';
 | 
			
		||||
import useContentManagerInitData from './useContentManagerInitData';
 | 
			
		||||
 | 
			
		||||
const cmPermissions = permissions.contentManager;
 | 
			
		||||
 | 
			
		||||
const App = () => {
 | 
			
		||||
  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) =>
 | 
			
		||||
    model.title.toLowerCase()
 | 
			
		||||
  );
 | 
			
		||||
 | 
			
		||||
@ -4,7 +4,7 @@
 | 
			
		||||
 */
 | 
			
		||||
/* eslint-disable consistent-return */
 | 
			
		||||
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 = {
 | 
			
		||||
  components: [],
 | 
			
		||||
@ -20,14 +20,14 @@ const initialState = {
 | 
			
		||||
const mainReducer = (state = initialState, action) =>
 | 
			
		||||
  produce(state, (draftState) => {
 | 
			
		||||
    switch (action.type) {
 | 
			
		||||
      case GET_DATA: {
 | 
			
		||||
      case GET_INIT_DATA: {
 | 
			
		||||
        draftState.status = 'loading';
 | 
			
		||||
        break;
 | 
			
		||||
      }
 | 
			
		||||
      case RESET_PROPS: {
 | 
			
		||||
      case RESET_INIT_DATA: {
 | 
			
		||||
        return initialState;
 | 
			
		||||
      }
 | 
			
		||||
      case SET_CONTENT_TYPE_LINKS: {
 | 
			
		||||
      case SET_INIT_DATA: {
 | 
			
		||||
        draftState.collectionTypeLinks = action.data.authorizedCtLinks.filter(
 | 
			
		||||
          ({ isDisplayed }) => isDisplayed
 | 
			
		||||
        );
 | 
			
		||||
@ -36,6 +36,7 @@ const mainReducer = (state = initialState, action) =>
 | 
			
		||||
        );
 | 
			
		||||
        draftState.components = action.data.components;
 | 
			
		||||
        draftState.models = action.data.contentTypeSchemas;
 | 
			
		||||
        draftState.fieldSizes = action.data.fieldSizes;
 | 
			
		||||
        draftState.status = 'resolved';
 | 
			
		||||
        break;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
@ -11,11 +11,11 @@ import axios from 'axios';
 | 
			
		||||
import { useIntl } from 'react-intl';
 | 
			
		||||
import { MUTATE_COLLECTION_TYPES_LINKS, MUTATE_SINGLE_TYPES_LINKS } from '../../../exposedHooks';
 | 
			
		||||
import { getRequestUrl, getTrad } from '../../utils';
 | 
			
		||||
import { getData, resetProps, setContentTypeLinks } from './actions';
 | 
			
		||||
import { getInitData, resetInitData, setInitData } from './actions';
 | 
			
		||||
import { selectAppDomain } from './selectors';
 | 
			
		||||
import getContentTypeLinks from './utils/getContentTypeLinks';
 | 
			
		||||
 | 
			
		||||
const useModels = () => {
 | 
			
		||||
const useContentManagerInitData = () => {
 | 
			
		||||
  const dispatch = useDispatch();
 | 
			
		||||
  const toggleNotification = useNotification();
 | 
			
		||||
  const state = useSelector(selectAppDomain());
 | 
			
		||||
@ -29,7 +29,7 @@ const useModels = () => {
 | 
			
		||||
  const { get } = useFetchClient();
 | 
			
		||||
 | 
			
		||||
  const fetchData = async () => {
 | 
			
		||||
    dispatch(getData());
 | 
			
		||||
    dispatch(getInitData());
 | 
			
		||||
 | 
			
		||||
    try {
 | 
			
		||||
      const [
 | 
			
		||||
@ -39,8 +39,11 @@ const useModels = () => {
 | 
			
		||||
        {
 | 
			
		||||
          data: { data: models },
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          data: { data: initData },
 | 
			
		||||
        },
 | 
			
		||||
      ] = await Promise.all(
 | 
			
		||||
        ['components', 'content-types'].map((endPoint) =>
 | 
			
		||||
        ['components', 'content-types', 'init'].map((endPoint) =>
 | 
			
		||||
          get(getRequestUrl(endPoint), { cancelToken: source.token })
 | 
			
		||||
        )
 | 
			
		||||
      );
 | 
			
		||||
@ -67,7 +70,13 @@ const useModels = () => {
 | 
			
		||||
        models,
 | 
			
		||||
      });
 | 
			
		||||
 | 
			
		||||
      const actionToDispatch = setContentTypeLinks(ctLinks, stLinks, models, components);
 | 
			
		||||
      const actionToDispatch = setInitData({
 | 
			
		||||
        authorizedCtLinks: ctLinks,
 | 
			
		||||
        authorizedStLinks: stLinks,
 | 
			
		||||
        contentTypeSchemas: models,
 | 
			
		||||
        components,
 | 
			
		||||
        fieldSizes: initData.fieldSizes,
 | 
			
		||||
      });
 | 
			
		||||
 | 
			
		||||
      dispatch(actionToDispatch);
 | 
			
		||||
    } catch (err) {
 | 
			
		||||
@ -88,7 +97,7 @@ const useModels = () => {
 | 
			
		||||
 | 
			
		||||
    return () => {
 | 
			
		||||
      source.cancel('Operation canceled by the user.');
 | 
			
		||||
      dispatch(resetProps());
 | 
			
		||||
      dispatch(resetInitData());
 | 
			
		||||
    };
 | 
			
		||||
    // eslint-disable-next-line react-hooks/exhaustive-deps
 | 
			
		||||
  }, [dispatch, toggleNotification]);
 | 
			
		||||
@ -96,4 +105,4 @@ const useModels = () => {
 | 
			
		||||
  return { ...state, refetchData: fetchDataRef.current };
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
export default useModels;
 | 
			
		||||
export default useContentManagerInitData;
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user