newspack-components 3.0.0-alpha.1 → 3.0.0-alpha.2

package/dist/esm/wizard/components/WizardError.js

@@ -1,67 +0,0 @@
-/**
- * WordPress dependencies.
- */
-import { __ as alias__ } from '@wordpress/i18n';
-const __ = alias__;
-import { useSelect } from '@wordpress/data';
-
-/**
- * Internal dependencies.
- */
-import { Button, Card, Modal, Notice } from '../..';
-import { WIZARD_STORE_NAMESPACE } from '../store';
-import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-const parseError = ({
-  data,
-  message,
-  code
-}) => {
-  let level = 'fatal';
-  if (!!data && 'level' in data) {
-    level = data.level;
-  } else if ('rest_invalid_param' === code) {
-    level = 'notice';
-  }
-  return {
-    message,
-    level
-  };
-};
-const WizardError = () => {
-  const error = useSelect(select => select(WIZARD_STORE_NAMESPACE).getError());
-  if (!error) {
-    return null;
-  }
-  const {
-    level,
-    message
-  } = parseError(error);
-  if ('fatal' === level) {
-    const fallbackURL = typeof newspack_urls !== 'undefined' && newspack_urls.dashboard;
-    return _jsxs(Modal, {
-      title: __('Unrecoverable error'),
-      onRequestClose: fallbackURL ? () => window.location = fallbackURL : undefined,
-      children: [_jsx(Notice, {
-        noticeText: message,
-        isError: true,
-        rawHTML: true
-      }), fallbackURL && _jsx(Card, {
-        buttonsCard: true,
-        noBorder: true,
-        className: "justify-end",
-        children: _jsx(Button, {
-          isPrimary: true,
-          href: fallbackURL,
-          children: __('Return to Dashboard', 'newspack-plugin')
-        })
-      })]
-    });
-  }
-  return _jsx(Notice, {
-    isError: true,
-    className: "newspack-wizard__above-header",
-    noticeText: message,
-    rawHTML: true
-  });
-};
-export default WizardError;

package/dist/esm/wizard/index.js

