@strapi/admin 4.14.5 → 4.15.0

package/admin/src/components/GuidedTour/Stepper/StepNumber.js

@@ -1,71 +0,0 @@
-import React from 'react';
-
-import { Flex, Icon, Typography } from '@strapi/design-system';
-import { pxToRem } from '@strapi/helper-plugin';
-import { Check } from '@strapi/icons';
-import PropTypes from 'prop-types';
-
-import { IS_ACTIVE, IS_DONE, IS_NOT_DONE } from '../constants';
-
-const StepNumber = ({ type, number }) => {
-  if (type === IS_DONE) {
-    return (
-      <Flex
-        background="primary600"
-        padding={2}
-        borderRadius="50%"
-        width={pxToRem(30)}
-        height={pxToRem(30)}
-        justifyContent="center"
-      >
-        <Icon as={Check} aria-hidden width={pxToRem(16)} color="neutral0" />
-      </Flex>
-    );
-  }
-
-  if (type === IS_ACTIVE) {
-    return (
-      <Flex
-        background="primary600"
-        padding={2}
-        borderRadius="50%"
-        width={pxToRem(30)}
-        height={pxToRem(30)}
-        justifyContent="center"
-      >
-        <Typography fontWeight="semiBold" textColor="neutral0">
-          {number}
-        </Typography>
-      </Flex>
-    );
-  }
-
-  return (
-    <Flex
-      borderColor="neutral500"
-      borderWidth="1px"
-      borderStyle="solid"
-      padding={2}
-      borderRadius="50%"
-      width={pxToRem(30)}
-      height={pxToRem(30)}
-      justifyContent="center"
-    >
-      <Typography fontWeight="semiBold" textColor="neutral600">
-        {number}
-      </Typography>
-    </Flex>
-  );
-};
-
-StepNumber.defaultProps = {
-  number: undefined,
-  type: IS_NOT_DONE,
-};
-
-StepNumber.propTypes = {
-  number: PropTypes.number,
-  type: PropTypes.oneOf([IS_ACTIVE, IS_DONE, IS_NOT_DONE]),
-};
-
-export default StepNumber;

package/admin/src/components/GuidedTour/constants.js

@@ -1,3 +0,0 @@
-export const IS_ACTIVE = 'isActive';
-export const IS_DONE = 'isDone';
-export const IS_NOT_DONE = 'isNotDone';

package/admin/src/components/GuidedTour/index.js

