binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-4253] improvement: minor enhancements to billing page (#7160)

Browse source
This commit is contained in:
Prateek Shourya 2025-06-04 17:29:45 +05:30 • committed by GitHub
parent a0a45b7916
commit ef3ec7274c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 17 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web/core/components/license/modal/card/plan-upgrade.tsx
View file

@ -56,12 +56,14 @@ export const PlanUpgradeCard: FC<PlanUpgradeCardProps> = observer((props) => {
href={TALK_TO_SALES_URL} href={TALK_TO_SALES_URL}
isLoading={isLoading} isLoading={isLoading}
features={features} features={features}
product={product}
prices={prices} prices={prices}
upgradeLoaderType={upgradeLoaderType} upgradeLoaderType={upgradeLoaderType}
verticalFeatureList={verticalFeatureList} verticalFeatureList={verticalFeatureList}
extraFeatures={extraFeatures} extraFeatures={extraFeatures}
isSelfHosted={isSelfHosted} isSelfHosted={isSelfHosted}
isTrialAllowed={isTrialAllowed} isTrialAllowed={isTrialAllowed}
renderTrialButton={renderTrialButton}
/> />
); );
} }

18
web/core/components/license/modal/card/talk-to-sales.tsx
View file

@ -5,7 +5,7 @@ import { observer } from "mobx-react";
// types // types
import { EProductSubscriptionEnum } from "@plane/constants"; import { EProductSubscriptionEnum } from "@plane/constants";
// plane imports // plane imports
import { TSubscriptionPrice } from "@plane/types"; import { IPaymentProduct, TSubscriptionPrice } from "@plane/types";
import { getButtonStyling, Loader } from "@plane/ui"; import { getButtonStyling, Loader } from "@plane/ui";
import { cn } from "@plane/utils"; import { cn } from "@plane/utils";
// plane web imports // plane web imports
@ -18,12 +18,14 @@ export type TalkToSalesCardProps = {
href: string; href: string;
isLoading?: boolean; isLoading?: boolean;
features: string[]; features: string[];
product: IPaymentProduct | undefined;
prices: TSubscriptionPrice[]; prices: TSubscriptionPrice[];
upgradeLoaderType: Omit<EProductSubscriptionEnum, "FREE"> | undefined; upgradeLoaderType: Omit<EProductSubscriptionEnum, "FREE"> | undefined;
verticalFeatureList?: boolean; verticalFeatureList?: boolean;
extraFeatures?: string | React.ReactNode; extraFeatures?: string | React.ReactNode;
isSelfHosted: boolean; isSelfHosted: boolean;
isTrialAllowed: boolean; isTrialAllowed: boolean;
renderTrialButton?: (props: { productId: string | undefined; priceId: string | undefined }) => React.ReactNode;
}; };
export const TalkToSalesCard: FC<TalkToSalesCardProps> = observer((props) => { export const TalkToSalesCard: FC<TalkToSalesCardProps> = observer((props) => {
@ -31,6 +33,7 @@ export const TalkToSalesCard: FC<TalkToSalesCardProps> = observer((props) => {
planVariant, planVariant,
href, href,
features, features,
product,
prices, prices,
isLoading, isLoading,
verticalFeatureList = false, verticalFeatureList = false,
@ -38,6 +41,7 @@ export const TalkToSalesCard: FC<TalkToSalesCardProps> = observer((props) => {
upgradeLoaderType, upgradeLoaderType,
isSelfHosted, isSelfHosted,
isTrialAllowed, isTrialAllowed,
renderTrialButton,
} = props; } = props;
const renderPriceContent = (price: TSubscriptionPrice) => ( const renderPriceContent = (price: TSubscriptionPrice) => (
@ -47,7 +51,7 @@ export const TalkToSalesCard: FC<TalkToSalesCardProps> = observer((props) => {
</> </>
); );
const renderActionButton = () => { const renderActionButton = (price: TSubscriptionPrice) => {
const upgradeButtonStyle = const upgradeButtonStyle =
getUpgradeButtonStyle(planVariant, !!upgradeLoaderType) ?? getButtonStyling("primary", "lg", !!upgradeLoaderType); getUpgradeButtonStyle(planVariant, !!upgradeLoaderType) ?? getButtonStyling("primary", "lg", !!upgradeLoaderType);
@ -81,7 +85,15 @@ export const TalkToSalesCard: FC<TalkToSalesCardProps> = observer((props) => {
> >
Talk to Sales Talk to Sales
</a> </a>
{isTrialAllowed && !isSelfHosted && <div className="mt-4 h-4" />} {isTrialAllowed && !isSelfHosted && (
<div className="mt-4 h-4 transition-all duration-300 animate-fade-in">
{renderTrialButton &&
renderTrialButton({
productId: product?.id,
priceId: price.id,
})}
</div>
)}
</div> </div>
)} )}
</> </>