Update app.py

app.py

@@ -4,8 +4,8 @@ import pandas as pd
     
 text = "<h1 style='text-align: center; color: midnightblue; font-size: 40px;'>TCO Comparison Calculator"
 text0 = "<h1 style='text-align: center; color: midnightblue; font-size: 30px;'>Describe your use case"
-text1 = "<h1 style='text-align: center; color: midnightblue; font-size: 30px;'>First option"
-text2 = "<h1 style='text-align: center; color: midnightblue; font-size: 30px;'>Second option"
+text1 = "<h1 style='text-align: center; color: midnightblue; font-size: 25px;'>First option"
+text2 = "<h1 style='text-align: center; color: midnightblue; font-size: 25px;'>Second option"
 text3 = "<h1 style='text-align: center; color: midnightblue; font-size: 30px;'>Compute and compare TCOs"
 description=f"""
 <p>In this demo application, we help you compare different AI model services, such as Open source or SaaS solutions.</p>
@@ -23,82 +23,82 @@ def on_use_case_change(use_case):
 def compare(tco1, tco2):
     r = tco1 / tco2
     if r < 1:
-        comparison_result = f"Second solution is {1/r:.5f} times more expensive than the first"
+        comparison_result = f"Second solution's cost/request is {1/r:.5f} times more expensive than the first"
     elif r > 1:
-        comparison_result = f"Second solution is {r:.5f} times cheaper than the first"
+        comparison_result = f"Second solution's cost/request is {r:.5f} times cheaper than the first"
     else:
         comparison_result = "Both solutions will cost the same."
     return comparison_result
 
-def update_plot(tco1, tco2, dropdown, dropdown2):
-    if dropdown == "(Open source) Llama 2" or dropdown == "(Open source) DIY":
-        salary = 1000
-        salary2 = 0
-    elif dropdown2 == "(Open source) Llama 2" or dropdown2 == "(Open source) DIY":
-        salary = 0
-        salary2 = 1000
-    else: 
-        salary = 0
-        salary2 = 0
-    data = pd.DataFrame(
-        {
-        "Number of requests": [100, 200, 300, 400, 500, 1000, 10000, 100, 200, 300, 400, 500, 1000, 10000],
-        "Cost ($)": [(tco1 * req + salary) for req in [100, 200, 300, 400, 500, 1000, 10000]] + [(tco2 * req + salary2) for req in [100, 200, 300, 400, 500, 1000, 10000]],
-        "AI model service": [dropdown] * 7 + [dropdown2] * 7
+def update_plot(tco1, tco2, dropdown, dropdown2, labour_cost1, labour_cost2):
+    
+    request_ranges = [100, 200, 300, 400, 500, 1000, 10000]
+    costs_tco1 = [(tco1 * req + labour_cost1) for req in request_ranges]
+    costs_tco2 = [(tco2 * req + labour_cost2) for req in request_ranges]
+
+    data = pd.DataFrame({
+        "Number of requests": request_ranges * 2,
+        "Cost ($)": costs_tco1 + costs_tco2,
+        "AI model service": [dropdown] * len(request_ranges) + [dropdown2] * len(request_ranges)
         }
     )
     return gr.LinePlot.update(data, x="Number of requests", y="Cost ($)",color="AI model service",color_legend_position="bottom", title="Total Cost of Model Serving for one month", height=300, width=500, tooltip=["Number of requests", "Cost ($)", "AI model service"])
  
 with gr.Blocks(theme=gr.themes.Soft()) as demo:
-    Models: list[models.BaseTCOModel] = [models.OpenAIModel, models.CohereModel, models.OpenSourceLlama2Model, models.OpenSourceDIY]
+    Models: list[models.BaseTCOModel] = [models.OpenAIModel, models.CohereModel, models.OpenSourceLlama2Model]
     model_names = [Model().get_name() for Model in Models]
     gr.Markdown(value=text)
     gr.Markdown(value=description)
     
     with gr.Row():
         with gr.Column():
+            # with gr.Row():
+            #     gr.Markdown(value=text0)
             with gr.Row():
-                gr.Markdown(value=text0)
-            with gr.Row():
-                use_case = gr.Dropdown(["Summarize", "Question-Answering", "Classification"], value="Question-Answering", label="AI model service type")
-            with gr.Row():
-                input_tokens = gr.Slider(minimum=1, maximum=1000, value=300, step=1, label="Number of input token", info="We put a value that we find best suit your use case choice but feel free to adjust", interactive=True)
-                output_tokens = gr.Slider(minimum=1, maximum=1000, value=300, step=1, label="Number of output token", info="We put a value that we find best suit your use case choice but feel free to adjust", interactive=True)
-            with gr.Row(visible=False):    
-                num_users = gr.Number(value="1000", interactive = True, label="Number of users for your service")
+                use_case = gr.Dropdown(["Summarize", "Question-Answering", "Classification"], value="Question-Answering", label="Describe your use case")
+            with gr.Accordion("Open to customize the number of input and output tokens for your use case", open=False):    
+                with gr.Row():
+                    input_tokens = gr.Slider(minimum=1, maximum=1000, value=300, step=1, label="Number of input token", info="We put a value that we find best suit your use case choice but feel free to adjust", interactive=True)
+                    output_tokens = gr.Slider(minimum=1, maximum=1000, value=300, step=1, label="Number of output token", info="We put a value that we find best suit your use case choice but feel free to adjust", interactive=True)
+                with gr.Row(visible=False):    
+                    num_users = gr.Number(value="1000", interactive = True, label="Number of users for your service")
     
     use_case.change(on_use_case_change, inputs=use_case, outputs=[input_tokens, output_tokens])
     
     with gr.Row():
         with gr.Column():
-            gr.Markdown(value=text1)
+            #gr.Markdown(value=text1)
             page1 = models.ModelPage(Models)
-            dropdown = gr.Dropdown(model_names, interactive=True, label="AI service options")
-            page1.render()
+            dropdown = gr.Dropdown(model_names, interactive=True, label="AI service option 1")
+            with gr.Accordion("Open for more information on the computation parameters for your first AI service option", open=False):    
+                page1.render()
 
         with gr.Column():
-            gr.Markdown(value=text2)
+            #gr.Markdown(value=text2)
             page2 = models.ModelPage(Models)
-            dropdown2 = gr.Dropdown(model_names, interactive=True, label="AI service options")
-            page2.render()
+            dropdown2 = gr.Dropdown(model_names, interactive=True, label="AI service option 2")
+            with gr.Accordion("Open for more information on the computation parameters for your second AI service option", open=False):        
+                page2.render()
             
-    dropdown.change(page1.make_model_visible, inputs=[dropdown, use_case, num_users, input_tokens, output_tokens], outputs=page1.get_all_components())
-    dropdown2.change(page2.make_model_visible, inputs=[dropdown2, use_case, num_users, input_tokens, output_tokens], outputs=page2.get_all_components())
+    dropdown.change(page1.make_model_visible, inputs=[dropdown, use_case], outputs=page1.get_all_components())
+    dropdown2.change(page2.make_model_visible, inputs=[dropdown2, use_case], outputs=page2.get_all_components())
     
-    gr.Markdown(value=text3)
+    #gr.Markdown(value=text3)
     compute_tco_btn = gr.Button("Compute cost/request and TCOs", size="lg")
     tco1 = gr.State()
     tco2 = gr.State()
+    labour_cost1 = gr.State()
+    labour_cost2 = gr.State()
     
     with gr.Row():  
         with gr.Column():
-            tco_output = gr.Text("Output 1: ", label="Cost/request for the first solution")
+            tco_output = gr.Text("Output 1: ", label="Cost/request for the first option", info="This is only the infrastructure cost per request for deployment, the labor cost still has to be added for a Total Cost of Model Serving")
             latency_info = gr.Markdown()
             with gr.Accordion("Open to see the formula", open=False):
                 tco_formula = gr.Markdown()
     
         with gr.Column():
-            tco_output2 = gr.Text("Output 2: ", label="Cost/request for the second solution")
+            tco_output2 = gr.Text("Output 2: ", label="Cost/request for the second option", info="This is only the infrastructure cost per request for deployment, the labor cost still has to be added for a Total Cost of Model Serving")
             latency_info2 = gr.Markdown()
             with gr.Accordion("Open to see the formula", open=False):
                 tco_formula2 = gr.Markdown()
@@ -109,6 +109,6 @@ with gr.Blocks(theme=gr.themes.Soft()) as demo:
         with gr.Column(scale=3):
             plot = gr.LinePlot()
     
-    compute_tco_btn.click(page1.compute_cost_per_token, inputs=page1.get_all_components_for_cost_computing() + [dropdown], outputs=[tco_output, tco1, tco_formula, latency_info]).then(page2.compute_cost_per_token, inputs=page2.get_all_components_for_cost_computing() + [dropdown2], outputs=[tco_output2, tco2, tco_formula2, latency_info2]).then(compare, inputs=[tco1, tco2], outputs=ratio).then(update_plot, inputs=[tco1, tco2, dropdown, dropdown2], outputs=plot)
+    compute_tco_btn.click(page1.compute_cost_per_token, inputs=page1.get_all_components_for_cost_computing() + [dropdown, input_tokens, output_tokens], outputs=[tco_output, tco1, tco_formula, latency_info, labour_cost1]).then(page2.compute_cost_per_token, inputs=page2.get_all_components_for_cost_computing() + [dropdown2, input_tokens, output_tokens], outputs=[tco_output2, tco2, tco_formula2, latency_info2, labour_cost2]).then(compare, inputs=[tco1, tco2], outputs=ratio).then(update_plot, inputs=[tco1, tco2, dropdown, dropdown2, labour_cost1, labour_cost2], outputs=plot)
 
 demo.launch(debug=True)