@@ -1,102 +0,0 @@
-import React, { useReducer } from 'react';
-
-import { GuidedTourProvider } from '@strapi/helper-plugin';
-import get from 'lodash/get';
-import PropTypes from 'prop-types';
-
-import init from './init';
-import reducer, { initialState } from './reducer';
-import arePreviousSectionsDone from './utils/arePreviousSectionsDone';
-import arePreviousStepsDone from './utils/arePreviousStepsDone';
-import persistStateToLocaleStorage from './utils/persistStateToLocaleStorage';
-
-const GuidedTour = ({ children }) => {
-  const [{ currentStep, guidedTourState, isGuidedTourVisible, isSkipped }, dispatch] = useReducer(
-    reducer,
-    initialState,
-    init
-  );
-
-  const setCurrentStep = (step) => {
-    // if step is null it is intentional, we need to dispatch it
-    if (step !== null) {
-      const isStepAlreadyDone = get(guidedTourState, step);
-      const isStepToShow = arePreviousStepsDone(step, guidedTourState);
-
-      if (isStepAlreadyDone || isSkipped || !isStepToShow) {
-        return null;
-      }
-    }
-
-    persistStateToLocaleStorage.addCurrentStep(step);
-
-    return dispatch({
-      type: 'SET_CURRENT_STEP',
-      step,
-    });
-  };
-
-  const setGuidedTourVisibility = (value) => {
-    dispatch({
-      type: 'SET_GUIDED_TOUR_VISIBILITY',
-      value,
-    });
-  };
-
-  const setStepState = (currentStep, value) => {
-    persistStateToLocaleStorage.addCompletedStep(currentStep);
-
-    dispatch({
-      type: 'SET_STEP_STATE',
-      currentStep,
-      value,
-    });
-  };
-
-  const startSection = (sectionName) => {
-    const sectionSteps = guidedTourState[sectionName];
-
-    if (sectionSteps) {
-      const isSectionToShow = arePreviousSectionsDone(sectionName, guidedTourState);
-      const firstStep = Object.keys(sectionSteps)[0];
-      const isFirstStepDone = sectionSteps[firstStep];
-
-      if (isSectionToShow && !currentStep && !isFirstStepDone) {
-        return setCurrentStep(`${sectionName}.${firstStep}`);
-      }
-    }
-
-    return null;
-  };
-
-  const setSkipped = (value) => {
-    persistStateToLocaleStorage.setSkipped(value);
-
-    dispatch({
-      type: 'SET_SKIPPED',
-      value,
-    });
-  };
-
-  return (
-    <GuidedTourProvider
-      guidedTourState={guidedTourState}
-      currentStep={currentStep}
-      setCurrentStep={setCurrentStep}
-      setGuidedTourVisibility={setGuidedTourVisibility}
-      setSkipped={setSkipped}
-      setStepState={setStepState}
-      startSection={startSection}
-      isGuidedTourVisible={isGuidedTourVisible}
-      isSkipped={isSkipped}
-    >
-      {children}
-    </GuidedTourProvider>
-  );
-};
-
-GuidedTour.propTypes = {
-  children: PropTypes.element.isRequired,
-};
-
-export default GuidedTour;

package/admin/src/components/GuidedTour/init.js

@@ -1,37 +0,0 @@
-import set from 'lodash/set';
-
-import persistStateToLocaleStorage, {
-  COMPLETED_STEPS,
-  CURRENT_STEP,
-  SKIPPED,
-} from './utils/persistStateToLocaleStorage';
-
-const init = (initialState) => {
-  const copyInitialState = { ...initialState };
-  const guidedTourLocaleStorage = persistStateToLocaleStorage.get(COMPLETED_STEPS);
-  const currentStepLocaleStorage = persistStateToLocaleStorage.get(CURRENT_STEP);
-  const skippedLocaleStorage = persistStateToLocaleStorage.get(SKIPPED);
-
-  if (guidedTourLocaleStorage) {
-    guidedTourLocaleStorage.forEach((step) => {
-      const [sectionName, stepName] = step.split('.');
-      set(copyInitialState, ['guidedTourState', sectionName, stepName], true);
-    });
-  }
-
-  // if current step when initializing mark it as done
-  if (currentStepLocaleStorage) {
-    const [sectionName, stepName] = currentStepLocaleStorage.split('.');
-    set(copyInitialState, ['guidedTourState', sectionName, stepName], true);
-    persistStateToLocaleStorage.addCompletedStep(currentStepLocaleStorage);
-    persistStateToLocaleStorage.addCurrentStep(null);
-  }
-
-  if (skippedLocaleStorage !== null) {
-    set(copyInitialState, 'isSkipped', skippedLocaleStorage);
-  }
-
-  return copyInitialState;
-};
-
-export default init;

package/admin/src/components/GuidedTour/reducer.js

