Disallow downgrades in package shop
Some checks failed
linter / quality (push) Has been cancelled
tests / ci (push) Has been cancelled
tests / ui (push) Has been cancelled

This commit is contained in:
Codex Agent
2026-01-12 11:45:12 +01:00
parent ab2cf3e023
commit 8f1d3a3eb6
5 changed files with 108 additions and 34 deletions

View File

@@ -2944,6 +2944,7 @@
"payNow": "Jetzt zahlen",
"errors": {
"checkout": "Checkout fehlgeschlagen"
}
},
"selectDisabled": "Nicht verfügbar"
}
}

View File

@@ -2948,6 +2948,7 @@
"payNow": "Pay Now",
"errors": {
"checkout": "Checkout failed"
}
},
"selectDisabled": "Not available"
}
}

View File

@@ -13,7 +13,7 @@ import { useAdminTheme } from './theme';
import { getPackages, createTenantPaddleCheckout, Package, getTenantPackagesOverview, TenantPackageSummary } from '../api';
import { getApiErrorMessage } from '../lib/apiError';
import { useQuery } from '@tanstack/react-query';
import { classifyPackageTier, selectRecommendedPackageId } from './lib/packageShop';
import { classifyPackageChange, selectRecommendedPackageId } from './lib/packageShop';
export default function MobilePackageShopPage() {
const { t } = useTranslation('management');
@@ -60,8 +60,7 @@ export default function MobilePackageShopPage() {
const activePackageId = inventory?.activePackage?.package_id ?? null;
const activeCatalogPackage = (catalog ?? []).find((pkg) => pkg.id === activePackageId) ?? null;
const activePrice = activeCatalogPackage?.price ?? null;
const recommendedPackageId = selectRecommendedPackageId(catalog ?? [], recommendedFeature, activePrice);
const recommendedPackageId = selectRecommendedPackageId(catalog ?? [], recommendedFeature, activeCatalogPackage);
// Merge and sort packages
const sortedPackages = [...(catalog || [])].sort((a, b) => {
@@ -101,7 +100,7 @@ export default function MobilePackageShopPage() {
const owned = inventory?.packages?.find(p => p.package_id === pkg.id);
const isActive = inventory?.activePackage?.package_id === pkg.id;
const isRecommended = recommendedPackageId ? pkg.id === recommendedPackageId : false;
const { isUpgrade, isDowngrade } = classifyPackageTier(pkg.price, activePrice);
const { isUpgrade, isDowngrade } = classifyPackageChange(pkg, activeCatalogPackage);
return (
<PackageShopCard
@@ -151,14 +150,15 @@ function PackageShopCard({
: t('shop.status.owned', 'Purchased'))
: null;
const isSubdued = Boolean(isDowngrade && !isActive);
const canSelect = !isDowngrade || isActive;
return (
<MobileCard
onPress={onSelect}
onPress={canSelect ? onSelect : undefined}
borderColor={isRecommended ? primary : (isActive ? '$green8' : border)}
borderWidth={isRecommended || isActive ? 2 : 1}
space="$3"
pressStyle={{ backgroundColor: accentSoft }}
pressStyle={canSelect ? { backgroundColor: accentSoft } : undefined}
backgroundColor={isActive ? '$green1' : undefined}
style={{ opacity: isSubdued ? 0.6 : 1 }}
>
@@ -211,9 +211,16 @@ function PackageShopCard({
</YStack>
<CTAButton
label={isActive ? t('shop.manage', 'Manage Plan') : t('shop.select', 'Select')}
onPress={onSelect}
tone={isActive ? 'ghost' : 'primary'}
label={
isActive
? t('shop.manage', 'Manage Plan')
: isDowngrade
? t('shop.selectDisabled', 'Not available')
: t('shop.select', 'Select')
}
onPress={canSelect ? onSelect : undefined}
tone={isActive || isDowngrade ? 'ghost' : 'primary'}
disabled={!canSelect}
/>
</MobileCard>
);

View File

@@ -1,14 +1,28 @@
import { describe, expect, it } from 'vitest';
import { classifyPackageTier, selectRecommendedPackageId } from '../lib/packageShop';
import { classifyPackageChange, selectRecommendedPackageId } from '../lib/packageShop';
describe('classifyPackageTier', () => {
it('returns neutral when no active price', () => {
expect(classifyPackageTier(100, null)).toEqual({ isUpgrade: false, isDowngrade: false });
describe('classifyPackageChange', () => {
const active = {
id: 1,
price: 200,
max_photos: 100,
max_guests: 50,
gallery_days: 30,
features: { advanced_analytics: false },
} as any;
it('returns neutral when no active package', () => {
expect(classifyPackageChange(active, null)).toEqual({ isUpgrade: false, isDowngrade: false });
});
it('marks upgrades and downgrades by price', () => {
expect(classifyPackageTier(150, 100)).toEqual({ isUpgrade: true, isDowngrade: false });
expect(classifyPackageTier(80, 100)).toEqual({ isUpgrade: false, isDowngrade: true });
it('marks upgrade when candidate adds features', () => {
const candidate = { ...active, id: 2, price: 150, features: { advanced_analytics: true } } as any;
expect(classifyPackageChange(candidate, active)).toEqual({ isUpgrade: true, isDowngrade: false });
});
it('marks downgrade when candidate removes features or limits', () => {
const candidate = { ...active, id: 3, max_photos: 50, features: { advanced_analytics: false } } as any;
expect(classifyPackageChange(candidate, active)).toEqual({ isUpgrade: false, isDowngrade: true });
});
});
@@ -24,10 +38,12 @@ describe('selectRecommendedPackageId', () => {
});
it('selects the cheapest upgrade with the feature', () => {
expect(selectRecommendedPackageId(packages, 'advanced_analytics', 120)).toBe(2);
const active = { id: 10, price: 120, max_photos: 100, max_guests: 50, gallery_days: 30, features: {} } as any;
expect(selectRecommendedPackageId(packages, 'advanced_analytics', active)).toBe(2);
});
it('falls back to cheapest feature package if no upgrades exist', () => {
expect(selectRecommendedPackageId(packages, 'advanced_analytics', 250)).toBe(2);
const active = { id: 10, price: 250, max_photos: 999, max_guests: 999, gallery_days: 365, features: { advanced_analytics: true } } as any;
expect(selectRecommendedPackageId(packages, 'advanced_analytics', active)).toBe(2);
});
});

View File

@@ -1,23 +1,76 @@
import type { Package } from '../../api';
export function classifyPackageTier(price: number, activePrice: number | null): {
type PackageChange = {
isUpgrade: boolean;
isDowngrade: boolean;
} {
if (activePrice === null) {
};
function collectFeatures(pkg: Package | null): Set<string> {
if (!pkg?.features) {
return new Set();
}
return new Set(Object.entries(pkg.features).filter(([, enabled]) => enabled).map(([key]) => key));
}
function compareLimit(candidate: number | null, active: number | null): number {
if (active === null) {
return candidate === null ? 0 : -1;
}
if (candidate === null) {
return 1;
}
if (candidate > active) return 1;
if (candidate < active) return -1;
return 0;
}
export function classifyPackageChange(pkg: Package, active: Package | null): PackageChange {
if (!active) {
return { isUpgrade: false, isDowngrade: false };
}
return {
isUpgrade: price > activePrice,
isDowngrade: price < activePrice,
};
const activeFeatures = collectFeatures(active);
const candidateFeatures = collectFeatures(pkg);
const hasFeatureUpgrade = Array.from(candidateFeatures).some((feature) => !activeFeatures.has(feature));
const hasFeatureDowngrade = Array.from(activeFeatures).some((feature) => !candidateFeatures.has(feature));
const limitKeys: Array<keyof Package> = ['max_photos', 'max_guests', 'gallery_days'];
let hasLimitUpgrade = false;
let hasLimitDowngrade = false;
limitKeys.forEach((key) => {
const candidateLimit = pkg[key] ?? null;
const activeLimit = active[key] ?? null;
const delta = compareLimit(candidateLimit, activeLimit);
if (delta > 0) {
hasLimitUpgrade = true;
} else if (delta < 0) {
hasLimitDowngrade = true;
}
});
const hasUpgrade = hasFeatureUpgrade || hasLimitUpgrade;
const hasDowngrade = hasFeatureDowngrade || hasLimitDowngrade;
if (hasUpgrade) {
return { isUpgrade: true, isDowngrade: false };
}
if (hasDowngrade) {
return { isUpgrade: false, isDowngrade: true };
}
return { isUpgrade: false, isDowngrade: false };
}
export function selectRecommendedPackageId(
packages: Package[],
feature: string | null,
activePrice: number | null
activePackage: Package | null
): number | null {
if (!feature) {
return null;
@@ -28,12 +81,8 @@ export function selectRecommendedPackageId(
return null;
}
const upgradeCandidates =
activePrice === null
? candidates
: candidates.filter((pkg) => pkg.price > activePrice);
const pool = upgradeCandidates.length ? upgradeCandidates : candidates;
const upgrades = candidates.filter((pkg) => classifyPackageChange(pkg, activePackage).isUpgrade);
const pool = upgrades.length ? upgrades : candidates;
const sorted = [...pool].sort((a, b) => a.price - b.price);
return sorted[0]?.id ?? null;