merge

static/js/pages/models.js

@@ -30,13 +30,13 @@ class ModelsPage {
             tableBody.innerHTML = '<tr><td colspan="7" class="text-center">No models found in registry</td></tr>';
             return;
         }
-
+        
         // Sort by provider then name
         this.models.sort((a, b) => {
             if (a.provider !== b.provider) return a.provider.localeCompare(b.provider);
             return a.name.localeCompare(b.name);
         });
-
+        
         tableBody.innerHTML = this.models.map(model => {
             const statusClass = model.enabled ? 'success' : 'secondary';
             const statusIcon = model.enabled ? 'check-circle' : 'ban';
@@ -99,6 +99,14 @@ class ModelsPage {
                             <input type="number" id="model-completion-cost" value="${model.completion_cost}" step="0.01">
                         </div>
                     </div>
+                    <div class="form-control">
+                        <label for="model-cache-read-cost">Cache Read Cost (per 1M tokens)</label>
+                        <input type="number" id="model-cache-read-cost" value="${model.cache_read_cost || 0}" step="0.01">
+                    </div>
+                    <div class="form-control">
+                        <label for="model-cache-write-cost">Cache Write Cost (per 1M tokens)</label>
+                        <input type="number" id="model-cache-write-cost" value="${model.cache_write_cost || 0}" step="0.01">
+                    </div>
                     <div class="form-control">
                         <label for="model-mapping">Internal Mapping (Optional)</label>
                         <input type="text" id="model-mapping" value="${model.mapping || ''}" placeholder="e.g. gpt-4o-2024-05-13">
@@ -118,6 +126,8 @@ class ModelsPage {
             const enabled = modal.querySelector('#model-enabled').checked;
             const promptCost = parseFloat(modal.querySelector('#model-prompt-cost').value);
             const completionCost = parseFloat(modal.querySelector('#model-completion-cost').value);
+            const cacheReadCost = parseFloat(modal.querySelector('#model-cache-read-cost').value);
+            const cacheWriteCost = parseFloat(modal.querySelector('#model-cache-write-cost').value);
             const mapping = modal.querySelector('#model-mapping').value;
             
             try {
@@ -125,6 +135,8 @@ class ModelsPage {
                     enabled,
                     prompt_cost: promptCost,
                     completion_cost: completionCost,
+                    cache_read_cost: isNaN(cacheReadCost) ? null : cacheReadCost,
+                    cache_write_cost: isNaN(cacheWriteCost) ? null : cacheWriteCost,
                     mapping: mapping || null
                 });