Add assistant cost usage limits to Settings

[nightnei]

Related issues

• Fixes STU-1820

How AI was used in this PR

AI helped with writing code, iterated, I reviewed carefully and adjusted.

Proposed Changes

We will display percentage of usage limits based on cost in Studio Settings.

Testing Instructions

1. Apply these wpcom (223470-ghe-Automattic/wpcom) changes
2. Set 'cost_usage' => 1500000, in class-studio-app-ai-assistant.php
3. Open Studio Settings and assert that you see the correct 7.5%:
   
4. Set 'cost_usage' => 30000000, (bigger than the cap)
5. Assert that you see 100% in Studio Settings

[wpmobilebot]

📊 Performance Test Results

Comparing 63dc83c vs trunk

app-size

Metric	trunk	63dc83c	Diff	Change
App Size (Mac)	2357.39 MB	2360.88 MB	+3.49 MB	🔴 0.1%

site-editor

Metric	trunk	63dc83c	Diff	Change
load	1719 ms	1760 ms	+41 ms	⚪ 0.0%

site-startup

Metric	trunk	63dc83c	Diff	Change
siteCreation	8513 ms	8518 ms	+5 ms	⚪ 0.0%
siteStartup	3933 ms	3875 ms	58 ms	🟢 -1.5%

---

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff)

[sejas]

I tested along with 223470-ghe-Automattic/wpcom and both work great.
When the user is under the limit:

When the user is over the limit:

[sejas]

We could add a message for the translators.

/* translators: %1$s: percentage of monthly limit used (e.g. 7.5%). %2$s: date the limit resets (e.g. July 1, 2026). */

[katinthehatsite]

I am wondering if it would make sense to change the design of the bar once the limit is hit e.g. make it red or something like this.

But it is not a strong preference, so we can also leave this as is.

[nightnei]

The idea is cool. I propose keeping it as is and maybe talking with Shaun Andrews later to improve the UI as a whole.

[katinthehatsite]

We can avoid using the as unknown as ReturnType by using partial which would be a bit cleaner:

nfo.test.tsx
index 5a670b28e..abfc3190d 100644
--- a/apps/studio/src/modules/user-settings/components/tests/prompt-info.test.tsx
+++ b/apps/studio/src/modules/user-settings/components/tests/prompt-info.test.tsx
@@ -20,7 +20,7 @@ describe( 'PromptInfo', () => {
        } );
 
        it( 'shows Studio Code dollar usage and reset date', () => {
-               vi.mocked( useGetStudioAssistantQuota ).mockReturnValue( {
+               vi.mocked( useGetStudioAssistantQuota, { partial: true } ).mockReturnValue( {
                        data: {
                                costUsage: 33392,
                                costCap: 20000000,
@@ -29,7 +29,7 @@ describe( 'PromptInfo', () => {
                        isError: false,
                        isLoading: false,
                        refetch: vi.fn(),
-               } as unknown as ReturnType< typeof useGetStudioAssistantQuota > );
+               } );
 
                render( <PromptInfo /> );
 
@@ -42,7 +42,7 @@ describe( 'PromptInfo', () => {
        } );
 
        it( 'shows unavailable message when cost cap is missing', () => {
-               vi.mocked( useGetStudioAssistantQuota ).mockReturnValue( {
+               vi.mocked( useGetStudioAssistantQuota, { partial: true } ).mockReturnValue( {
                        data: {
                                costUsage: 0,
                                costCap: 0,
@@ -51,7 +51,7 @@ describe( 'PromptInfo', () => {
                        isError: false,
                        isLoading: false,
                        refetch: vi.fn(),
-               } as unknown as ReturnType< typeof useGetStudioAssistantQuota > );
+               } );
 
                render( <PromptInfo /> );
 
@@ -61,7 +61,7 @@ describe( 'PromptInfo', () => {
        } );
 
        it( 'caps over-limit usage at 100%', () => {
-               vi.mocked( useGetStudioAssistantQuota ).mockReturnValue( {
+               vi.mocked( useGetStudioAssistantQuota, { partial: true } ).mockReturnValue( {
                        data: {
                                costUsage: 3403700000,
                                costCap: 20000000,
@@ -70,7 +70,7 @@ describe( 'PromptInfo', () => {
                        isError: false,
                        isLoading: false,
                        refetch: vi.fn(),
-               } as unknown as ReturnType< typeof useGetStudioAssistantQuota > );
+               } );
 
                render( <PromptInfo /> );

[katinthehatsite]

The changes look good but I added one comment regarding cleaning up the tests a bit