@@ -1,50 +0,0 @@
-/* eslint-disable consistent-return */
-import produce from 'immer';
-
-export const initialState = {
-  currentStep: null,
-  guidedTourState: {
-    contentTypeBuilder: {
-      create: false,
-      success: false,
-    },
-    contentManager: {
-      create: false,
-      success: false,
-    },
-    apiTokens: {
-      create: false,
-      success: false,
-    },
-  },
-  isGuidedTourVisible: false,
-  isSkipped: true,
-};
-
-const reducer = (state = initialState, action) =>
-  produce(state, (draftState) => {
-    switch (action.type) {
-      case 'SET_CURRENT_STEP': {
-        draftState.currentStep = action.step;
-        break;
-      }
-      case 'SET_STEP_STATE': {
-        const [section, step] = action.currentStep.split('.');
-        draftState.guidedTourState[section][step] = action.value;
-        break;
-      }
-      case 'SET_SKIPPED': {
-        draftState.isSkipped = action.value;
-        break;
-      }
-      case 'SET_GUIDED_TOUR_VISIBILITY': {
-        draftState.isGuidedTourVisible = action.value;
-        break;
-      }
-      default: {
-        return draftState;
-      }
-    }
-  });
-
-export default reducer;

package/admin/src/components/GuidedTour/utils/arePreviousSectionsDone.js

@@ -1,13 +0,0 @@
-const arePreviousSectionsDone = (sectionName, guidedTourState) => {
-  const guidedTourArray = Object.entries(guidedTourState);
-
-  // Find current section position in the guidedTourArray
-  // Get only previous sections based on current section position
-  const currentSectionIndex = guidedTourArray.findIndex(([key]) => key === sectionName);
-  const previousSections = guidedTourArray.slice(0, currentSectionIndex);
-
-  // Check if every steps from previous section are done
-  return previousSections.every(([, sectionValue]) => Object.values(sectionValue).every(Boolean));
-};
-
-export default arePreviousSectionsDone;

package/admin/src/components/GuidedTour/utils/arePreviousStepsDone.js

@@ -1,12 +0,0 @@
-const arePreviousStepsDone = (step, guidedTourState) => {
-  const stepSplit = step.split('.');
-  const stepName = stepSplit[1];
-  const sectionArray = Object.entries(guidedTourState[stepSplit[0]]);
-
-  const currentStepIndex = sectionArray.findIndex(([key]) => key === stepName);
-  const previousSteps = sectionArray.slice(0, currentStepIndex);
-
-  return previousSteps.every(([, sectionValue]) => sectionValue);
-};
-
-export default arePreviousStepsDone;

package/admin/src/components/GuidedTour/utils/isGuidedTourCompleted.js

@@ -1,6 +0,0 @@
-const isGuidedTourCompleted = (guidedTourState) =>
-  Object.entries(guidedTourState).every(([, section]) =>
-    Object.entries(section).every(([, step]) => step)
-  );
-
-export default isGuidedTourCompleted;

package/admin/src/components/GuidedTour/utils/persistStateToLocaleStorage.js

@@ -1,34 +0,0 @@
-export const CURRENT_STEP = 'GUIDED_TOUR_CURRENT_STEP';
-export const COMPLETED_STEPS = 'GUIDED_TOUR_COMPLETED_STEPS';
-export const SKIPPED = 'GUIDED_TOUR_SKIPPED';
-const parse = JSON.parse;
-const stringify = JSON.stringify;
-
-const persistStateToLocaleStorage = {
-  clear() {
-    localStorage.removeItem(CURRENT_STEP);
-    localStorage.removeItem(COMPLETED_STEPS);
-  },
-  addCompletedStep(completedStep) {
-    const currentSteps = parse(localStorage.getItem(COMPLETED_STEPS))?.slice() || [];
-    const isAlreadyStored = currentSteps.includes(completedStep);
-
-    if (isAlreadyStored) {
-      return;
-    }
-
-    currentSteps.push(completedStep);
-    localStorage.setItem(COMPLETED_STEPS, stringify(currentSteps));
-  },
-  addCurrentStep(currentStep) {
-    localStorage.setItem(CURRENT_STEP, stringify(currentStep));
-  },
-  setSkipped(value) {
-    localStorage.setItem(SKIPPED, stringify(value));
-  },
-  get(item) {
-    return parse(localStorage.getItem(item));
-  },
-};
-
-export default persistStateToLocaleStorage;

