diff --git a/server/src/internal/products/productUtils/compareProductUtils.ts b/server/src/internal/products/productUtils/compareProductUtils.ts index 27e773b78..407187337 100644 --- a/server/src/internal/products/productUtils/compareProductUtils.ts +++ b/server/src/internal/products/productUtils/compareProductUtils.ts @@ -142,6 +142,7 @@ export const productsAreSame = ({ item1: item, item2: similarItem!, features, + logDifferences: false, }); if (!same) { diff --git a/shared/utils/productV2Utils/compareProductUtils.ts/compareItemUtils.ts b/shared/utils/productV2Utils/compareProductUtils.ts/compareItemUtils.ts index 6518d3fa2..ff03d289d 100644 --- a/shared/utils/productV2Utils/compareProductUtils.ts/compareItemUtils.ts +++ b/shared/utils/productV2Utils/compareProductUtils.ts/compareItemUtils.ts @@ -105,9 +105,11 @@ const tiersAreSame = ( export const featureItemsAreSame = ({ item1, item2, + logDifferences = false, }: { item1: FeatureItem; item2: FeatureItem; + logDifferences?: boolean; }) => { const checks = { feature_id: { @@ -135,15 +137,22 @@ export const featureItemsAreSame = ({ item1.reset_usage_when_enabled == item2.reset_usage_when_enabled, message: `Reset usage when enabled different: ${item1.reset_usage_when_enabled} !== ${item2.reset_usage_when_enabled}`, }, - config: { - condition: JSON.stringify(item1.config) === JSON.stringify(item2.config), - message: `Config different: ${JSON.stringify(item1.config)} !== ${JSON.stringify(item2.config)}`, + rollover_config: { + condition: rolloversAreSame({ + rollover1: item1.config?.rollover || undefined, + rollover2: item2.config?.rollover || undefined, + }), + message: `Rollover config different: ${JSON.stringify(item1.config?.rollover)} !== ${JSON.stringify(item2.config?.rollover)}`, }, + // config: { + // condition: JSON.stringify(item1.config) === JSON.stringify(item2.config), + // message: `Config different: ${JSON.stringify(item1.config)} !== ${JSON.stringify(item2.config)}`, + // }, }; const same = Object.values(checks).every((d) => d.condition); - if (!same) { + if (!same && logDifferences) { console.log( "Feature items different:", Object.values(checks) @@ -158,16 +167,18 @@ export const featureItemsAreSame = ({ export const priceItemsAreSame = ({ item1, item2, + logDifferences = false, }: { item1: PriceItem; item2: PriceItem; + logDifferences?: boolean; }) => { const same = item1.price === item2.price && item1.interval == item2.interval && (item1.interval_count || 1) == (item2.interval_count || 1); - if (!same) { + if (!same && logDifferences) { console.log(`Price items different: ${item1.price}`); } @@ -210,9 +221,11 @@ const rolloversAreSame = ({ export const featurePriceItemsAreSame = ({ item1, item2, + logDifferences = false, }: { item1: FeaturePriceItem; item2: FeaturePriceItem; + logDifferences?: boolean; }) => { // console.log("Item 1 config:", item1.config); // console.log("Item 2 config:", item2.config); @@ -297,7 +310,7 @@ export const featurePriceItemsAreSame = ({ const pricesChanged = Object.values(pricesSame).some((d) => !d.condition); - if (!same) { + if (!same && logDifferences) { console.log( "Feature price items different:", Object.values(entsSame) @@ -319,10 +332,12 @@ export const itemsAreSame = ({ item1, item2, features, + logDifferences = false, }: { item1: ProductItem; item2: ProductItem; features?: Feature[]; + logDifferences?: boolean; }) => { // 1. If feature item let same = false; @@ -339,6 +354,7 @@ export const itemsAreSame = ({ same = featureItemsAreSame({ item1: item1 as FeatureItem, item2: item2 as FeatureItem, + logDifferences, }); pricesChanged = false; @@ -356,6 +372,7 @@ export const itemsAreSame = ({ featurePriceItemsAreSame({ item1: item1 as FeaturePriceItem, item2: item2 as FeaturePriceItem, + logDifferences, }); same = same_; @@ -377,6 +394,7 @@ export const itemsAreSame = ({ same = priceItemsAreSame({ item1: item1 as PriceItem, item2: item2 as PriceItem, + logDifferences, }); if (!same) { pricesChanged = true; diff --git a/shared/utils/productV2Utils/compareProductUtils.ts/compareProductUtils.ts b/shared/utils/productV2Utils/compareProductUtils.ts/compareProductUtils.ts index c513bfe46..22baf8322 100644 --- a/shared/utils/productV2Utils/compareProductUtils.ts/compareProductUtils.ts +++ b/shared/utils/productV2Utils/compareProductUtils.ts/compareProductUtils.ts @@ -190,6 +190,7 @@ export const productsAreSame = ({ item1: item, item2: similarItem, features, + logDifferences: false, }); if (!same) { diff --git a/vite/src/components/autumn/pricing-table-preview.tsx b/vite/src/components/autumn/pricing-table-preview.tsx index 3b7acd421..9fe95e99e 100644 --- a/vite/src/components/autumn/pricing-table-preview.tsx +++ b/vite/src/components/autumn/pricing-table-preview.tsx @@ -73,7 +73,7 @@ export default function PricingTablePreview({ } else if (productCount === 2) { return "flex flex-col gap-6 max-w-2xl mx-auto px-4 sm:grid sm:grid-cols-2 sm:flex-none"; // Vertical on mobile, 2 columns on sm+ } else { - return "flex flex-col gap-6 max-w-7xl mx-auto px-4 sm:grid md:grid-cols-2 xl:grid-cols-3 sm:flex-none"; // Vertical on mobile, 2 columns on sm+, 3 on lg+ + return "flex flex-col gap-6 max-w-7xl mx-auto px-4 sm:grid lg:grid-cols-2 2xl:grid-cols-3 sm:flex-none"; // Vertical on mobile, 2 columns on sm+, 3 on lg+ } }; diff --git a/vite/src/views/onboarding3/components/OnboardingStepRenderer.tsx b/vite/src/views/onboarding3/components/OnboardingStepRenderer.tsx index e84585142..83abf8a19 100644 --- a/vite/src/views/onboarding3/components/OnboardingStepRenderer.tsx +++ b/vite/src/views/onboarding3/components/OnboardingStepRenderer.tsx @@ -33,8 +33,10 @@ export const OnboardingStepRenderer = () => { const setProduct = useProductStore((s) => s.setProduct); const sheetType = useSheetStore((s) => s.type); const itemId = useSheetStore((s) => s.itemId); + const [trackResponse, setTrackResponse] = useState(null); const [checkResponse, setCheckResponse] = useState(null); + const [lastUsedFeatureId, setLastUsedFeatureId] = useState< string | undefined >(undefined); diff --git a/vite/src/views/onboarding3/components/playground-step/AvailableFeatures.tsx b/vite/src/views/onboarding3/components/playground-step/AvailableFeatures.tsx index f373d950d..a46d7de05 100644 --- a/vite/src/views/onboarding3/components/playground-step/AvailableFeatures.tsx +++ b/vite/src/views/onboarding3/components/playground-step/AvailableFeatures.tsx @@ -1,6 +1,6 @@ import { FeatureType } from "@autumn/shared"; import { ArrowRightIcon } from "@phosphor-icons/react"; -import { useCustomer } from "autumn-js/react"; +import { PaywallDialog, useCustomer } from "autumn-js/react"; import { useState } from "react"; import { Button } from "@/components/v2/buttons/Button"; import { Input } from "@/components/v2/inputs/Input"; @@ -104,11 +104,11 @@ export const AvailableFeatures = ({ const featureId = customer?.features[x].id; // Check the feature access - const { data: checkResponse, error: checkError } = - await check({ - featureId: featureId, - requiredBalance: value, - }); + const { data: checkResponse, error: checkError } = check({ + featureId: featureId, + requiredBalance: value, + dialog: PaywallDialog, + }); if (!checkError && checkResponse && onCheckSuccess) { onCheckSuccess(checkResponse); @@ -118,6 +118,8 @@ export const AvailableFeatures = ({ onFeatureUsed(featureId); } + if (!checkResponse?.allowed) return; + // Track the usage const { data, error } = await track({ featureId: featureId, @@ -135,8 +137,8 @@ export const AvailableFeatures = ({ )) ) : ( - Your current plan doesn't have any features. Try purchasing a - plan in the preview first. + Your current plan doesn't have any features. Try purchasing a plan + in the preview first. )} diff --git a/vite/src/views/onboarding3/components/playground-step/QuickStartCodeGroup.tsx b/vite/src/views/onboarding3/components/playground-step/QuickStartCodeGroup.tsx index 5867dfec3..197961491 100644 --- a/vite/src/views/onboarding3/components/playground-step/QuickStartCodeGroup.tsx +++ b/vite/src/views/onboarding3/components/playground-step/QuickStartCodeGroup.tsx @@ -152,10 +152,7 @@ export const QuickStartCodeGroup = ({ snippets={snippets.track} trackResponse={trackResponse} /> - + diff --git a/vite/src/views/onboarding3/utils/completionStepCode.ts b/vite/src/views/onboarding3/utils/completionStepCode.ts index 6ad79a1cc..65edce9d1 100644 --- a/vite/src/views/onboarding3/utils/completionStepCode.ts +++ b/vite/src/views/onboarding3/utils/completionStepCode.ts @@ -11,10 +11,14 @@ export const getCodeSnippets = ( allowed: { react: `import { useCustomer } from 'autumn-js/react'; -const { allowed } = useCustomer(); +const { check } = useCustomer(); const handleCheckFeature = async () => { - if ( !allowed({ featureId: '${actualFeatureId}' }) ) { + const { data } = await check({ + featureId: '${actualFeatureId}', + requiredQuantity: 1 + }); + if (!data?.allowed) { alert('Feature not allowed'); } }`, @@ -24,7 +28,7 @@ const autumn = new Autumn({ apiKey: process.env.AUTUMN_API_KEY }); -const allowed = await autumn.check({ +const { data, error } = await autumn.check({ customerId: 'cust_123', featureId: '${actualFeatureId}' });`, diff --git a/vite/src/views/products/plan/components/EditPlanHeader.tsx b/vite/src/views/products/plan/components/EditPlanHeader.tsx index 49a1c5e7c..2acba0d24 100644 --- a/vite/src/views/products/plan/components/EditPlanHeader.tsx +++ b/vite/src/views/products/plan/components/EditPlanHeader.tsx @@ -2,7 +2,6 @@ import { UserIcon } from "@phosphor-icons/react"; import { useState } from "react"; import { toast } from "sonner"; import { AdminHover } from "@/components/general/AdminHover"; -import { Badge } from "@/components/v2/badges/Badge"; import { IconBadge } from "@/components/v2/badges/IconBadge"; import V2Breadcrumb from "@/components/v2/breadcrumb"; import { Button } from "@/components/v2/buttons/Button"; @@ -18,7 +17,6 @@ import { useSheetStore } from "@/hooks/stores/useSheetStore"; import { useAxiosInstance } from "@/services/useAxiosInstance"; import { getBackendErr } from "@/utils/genUtils"; import { isOneOffProduct } from "@/utils/product/priceUtils"; -import { PlanTypeBadge } from "../../components/PlanTypeBadge"; import { useMigrationsQuery } from "../../product/hooks/queries/useMigrationsQuery.tsx.tsx"; import { useProductCountsQuery } from "../../product/hooks/queries/useProductCountsQuery"; import { @@ -143,12 +141,12 @@ export const EditPlanHeader = () => { size="sm" /> )} - {product.is_default && Default} - {product.is_add_on && Add-on} + {/* {product.is_default && Default} + {product.is_add_on && Add-on} */} }> {counts?.active || 0} - + {/* */} diff --git a/vite/src/views/products/plan/components/plan-card/PlanCardToolbar.tsx b/vite/src/views/products/plan/components/plan-card/PlanCardToolbar.tsx index 3192fcec9..241e6ffd6 100644 --- a/vite/src/views/products/plan/components/plan-card/PlanCardToolbar.tsx +++ b/vite/src/views/products/plan/components/plan-card/PlanCardToolbar.tsx @@ -52,28 +52,14 @@ export const PlanCardToolbar = ({ aria-label="Edit plan" variant="muted" disabled={editDisabled} - size="sm" - className={cn(isEditingPlan && "btn-secondary-active !opacity-100 ")} + // size="sm" + className={cn( + // "text-body", + isEditingPlan && "btn-secondary-active !opacity-100 ", + )} > - Edit Details + Plan Details - - {/* {product?.archived ? ( - - ) : ( - } - onClick={() => setDeleteOpen(true)} - aria-label="Delete plan" - variant="muted" - iconOrientation="center" - disabled={deleteDisabled} - title={deleteDisabled && deleteTooltip ? deleteTooltip : undefined} - className={cn(deleteDisabled && "opacity-50 cursor-not-allowed")} - /> - )} */} );