diff --git a/frontend/src/app/(home)/page.tsx b/frontend/src/app/(home)/page.tsx
index 08b6dcac..2c1e96d2 100644
--- a/frontend/src/app/(home)/page.tsx
+++ b/frontend/src/app/(home)/page.tsx
@@ -24,7 +24,9 @@ export default function Home() {
{/* */}
{/* */}
-
+
diff --git a/frontend/src/components/home/sections/pricing-section.tsx b/frontend/src/components/home/sections/pricing-section.tsx
index 9f6af4c2..961a7144 100644
--- a/frontend/src/components/home/sections/pricing-section.tsx
+++ b/frontend/src/components/home/sections/pricing-section.tsx
@@ -5,16 +5,8 @@ import type { PricingTier } from '@/lib/home';
import { siteConfig } from '@/lib/home';
import { cn } from '@/lib/utils';
import { motion } from 'motion/react';
-import { useState, useEffect, useRef } from 'react';
+import { useState, useEffect } from 'react';
import { CheckIcon } from 'lucide-react';
-import Link from 'next/link';
-import {
- Select,
- SelectContent,
- SelectItem,
- SelectTrigger,
- SelectValue,
-} from '@/components/ui/select';
import { Button } from '@/components/ui/button';
import {
createCheckoutSession,
@@ -26,7 +18,6 @@ import { isLocalMode } from '@/lib/config';
import { useSubscription } from '@/hooks/react-query';
// Constants
-const DEFAULT_SELECTED_PLAN = '$50';
export const SUBSCRIPTION_PLANS = {
FREE: 'free',
PRO: 'base',
@@ -53,16 +44,6 @@ interface PriceDisplayProps {
isCompact?: boolean;
}
-interface CustomPriceDisplayProps {
- price: string;
-}
-
-interface UpgradePlan {
- hours: string;
- price: string;
- stripePriceId: string;
-}
-
interface PricingTierProps {
tier: PricingTier;
isCompact?: boolean;
@@ -142,24 +123,6 @@ function PriceDisplay({ price, isCompact }: PriceDisplayProps) {
);
}
-function CustomPriceDisplay({ price }: CustomPriceDisplayProps) {
- return (
-
- {price}
-
- );
-}
-
function PricingTier({
tier,
isCompact = false,
@@ -173,37 +136,7 @@ function PricingTier({
returnUrl,
insideDialog = false,
}: PricingTierProps) {
- const [localSelectedPlan, setLocalSelectedPlan] = useState(
- selectedPlan || DEFAULT_SELECTED_PLAN,
- );
- const hasInitialized = useRef(false);
-
- // Auto-select the correct plan only on initial load
- useEffect(() => {
- if (
- !hasInitialized.current &&
- tier.name === 'Custom' &&
- tier.upgradePlans &&
- currentSubscription?.price_id
- ) {
- const matchingPlan = tier.upgradePlans.find(
- (plan) => plan.stripePriceId === currentSubscription.price_id,
- );
- if (matchingPlan) {
- setLocalSelectedPlan(matchingPlan.price);
- }
- hasInitialized.current = true;
- }
- }, [currentSubscription, tier.name, tier.upgradePlans]);
-
- // Only refetch when plan is selected
- const handlePlanSelect = (value: string) => {
- setLocalSelectedPlan(value);
- if (tier.name === 'Custom' && onSubscriptionUpdate) {
- onSubscriptionUpdate();
- }
- };
-
+ // Auto-select the correct plan only on initial load - simplified since no more Custom tier
const handleSubscribe = async (planStripePriceId: string) => {
if (!isAuthenticated) {
window.location.href = '/auth';
@@ -215,22 +148,11 @@ function PricingTier({
}
try {
- // For custom tier, get the selected plan's stripePriceId
- let finalPriceId = planStripePriceId;
- if (tier.name === 'Custom' && tier.upgradePlans) {
- const selectedPlan = tier.upgradePlans.find(
- (plan) => plan.price === localSelectedPlan,
- );
- if (selectedPlan?.stripePriceId) {
- finalPriceId = selectedPlan.stripePriceId;
- }
- }
-
- onPlanSelect?.(finalPriceId);
+ onPlanSelect?.(planStripePriceId);
const response: CreateCheckoutSessionResponse =
await createCheckoutSession({
- price_id: finalPriceId,
+ price_id: planStripePriceId,
success_url: returnUrl,
cancel_url: returnUrl,
});
@@ -295,67 +217,12 @@ function PricingTier({
}
};
- const getPriceValue = (
- tier: (typeof siteConfig.cloudPricingItems)[0],
- selectedPrice?: string,
- ): string => {
- if (tier.upgradePlans && selectedPrice) {
- const plan = tier.upgradePlans.find(
- (plan) => plan.price === selectedPrice,
- );
- if (plan) {
- return plan.price;
- }
- }
- return tier.price;
- };
-
- const getSelectedPlanPriceId = (
- tier: (typeof siteConfig.cloudPricingItems)[0],
- ): string => {
- if (tier.name === 'Custom' && tier.upgradePlans) {
- const selectedPlan = tier.upgradePlans.find(
- (plan) => plan.price === localSelectedPlan,
- );
- return selectedPlan?.stripePriceId || tier.stripePriceId;
- }
- return tier.stripePriceId;
- };
-
- const getSelectedPlanPrice = (
- tier: (typeof siteConfig.cloudPricingItems)[0],
- ): string => {
- if (tier.name === 'Custom' && tier.upgradePlans) {
- const selectedPlan = tier.upgradePlans.find(
- (plan) => plan.price === localSelectedPlan,
- );
- return selectedPlan?.price || tier.price;
- }
- return tier.price;
- };
-
- const tierPriceId = getSelectedPlanPriceId(tier);
+ const tierPriceId = tier.stripePriceId;
const isCurrentActivePlan =
- isAuthenticated &&
- // For custom tier, check if the selected plan matches the current subscription
- (tier.name === 'Custom'
- ? tier.upgradePlans?.some(
- (plan) =>
- plan.price === localSelectedPlan &&
- plan.stripePriceId === currentSubscription?.price_id,
- )
- : currentSubscription?.price_id === tierPriceId);
+ isAuthenticated && currentSubscription?.price_id === tierPriceId;
const isScheduled = isAuthenticated && currentSubscription?.has_schedule;
const isScheduledTargetPlan =
- isScheduled &&
- // For custom tier, check if the selected plan matches the scheduled subscription
- (tier.name === 'Custom'
- ? tier.upgradePlans?.some(
- (plan) =>
- plan.price === localSelectedPlan &&
- plan.stripePriceId === currentSubscription?.scheduled_price_id,
- )
- : currentSubscription?.scheduled_price_id === tierPriceId);
+ isScheduled && currentSubscription?.scheduled_price_id === tierPriceId;
const isPlanLoading = isLoading[tierPriceId];
let buttonText = isAuthenticated ? 'Select Plan' : 'Try Free';
@@ -402,41 +269,15 @@ function PricingTier({
);
} else {
- // For custom tier, find the current plan in upgradePlans
- const currentTier =
- tier.name === 'Custom' && tier.upgradePlans
- ? tier.upgradePlans.find(
- (p) => p.stripePriceId === currentSubscription?.price_id,
- )
- : siteConfig.cloudPricingItems.find(
- (p) => p.stripePriceId === currentSubscription?.price_id,
- );
-
- // Find the highest active plan from upgradePlans
- const highestActivePlan = siteConfig.cloudPricingItems.reduce(
- (highest, item) => {
- if (item.upgradePlans) {
- const activePlan = item.upgradePlans.find(
- (p) => p.stripePriceId === currentSubscription?.price_id,
- );
- if (activePlan) {
- const activeAmount =
- parseFloat(activePlan.price.replace(/[^\d.]/g, '') || '0') *
- 100;
- const highestAmount =
- parseFloat(highest?.price?.replace(/[^\d.]/g, '') || '0') * 100;
- return activeAmount > highestAmount ? activePlan : highest;
- }
- }
- return highest;
- },
- null as { price: string; hours: string; stripePriceId: string } | null,
+ // Find the current tier
+ const currentTier = siteConfig.cloudPricingItems.find(
+ (p) => p.stripePriceId === currentSubscription?.price_id,
);
const currentPriceString = currentSubscription
- ? highestActivePlan?.price || currentTier?.price || '$0'
+ ? currentTier?.price || '$0'
: '$0';
- const selectedPriceString = getSelectedPlanPrice(tier);
+ const selectedPriceString = tier.price;
const currentAmount =
currentPriceString === '$0'
? 0
@@ -492,14 +333,20 @@ function PricingTier({
return (
-
+
{tier.name}
{tier.isPopular && (
@@ -510,54 +357,20 @@ function PricingTier({
{isAuthenticated && statusBadge}
- {tier.name === 'Custom' ? (
-
- ) : (
-
- )}
+
{tier.price !== '$0' ? '/month' : ''}
{tier.description}
- {tier.name === 'Custom' && tier.upgradePlans ? (
-
-
- Customize your monthly usage
-
-
-
- {localSelectedPlan}/month
-
-
- ) : (
-
- {tier.price}/month
-
- )}
+
+ {tier.price}/month
+
-
+
{tier.features && tier.features.length > 0 && (
{tier.features.map((feature) => (
@@ -572,14 +385,17 @@ function PricingTier({
)}
-
+