package/admin/src/components/Providers/index.js

@@ -1,156 +0,0 @@
-import React from 'react';
-
-import {
-  AutoReloadOverlayBlockerProvider,
-  CustomFieldsProvider,
-  LibraryProvider,
-  NotificationsProvider,
-  OverlayBlockerProvider,
-  StrapiAppProvider,
-} from '@strapi/helper-plugin';
-import PropTypes from 'prop-types';
-import { QueryClient, QueryClientProvider } from 'react-query';
-import { Provider } from 'react-redux';
-
-import { AdminContext } from '../../contexts/admin';
-import { ConfigurationProvider } from '../ConfigurationProvider';
-import GuidedTour from '../GuidedTour';
-import { LanguageProvider } from '../LanguageProvider';
-import { Theme } from '../Theme';
-import { ThemeToggleProvider } from '../ThemeToggleProvider';
-
-const queryClient = new QueryClient({
-  defaultOptions: {
-    queries: {
-      refetchOnWindowFocus: false,
-    },
-  },
-});
-
-const Providers = ({
-  authLogo,
-  children,
-  components,
-  customFields,
-  fields,
-  getAdminInjectedComponents,
-  getPlugin,
-  localeNames,
-  menu,
-  menuLogo,
-  messages,
-  plugins,
-  runHookParallel,
-  runHookSeries,
-  runHookWaterfall,
-  settings,
-  showReleaseNotification,
-  showTutorials,
-  store,
-  themes,
-}) => {
-  return (
-    <LanguageProvider messages={messages} localeNames={localeNames}>
-      <ThemeToggleProvider themes={themes}>
-        <Theme>
-          <QueryClientProvider client={queryClient}>
-            <Provider store={store}>
-              <AdminContext.Provider value={{ getAdminInjectedComponents }}>
-                <ConfigurationProvider
-                  authLogo={authLogo}
-                  menuLogo={menuLogo}
-                  showReleaseNotification={showReleaseNotification}
-                  showTutorials={showTutorials}
-                >
-                  <StrapiAppProvider
-                    getPlugin={getPlugin}
-                    menu={menu}
-                    plugins={plugins}
-                    runHookParallel={runHookParallel}
-                    runHookWaterfall={runHookWaterfall}
-                    runHookSeries={runHookSeries}
-                    settings={settings}
-                  >
-                    <LibraryProvider components={components} fields={fields}>
-                      <CustomFieldsProvider customFields={customFields}>
-                        <AutoReloadOverlayBlockerProvider>
-                          <OverlayBlockerProvider>
-                            <GuidedTour>
-                              <NotificationsProvider>{children}</NotificationsProvider>
-                            </GuidedTour>
-                          </OverlayBlockerProvider>
-                        </AutoReloadOverlayBlockerProvider>
-                      </CustomFieldsProvider>
-                    </LibraryProvider>
-                  </StrapiAppProvider>
-                </ConfigurationProvider>
-              </AdminContext.Provider>
-            </Provider>
-          </QueryClientProvider>
-        </Theme>
-      </ThemeToggleProvider>
-    </LanguageProvider>
-  );
-};
-
-Providers.propTypes = {
-  authLogo: PropTypes.oneOfType([PropTypes.string, PropTypes.any]).isRequired,
-  children: PropTypes.node.isRequired,
-  components: PropTypes.object.isRequired,
-  customFields: PropTypes.object.isRequired,
-  fields: PropTypes.object.isRequired,
-  getAdminInjectedComponents: PropTypes.func.isRequired,
-  getPlugin: PropTypes.func.isRequired,
-  localeNames: PropTypes.objectOf(PropTypes.string).isRequired,
-  menu: PropTypes.arrayOf(
-    PropTypes.shape({
-      to: PropTypes.string.isRequired,
-      icon: PropTypes.func.isRequired,
-      intlLabel: PropTypes.shape({
-        id: PropTypes.string.isRequired,
-        defaultMessage: PropTypes.string.isRequired,
-      }).isRequired,
-      permissions: PropTypes.array,
-      Component: PropTypes.func,
-    })
-  ).isRequired,
-  menuLogo: PropTypes.oneOfType([PropTypes.string, PropTypes.any]).isRequired,
-  messages: PropTypes.object.isRequired,
-  plugins: PropTypes.object.isRequired,
-  runHookParallel: PropTypes.func.isRequired,
-  runHookWaterfall: PropTypes.func.isRequired,
-  runHookSeries: PropTypes.func.isRequired,
-  settings: PropTypes.object.isRequired,
-  showReleaseNotification: PropTypes.bool.isRequired,
-  showTutorials: PropTypes.bool.isRequired,
-  store: PropTypes.object.isRequired,
-  themes: PropTypes.shape({
-    light: PropTypes.shape({
-      colors: PropTypes.object.isRequired,
-      shadows: PropTypes.object.isRequired,
-      sizes: PropTypes.object.isRequired,
-      zIndices: PropTypes.array.isRequired,
-      spaces: PropTypes.array.isRequired,
-      borderRadius: PropTypes.string.isRequired,
-      mediaQueries: PropTypes.object.isRequired,
-      fontSizes: PropTypes.array.isRequired,
-      lineHeights: PropTypes.array.isRequired,
-      fontWeights: PropTypes.object.isRequired,
-    }).isRequired,
-    dark: PropTypes.shape({
-      colors: PropTypes.object.isRequired,
-      shadows: PropTypes.object.isRequired,
-      sizes: PropTypes.object.isRequired,
-      zIndices: PropTypes.array.isRequired,
-      spaces: PropTypes.array.isRequired,
-      borderRadius: PropTypes.string.isRequired,
-      mediaQueries: PropTypes.object.isRequired,
-      fontSizes: PropTypes.array.isRequired,
-      lineHeights: PropTypes.array.isRequired,
-      fontWeights: PropTypes.object.isRequired,
-    }).isRequired,
-    custom: PropTypes.object,
-  }).isRequired,
-};
-
-export default Providers;

