♻️ Move JS configuration for styling page

This commit is contained in:
Philipp Stracker 2025-01-13 19:03:33 +01:00
parent 63f417d7d2
commit 0b624eb8bc
No known key found for this signature in database
5 changed files with 155 additions and 83 deletions

View file

@ -1,10 +1,9 @@
export const BUSINESS_TYPES = {
CASUAL_SELLER: 'casual_seller',
BUSINESS: 'business',
};
export { BUSINESS_TYPES, PRODUCT_TYPES } from './onboarding/constants';
export const PRODUCT_TYPES = {
VIRTUAL: 'virtual',
PHYSICAL: 'physical',
SUBSCRIPTIONS: 'subscriptions',
};
export {
STYLING_LOCATIONS,
STYLING_LABELS,
STYLING_COLORS,
STYLING_LAYOUTS,
STYLING_SHAPES,
} from './styling/constants';

View file

@ -8,7 +8,7 @@
export const STORE_NAME = 'wc/paypal/onboarding';
/**
* REST path to hydrate data of this module by loading data from the WP DB..
* REST path to hydrate data of this module by loading data from the WP DB.
*
* Used by: Resolvers
* See: OnboardingRestEndpoint.php
@ -26,3 +26,24 @@ export const REST_HYDRATE_PATH = '/wc/v3/wc_paypal/onboarding';
* @type {string}
*/
export const REST_PERSIST_PATH = '/wc/v3/wc_paypal/onboarding';
/**
* Onboarding options for StepBusiness
*
* @type {Object}
*/
export const BUSINESS_TYPES = {
CASUAL_SELLER: 'casual_seller',
BUSINESS: 'business',
};
/**
* Onboarding options for StepProducts
*
* @type {Object}
*/
export const PRODUCT_TYPES = {
VIRTUAL: 'virtual',
PHYSICAL: 'physical',
SUBSCRIPTIONS: 'subscriptions',
};

View file

@ -96,67 +96,3 @@ export const paymentMethodOptions = [
label: __( 'Apple Pay', 'woocommerce-paypal-payments' ),
},
];
export const buttonLabelOptions = [
{
value: 'paypal',
label: __( 'PayPal', 'woocommerce-paypal-payments' ),
},
{
value: 'checkout',
label: __( 'Checkout', 'woocommerce-paypal-payments' ),
},
{
value: 'buynow',
label: __( 'PayPal Buy Now', 'woocommerce-paypal-payments' ),
},
{
value: 'pay',
label: __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
},
];
export const colorOptions = [
{
value: 'gold',
label: __( 'Gold (Recommended)', 'woocommerce-paypal-payments' ),
},
{
value: 'blue',
label: __( 'Blue', 'woocommerce-paypal-payments' ),
},
{
value: 'silver',
label: __( 'Silver', 'woocommerce-paypal-payments' ),
},
{
value: 'black',
label: __( 'Black', 'woocommerce-paypal-payments' ),
},
{
value: 'white',
label: __( 'White', 'woocommerce-paypal-payments' ),
},
];
export const buttonLayoutOptions = [
{
label: __( 'Vertical', 'woocommerce-paypal-payments' ),
value: 'vertical',
},
{
label: __( 'Horizontal', 'woocommerce-paypal-payments' ),
value: 'horizontal',
},
];
export const shapeOptions = [
{
value: 'pill',
label: __( 'Pill', 'woocommerce-paypal-payments' ),
},
{
value: 'rect',
label: __( 'Rectangle', 'woocommerce-paypal-payments' ),
},
];

View file

@ -1,3 +1,5 @@
import { __ } from '@wordpress/i18n';
/**
* Name of the Redux store module.
*
@ -26,3 +28,115 @@ export const REST_HYDRATE_PATH = '/wc/v3/wc_paypal/styling';
* @type {string}
*/
export const REST_PERSIST_PATH = '/wc/v3/wc_paypal/styling';
export const STYLING_LOCATIONS = {
cart: {
value: 'cart',
label: __( 'Cart', 'woocommerce-paypal-payments' ),
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">Cart page</a> and select which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
link: '#',
},
'classic-checkout': {
value: 'classic-checkout',
label: __( 'Classic Checkout', 'woocommerce-paypal-payments' ),
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">Classic Checkout page</a> and choose which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
link: '#',
},
'express-checkout': {
value: 'express-checkout',
label: __( 'Express Checkout', 'woocommerce-paypal-payments' ),
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">Express Checkout location</a> and choose which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
link: '#',
},
'mini-cart': {
value: 'mini-cart',
label: __( 'Mini Cart', 'woocommerce-paypel-payements' ),
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">Mini Cart</a> and choose which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
link: '#',
},
'product-page': {
value: 'product-page',
label: __( 'Product Page', 'woocommerce-paypal-payments' ),
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">Product Page</a> and choose which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
link: '#',
},
};
export const STYLING_LABELS = {
paypal: {
value: 'paypal',
label: __( 'PayPal', 'woocommerce-paypal-payments' ),
},
checkout: {
value: 'checkout',
label: __( 'Checkout', 'woocommerce-paypal-payments' ),
},
buynow: {
value: 'buynow',
label: __( 'PayPal Buy Now', 'woocommerce-paypal-payments' ),
},
pay: {
value: 'pay',
label: __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
},
};
export const STYLING_COLORS = {
gold: {
value: 'gold',
label: __( 'Gold (Recommended)', 'woocommerce-paypal-payments' ),
},
blue: {
value: 'blue',
label: __( 'Blue', 'woocommerce-paypal-payments' ),
},
silver: {
value: 'silver',
label: __( 'Silver', 'woocommerce-paypal-payments' ),
},
black: {
value: 'black',
label: __( 'Black', 'woocommerce-paypal-payments' ),
},
white: {
value: 'white',
label: __( 'White', 'woocommerce-paypal-payments' ),
},
};
export const STYLING_LAYOUTS = {
vertical: {
value: 'vertical',
label: __( 'Vertical', 'woocommerce-paypal-payments' ),
},
horizontal: {
value: 'horizontal',
label: __( 'Horizontal', 'woocommerce-paypal-payments' ),
},
};
export const STYLING_SHAPES = {
pill: {
value: 'pill',
label: __( 'Pill', 'woocommerce-paypal-payments' ),
},
rect: {
value: 'rect',
label: __( 'Rectangle', 'woocommerce-paypal-payments' ),
},
};