refactor(workspace): enforce layered crate boundaries

frontend/src/features/models/components/GlobalModelFormDialog.vue

@@ -601,6 +601,7 @@ import {
   EMBEDDING_API_FORMATS,
   buildGlobalModelCreatePayload,
   buildGlobalModelUpdatePayload,
+  cloneTieredPricingConfig,
 } from './global-model-form-helpers'
 import { tieredPricingHasImageOutputPricing } from '../utils/tiered-pricing'
 
@@ -1106,7 +1107,7 @@ function selectModel(model: ModelsDevModelItem) {
   loadVideoPricingFromConfig()
 
   tieredPricing.value = model.tieredPricing
-    ? structuredClone(model.tieredPricing)
+    ? cloneTieredPricingConfig(model.tieredPricing)
     : null
 
   presetPanelCollapsed.value = true

frontend/src/features/models/components/__tests__/global-model-form-helpers.spec.ts

@@ -1,10 +1,13 @@
 import { describe, expect, it } from 'vitest'
+import { reactive } from 'vue'
 
 import {
   EMBEDDING_API_FORMATS,
   buildGlobalModelCreatePayload,
   buildGlobalModelUpdatePayload,
+  cloneTieredPricingConfig,
 } from '../global-model-form-helpers'
+import type { TieredPricingConfig } from '@/api/endpoints/types'
 
 const embeddingPricing = {
   tiers: [{ up_to: null, input_price_per_1m: 0.02, output_price_per_1m: 0 }],
@@ -66,3 +69,24 @@ describe('global model form embedding payload helpers', () => {
     })
   })
 })
+
+describe('global model form pricing presets', () => {
+  it('clones reactive pricing before opening the preset editor', () => {
+    const pricing = reactive({
+      tiers: [{
+        up_to: null,
+        input_price_per_1m: 3,
+        output_price_per_1m: 15,
+      }],
+    }) as TieredPricingConfig
+
+    const cloned = cloneTieredPricingConfig(pricing)
+
+    expect(cloned).toEqual(pricing)
+    expect(cloned).not.toBe(pricing)
+    expect(cloned.tiers[0]).not.toBe(pricing.tiers[0])
+
+    cloned.tiers[0].input_price_per_1m = 9
+    expect(pricing.tiers[0].input_price_per_1m).toBe(3)
+  })
+})

frontend/src/features/models/components/global-model-form-helpers.ts

@@ -23,6 +23,14 @@ export interface GlobalModelFormPayloadState {
   is_active?: boolean
 }
 
+export function cloneTieredPricingConfig(
+  pricing: TieredPricingConfig,
+): TieredPricingConfig {
+  // Presets live inside a Vue ref and can therefore be reactive proxies, which
+  // structuredClone cannot clone directly. Pricing configs are JSON payloads.
+  return JSON.parse(JSON.stringify(pricing)) as TieredPricingConfig
+}
+
 function cleanGlobalModelConfig(form: GlobalModelFormPayloadState): Record<string, unknown> | undefined {
   return form.config && Object.keys(form.config).length > 0 ? form.config : undefined
 }