docs(agents): add "Pricing" page to agents docs - #1134
Conversation
✅ Deploy Preview for docs-novu ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
…lling details, and features across tiers
…and clarity on plan features
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
| function formatCurrency(value: number): string { | ||
| return new Intl.NumberFormat('en-US', { | ||
| style: 'currency', | ||
| currency: 'USD', | ||
| minimumFractionDigits: value % 1 === 0 ? 0 : 2, | ||
| maximumFractionDigits: 2, | ||
| }).format(value); |
There was a problem hiding this comment.
formatCurrency truncates Team overage rate to wrong value
maximumFractionDigits: 2 causes formatCurrency(0.015) to render as $0.01 instead of $0.015. In JavaScript, 0.015 is stored as 0.01499999... in IEEE 754, so rounding to 2 decimal places floors to $0.01 — a 33% understatement of the Team plan's per-conversation rate. This appears in the overage hint on line 228 when the Team plan is selected with extra conversations. maximumFractionDigits should be increased to 3 to accommodate this rate.
Prompt To Fix With AI
This is a comment left during a code review.
Path: src/components/agents/pricing-calculator.tsx
Line: 52-58
Comment:
**`formatCurrency` truncates Team overage rate to wrong value**
`maximumFractionDigits: 2` causes `formatCurrency(0.015)` to render as `$0.01` instead of `$0.015`. In JavaScript, `0.015` is stored as `0.01499999...` in IEEE 754, so rounding to 2 decimal places floors to `$0.01` — a 33% understatement of the Team plan's per-conversation rate. This appears in the overage hint on line 228 when the Team plan is selected with extra conversations. `maximumFractionDigits` should be increased to `3` to accommodate this rate.
How can I resolve this? If you propose a fix, please make it concise.
| <label | ||
| htmlFor="connect-pricing-conversations" | ||
| className="text-sm font-medium text-fd-foreground" | ||
| > | ||
| Active conversations per billing cycle | ||
| </label> | ||
| <input | ||
| id="connect-pricing-conversations-input" | ||
| type="number" | ||
| min={0} | ||
| max={MAX_CONVERSATIONS} | ||
| value={conversations} | ||
| onChange={(event) => handleConversationsChange(Number(event.target.value))} | ||
| className="w-28 rounded-md border border-fd-border bg-fd-background px-2 py-1 text-right text-sm text-fd-foreground" | ||
| /> |
There was a problem hiding this comment.
The <label> element's htmlFor="connect-pricing-conversations" points to the range slider, but the numeric <input> has id="connect-pricing-conversations-input" with no associated label. Screen readers will not announce the purpose of the number field when it receives focus.
Prompt To Fix With AI
This is a comment left during a code review.
Path: src/components/agents/pricing-calculator.tsx
Line: 148-162
Comment:
**Number input has no accessible label**
The `<label>` element's `htmlFor="connect-pricing-conversations"` points to the range slider, but the numeric `<input>` has `id="connect-pricing-conversations-input"` with no associated label. Screen readers will not announce the purpose of the number field when it receives focus.
How can I resolve this? If you propose a fix, please make it concise.| setSelectedPlanId((currentPlanId) => { | ||
| if (currentPlanId === 'free' && nextValue > FREE_TO_PRO_THRESHOLD) { | ||
| return 'pro'; | ||
| } | ||
|
|
||
| if ( | ||
| (currentPlanId === 'pro' || currentPlanId === 'team') && | ||
| nextValue < PRO_TEAM_TO_FREE_THRESHOLD | ||
| ) { | ||
| return 'free'; | ||
| } |
There was a problem hiding this comment.
When a user explicitly clicks Team and then drags the slider below 100, the plan silently resets to Free. There's also a one-way threshold inconsistency: Free auto-promotes to Pro at 300 conversations but Pro/Team never auto-promotes to Team — a user on the Pro plan with 5,001 conversations (above the Team threshold) simply sees growing overage instead of being guided toward Team. Both behaviours could confuse users trying to compare plans.
Prompt To Fix With AI
This is a comment left during a code review.
Path: src/components/agents/pricing-calculator.tsx
Line: 91-101
Comment:
**Auto-switching overrides manual Team plan selection unexpectedly**
When a user explicitly clicks Team and then drags the slider below 100, the plan silently resets to Free. There's also a one-way threshold inconsistency: Free auto-promotes to Pro at 300 conversations but Pro/Team never auto-promotes to Team — a user on the Pro plan with 5,001 conversations (above the Team threshold) simply sees growing overage instead of being guided toward Team. Both behaviours could confuse users trying to compare plans.
How can I resolve this? If you propose a fix, please make it concise.Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
1 participant
Greptile Summary
This PR adds a new "Pricing" documentation page for Novu Connect under the agents section, along with an interactive
ConnectPricingCalculatorReact component that lets users estimate monthly costs by plan and conversation volume.pricing.mdx: Comprehensive new page covering plan tiers, active conversation billing semantics, per-platform counting rules, and an FAQ section — all consistent with each other.pricing-calculator.tsx: Client component with plan selector, conversation slider/number input, and a live estimate breakdown. TheformatCurrencyhelper caps at 2 decimal places, which silently rounds the Team plan's$0.015overage rate down to$0.01for users.meta.json: Registers the new page under a "Pricing" sidebar section in the agents navigation.Confidence Score: 4/5
Safe to merge with one fix recommended: the Team plan overage rate displays as $0.01 instead of $0.015 in the calculator hint text.
The documentation content is accurate and well-structured. The calculator component works correctly for most scenarios, but
formatCurrencywithmaximumFractionDigits: 2mis-displays the Team plan's three-decimal overage rate, showing users $0.01/conversation instead of the correct $0.015/conversation. This is live pricing information in a docs page, so the wrong rate is worth fixing before shipping.src/components/agents/pricing-calculator.tsx — specifically the
formatCurrencyfunction and the auto-switch thresholds.Important Files Changed
formatCurrencywithmaximumFractionDigits: 2mis-displays the Team plan's $0.015 overage rate as $0.01. Also has a missing label association for the number input and auto-switching logic that can override explicit plan selection.Flowchart
%%{init: {'theme': 'neutral'}}%% flowchart TD A[User changes conversation count] --> B[Clamp to 0–20,000] B --> C[setConversations] B --> D{Current plan?} D -- free AND value > 300 --> E[Switch to Pro] D -- pro/team AND value < 100 --> F[Switch to Free] D -- otherwise --> G[Keep current plan] E & F & G --> H[Re-compute estimate via useMemo] H --> I{Free plan over limit?} I -- yes --> J[Show cap warning] I -- no --> K{Paid plan with overage?} K -- yes --> L[Show overage hint\n⚠️ formatCurrency 0.015 → $0.01] K -- no --> M[Show clean total]%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%% flowchart TD A[User changes conversation count] --> B[Clamp to 0–20,000] B --> C[setConversations] B --> D{Current plan?} D -- free AND value > 300 --> E[Switch to Pro] D -- pro/team AND value < 100 --> F[Switch to Free] D -- otherwise --> G[Keep current plan] E & F & G --> H[Re-compute estimate via useMemo] H --> I{Free plan over limit?} I -- yes --> J[Show cap warning] I -- no --> K{Paid plan with overage?} K -- yes --> L[Show overage hint\n⚠️ formatCurrency 0.015 → $0.01] K -- no --> M[Show clean total]Prompt To Fix All With AI
Reviews (1): Last reviewed commit: "docs(agents): enhance pricing documentat..." | Re-trigger Greptile