Browse Source

docs(24-03): complete CostDialog UI plan

Tasks completed: 4/4
- Restructure CostDialog for provider-grouped breakdown
- Update pricing reference section
- Update CostDialog tests (33 tests passing)
- Human verification approved

Simplified based on user feedback:
- Removed unreliable fal.ai pricing API calls
- External providers show model links instead of prices
- Header always shows $x.xx (Gemini costs only)

SUMMARY: .planning/phases/24-improved-cost-summary/24-03-SUMMARY.md
handoff-20260429-1057
shrimbly 6 months ago
parent
commit
1f1e342ad5
  1. 8
      .planning/ROADMAP.md
  2. 14
      .planning/STATE.md
  3. 105
      .planning/phases/24-improved-cost-summary/24-03-SUMMARY.md

8
.planning/ROADMAP.md

@ -12,8 +12,8 @@ None
- ✅ **v1.0 Multi-Provider Support** - Phases 1-6 (shipped 2026-01-11) - ✅ **v1.0 Multi-Provider Support** - Phases 1-6 (shipped 2026-01-11)
- ✅ **v1.1 Improvements** - Phases 7-14 (shipped 2026-01-12) - ✅ **v1.1 Improvements** - Phases 7-14 (shipped 2026-01-12)
- 🚧 **v1.2 Improvements** - Phases 15-24 (in progress) - **v1.2 Improvements** - Phases 15-24 (shipped 2026-01-17)
- 📋 **v1.3 Improvements** - Phases 25-29 (planned) - 🚧 **v1.3 Improvements** - Phases 25-29 (in progress)
## Phases ## Phases
@ -344,7 +344,7 @@ Plans:
Plans: Plans:
- [x] 24-01: fal.ai pricing API integration and ProviderModel.pricing population - [x] 24-01: fal.ai pricing API integration and ProviderModel.pricing population
- [x] 24-02: Expand costCalculator to handle video nodes and external providers - [x] 24-02: Expand costCalculator to handle video nodes and external providers
- [ ] 24-03: Update CostDialog UI for multi-provider breakdown - [x] 24-03: Update CostDialog UI for multi-provider breakdown
### 📋 v1.3 Improvements (Planned) ### 📋 v1.3 Improvements (Planned)
@ -455,7 +455,7 @@ Phases execute in numeric order: 1 → 2 → ... → 24 → 25 → 26 → 27 →
| 21. Fix Image Input & Deduplication | v1.2 | 1/1 | Complete | 2026-01-13 | | 21. Fix Image Input & Deduplication | v1.2 | 1/1 | Complete | 2026-01-13 |
| 22. Generate Node Dynamic Input Tests | v1.2 | 1/1 | Complete | 2026-01-13 | | 22. Generate Node Dynamic Input Tests | v1.2 | 1/1 | Complete | 2026-01-13 |
| 23. Model Browser Improvements | v1.2 | 1/1 | Complete | 2026-01-13 | | 23. Model Browser Improvements | v1.2 | 1/1 | Complete | 2026-01-13 |
| 24. Improved Cost Summary | v1.2 | 2/3 | In progress | - | | 24. Improved Cost Summary | v1.2 | 3/3 | Complete | 2026-01-17 |
| 25. Template Explorer UI | v1.3 | 2/2 | Complete | 2026-01-16 | | 25. Template Explorer UI | v1.3 | 2/2 | Complete | 2026-01-16 |
| 26. Template Preview Rendering | v1.3 | 1/1 | Complete | 2026-01-17 | | 26. Template Preview Rendering | v1.3 | 1/1 | Complete | 2026-01-17 |
| 27. Node Defaults Infrastructure | v1.3 | 0/? | Not started | - | | 27. Node Defaults Infrastructure | v1.3 | 0/? | Not started | - |

14
.planning/STATE.md