@@ -1,120 +0,0 @@
-/**
- * External dependencies.
- */
-import classnames from 'classnames';
-
-/**
- * WordPress dependencies.
- */
-import { useSelect } from '@wordpress/data';
-import { useState } from '@wordpress/element';
-import { __ as alias__ } from '@wordpress/i18n';
-const __ = alias__;
-import { category } from '@wordpress/icons';
-
-/**
- * Internal dependencies
- */
-import { Footer, Notice, Button, NewspackIcon, TabbedNavigation, PluginInstaller, HandoffMessage } from '../';
-import Router from '../proxied-imports/router';
-import registerStore, { WIZARD_STORE_NAMESPACE } from './store';
-import { useWizardData } from './store/utils';
-import WizardError from './components/WizardError';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
-registerStore();
-const {
-  HashRouter,
-  Redirect,
-  Route,
-  Switch
-} = Router;
-const Wizard = ({
-  sections = [],
-  apiSlug,
-  headerText,
-  subHeaderText,
-  hasSimpleFooter,
-  className,
-  renderAboveSections,
-  requiredPlugins = []
-}) => {
-  const isLoading = useSelect(select => select(WIZARD_STORE_NAMESPACE).isLoading());
-  const isQuietLoading = useSelect(select => select(WIZARD_STORE_NAMESPACE).isQuietLoading());
-
-  // Trigger initial data fetch. Some sections might not use the wizard data,
-  // but for consistency, fetching is triggered regardless of the section.
-  useSelect(select => select(WIZARD_STORE_NAMESPACE).getWizardAPIData(apiSlug));
-  let displayedSections = sections.filter(section => !section.isHidden);
-  const [pluginRequirementsSatisfied, setPluginRequirementsSatisfied] = useState(requiredPlugins.length === 0);
-  if (!pluginRequirementsSatisfied) {
-    headerText = requiredPlugins.length > 1 ? __('Required plugins', 'newspack-plugin') : __('Required plugin', 'newspack-plugin');
-    displayedSections = [{
-      path: '/',
-      render: () => _jsx(PluginInstaller, {
-        plugins: requiredPlugins,
-        onStatus: ({
-          complete
-        }) => setPluginRequirementsSatisfied(complete)
-      })
-    }];
-  }
-  return _jsxs(_Fragment, {
-    children: [_jsx("div", {
-      className: classnames(isLoading ? 'newspack-wizard__is-loading' : 'newspack-wizard__is-loaded', {
-        'newspack-wizard__is-loading-quiet': isQuietLoading
-      }),
-      children: _jsxs(HashRouter, {
-        hashType: "slash",
-        children: [newspack_aux_data.is_debug_mode && _jsx(Notice, {
-          debugMode: true
-        }), _jsx("div", {
-          className: "bg-white",
-          children: _jsx("div", {
-            className: "newspack-wizard__header__inner",
-            children: _jsxs("div", {
-              className: "newspack-wizard__title",
-              children: [_jsx(Button, {
-                isLink: true,
-                href: newspack_urls.dashboard,
-                label: __('Return to Dashboard', 'newspack-plugin'),
-                showTooltip: true,
-                icon: category,
-                iconSize: 36,
-                children: _jsx(NewspackIcon, {
-                  size: 36
-                })
-              }), _jsxs("div", {
-                children: [headerText && _jsx("h2", {
-                  children: headerText
-                }), subHeaderText && _jsx("span", {
-                  children: subHeaderText
-                })]
-              })]
-            })
-          })
-        }), displayedSections.length > 1 && _jsx(TabbedNavigation, {
-          items: displayedSections,
-          children: _jsx(WizardError, {})
-        }), _jsx(HandoffMessage, {}), _jsxs(Switch, {
-          children: [displayedSections.map((section, index) => {
-            const SectionComponent = section.render;
-            return _jsx(Route, {
-              path: section.path,
-              children: _jsxs("div", {
-                className: classnames('newspack-wizard newspack-wizard__content', className),
-                children: ['function' === typeof renderAboveSections ? renderAboveSections() : null, _jsx(SectionComponent, {})]
-              })
-            }, index);
-          }), _jsx(Redirect, {
-            to: displayedSections[0].path
-          })]
-        })]
-      })
-    }), !isLoading && _jsx(Footer, {
-      simple: hasSimpleFooter
-    })]
-  });
-};
-Wizard.useWizardData = useWizardData;
-Wizard.STORE_NAMESPACE = WIZARD_STORE_NAMESPACE;
-export default Wizard;

package/dist/esm/wizard/store/index.js

