diff --git a/src/components/pricingcalculator/PricingCalculator.tsx b/src/components/pricingcalculator/PricingCalculator.tsx index bdf65a13..4805a980 100644 --- a/src/components/pricingcalculator/PricingCalculator.tsx +++ b/src/components/pricingcalculator/PricingCalculator.tsx @@ -15,13 +15,14 @@ import Costs from './costs/Costs' import TotalCost from './costs/TotalCost' export type PricingCalculatorProps = { + appsDefault?: number expandedDefault?: boolean } -const PricingCalculator = forwardRef(({ expandedDefault = false }, ref) => { +const PricingCalculator = forwardRef(({ appsDefault = 5, expandedDefault = false }, ref) => { const [expanded, setExpanded] = useState(expandedDefault) const [providerId, setProviderId] = useState(PROVIDERS[0].id) - const [apps, setApps] = useState(10) + const [apps, setApps] = useState(appsDefault) const provider = useMemo(() => PROVIDERS.find(({ id }) => id === providerId), [providerId]) const providerCost = useMemo(() => estimateProviderCost(provider, apps), [provider, apps]) diff --git a/src/components/pricingcalculator/PricingCalculatorExtended.tsx b/src/components/pricingcalculator/PricingCalculatorExtended.tsx index 01f81172..b24a53f4 100644 --- a/src/components/pricingcalculator/PricingCalculatorExtended.tsx +++ b/src/components/pricingcalculator/PricingCalculatorExtended.tsx @@ -23,13 +23,22 @@ import ClustersControl from './controls/ClustersControl' import Costs from './costs/Costs' import TotalCost from './costs/TotalCost' -const PricingCalculatorExtended = forwardRef((props, ref) => { +export type PricingCalculatorProps = { + appsDefault?: number + clustersDefault?: number + usersDefault?: number + professionalDefault?: boolean +} & CardProps + +const PricingCalculatorExtended = forwardRef(({ + appsDefault = 5, clustersDefault = 1, usersDefault = 0, professionalDefault = false, ...props +}, ref) => { const [providerId, setProviderId] = useState(PROVIDERS[0].id) - const [clusters, setClusters] = useState(3) - const [apps, setApps] = useState(10) - const [users, setUsers] = useState(0) - const [professional, setProfessional] = useState(false) - const [enforcedPro, setEnforcedPro] = useState(false) + const [clusters, setClusters] = useState(clustersDefault) + const [apps, setApps] = useState(appsDefault) + const [users, setUsers] = useState(usersDefault) + const [enforcedPro, setEnforcedPro] = useState(users > 5) + const [professional, setProfessional] = useState(professionalDefault || enforcedPro) const provider = useMemo(() => PROVIDERS.find(({ id }) => id === providerId), [providerId]) const providerCost = useMemo(() => estimateProviderCost(provider, apps, clusters), [provider, apps, clusters]) const pluralCost = useMemo(() => estimatePluralCost(professional, clusters, users), [professional, clusters, users]) @@ -111,11 +120,11 @@ const PricingCalculatorExtended = forwardRef((props, >