UI Standardization, Progress Bars, and BYOK Retry with Platform Credits

October 20, 2025

This release standardizes the look and feel of the entire platform while adding two practical new features. Across 42 pages, headers, icons, buttons, and spacing have been unified into a single consistent design language. Quota limits now show visual progress bars so you can see at a glance how close you are to your limits. And when a Bring Your Own Key (BYOK) request fails — due to an expired or invalid key — you can now retry the same request using platform credits with a single click, rather than losing your work.

New Features

• Visual progress bars for quota limits — Your prompt, library, and version limits now display mini progress bars beneath the usage numbers. The bars fill and change color as you approach your limits, giving you an instant visual sense of how much capacity remains. Progress bars use distinct colors for each limit type (orange for prompts and libraries, teal for versions) and animate smoothly when counts change.
• BYOK retry with platform credits — When a generation fails because your own API key is invalid, expired, or rejected by the provider, a new error alert appears with a clear explanation of what went wrong and a “Retry with Platform Credits” button. Clicking it re-runs the exact same generation using EnginifyAI’s platform key instead, charged against your credit balance. There’s no silent fallback — you always explicitly choose whether to use platform credits.
• Provider-specific BYOK error context — BYOK failure alerts now identify which provider (OpenAI, Anthropic, Google, or xAI) rejected the request, helping you understand whether the issue is with a specific key or a broader provider problem.
• Real-time quota data across all pages — Library, prompt, and version counts are now pulled from a unified quota endpoint across all pages, with 30-second auto-refresh. This means your usage numbers are always consistent whether you’re looking at the Prompt Explorer, Library Explorer, or Quota Settings.

Improvements

• Unified page header design — All 42 application pages now use the same header layout: consistent icon backgrounds with purple styling, standardized title typography at the same size, uniform button styling, and consistent spacing. This creates a cohesive experience as you navigate between different areas of the platform.
• Standardized button design — Action buttons across the platform now share the same purple color scheme, rounded corners, shadow styling, and hover states. This eliminates the visual inconsistency where different pages used different button styles for the same type of action.
• Consistent icon styling — Page icons now use uniform backgrounds with proper sizing and border radius, replacing the previous mix of emoji icons, gradient backgrounds, and bare icons that varied from page to page.
• Improved dark mode support — All standardized elements maintain proper contrast and visibility in dark mode, including icon backgrounds, button states, and text colors.

Bug Fixes

• Fixed React hooks violation on libraries page — A critical bug where React state hooks were being called after conditional returns has been fixed. This was causing runtime errors and warnings on the libraries page that could lead to unexpected behavior.
• Token usage logging fixed — The system for logging detailed token usage per AI request was failing due to a function signature mismatch. The logging function has been corrected to properly record all metadata (model, tokens, cost, processing time) to the tracking table.