From 359617462ab2c78d53e8c7f39ec5e9c8a9ce30f4 Mon Sep 17 00:00:00 2001 From: Ronald Langeveld Date: Wed, 23 Aug 2023 10:48:20 +0200 Subject: [PATCH] Fixed portal not passing all params in preview - Admin X (#17783) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit refs https://github.com/TryGhost/Product/issues/3349 - Previously it detected members as being disabled altogether, which wasn't the case. - This resolves that by passing in a few extra required params to have Portal loading properly --- ### 🤖 Generated by Copilot at d3cccab This pull request enhances the portal preview feature by adding new parameters to the iframe URL for the portal settings and pricing tiers. It also cleans up some code in `PortalFrame.tsx` for better readability and type safety. --- .../membership/portal/PortalFrame.tsx | 62 +++++++++---------- 1 file changed, 30 insertions(+), 32 deletions(-) diff --git a/apps/admin-x-settings/src/components/settings/membership/portal/PortalFrame.tsx b/apps/admin-x-settings/src/components/settings/membership/portal/PortalFrame.tsx index 8fe03cc96b..126563eabb 100644 --- a/apps/admin-x-settings/src/components/settings/membership/portal/PortalFrame.tsx +++ b/apps/admin-x-settings/src/components/settings/membership/portal/PortalFrame.tsx @@ -19,55 +19,53 @@ function getPortalPreviewUrl({settings, tiers, siteData, selectedTab}: { if (!siteData?.url) { return null; } - let portalTiers = tiers.filter((t) => { return t.visibility === 'public' && t.type === 'paid'; }).map(t => t.id); const baseUrl = siteData.url.replace(/\/$/, ''); - const portalBase = '/#/portal/preview'; + const portalBase = '/?v=modal-portal-settings#/portal/preview'; const settingsParam = new URLSearchParams(); - const signupButtonText = getSettingValue(settings, 'portal_button_signup_text') || ''; - let buttonIcon = getSettingValue(settings, 'portal_button_icon') as string; - if (!buttonIcon) { - buttonIcon = 'icon-1'; - } + let buttonIcon = getSettingValue(settings, 'portal_button_icon') as string || 'icon-1'; const portalPlans: string[] = JSON.parse(getSettingValue(settings, 'portal_plans') as string); - const isFreeChecked = portalPlans.includes('free'); - const isMonthlyChecked = portalPlans.includes('monthly'); - const isYearlyChecked = portalPlans.includes('yearly'); - const portalButton = getSettingValue(settings, 'portal_button') || false; - const portalName = getSettingValue(settings, 'portal_name'); - const portalButtonStyle = getSettingValue(settings, 'portal_button_style') as string; - const signupCheckboxRequired = getSettingValue(settings, 'portal_signup_checkbox_required') as boolean; - const portalSignupTermsHtml = getSettingValue(settings, 'portal_signup_terms_html') as string || ''; - let page = 'signup'; - if (selectedTab === 'account') { - page = 'accountHome'; - } + const isFreeChecked = portalPlans.includes('free') ? 'true' : 'false'; + const isMonthlyChecked = portalPlans.includes('monthly') ? 'true' : 'false'; + const isYearlyChecked = portalPlans.includes('yearly') ? 'true' : 'false'; + const portalButton = getSettingValue(settings, 'portal_button') === true ? 'true' : 'false'; // Assuming a boolean + const portalName = getSettingValue(settings, 'portal_name') as boolean; + const signupCheckboxRequired = getSettingValue(settings, 'portal_signup_checkbox_required') ? 'true' : 'false'; // Assuming a boolean + const portalSignupTermsHtml = getSettingValue(settings, 'portal_signup_terms_html') || ''; + let page = selectedTab === 'account' ? 'accountHome' : 'signup'; - settingsParam.append('button', `${portalButton}`); - settingsParam.append('name', `${portalName}`); - settingsParam.append('isFree', `${isFreeChecked}`); - settingsParam.append('isMonthly', `${isMonthlyChecked}`); - settingsParam.append('isYearly', `${isYearlyChecked}`); + settingsParam.append('button', portalButton); + settingsParam.append('name', portalName ? 'true' : 'false'); + settingsParam.append('isFree', isFreeChecked); + settingsParam.append('isMonthly', isMonthlyChecked); + settingsParam.append('isYearly', isYearlyChecked); settingsParam.append('page', page); settingsParam.append('buttonIcon', encodeURIComponent(buttonIcon)); settingsParam.append('signupButtonText', encodeURIComponent(signupButtonText)); - settingsParam.append('membersSignupAccess', 'true'); + settingsParam.append('membersSignupAccess', 'all'); settingsParam.append('allowSelfSignup', 'true'); - settingsParam.append('signupTermsHtml', portalSignupTermsHtml); - settingsParam.append('signupCheckboxRequired', `${signupCheckboxRequired}`); + settingsParam.append('signupTermsHtml', portalSignupTermsHtml.toString()); + settingsParam.append('signupCheckboxRequired', signupCheckboxRequired); - if (portalTiers) { - const portalTiersList = portalTiers.join(','); - settingsParam.append('portalProducts', encodeURIComponent(portalTiersList)); + if (portalTiers && portalTiers.length) { + settingsParam.append('portalProducts', encodeURIComponent(portalTiers.join(','))); // assuming that it might be more than 1 } - settingsParam.append('accentColor', encodeURIComponent(`${getSettingValue(settings, 'accent_color')}`)); + if (portalPlans && portalPlans.length) { + settingsParam.append('portalPrices', encodeURIComponent(portalPlans.join(','))); + } - if (getSettingValue(settings, 'portal_button_style')) { + const accentColor = getSettingValue(settings, 'accent_color'); + if (accentColor !== undefined && accentColor !== null) { + settingsParam.append('accentColor', encodeURIComponent(accentColor)); + } + + const portalButtonStyle = getSettingValue(settings, 'portal_button_style'); + if (portalButtonStyle) { settingsParam.append('buttonStyle', encodeURIComponent(portalButtonStyle)); }