Hid tips and donation settings when Stripe is disabled

closes https://linear.app/tryghost/issue/PLG-178

- updated conditional to ensure we're ready for GA by showing when Stripe is enabled rather than only when the feature flag is enabled
This commit is contained in:
Kevin Ansfield 2024-08-20 18:37:40 +01:00
parent b01d4287ad
commit f08e4d4728
3 changed files with 18 additions and 4 deletions

View File

@ -186,7 +186,7 @@ const Sidebar: React.FC = () => {
<NavItem icon='heart' keywords={growthSearchKeywords.recommendations} navid='recommendations' title="Recommendations" onClick={handleSectionClick} />
<NavItem icon='emailfield' keywords={growthSearchKeywords.embedSignupForm} navid='embed-signup-form' title="Embeddable signup form" onClick={handleSectionClick} />
{hasStripeEnabled && <NavItem icon='discount' keywords={growthSearchKeywords.offers} navid='offers' title="Offers" onClick={handleSectionClick} />}
{hasTipsAndDonations && <NavItem icon='piggybank' keywords={growthSearchKeywords.tips} navid='tips-and-donations' title="Tips & donations" onClick={handleSectionClick} />}
{hasTipsAndDonations && hasStripeEnabled && <NavItem icon='piggybank' keywords={growthSearchKeywords.tips} navid='tips-and-donations' title="Tips & donations" onClick={handleSectionClick} />}
</SettingNavSection>
<SettingNavSection isVisible={checkVisible(Object.values(emailSearchKeywords).flat())} title="Email newsletter">

View File

@ -25,7 +25,7 @@ const GrowthSettings: React.FC = () => {
<Recommendations keywords={searchKeywords.recommendations} />
<EmbedSignupForm keywords={searchKeywords.embedSignupForm} />
{hasStripeEnabled && <Offers keywords={searchKeywords.offers} />}
{hasTipsAndDonations && <TipsAndDonations keywords={searchKeywords.tips} />}
{hasTipsAndDonations && hasStripeEnabled && <TipsAndDonations keywords={searchKeywords.tips} />}
</SearchableSection>
);
};

View File

@ -1,18 +1,32 @@
import {expect, test} from '@playwright/test';
import {globalDataRequests} from '../../utils/acceptance';
import {mockApi, toggleLabsFlag} from '@tryghost/admin-x-framework/test/acceptance';
import {mockApi, settingsWithStripe, toggleLabsFlag} from '@tryghost/admin-x-framework/test/acceptance';
test.describe('Tips and donations', () => {
test.beforeEach(async () => {
toggleLabsFlag('tipsAndDonations', true);
});
test('Shows suggested amount and shareable link', async ({page}) => {
test('Is not shown when Stripe is disabled', async ({page}) => {
await mockApi({page, requests: {...globalDataRequests}});
await page.goto('/');
await expect(page.locator('[data-setting-nav-item] #tips-and-donations')).not.toBeVisible();
await expect(page.getByTestId('tips-and-donations')).not.toBeVisible();
});
test('Shows suggested amount and shareable link when Stripe is enabled', async ({page}) => {
await mockApi({page, requests: {
...globalDataRequests,
browseSettings: {...globalDataRequests.browseSettings, response: settingsWithStripe}
}});
await page.goto('/');
const section = page.getByTestId('tips-and-donations');
await expect(page.locator('[data-setting-nav-item] #tips-and-donations')).toBeVisible();
await expect(section).toBeVisible();
await expect(section.getByTestId('suggested-amount')).toHaveText(/\$5/);
await expect(section.getByTestId('donate-url')).toHaveText('http://test.com/#/portal/support');
await expect(section.getByTestId('preview-shareable-link')).not.toBeVisible();