@ -5,7 +5,7 @@
See: .planning/PROJECT.md (updated 2026-01-09) See: .planning/PROJECT.md (updated 2026-01-09)
**Core value:** Provider infrastructure that dynamically discovers models from external APIs, enabling users to access hundreds of image/video generation models without hardcoding schemas. **Core value:** Provider infrastructure that dynamically discovers models from external APIs, enabling users to access hundreds of image/video generation models without hardcoding schemas.
**Current focus:** Testing and modularization (v1.2) **Current focus:** Template explorer and UI improvements (v1.3)
## Current Position ## Current Position
@ -47,7 +47,7 @@ Progress: █████████░ 92%
| 22. Generate Node Dynamic Input Tests | 1/1 | 20 min | 20 min | | 22. Generate Node Dynamic Input Tests | 1/1 | 20 min | 20 min |
| 23. Model Browser Improvements | 1/1 | 5 min | 5 min | | 23. Model Browser Improvements | 1/1 | 5 min | 5 min |
| 20. Integration Tests | 2/2 | 11 min | 5.5 min | | 20. Integration Tests | 2/2 | 11 min | 5.5 min |
| 24. Improved Cost Summary | 2/3 | 10 min | 5 min | | 24. Improved Cost Summary | 3/3 | 25 min | 8 min |
| 25. Template Explorer UI | 2/2 | 23 min | 11.5 min | | 25. Template Explorer UI | 2/2 | 23 min | 11.5 min |
| 26. Template Preview Rendering | 1/1 | 25 min | 25 min | | 26. Template Preview Rendering | 1/1 | 25 min | 25 min |
@ -119,9 +119,9 @@ Recent decisions affecting current work:
- Max 8 recent models stored in localStorage, 4 displayed in UI - Max 8 recent models stored in localStorage, 4 displayed in UI
- Gemini models hardcoded in /api/models (not fetched from external API) - Gemini models hardcoded in /api/models (not fetched from external API)
- Green color theme for Gemini provider (bg-green-500/20 text-green-300) - Green color theme for Gemini provider (bg-green-500/20 text-green-300)
- Cost dialog: two-section layout (Known Costs vs Pricing Unavailable) grouping by provider - Cost dialog: Gemini Cost section (with prices) + External Providers section (with model links)
- fal.ai pricing via API, Replicate excluded from cost tracking (no API available) - External provider pricing removed (fal.ai 429 errors, Replicate no API) - show model links instead
- Incurred cost only tracks providers with known pricing (Gemini, fal.ai) - Incurred cost only tracks Gemini generations
- Template category colors: blue=product, purple=style, green=composition, amber=community - Template category colors: blue=product, purple=style, green=composition, amber=community
- Template grid layout: 2 cols mobile, 3 cols lg+ - Template grid layout: 2 cols mobile, 3 cols lg+
- Template node count calculated at runtime from workflow.nodes.length - Template node count calculated at runtime from workflow.nodes.length
@ -154,6 +154,6 @@ Recent decisions affecting current work:
## Session Continuity ## Session Continuity
Last session: 2026-01-17 Last session: 2026-01-17
Stopped at: Completed 26-01-PLAN.md (horizontal cards with direct workflow loading) Stopped at: Completed 24-03-PLAN.md (simplified CostDialog with model links)
Resume file: None Resume file: None
Next action: Execute 24-03-PLAN.md (CostDialog UI) or Phase 27 (Node Defaults Infrastructure) Next action: Phase 27 (Node Defaults Infrastructure)

105
.planning/phases/24-improved-cost-summary/24-03-SUMMARY.md

@ -0,0 +1,105 @@
---
phase: 24-improved-cost-summary
plan: 03
subsystem: ui
tags: [cost-dialog, pricing, fal-ai, replicate, gemini]
# Dependency graph
requires:
- phase: 24-01
provides: fal.ai pricing API integration
- phase: 24-02
provides: costCalculator multi-provider support
provides:
- Simplified CostDialog with Gemini pricing and external provider model links
- CostIndicator always showing dollar format
affects: []
# Tech tracking
tech-stack:
added: []
patterns:
- Model links for external providers instead of unreliable pricing
key-files:
created: []
modified:
- src/components/CostDialog.tsx
- src/components/CostIndicator.tsx
- src/components/__tests__/CostDialog.test.tsx
- src/app/api/models/route.ts
key-decisions:
- "Show $x.xx in header always (Gemini costs only, external providers not tracked)"
- "Replace external provider pricing with 'View model' links to provider pages"
- "Remove fal.ai pricing API calls to avoid 429 rate limit errors"
patterns-established:
- "External provider costs shown as model links, not prices"
issues-created: []
# Metrics
duration: 15min
completed: 2026-01-17
---
# Phase 24 Plan 3: Update CostDialog UI Summary
**Simplified CostDialog showing Gemini pricing with model links for fal.ai/Replicate instead of unreliable external pricing**
## Performance
- **Duration:** ~15 min
- **Started:** 2026-01-16T07:54:02Z
- **Completed:** 2026-01-17T07:31:49Z
- **Tasks:** 4 (3 auto + 1 checkpoint)
- **Files modified:** 4
## Accomplishments
- Simplified CostDialog with two sections: Gemini Cost (with prices) and External Providers (with model links)
- CostIndicator always shows $x.xx format (Gemini costs only)
- Removed fal.ai pricing API calls that were causing 429 rate limit errors
- Model links go to fal.ai/models/{id} and replicate.com/{owner/model}
## Task Commits
1. **Task 1-2: Restructure CostDialog** - `065af2c`, `52a9dc0` (initial implementation)
2. **Task 1-3 (revised): Simplify based on feedback** - `d6ce195` (feat: simplify CostDialog with model links)
3. **Fix: Always show dollar format** - `611760e` (fix: always show dollar format in cost indicator)
4. **Fix: Remove pricing API calls** - `ac6e953` (fix: remove fal.ai pricing API calls causing 429 errors)
## Files Created/Modified
- `src/components/CostDialog.tsx` - Simplified two-section layout with Gemini Cost and External Providers
- `src/components/CostIndicator.tsx` - Always shows $x.xx format
- `src/components/__tests__/CostDialog.test.tsx` - Updated tests for new layout (33 tests passing)
- `src/app/api/models/route.ts` - Removed fetchFalPricing function and related types
## Decisions Made
- External provider pricing is unreliable (fal.ai 429 errors, Replicate has no API) - show model links instead
- Header always shows dollar format (Gemini costs only since external not tracked)
- Incurred cost tracks Gemini generations only
## Deviations from Plan
### User-Requested Changes
**1. Simplified pricing display based on user feedback**
- **Issue:** fal.ai pricing API returning 429 errors, pricing data unreliable
- **Change:** Replaced complex pricing display with simple model links
- **Files modified:** CostDialog.tsx, CostIndicator.tsx, models/route.ts
### Auto-fixed Issues
None - changes were user-directed simplifications.
## Issues Encountered
- fal.ai pricing API rate limiting (429 errors) - resolved by removing pricing calls entirely
## Next Step
Phase 24 complete, ready for next phase
Loading…
Cancel
Save