package/admin/src/components/RBACProvider/actions.js

@@ -1,10 +0,0 @@
-import { RESET_STORE, SET_PERMISSIONS } from './constants';
-
-const resetStore = () => ({ type: RESET_STORE });
-
-const setPermissions = (permissions) => ({
-  type: SET_PERMISSIONS,
-  permissions,
-});
-
-export { resetStore, setPermissions };

package/admin/src/components/RBACProvider/constants.js

@@ -1,2 +0,0 @@
-export const RESET_STORE = 'StrapiAdmin/RBACProvider/RESET_STORE';
-export const SET_PERMISSIONS = 'StrapiAdmin/RBACProvider/SET_PERMISSIONS';

package/admin/src/components/RBACProvider/index.js

@@ -1,39 +0,0 @@
-import React, { useEffect } from 'react';
-
-import { LoadingIndicatorPage, RBACProviderContext } from '@strapi/helper-plugin';
-import PropTypes from 'prop-types';
-import { useDispatch, useSelector } from 'react-redux';
-
-import { resetStore, setPermissions } from './actions';
-
-const RBACProvider = ({ children, permissions, refetchPermissions }) => {
-  const { allPermissions } = useSelector((state) => state.rbacProvider);
-
-  const dispatch = useDispatch();
-
-  useEffect(() => {
-    dispatch(setPermissions(permissions));
-
-    return () => {
-      dispatch(resetStore());
-    };
-  }, [permissions, dispatch]);
-
-  if (!allPermissions) {
-    return <LoadingIndicatorPage />;
-  }
-
-  return (
-    <RBACProviderContext.Provider value={{ allPermissions, refetchPermissions }}>
-      {children}
-    </RBACProviderContext.Provider>
-  );
-};
-
-RBACProvider.propTypes = {
-  children: PropTypes.node.isRequired,
-  permissions: PropTypes.array.isRequired,
-  refetchPermissions: PropTypes.func.isRequired,
-};
-
-export default RBACProvider;

