From 57d3d59aaf025d12f7a7df4e9997bc1832ca5513 Mon Sep 17 00:00:00 2001
From: Ishaan Jaff <ishaanjaffer0324@gmail.com>
Date: Sat, 7 Sep 2024 12:07:14 -0700
Subject: [PATCH] ui allow setting input / output cost per M tokens

---
 .../src/components/model_dashboard.tsx        | 25 +++++++++++++------
 1 file changed, 17 insertions(+), 8 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/model_dashboard.tsx b/ui/litellm-dashboard/src/components/model_dashboard.tsx
index de92805b0..7e97eb377 100644
--- a/ui/litellm-dashboard/src/components/model_dashboard.tsx
+++ b/ui/litellm-dashboard/src/components/model_dashboard.tsx
@@ -457,19 +457,19 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
             </Form.Item>
 
             <Form.Item
-              label="input_cost_per_token"
-              name="input_cost_per_token"
-              tooltip="float (optional) - Input cost per token"
+              label="Input Cost per 1M Tokens"
+              name="input_cost_per_million_tokens"
+              tooltip="float (optional) - Input cost per 1 million tokens"
             >
-              <InputNumber min={0} step={0.0001} />
+              <InputNumber min={0} step={0.01} />
             </Form.Item>
 
             <Form.Item
-              label="output_cost_per_token"
-              name="output_cost_per_token"
-              tooltip="float (optional) - Output cost per token"
+              label="Output Cost per 1M Tokens"
+              name="output_cost_per_million_tokens"
+              tooltip="float (optional) - Output cost per 1 million tokens"
             >
-              <InputNumber min={0} step={0.0001} />
+              <InputNumber min={0} step={0.01} />
             </Form.Item>
 
             <Form.Item
@@ -517,6 +517,15 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
     let newLiteLLMParams: Record<string, any> = {};
     let model_info_model_id = null;
 
+    if (formValues.input_cost_per_million_tokens) {
+      formValues.input_cost_per_token = formValues.input_cost_per_million_tokens / 1000000;
+      delete formValues.input_cost_per_million_tokens;
+    }
+    if (formValues.output_cost_per_million_tokens) {
+      formValues.output_cost_per_token = formValues.output_cost_per_million_tokens / 1000000;
+      delete formValues.output_cost_per_million_tokens;
+    }
+
     for (const [key, value] of Object.entries(formValues)) {
       if (key !== "model_id") {
         newLiteLLMParams[key] = value;