Additional changes for the core profiler plugins page (#38616)

* Add install-and-activate-plugins-async action to onboarding

* Add label and learn_more_link types

* Use label and learn_more_link

* Fix type

* Add changelog

* Add changelog

* Add install_priority -- this will be used in the core profiler

* Sort selected plugins by install_priority for installation

* Remove unused imports

* dev: refactor installAndActivatePlugins to xstate

* ts fixes

* Sort plugins by install_priority

* Make sure WooCommerce Shipping is always visible

* Update free extension list content

* Updated WC payment description
* Updated logo images

* Visual changes on the plugin page

* Change CTA font size from 13px to 14px
* Change spacing between the chebox and logo to 24px
* Change heading font-weight to 500

* Fix css lint error

* Fix gray-900 variable name

* Hide learn more link on mobile view

* Add back learn more link that was removed from rebase

* Send pluginsAvailable to pluginInstallermachine

* Use is_activated to determine plugin availability and install status

* Update packages/js/data/src/onboarding/types.ts

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

* Update plugins/woocommerce/src/Internal/Admin/RemoteFreeExtensions/DefaultFreeExtensions.php

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

* Add back recordTracksPluginsLearnMoreLinkClicked

* Use install-and-activate-plugins-async when timer is up

* Record plugin and link with learn more linked clicked event

* Fix failign tests

* Add comment for install_priority

---------

Co-authored-by: rjchow <me@rjchow.com>
Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>
This commit is contained in:
Moon 2023-06-13 15:03:03 -07:00 committed by GitHub
parent 05a4884188
commit 620ff93e5a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
20 changed files with 315 additions and 44 deletions

View File

@ -0,0 +1,4 @@
Significance: minor
Type: dev
Added install-and-activate-async to Onboarding and updated related types

View File

@ -17,8 +17,9 @@ import {
TaskListType,
TaskType,
OnboardingProductTypes,
InstallAndActivatePluginsAsyncResponse,
} from './types';
import { Plugin } from '../plugins/types';
import { Plugin, PluginNames } from '../plugins/types';
export function getFreeExtensionsError( error: unknown ) {
return {
@ -465,6 +466,28 @@ export function* actionTask( id: string ) {
}
}
export function* installAndActivatePluginsAsync(
plugins: Partial< PluginNames >[]
) {
yield setIsRequesting( 'installAndActivatePluginsAsync', true );
try {
const results: InstallAndActivatePluginsAsyncResponse = yield apiFetch(
{
path: `${ WC_ADMIN_NAMESPACE }/onboarding/plugins/install-and-activate-async`,
method: 'POST',
data: { plugins },
}
);
return results;
} catch ( error ) {
throw error;
} finally {
yield setIsRequesting( 'installAndActivatePluginsAsync', false );
}
}
export type Action = ReturnType<
| typeof getFreeExtensionsError
| typeof getFreeExtensionsSuccess

View File

@ -49,12 +49,19 @@ describe( 'plugins reducer', () => {
it( 'should handle SET_PROFILE_ITEMS', () => {
const state = reducer(
{
// @ts-expect-error - we're only testing profileItems
profileItems,
freeExtensions: [],
taskLists: {},
paymentMethods: [],
productTypes: {},
emailPrefill: '',
errors: {},
requesting: {},
},
{
type: TYPES.SET_PROFILE_ITEMS,
profileItems: { is_agree_marketing: true },
replace: false,
}
);
@ -64,8 +71,14 @@ describe( 'plugins reducer', () => {
it( 'should handle SET_PROFILE_ITEMS with replace', () => {
const state = reducer(
{
// @ts-expect-error - we're only testing profileItems
profileItems,
freeExtensions: [],
taskLists: {},
paymentMethods: [],
productTypes: {},
emailPrefill: '',
errors: {},
requesting: {},
},
{
type: TYPES.SET_PROFILE_ITEMS,

View File

@ -117,7 +117,7 @@ export type RevenueTypeSlug =
| 'more-than-250000';
export type ProfileItems = {
business_extensions?: [] | null;
business_extensions?: string[] | null;
completed?: boolean | null;
industry?: Industry[] | null;
number_employees?: string | null;
@ -180,7 +180,21 @@ export type Extension = {
image_url: string;
manage_url: string;
name: string;
label?: string;
is_built_by_wc: boolean;
is_visible: boolean;
is_installed?: boolean;
is_activated?: boolean;
learn_more_link?: string;
install_priority?: number;
};
export type InstallAndActivatePluginsAsyncResponse = {
job_id: string;
status: 'pending' | 'in-progress' | 'completed' | 'failed';
plugins: Array< {
status: 'pending' | 'installing' | 'installed' | 'activated' | 'failed';
errors: string[];
install_duration?: number;
} >;
};

View File

@ -11,6 +11,7 @@ import {
CoreProfilerStateMachineContext,
UserProfileEvent,
BusinessInfoEvent,
PluginsLearnMoreLinkClicked,
} from '..';
import { POSSIBLY_DEFAULT_STORE_NAMES } from '../pages/BusinessInfo';
@ -89,6 +90,18 @@ const recordTracksBusinessInfoCompleted = (
} );
};
const recordTracksPluginsLearnMoreLinkClicked = (
_context: unknown,
_event: PluginsLearnMoreLinkClicked,
{ action }: { action: unknown }
) => {
const { step } = action as { step: string };
recordEvent( `storeprofiler_${ step }_learn_more_link_clicked`, {
plugin: _event.payload.plugin,
link: _event.payload.learnMoreLink,
} );
};
export default {
recordTracksStepViewed,
recordTracksStepSkipped,
@ -96,4 +109,5 @@ export default {
recordTracksUserProfileCompleted,
recordTracksSkipBusinessLocationCompleted,
recordTracksBusinessInfoCompleted,
recordTracksPluginsLearnMoreLinkClicked,
};

View File

@ -16,6 +16,10 @@
max-width: 100%;
}
.components-checkbox-control__input-container {
margin-top: 6px;
}
input {
margin: 3px 26px 0 0;
width: 20px;
@ -26,8 +30,7 @@
}
img {
margin-right: 12px;
width: 25px;
height: 25px;
width: 28px;
@include breakpoint( '<782px' ) {
align-self: center;
}
@ -35,6 +38,7 @@
h3 {
font-size: 14px;
line-height: 20px;
font-weight: 500;
margin: 0 0 8px 0;
padding: 0;
@include breakpoint( '<782px' ) {
@ -43,14 +47,20 @@
}
p {
display: inline;
font-size: 13px;
line-height: 16px;
color: $gray-700;
margin: 0;
padding: 0;
a {
color: inherit;
@include breakpoint( '<782px' ) {
display: none;
}
}
a {
color: $gray-700;
margin-left: 5px;
@include breakpoint( '<782px' ) {
display: none;
}
@ -63,6 +73,7 @@
height: 16px;
&:focus {
box-shadow: none;
border-color: #1e1e1e;
}
}
.components-checkbox-control__input[type='checkbox']:checked {

View File

@ -19,6 +19,7 @@ export const PluginCard = ( {
onChange,
checked = false,
description,
learnMoreLink,
}: {
// Checkbox will be hidden if true
installed?: boolean;
@ -28,6 +29,7 @@ export const PluginCard = ( {
description: string | ReactNode;
checked?: boolean;
onChange?: () => void;
learnMoreLink?: ReactNode;
} ) => {
return (
<div className="woocommerce-profiler-plugins-plugin-card">
@ -53,6 +55,7 @@ export const PluginCard = ( {
) }
</div>
<p dangerouslySetInnerHTML={ sanitizeHTML( description ) } />
{ learnMoreLink }
</div>
</div>
);

View File

@ -106,6 +106,14 @@ export type PluginsInstallationRequestedEvent = {
};
};
export type PluginsLearnMoreLinkClicked = {
type: 'PLUGINS_LEARN_MORE_LINK_CLICKED';
payload: {
plugin: string;
learnMoreLink: string;
};
};
// TODO: add types as we develop the pages
export type OnboardingProfile = {
business_choice: BusinessChoice;
@ -1107,6 +1115,14 @@ export const coreProfilerStateMachineDefinition = createMachine( {
],
target: 'pluginsSkipped',
},
PLUGINS_LEARN_MORE_LINK_CLICKED: {
actions: [
{
type: 'recordTracksPluginsLearnMoreLinkClicked',
step: 'plugins',
},
],
},
PLUGINS_INSTALLATION_REQUESTED: {
target: 'installPlugins',
actions: [ 'assignPluginsSelected' ],
@ -1266,6 +1282,7 @@ export const coreProfilerStateMachineDefinition = createMachine( {
data: ( context ) => {
return {
selectedPlugins: context.pluginsSelected,
pluginsAvailable: context.pluginsAvailable,
};
},
},

View File

@ -11,7 +11,10 @@ import { useState } from 'react';
/**
* Internal dependencies
*/
import { CoreProfilerStateMachineContext } from '../index';
import {
CoreProfilerStateMachineContext,
PluginsLearnMoreLinkClicked,
} from '../index';
import { PluginsInstallationRequestedEvent, PluginsPageSkippedEvent } from '..';
import { Heading } from '../components/heading/heading';
import { Navigation } from '../components/navigation/navigation';
@ -36,13 +39,16 @@ export const Plugins = ( {
}: {
context: CoreProfilerStateMachineContext;
sendEvent: (
payload: PluginsInstallationRequestedEvent | PluginsPageSkippedEvent
payload:
| PluginsInstallationRequestedEvent
| PluginsPageSkippedEvent
| PluginsLearnMoreLinkClicked
) => void;
navigationProgress: number;
} ) => {
const [ selectedPlugins, setSelectedPlugins ] = useState<
ExtensionList[ 'plugins' ]
>( context.pluginsAvailable.filter( ( plugin ) => ! plugin.is_installed ) );
>( context.pluginsAvailable.filter( ( plugin ) => ! plugin.is_activated ) );
const setSelectedPlugin = ( plugin: Extension ) => {
setSelectedPlugins(
@ -136,10 +142,29 @@ export const Plugins = ( {
) }
<div className="woocommerce-profiler-plugins__list">
{ context.pluginsAvailable.map( ( plugin ) => {
const learnMoreLink = plugin.learn_more_link ? (
<Link
onClick={ () => {
sendEvent( {
type: 'PLUGINS_LEARN_MORE_LINK_CLICKED',
payload: {
plugin: plugin.key,
learnMoreLink:
plugin.learn_more_link ?? '',
},
} );
} }
href={ plugin.learn_more_link }
target="_blank"
type="external"
>
{ __( 'Learn More', 'woocommerce' ) }
</Link>
) : null;
return (
<PluginCard
key={ `checkbox-control-${ plugin.key }` }
installed={ plugin.is_installed }
installed={ plugin.is_activated }
onChange={ () => {
setSelectedPlugin( plugin );
} }
@ -156,8 +181,9 @@ export const Plugins = ( {
/>
) : null
}
title={ plugin.name }
title={ plugin.label }
description={ plugin.description }
learnMoreLink={ learnMoreLink }
/>
);
} ) }

View File

@ -1,7 +1,12 @@
/**
* External dependencies
*/
import { PLUGINS_STORE_NAME, PluginNames } from '@woocommerce/data';
import {
ExtensionList,
ONBOARDING_STORE_NAME,
PLUGINS_STORE_NAME,
PluginNames,
} from '@woocommerce/data';
import { dispatch } from '@wordpress/data';
import {
assign,
@ -68,6 +73,7 @@ const createPluginInstalledAndActivatedEvent = (
export type PluginInstallerMachineContext = {
selectedPlugins: PluginNames[];
pluginsAvailable: ExtensionList[ 'plugins' ] | [];
pluginsInstallationQueue: PluginNames[];
installedPlugins: InstalledPlugin[];
startTime: number;
@ -93,6 +99,7 @@ export const pluginInstallerMachine = createMachine(
initial: 'installing',
context: {
selectedPlugins: [] as PluginNames[],
pluginsAvailable: [] as ExtensionList[ 'plugins' ] | [],
pluginsInstallationQueue: [] as PluginNames[],
installedPlugins: [] as InstalledPlugin[],
startTime: 0,
@ -160,7 +167,7 @@ export const pluginInstallerMachine = createMachine(
invoke: {
src: 'queueRemainingPluginsAsync',
onDone: {
target: 'finished',
target: 'reportSuccess',
},
},
},
@ -188,7 +195,21 @@ export const pluginInstallerMachine = createMachine(
} ),
assignPluginsInstallationQueue: assign( {
pluginsInstallationQueue: ( ctx ) => {
return ctx.selectedPlugins;
// Sort the plugins by install_priority so that the smaller plugins are installed first
// install_priority is set by plugin's size
// Lower install_prioirty means the plugin is smaller
return ctx.selectedPlugins.slice().sort( ( a, b ) => {
const aIndex = ctx.pluginsAvailable.find(
( plugin ) => plugin.key === a
);
const bIndex = ctx.pluginsAvailable.find(
( plugin ) => plugin.key === b
);
return (
( aIndex?.install_priority ?? 99 ) -
( bIndex?.install_priority ?? 99 )
);
} );
},
} ),
assignStartTime: assign( {
@ -262,9 +283,10 @@ export const pluginInstallerMachine = createMachine(
);
},
queueRemainingPluginsAsync: ( ctx ) => {
return dispatch( PLUGINS_STORE_NAME ).installPlugins(
ctx.pluginsInstallationQueue,
true
return dispatch(
ONBOARDING_STORE_NAME
).installAndActivatePluginsAsync(
ctx.pluginsInstallationQueue
);
},
},

View File

@ -48,6 +48,7 @@ describe( 'pluginInstallerMachine', () => {
.withContext( {
...defaultContext,
selectedPlugins: [ 'woocommerce-payments' ],
pluginsAvailable: [],
} );
dispatchInstallPluginMock.mockImplementationOnce( ( context ) => {
@ -88,3 +89,10 @@ describe( 'pluginInstallerMachine', () => {
} );
} );
} );
// TODO: write more tests, I ran out of time and it's friday night
// we need tests for:
// 1. when given multiple plugins it should call the installPlugin service multiple times with the right plugins
// 2. when given multiple plugins and a mocked delay using the config, we can mock the installs to take longer than the timeout and then some plugins should not finish installing, then it should add the remaining to async queue
// 3. when a plugin gives an error it should report the error to the parents. we can check this by mocking 'updateParentWithInstallationErrors'
// 4. it should update parent with the plugin installation progress, we can check this by mocking the action 'updateParentWithPluginProgress'

View File

@ -398,8 +398,12 @@
max-width: 615px;
margin: 58px 0 0 0;
}
.woocommerce-profiler-heading__title {
color: $gray-900;
padding: 0;
}
.woocommerce-profiler-heading__subtitle {
margin: 0 0 48px 0 !important;
margin: 12px 0 48px 0 !important;
@include breakpoint( '<782px' ) {
margin-top: 12px !important;
}
@ -418,6 +422,7 @@
margin-top: 28px;
text-align: center;
display: block;
font-size: 14px;
}
.plugin-error {

View File

@ -0,0 +1,18 @@
<svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1698_35803)">
<g clip-path="url(#clip1_1698_35803)">
<path d="M25.9029 14.3535C25.9029 13.341 25.8207 12.6022 25.6429 11.8359H14.0809V16.4059H20.8675C20.7308 17.5416 19.9919 19.252 18.3499 20.4013L18.3269 20.5543L21.9826 23.3863L22.2359 23.4115C24.5619 21.2633 25.9029 18.1026 25.9029 14.3535Z" fill="#4285F4"/>
<path d="M14.0809 26.3942C17.4058 26.3942 20.197 25.2995 22.2358 23.4113L18.3499 20.401C17.31 21.1262 15.9144 21.6325 14.0809 21.6325C10.8244 21.6325 8.06055 19.4843 7.0753 16.5151L6.93088 16.5274L3.12967 19.4692L3.07996 19.6074C5.10498 23.6302 9.26455 26.3942 14.0809 26.3942Z" fill="#34A853"/>
<path d="M7.07547 16.515C6.8155 15.7488 6.66505 14.9278 6.66505 14.0795C6.66505 13.2311 6.8155 12.4102 7.06179 11.6439L7.0549 11.4808L3.20604 8.4917L3.08012 8.5516C2.2455 10.2209 1.7666 12.0955 1.7666 14.0795C1.7666 16.0635 2.2455 17.938 3.08012 19.6073L7.07547 16.515Z" fill="#FBBC05"/>
<path d="M14.081 6.52671C16.3933 6.52671 17.9531 7.52554 18.8425 8.36025L22.318 4.9669C20.1835 2.98291 17.4058 1.76514 14.081 1.76514C9.26457 1.76514 5.10499 4.52903 3.07996 8.55173L7.06164 11.6441C8.06057 8.67492 10.8245 6.52671 14.081 6.52671Z" fill="#EB4335"/>
</g>
</g>
<defs>
<clipPath id="clip0_1698_35803">
<rect width="24.7139" height="24.7139" fill="white" transform="translate(1.76526 1.76514)"/>
</clipPath>
<clipPath id="clip1_1698_35803">
<rect width="24.1504" height="24.7139" fill="white" transform="translate(1.76526 1.76514)"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,10 @@
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1698_35800)">
<path d="M13.9767 1.75C7.23333 1.75 1.75 7.23333 1.75 13.9767C1.75 20.72 7.23333 26.2033 13.9767 26.2033C20.72 26.2033 26.2033 20.72 26.2033 13.9767C26.2033 7.23333 20.72 1.75 13.9767 1.75ZM13.3467 16.0067H7.25667L13.3467 4.15333V16.0067ZM14.5833 23.7767V11.9233H20.6733L14.5833 23.7767Z" fill="#069E08"/>
</g>
<defs>
<clipPath id="clip0_1698_35800">
<rect width="24.5" height="24.5" fill="white" transform="translate(1.75 1.75)"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 594 B

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 15 KiB

View File

@ -0,0 +1,15 @@
<svg width="29" height="28" viewBox="0 0 29 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1698_35810)">
<g clip-path="url(#clip1_1698_35810)">
<path d="M1.99438 14.0002C1.99438 19.0164 5.01076 23.3257 9.32706 25.2203C9.29261 24.3649 9.32094 23.338 9.54029 22.4073C9.77582 21.4129 11.1165 15.7322 11.1165 15.7322C11.1165 15.7322 10.7252 14.95 10.7252 13.794C10.7252 11.9787 11.7774 10.6228 13.0877 10.6228C14.202 10.6228 14.7403 11.4598 14.7403 12.462C14.7403 13.5821 14.0259 15.2575 13.6585 16.8094C13.3516 18.1088 14.31 19.1687 15.592 19.1687C17.913 19.1687 19.4762 16.1877 19.4762 12.6557C19.4762 9.9708 17.6679 7.96123 14.3788 7.96123C10.6629 7.96123 8.34792 10.7324 8.34792 13.8278C8.34792 14.8951 8.6626 15.6477 9.15547 16.2306C9.38209 16.4982 9.41358 16.6059 9.33156 16.9133C9.2728 17.1387 9.13786 17.6813 9.08197 17.8964C9.00043 18.2066 8.74902 18.3176 8.46861 18.203C6.75705 17.5043 5.95994 15.6299 5.95994 13.5229C5.95994 10.0431 8.89477 5.8704 14.7151 5.8704C19.3921 5.8704 22.4704 9.25485 22.4704 12.8878C22.4704 17.6934 19.7987 21.2835 15.8605 21.2835C14.538 21.2835 13.294 20.5686 12.8678 19.7565C12.8678 19.7565 12.1566 22.579 12.006 23.1241C11.7462 24.0685 11.2379 25.0126 10.773 25.7483C11.8748 26.0735 13.0386 26.2507 14.2449 26.2507C21.0095 26.2507 26.4945 20.766 26.4945 14.0002C26.4945 7.23465 21.0095 1.75 14.2449 1.75C7.47951 1.75 1.99438 7.23465 1.99438 14.0002Z" fill="#CB1F27"/>
</g>
</g>
<defs>
<clipPath id="clip0_1698_35810">
<rect width="24.5" height="24.5" fill="white" transform="translate(1.99438 1.75)"/>
</clipPath>
<clipPath id="clip1_1698_35810">
<rect width="24.5" height="24.5" fill="white" transform="translate(1.99438 1.75)"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 278 KiB

View File

@ -0,0 +1,10 @@
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1698_35791)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M25.5751 7H2.61755C1.16468 7 -0.0114466 8.18766 8.40658e-05 9.62899V18.3923C8.40658e-05 19.8452 1.17621 21.0213 2.62908 21.0213H13.5025L18.4722 23.7887L17.3422 21.0213H25.5751C27.028 21.0213 28.2041 19.8452 28.2041 18.3923V9.62899C28.2041 8.17613 27.028 7 25.5751 7ZM2.13267 9.03307C1.80982 9.05613 1.56767 9.17144 1.40624 9.39052C1.24481 9.59807 1.18716 9.86328 1.22175 10.1631C1.90206 14.4871 2.53625 17.4043 3.12431 18.9149C3.35493 19.4683 3.62013 19.7335 3.93146 19.7105C4.41575 19.6759 4.99228 19.0071 5.67259 17.7041C6.03005 16.9662 6.58352 15.8592 7.33301 14.3833C7.95567 16.5626 8.80894 18.2 9.88129 19.2954C10.1811 19.6067 10.4924 19.7451 10.7922 19.722C11.0574 19.699 11.265 19.5606 11.4033 19.3069C11.5186 19.0878 11.5648 18.8341 11.5417 18.5459C11.4725 17.4966 11.5763 16.0322 11.8646 14.1527C12.1644 12.2155 12.5334 10.8203 12.983 9.99012C13.0753 9.81716 13.1099 9.64419 13.0984 9.43664C13.0753 9.17144 12.96 8.95236 12.7409 8.7794C12.5218 8.60643 12.2797 8.52572 12.0145 8.54878C11.6801 8.57184 11.4264 8.73327 11.2534 9.05613C10.5385 10.3591 10.0312 12.4692 9.73139 15.398C9.29323 14.2911 8.92425 12.9881 8.63598 11.4545C8.50914 10.7742 8.19781 10.4513 7.69046 10.4859C7.34454 10.509 7.05628 10.7396 6.82566 11.1778L4.30044 15.9861C3.88534 14.3141 3.49329 12.2732 3.13584 9.86328C3.05513 9.26368 2.72074 8.98695 2.13267 9.03307ZM24.3521 9.86167C25.1707 10.0346 25.7819 10.4728 26.197 11.1992C26.566 11.8219 26.7504 12.5714 26.7504 13.4708C26.7504 14.6584 26.4506 15.7423 25.8511 16.734C25.1592 17.887 24.2598 18.4636 23.1413 18.4636C22.9453 18.4636 22.7378 18.4405 22.5187 18.3944C21.7 18.2214 21.0889 17.7832 20.6738 17.0568C20.3048 16.4226 20.1203 15.6616 20.1203 14.7737C20.1203 13.5861 20.4201 12.5022 21.0197 11.5221C21.7231 10.369 22.6225 9.79248 23.7294 9.79248C23.9254 9.79248 24.133 9.81554 24.3521 9.86167ZM23.8678 16.0998C24.2944 15.7193 24.5827 15.1542 24.7441 14.3932C24.7902 14.128 24.8248 13.8397 24.8248 13.54C24.8248 13.2056 24.7556 12.8481 24.6173 12.4907C24.4443 12.041 24.2137 11.7988 23.937 11.7412C23.5219 11.6604 23.1183 11.8911 22.7378 12.4561C22.4264 12.8942 22.2304 13.3555 22.1266 13.8282C22.069 14.0934 22.0459 14.3817 22.0459 14.67C22.0459 15.0044 22.1151 15.3618 22.2535 15.7192C22.4264 16.1689 22.657 16.4111 22.9338 16.4687C23.2221 16.5264 23.5334 16.3996 23.8678 16.0998ZM18.9674 11.1992C18.5523 10.4728 17.9296 10.0346 17.1225 9.86167C16.9034 9.81554 16.6959 9.79248 16.4998 9.79248C15.3929 9.79248 14.4935 10.369 13.7901 11.5221C13.1905 12.5022 12.8907 13.5861 12.8907 14.7737C12.8907 15.6616 13.0752 16.4226 13.4442 17.0568C13.8593 17.7832 14.4704 18.2214 15.2891 18.3944C15.5082 18.4405 15.7157 18.4636 15.9118 18.4636C17.0302 18.4636 17.9296 17.887 18.6215 16.734C19.2211 15.7423 19.5209 14.6584 19.5209 13.4708C19.5209 12.5714 19.3364 11.8219 18.9674 11.1992ZM17.5145 14.3932C17.3531 15.1542 17.0648 15.7193 16.6382 16.0998C16.3038 16.3996 15.9925 16.5264 15.7042 16.4687C15.4275 16.4111 15.1969 16.1689 15.0239 15.7192C14.8855 15.3618 14.8164 15.0044 14.8164 14.67C14.8164 14.3817 14.8394 14.0934 14.8971 13.8282C15.0008 13.3555 15.1969 12.8942 15.5082 12.4561C15.8887 11.8911 16.2923 11.6604 16.7074 11.7412C16.9841 11.7988 17.2147 12.041 17.3877 12.4907C17.5261 12.8481 17.5952 13.2056 17.5952 13.54C17.5952 13.8397 17.5722 14.128 17.5145 14.3932Z" fill="#7F54B3"/>
</g>
<defs>
<clipPath id="clip0_1698_35791">
<rect width="28" height="28" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

View File

@ -0,0 +1,4 @@
Significance: minor
Type: enhancement
Additional changes for the core profiler plugins page

View File

@ -816,6 +816,7 @@ class DefaultFreeExtensions {
*
* - Updated description for the core-profiler.
* - Adds learn_more_link and label.
* - Adds install_priority, which is used to sort the plugins. The value is determined by the plugin size. Lower = smaller.
*
* @param array $plugins Array of plugins.
*
@ -824,47 +825,72 @@ class DefaultFreeExtensions {
public static function with_core_profiler_fields( array $plugins ) {
$_plugins = array(
'woocommerce-payments' => array(
'label' => __( 'Get paid with WooCommerce Payments', 'woocommerce' ),
'description' => __( 'Accept credit cards and other popular payment methods smoothly.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/woocommerce-payments',
'label' => __( 'Get paid with WooCommerce Payments', 'woocommerce' ),
'image_url' => plugins_url( '/assets/images/core-profiler/logo-woo.svg', WC_PLUGIN_FILE ),
'description' => __( "Securely accept payments and manage payment activity straight from your store's dashboard", 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/woocommerce-payments',
'install_priority' => 5,
),
'woocommerce-services:shipping' => array(
'label' => __( 'Print shipping labels with WooCommerce Shipping', 'woocommerce' ),
'description' => __( 'Print USPS and DHL labels directly from your dashboard and save on shipping.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/woocommerce-shipping',
'label' => __( 'Print shipping labels with WooCommerce Shipping', 'woocommerce' ),
'image_url' => plugins_url( '/assets/images/core-profiler/logo-woo.svg', WC_PLUGIN_FILE ),
'description' => __( 'Print USPS and DHL labels directly from your dashboard and save on shipping.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/woocommerce-shipping',
'install_priority' => 3,
),
'jetpack' => array(
'label' => __( 'Enhance security with Jetpack', 'woocommerce' ),
'description' => __( 'Get auto real-time backups, malware scans, and spam protection.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/jetpack',
'label' => __( 'Enhance security with Jetpack', 'woocommerce' ),
'image_url' => plugins_url( '/assets/images/core-profiler/logo-jetpack.svg', WC_PLUGIN_FILE ),
'description' => __( 'Get auto real-time backups, malware scans, and spam protection.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/jetpack',
'install_priority' => 8,
),
'pinterest-for-woocommerce' => array(
'label' => __( 'Showcase your products with Pinterest', 'woocommerce' ),
'description' => __( 'Get your products in front of a highly engaged audience.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/pinterest-for-woocommerce',
'label' => __( 'Showcase your products with Pinterest', 'woocommerce' ),
'image_url' => plugins_url( '/assets/images/core-profiler/logo-pinterest.svg', WC_PLUGIN_FILE ),
'description' => __( 'Get your products in front of a highly engaged audience.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/pinterest-for-woocommerce',
'install_priority' => 2,
),
'mailpoet' => array(
'label' => __( 'Reach your customers with MailPoet', 'woocommerce' ),
'description' => __( 'Send purchase follow-up emails, newsletters, and promotional campaigns.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/mailpoet',
'label' => __( 'Reach your customers with MailPoet', 'woocommerce' ),
'image_url' => plugins_url( '/assets/images/core-profiler/logo-mailpoet.svg', WC_PLUGIN_FILE ),
'description' => __( 'Send purchase follow-up emails, newsletters, and promotional campaigns.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/mailpoet',
'install_priority' => 7,
),
'tiktok-for-business' => array(
'label' => __( 'Create ad campaigns with TikTok', 'woocommerce' ),
'description' => __( 'Create advertising campaigns and reach one billion global users.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/tiktok-for-woocommerce',
'label' => __( 'Create ad campaigns with TikTok', 'woocommerce' ),
'image_url' => plugins_url( '/assets/images/core-profiler/logo-tiktok.svg', WC_PLUGIN_FILE ),
'description' => __( 'Create advertising campaigns and reach one billion global users.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/tiktok-for-woocommerce',
'install_priority' => 1,
),
'google-listings-and-ads' => array(
'label' => __( 'Drive sales with Google Listings & Ads', 'woocommerce' ),
'description' => __( 'Reach millions of active shoppers across Google with free product listings and ads.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/google-listings-and-ads',
'label' => __( 'Drive sales with Google Listings & Ads', 'woocommerce' ),
'image_url' => plugins_url( '/assets/images/core-profiler/logo-google.svg', WC_PLUGIN_FILE ),
'description' => __( 'Reach millions of active shoppers across Google with free product listings and ads.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/google-listings-and-ads',
'install_priority' => 6,
),
'woocommerce-services:tax' => array(
'label' => __( 'Get automated tax rates with WooCommerce Tax', 'woocommerce' ),
'description' => __( 'Automatically calculate how much sales tax should be collected by city, country, or state.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/tax',
'label' => __( 'Get automated tax rates with WooCommerce Tax', 'woocommerce' ),
'image_url' => plugins_url( '/assets/images/core-profiler/logo-woo.svg', WC_PLUGIN_FILE ),
'description' => __( 'Automatically calculate how much sales tax should be collected by city, country, or state.', 'woocommerce' ),
'learn_more_link' => 'https://woocommerce.com/products/tax',
'install_priority' => 4,
),
);
// Copy shipping for the core-profiler and remove is_visible conditions, except for the country restriction.
$_plugins['woocommerce-services:shipping']['is_visible'] = [
array(
'type' => 'base_location_country',
'value' => 'US',
'operation' => '=',
),
];
$remove_plugins_activated_rule = function( $is_visible ) {
$is_visible = array_filter(
array_map(