From e1bb3255c92a4ce4b39448b9c2264d6de9f3a179 Mon Sep 17 00:00:00 2001 From: Joshua T Flowers Date: Fri, 17 Jan 2020 09:46:11 +0800 Subject: [PATCH] Onboarding: Hide plugin install step when already installed (https://github.com/woocommerce/woocommerce-admin/pull/3575) * Remove already active plugins from install list * Update global with newly activated and installed plugins * Cache activated plugins to prevent step removal --- .../task-list/tasks/shipping/index.js | 40 +++++++++++++------ .../client/wc-api/onboarding/operations.js | 13 ++++++ 2 files changed, 40 insertions(+), 13 deletions(-) diff --git a/plugins/woocommerce-admin/client/dashboard/task-list/tasks/shipping/index.js b/plugins/woocommerce-admin/client/dashboard/task-list/tasks/shipping/index.js index 948b29134f7..e94469f095d 100644 --- a/plugins/woocommerce-admin/client/dashboard/task-list/tasks/shipping/index.js +++ b/plugins/woocommerce-admin/client/dashboard/task-list/tasks/shipping/index.js @@ -6,7 +6,7 @@ import { __ } from '@wordpress/i18n'; import apiFetch from '@wordpress/api-fetch'; import { Component } from '@wordpress/element'; import { compose } from '@wordpress/compose'; -import { filter } from 'lodash'; +import { difference, filter } from 'lodash'; import interpolateComponents from 'interpolate-components'; import { withDispatch } from '@wordpress/data'; @@ -38,8 +38,10 @@ class Shipping extends Component { shippingZones: [], }; + // Cache active plugins to prevent removal mid-step. + const { activePlugins = [] } = getSetting( 'onboarding', {} ); + this.activePlugins = activePlugins; this.state = this.initialState; - this.completeStep = this.completeStep.bind( this ); } @@ -150,18 +152,24 @@ class Shipping extends Component { } } - getSteps() { + getPluginsToActivate() { const { countryCode, isJetpackConnected } = this.props; - let plugins = []; + + const plugins = []; if ( [ 'GB', 'CA', 'AU' ].includes( countryCode ) ) { - plugins = [ 'woocommerce-shipstation-integration' ]; + plugins.push( 'woocommerce-shipstation-integration' ); } else if ( 'US' === countryCode ) { - plugins = [ 'woocommerce-services' ]; + plugins.push( 'woocommerce-services' ); if ( ! isJetpackConnected ) { plugins.push( 'jetpack' ); } } + return difference( plugins, this.activePlugins ); + } + + getSteps() { + const pluginsToActivate = this.getPluginsToActivate(); const steps = [ { @@ -190,7 +198,7 @@ class Shipping extends Component { content: ( { - recordEvent( 'tasklist_shipping_label_printing', { install: true, plugins } ); + recordEvent( 'tasklist_shipping_label_printing', { + install: true, + pluginsToActivate, + } ); this.completeStep(); } } onSkip={ () => { - recordEvent( 'tasklist_shipping_label_printing', { install: false, plugins } ); + recordEvent( 'tasklist_shipping_label_printing', { + install: false, + pluginsToActivate, + } ); getHistory().push( getNewPath( {}, '/', {} ) ); } } - pluginSlugs={ plugins } + pluginSlugs={ pluginsToActivate } { ...this.props } /> ), - visible: plugins.length, + visible: pluginsToActivate.length, }, { key: 'connect', @@ -259,7 +273,7 @@ class Shipping extends Component { } } /> ), - visible: plugins.includes( 'jetpack' ), + visible: pluginsToActivate.includes( 'jetpack' ), }, ]; diff --git a/plugins/woocommerce-admin/client/wc-api/onboarding/operations.js b/plugins/woocommerce-admin/client/wc-api/onboarding/operations.js index 4863af6207c..5ce96223b06 100644 --- a/plugins/woocommerce-admin/client/wc-api/onboarding/operations.js +++ b/plugins/woocommerce-admin/client/wc-api/onboarding/operations.js @@ -6,11 +6,13 @@ import { __, sprintf } from '@wordpress/i18n'; import { addQueryArgs } from '@wordpress/url'; import apiFetch from '@wordpress/api-fetch'; +import { uniq } from 'lodash'; /** * Internal dependencies */ import { getResourceIdentifier, getResourceName } from '../utils'; +import { getSetting, setSetting } from '@woocommerce/wc-admin-settings'; import { JETPACK_NAMESPACE, WC_ADMIN_NAMESPACE } from '../constants'; import { pluginNames } from './constants'; @@ -166,6 +168,11 @@ function activatePlugins( resourceNames, data, fetch ) { function activatePluginToResource( response, items ) { const resourceName = 'plugin-activate'; + const { activePlugins = [] } = getSetting( 'onboarding', {} ); + setSetting( 'onboarding', { + ...getSetting( 'onboarding', {} ), + activePlugins: uniq( [ ...activePlugins, ...items ] ), + } ); const resources = { [ resourceName ]: { data: items }, @@ -258,6 +265,12 @@ function installPlugins( resourceNames, data, fetch ) { }, } ) .then( response => { + const { installedPlugins = [] } = getSetting( 'onboarding', {} ); + setSetting( 'onboarding', { + ...getSetting( 'onboarding', {} ), + installedPlugins: uniq( [ ...installedPlugins, ...plugins ] ), + } ); + return { [ resourceName ]: { data: plugins }, [ getResourceName( resourceName, plugin ) ]: { data: response },