@@ -1,155 +0,0 @@
-/**
- * External dependencies.
- */
-import set from 'lodash/set';
-import get from 'lodash/get';
-import isEmpty from 'lodash/isEmpty';
-
-/**
- * WordPress dependencies.
- */
-import apiFetch from '@wordpress/api-fetch';
-import { createReduxStore, register, dispatch, select } from '@wordpress/data';
-import { createAction } from './utils.js';
-export const WIZARD_STORE_NAMESPACE = 'newspack/wizards';
-const DEFAULT_STATE = {
-  isLoading: true,
-  isQuietLoading: false,
-  apiData: {},
-  error: null
-};
-
-/**
- * wordpress/data does not trigger a component re-render
- * on deep state change (via lodash's set function)
- * unless the state was cloned first.
- */
-const clone = objectToClone => JSON.parse(JSON.stringify(objectToClone));
-const reducer = (state = DEFAULT_STATE, {
-  type,
-  payload = {}
-}) => {
-  switch (type) {
-    case 'START_LOADING_DATA':
-      if (payload.isQuietLoading) {
-        return {
-          ...state,
-          isQuietLoading: true
-        };
-      }
-      return {
-        ...state,
-        isLoading: true
-      };
-    case 'FINISH_LOADING_DATA':
-      return {
-        ...state,
-        isLoading: false,
-        isQuietLoading: false
-      };
-    case 'SET_API_DATA':
-      return set(clone(state), ['apiData', payload.slug], payload.data);
-    case 'UPDATE_WIZARD_SETTINGS':
-      return set(clone(state), ['apiData', payload.slug, ...payload.path], payload.value);
-    case 'SET_ERROR':
-      return {
-        ...state,
-        error: payload
-      };
-    default:
-      return state;
-  }
-};
-const actions = {
-  // Regular actions.
-  startLoadingData: createAction('START_LOADING_DATA'),
-  finishLoadingData: createAction('FINISH_LOADING_DATA'),
-  fetchFromAPI: createAction('FETCH_FROM_API'),
-  setAPIDataForWizard: createAction('SET_API_DATA'),
-  updateWizardSettings: createAction('UPDATE_WIZARD_SETTINGS'),
-  setError: createAction('SET_ERROR'),
-  // Async actions. These will not show up in Redux devtools.
-  *saveWizardSettings({
-    slug,
-    section = '',
-    payloadPath = false,
-    auxData = {},
-    updatePayload = null
-  }) {
-    // Optionally data can be updated before saving - an immediate update case
-    // (without an explicit "save" action).
-    if (updatePayload) {
-      yield actions.updateWizardSettings({
-        slug,
-        ...updatePayload
-      });
-    }
-    const wizardState = select(WIZARD_STORE_NAMESPACE).getWizardAPIData(slug);
-    const data = payloadPath ? get(wizardState, payloadPath) : wizardState;
-    const updatedData = yield actions.fetchFromAPI({
-      path: `/newspack/v1/wizard/${slug}/${section}`,
-      method: 'POST',
-      data: {
-        ...data,
-        ...auxData
-      },
-      isQuietFetch: true
-    });
-    if (!isEmpty(updatedData) && !updatedData.error) {
-      return actions.setAPIDataForWizard({
-        slug,
-        data: updatedData
-      });
-    }
-  },
-  *wizardApiFetch(fetchConfig) {
-    // Just a proxy to fetchFromAPI, but it has to be a generator.
-    const result = yield actions.fetchFromAPI(fetchConfig);
-    return result;
-  }
-};
-const selectors = {
-  isLoading: state => state.isLoading,
-  isQuietLoading: state => state.isQuietLoading,
-  getWizardAPIData: (state, slug) => state.apiData[slug] || {},
-  getError: state => state.error
-};
-const store = createReduxStore(WIZARD_STORE_NAMESPACE, {
-  reducer,
-  actions,
-  selectors,
-  controls: {
-    FETCH_FROM_API: action => {
-      dispatch(WIZARD_STORE_NAMESPACE).startLoadingData({
-        isQuietLoading: Boolean(action.payload.isQuietFetch)
-      });
-      return apiFetch(action.payload).then(data => {
-        dispatch(WIZARD_STORE_NAMESPACE).setError(null);
-        return data;
-      }).catch(error => {
-        dispatch(WIZARD_STORE_NAMESPACE).setError(error);
-        return {
-          error
-        };
-      }).finally(result => {
-        dispatch(WIZARD_STORE_NAMESPACE).finishLoadingData();
-        return result;
-      });
-    }
-  },
-  resolvers: {
-    *getWizardAPIData(slug) {
-      if (slug) {
-        const data = yield actions.fetchFromAPI({
-          path: `/newspack/v1/wizard/${slug}`
-        });
-        return actions.setAPIDataForWizard({
-          slug,
-          data
-        });
-      }
-      return actions.finishLoadingData();
-    }
-  }
-});
-export default (() => register(store));

package/dist/esm/wizard/store/utils.js

@@ -1,14 +0,0 @@
-/**
- * WordPress dependencies.
- */
-import { useSelect } from '@wordpress/data';
-
-/**
- * Internal dependencies
- */
-import { WIZARD_STORE_NAMESPACE } from '.';
-export const createAction = type => payload => ({
-  type,
-  payload
-});
-export const useWizardData = (wizardName, defaultValue = {}) => useSelect(select => select(WIZARD_STORE_NAMESPACE).getWizardAPIData(`newspack-${wizardName}-wizard`)) || defaultValue;