Fix $0 pricing calculator tabs for products billed with another product

[ksvat]

Changes

Why: Reported from Slack — the pricing calculator's Web analytics tab always showed $0 no matter where the slider went, and clicking it in the tab list appeared to do nothing.

Web analytics is billed on the Product analytics event meter, so it never gets a volume or cost of its own (setProduct deliberately ignores billedWith products to avoid double-counting the total). The calculator still gave it a normal tab: the price column read $0 permanently, and because tab bodies were looked up by type — and Web analytics is typed product_analytics — selecting it rendered the identical Product analytics calculator.

• Look tab bodies up by handle instead of type, so a product can no longer inherit the calculator of the product it's billed with.
• Render a shared "billed with" notice for these products, driven by the existing billedWith / pricingLead product data, with a button that jumps to the tab that actually moves the bill. This replaces the hard-coded Experiments special case, so Experiments and Web analytics now behave the same way.
• Show "Billed with " instead of a price in the tab list.
• Pass handle to setVolume, which keys on handle rather than type.
• Fix an always-false condition (!activeProduct.name == 'Experiments') that hid the "Subtotal" heading, and scope it to the plain single-slider tab — the custom tabs label their own subtotal row.

Note: I couldn't run a local build in this environment (no node_modules), so this needs a check against the Vercel preview.

Checklist

• I've read the docs and/or content style guides.
• Words are spelled using American English
• Use relative URLs for internal links
• I've checked the pages added or changed in the Vercel preview build
• If I moved a page, I added a redirect in vercel.json (n/a)

---

Created with PostHog from a Slack thread

[github-actions]

Deploy preview

Status	Details	Updated (UTC)
🟢 Ready	View preview	Aug 14, 2026 09:12PM

[github-actions]

Bundle report

Total JS (gzip)

7.55 MiB (+0.2 KiB / +0.0%)

Eager graph (modules shipped in each entrypoint's initial chunks)

Entrypoint	Eager size	Budget	Modules
✅ app	16.90 MiB (no change)	report-only	2017

Largest modules in the app closure

Module	Size
./src/data/mcp-tools.json	991.3 KiB
css ./node_modules/.pnpm/css-loader@5.2.7_webpack@5.101.3/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[8].oneOf[1].use[1]!./node_modules/.pnpm/postcss-loader@4.3.0_postcss@8.5.6_webpack@5.101.3/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[8].oneOf[1].use[2]!./src/styles/global.css	752.3 KiB
./src/components/Stickers/Stickers.tsx	696.4 KiB
./node_modules/.pnpm/@radix-ui+react-icons@1.3.2_react@18.3.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js	481.4 KiB
./node_modules/.pnpm/rehype-raw@7.0.0/node_modules/rehype-raw/lib/index.js + 29 modules	395.1 KiB
./node_modules/.pnpm/@posthog+icons@0.36.6_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@posthog/icons/dist/posthog-icons.cjs.js	364.8 KiB
./node_modules/.pnpm/@posthog+icons@0.36.6_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@posthog/icons/dist/posthog-icons.es.js	354.8 KiB
./src/hooks/useCustomers.tsx + 54 modules	353.8 KiB
./node_modules/.pnpm/react-markdown@8.0.7_@types+react@16.14.66_react@18.3.1/node_modules/react-markdown/lib/react-markdown.js + 88 modules	351.4 KiB
./src/components/ProductComparisonTable/index.tsx + 126 modules	301.4 KiB
./node_modules/.pnpm/cloudinary-core@2.14.0_lodash@4.17.21/node_modules/cloudinary-core/cloudinary-core.js	281.9 KiB
./src/components/SearchUI/index.tsx + 87 modules	273.0 KiB
./node_modules/.pnpm/@posthog+brand@0.8.0_react@18.3.1/node_modules/@posthog/brand/dist/generated/hoggies/svg/magnifying-glass.mjs	254.7 KiB
./node_modules/.pnpm/framer-motion@10.18.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/framer-motion/dist/es/render/dom/motion.mjs + 109 modules	253.9 KiB
./node_modules/.pnpm/d3@7.9.0/node_modules/d3/src/index.js + 208 modules	247.4 KiB

---

Eager-graph budgets are report-only until a baseline is established. Sizes are gzip of public/**/*.js; eager size is webpack module source bytes for the modules actually shipped in the entrypoint's initial chunks (post-tree-shake).

[smallbrownbike]

Fixed here