/** * External dependencies */ import { __ } from '@wordpress/i18n'; import { applyFilters } from '@wordpress/hooks'; import { Card, CardBody, CardHeader } from '@wordpress/components'; import { megaphone, box, brush, home, shipping, percent, payment, pencil, } from '@wordpress/icons'; import { getSetting } from '@woocommerce/wc-admin-settings'; import { recordEvent } from '@woocommerce/tracks'; import { Text } from '@woocommerce/experimental'; /** * Internal dependencies */ import './style.scss'; import { QuickLinkCategory } from './quick-link-category'; import { QuickLink } from './quick-link'; export function getItemsByCategory( shopUrl ) { return [ { title: __( 'Marketing & Merchandising', 'woocommerce-admin' ), items: [ { title: __( 'Marketing', 'woocommerce-admin' ), link: getLinkTypeAndHref( { type: 'wc-admin', path: 'marketing', } ), icon: megaphone, listItemTag: 'marketing', }, { title: __( 'Add products', 'woocommerce-admin' ), link: getLinkTypeAndHref( { type: 'wp-admin', path: 'post-new.php?post_type=product', } ), icon: box, listItemTag: 'add-products', }, { title: __( 'Personalize my store', 'woocommerce-admin' ), link: getLinkTypeAndHref( { type: 'wp-admin', path: 'customize.php', } ), icon: brush, listItemTag: 'personalize-store', }, { title: __( 'View my store', 'woocommerce-admin' ), link: getLinkTypeAndHref( { type: 'external', href: shopUrl, } ), icon: home, listItemTag: 'view-store', }, ], }, { title: __( 'Settings', 'woocommerce-admin' ), items: [ { title: __( 'Store details', 'woocommerce-admin' ), link: getLinkTypeAndHref( { type: 'wc-settings', tab: 'general', } ), icon: pencil, listItemTag: 'edit-store-details', }, { title: __( 'Payments', 'woocommerce-admin' ), link: getLinkTypeAndHref( { type: 'wc-settings', tab: 'checkout', } ), icon: payment, listItemTag: 'payment-settings', }, { title: __( 'Tax', 'woocommerce-admin' ), link: getLinkTypeAndHref( { type: 'wc-settings', tab: 'tax', } ), icon: percent, listItemTag: 'tax-settings', }, { title: __( 'Shipping', 'woocommerce-admin' ), link: getLinkTypeAndHref( { type: 'wc-settings', tab: 'shipping', } ), icon: shipping, listItemTag: 'shipping-settings', }, ], }, ]; } export function getLinkTypeAndHref( { path, tab = null, type, href = null } ) { return ( { 'wc-admin': { href: `admin.php?page=wc-admin&path=%2F${ path }`, linkType: 'wc-admin', }, 'wp-admin': { href: path, linkType: 'wp-admin', }, 'wc-settings': { href: `admin.php?page=wc-settings&tab=${ tab }`, linkType: 'wp-admin', }, }[ type ] || { href, linkType: 'external', } ); } export const generateExtensionLinks = ( links ) => { return links.reduce( ( acc, { icon, href, title } ) => { const url = new URL( href, window.location.href ); // We do not support extension links that take users away from the host. if ( url.origin === window.location.origin ) { acc.push( { icon, link: { href, linkType: 'wp-admin', }, title, listItemTag: 'quick-links-extension-link', } ); } return acc; }, [] ); }; export const StoreManagementLinks = () => { const shopUrl = getSetting( 'shopUrl' ); const extensionQuickLinks = generateExtensionLinks( applyFilters( 'woocommerce_admin_homescreen_quicklinks', [] ) ); const itemCategories = getItemsByCategory( shopUrl ); const extensionCategory = { title: __( 'Extensions', 'woocommerce-admin' ), items: extensionQuickLinks, }; const categories = extensionQuickLinks.length ? [ ...itemCategories, extensionCategory ] : itemCategories; return ( { __( 'Store management', 'woocommerce-admin' ) } { categories.map( ( category ) => { return ( { category.items.map( ( { icon, listItemTag, title, link: { href, linkType }, } ) => ( { recordEvent( 'home_quick_links_click', { task_name: listItemTag, } ); } } /> ) ) } ); } ) } ); };