ENG-767 Offers cannot be created if there are no active paid tiers (#19900)
This commit is contained in:
parent
5477d70a0c
commit
2798a8cd09
@ -57,15 +57,34 @@ const Offers: React.FC<{ keywords: string[] }> = ({keywords}) => {
|
||||
updateRoute('offers/new');
|
||||
};
|
||||
|
||||
const openTiers = () => {
|
||||
updateRoute('/tiers');
|
||||
};
|
||||
|
||||
const goToOfferEdit = (offerId: string) => {
|
||||
sessionStorage.setItem('editOfferPageSource', 'offers');
|
||||
updateRoute(`offers/edit/${offerId}`);
|
||||
};
|
||||
|
||||
let offerButtonText = 'Manage offers';
|
||||
let offerButtonLink = openOfferListModal;
|
||||
let descriptionButtonText = 'Learn more';
|
||||
if (allOffers.length > 0) {
|
||||
offerButtonText = 'Manage offers';
|
||||
offerButtonLink = openOfferListModal;
|
||||
} else if (paidActiveTiers.length === 0 && allOffers.length === 0) {
|
||||
offerButtonText = '';
|
||||
offerButtonLink = openTiers;
|
||||
descriptionButtonText = '';
|
||||
} else if (paidActiveTiers.length > 0 && allOffers.length === 0) {
|
||||
offerButtonText = 'Add offers';
|
||||
offerButtonLink = openAddModal;
|
||||
}
|
||||
|
||||
return (
|
||||
<TopLevelGroup
|
||||
customButtons={<Button color='green' disabled={!checkStripeEnabled(settings, config)} label={allOffers.length > 0 ? 'Manage offers' : 'Add offer'} link linkWithPadding onClick={allOffers.length > 0 ? openOfferListModal : openAddModal}/>}
|
||||
description={<>Create discounts & coupons to boost new subscriptions. {allOffers.length === 0 && <><br /><a className='text-green' href="https://ghost.org/help/offers" rel="noopener noreferrer" target="_blank">Learn more</a></>}</>}
|
||||
customButtons={<Button color='green' disabled={!checkStripeEnabled(settings, config)} label={offerButtonText} link linkWithPadding onClick={offerButtonLink}/>}
|
||||
description={<>Create discounts & coupons to boost new subscriptions. {allOffers.length === 0 && <><br /><a className='text-green' href="https://ghost.org/help/offers" rel="noopener noreferrer" target="_blank">{descriptionButtonText}</a></>}</>}
|
||||
keywords={keywords}
|
||||
navid='offers'
|
||||
testId='offers'
|
||||
@ -94,6 +113,17 @@ const Offers: React.FC<{ keywords: string[] }> = ({keywords}) => {
|
||||
</div> :
|
||||
null
|
||||
}
|
||||
{paidActiveTiers.length === 0 && allOffers.length === 0 ?
|
||||
(<div>
|
||||
<div className='items-center-mt-1 flex justify-between'>
|
||||
<>You must have an active tier to create an offer.</>
|
||||
</div>
|
||||
<div className='items-center-mt-1 flex justify-between'>
|
||||
<Button color='green' label='Manage tiers' link linkWithPadding onClick={openTiers} />
|
||||
</div>
|
||||
</div>
|
||||
) : ''
|
||||
}
|
||||
</TopLevelGroup>
|
||||
);
|
||||
};
|
||||
|
@ -1,9 +1,9 @@
|
||||
import {Button, Tab, TabView} from '@tryghost/admin-x-design-system';
|
||||
import {ButtonGroup, ButtonProps} from '@tryghost/admin-x-design-system';
|
||||
import {ButtonGroup, ButtonProps, showToast} from '@tryghost/admin-x-design-system';
|
||||
import {Modal} from '@tryghost/admin-x-design-system';
|
||||
import {NoValueLabel} from '@tryghost/admin-x-design-system';
|
||||
import {SortMenu} from '@tryghost/admin-x-design-system';
|
||||
import {Tier, useBrowseTiers} from '@tryghost/admin-x-framework/api/tiers';
|
||||
import {Tier, getPaidActiveTiers, useBrowseTiers} from '@tryghost/admin-x-framework/api/tiers';
|
||||
import {Tooltip} from '@tryghost/admin-x-design-system';
|
||||
import {currencyToDecimal, getSymbol} from '../../../../utils/currency';
|
||||
import {getHomepageUrl} from '@tryghost/admin-x-framework/api/site';
|
||||
@ -140,6 +140,8 @@ export const OffersIndexModal = () => {
|
||||
}
|
||||
});
|
||||
|
||||
const paidActiveTiers = getPaidActiveTiers(allTiers || []);
|
||||
|
||||
const listLayoutOutput = <div className='overflow-x-auto'>
|
||||
<table className='m-0 w-full'>
|
||||
{(selectedTab === 'active' && activeOffers.length > 0) || (selectedTab === 'archived' && archivedOffers.length > 0) ?
|
||||
@ -198,7 +200,16 @@ export const OffersIndexModal = () => {
|
||||
icon: 'add',
|
||||
label: 'New offer',
|
||||
color: 'green',
|
||||
onClick: () => updateRoute('offers/new')
|
||||
onClick: () => {
|
||||
if (paidActiveTiers.length === 0) {
|
||||
showToast({
|
||||
type: 'neutral',
|
||||
message: 'You must have an active tier to create an offer.'
|
||||
});
|
||||
} else {
|
||||
updateRoute('offers/new');
|
||||
}
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
|
@ -10,7 +10,8 @@ test.describe('Offers Modal', () => {
|
||||
test('Offers Modal is available', async ({page}) => {
|
||||
await mockApi({page, requests: {
|
||||
...globalDataRequests,
|
||||
browseSettings: {...globalDataRequests.browseSettings, response: settingsWithStripe}
|
||||
browseSettings: {...globalDataRequests.browseSettings, response: settingsWithStripe},
|
||||
browseTiers: {method: 'GET', path: '/tiers/', response: responseFixtures.tiers}
|
||||
}});
|
||||
await page.goto('/');
|
||||
const section = page.getByTestId('offers');
|
||||
|
Loading…
Reference in New Issue
Block a user