Respect core settings for showing the Checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/7883)
* Respect core settings for showing the Checkout block * Add account creation option from core to checkout context provider * Fix TS errors * Adjust display logic of <LoginPrompt /> * Update assets/js/blocks/checkout/block.tsx Co-authored-by: Mike Jolley <mike.jolley@me.com> * Rename <LoginPrompt> to <MustLoginPrompt> * Show space between login text and login link * Fix TS error Co-authored-by: Mike Jolley <mike.jolley@me.com>
This commit is contained in:
parent
b02b7f9348
commit
7dfced254a
|
@ -47,7 +47,7 @@ export interface BlockErrorBoundaryProps extends BlockErrorBase {
|
|||
* Override the default error with a function that takes the error message and returns a React component
|
||||
*/
|
||||
renderError?: ( props: RenderErrorProps ) => React.ReactNode;
|
||||
showErrorMessage?: boolean;
|
||||
showErrorMessage?: boolean | undefined;
|
||||
}
|
||||
|
||||
export interface DerivedStateReturn {
|
||||
|
|
|
@ -4,6 +4,10 @@
|
|||
margin: 0 auto $gap;
|
||||
position: relative;
|
||||
|
||||
.wc-block-must-login-prompt {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.wc-block-components-main {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
|
|
|
@ -35,20 +35,20 @@ import type { Attributes } from './types';
|
|||
import { CheckoutBlockContext } from './context';
|
||||
import { hasNoticesOfType } from '../../utils/notices';
|
||||
|
||||
const LoginPrompt = () => {
|
||||
const MustLoginPrompt = () => {
|
||||
return (
|
||||
<>
|
||||
<div className="wc-block-must-login-prompt">
|
||||
{ __(
|
||||
'You must be logged in to checkout.',
|
||||
'woo-gutenberg-products-block'
|
||||
) }
|
||||
) }{ ' ' }
|
||||
<a href={ LOGIN_TO_CHECKOUT_URL }>
|
||||
{ __(
|
||||
'Click here to log in.',
|
||||
'woo-gutenberg-products-block'
|
||||
) }
|
||||
</a>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -84,22 +84,29 @@ const Checkout = ( {
|
|||
return <CheckoutOrderError />;
|
||||
}
|
||||
|
||||
/**
|
||||
* If checkout requires an account (guest checkout is turned off), render
|
||||
* a notice and prevent access to the checkout, unless we explicitly allow
|
||||
* account creation during the checkout flow.
|
||||
*/
|
||||
if (
|
||||
isLoginRequired( customerId ) &&
|
||||
getSetting( 'checkoutAllowsSignup', false )
|
||||
! getSetting( 'checkoutAllowsSignup', false )
|
||||
) {
|
||||
<LoginPrompt />;
|
||||
return <MustLoginPrompt />;
|
||||
}
|
||||
|
||||
return (
|
||||
<CheckoutBlockContext.Provider
|
||||
value={ {
|
||||
value={
|
||||
{
|
||||
showCompanyField,
|
||||
requireCompanyField,
|
||||
showApartmentField,
|
||||
showPhoneField,
|
||||
requirePhoneField,
|
||||
} }
|
||||
} as Attributes
|
||||
}
|
||||
>
|
||||
{ children }
|
||||
</CheckoutBlockContext.Provider>
|
||||
|
|
|
@ -9,7 +9,7 @@ import { allSettings } from './settings-init';
|
|||
export const ADMIN_URL = allSettings.adminUrl;
|
||||
export const COUNTRIES = allSettings.countries;
|
||||
export const CURRENCY = allSettings.currency;
|
||||
export const CURRENT_USER_IS_ADMIN = allSettings.currentUserIsAdmin;
|
||||
export const CURRENT_USER_IS_ADMIN = allSettings.currentUserIsAdmin as boolean;
|
||||
export const HOME_URL = allSettings.homeUrl;
|
||||
export const LOCALE = allSettings.locale;
|
||||
export const ORDER_STATUSES = allSettings.orderStatuses;
|
||||
|
|
Loading…
Reference in New Issue