package/admin/src/components/RBACProvider/reducer.js

@@ -1,51 +0,0 @@
-/*
- *
- * RBACProvider reducer
- * The goal of this reducer is to provide
- * the plugins with an access to the user's permissions
- * in our middleware system
- *
- */
-
-import produce from 'immer';
-
-import { RESET_STORE, SET_PERMISSIONS } from './constants';
-
-const initialState = {
-  allPermissions: null,
-  collectionTypesRelatedPermissions: {},
-};
-
-const reducer = (state = initialState, action) =>
-  // eslint-disable-next-line consistent-return
-  produce(state, (draftState) => {
-    switch (action.type) {
-      case SET_PERMISSIONS: {
-        draftState.allPermissions = action.permissions;
-        draftState.collectionTypesRelatedPermissions = action.permissions
-          .filter((perm) => perm.subject)
-          .reduce((acc, current) => {
-            const { subject, action } = current;
-
-            if (!acc[subject]) {
-              acc[subject] = {};
-            }
-
-            acc[subject] = acc[subject][action]
-              ? { ...acc[subject], [action]: [...acc[subject][action], current] }
-              : { ...acc[subject], [action]: [current] };
-
-            return acc;
-          }, {});
-        break;
-      }
-      case RESET_STORE: {
-        return initialState;
-      }
-      default:
-        return state;
-    }
-  });
-
-export default reducer;
-export { initialState };

package/admin/src/contexts/ApiTokenPermissions/index.js

@@ -1,25 +0,0 @@
-import React, { createContext, useContext } from 'react';
-
-import PropTypes from 'prop-types';
-
-const ApiTokenPermissionsContext = createContext({});
-
-const ApiTokenPermissionsContextProvider = ({ children, ...rest }) => {
-  return (
-    <ApiTokenPermissionsContext.Provider value={rest}>
-      {children}
-    </ApiTokenPermissionsContext.Provider>
-  );
-};
-
-const useApiTokenPermissionsContext = () => useContext(ApiTokenPermissionsContext);
-
-ApiTokenPermissionsContextProvider.propTypes = {
-  children: PropTypes.node.isRequired,
-};
-
-export {
-  ApiTokenPermissionsContext,
-  ApiTokenPermissionsContextProvider,
-  useApiTokenPermissionsContext,
-};

package/admin/src/core/store/configureStore.js

@@ -1,47 +0,0 @@
-import { applyMiddleware, combineReducers, compose, createStore } from 'redux';
-
-const configureStore = (appMiddlewares, appReducers) => {
-  let composeEnhancers = compose;
-
-  const middlewares = [];
-
-  appMiddlewares.forEach((middleware) => {
-    middlewares.push(middleware());
-  });
-
-  // If Redux Dev Tools  are installed, enable them
-  if (
-    process.env.NODE_ENV !== 'production' &&
-    typeof window === 'object' &&
-    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
-  ) {
-    composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({});
-  }
-
-  const store = createStore(
-    createReducer(appReducers, {}),
-    {},
-    composeEnhancers(applyMiddleware(...middlewares))
-  );
-
-  // Add a dictionary to keep track of the registered async reducers
-  store.asyncReducers = {};
-
-  // Create an inject reducer function
-  // This function adds the async reducer, and creates a new combined reducer
-  store.injectReducer = (key, asyncReducer) => {
-    store.asyncReducers[key] = asyncReducer;
-    store.replaceReducer(createReducer(appReducers, store.asyncReducers));
-  };
-
-  return store;
-};
-
-const createReducer = (appReducers, asyncReducers) => {
-  return combineReducers({
-    ...appReducers,
-    ...asyncReducers,
-  });
-};
-
-export default configureStore;