Update app.py

app.py

@@ -7,76 +7,101 @@ from format.format_output import format_output
 from validate.validate_ingredients import validate_ingredients
 from device.get_device_id import get_device_id
 
-# Load the model and tokenizer
 tokenizer = AutoTokenizer.from_pretrained("Ashikan/dut-recipe-generator")
 model = AutoModelForCausalLM.from_pretrained("Ashikan/dut-recipe-generator")
 pipe = pipeline("text-generation", model=model, tokenizer=tokenizer, device=get_device_id())
 
 @spaces.GPU
-def perform_model_inference(ingredients_list=None, recipe_name=None):
-    # If ingredients are provided
-    if ingredients_list:
-        for ingredient_index in range(len(ingredients_list)):
-            ingredients_list[ingredient_index] = ingredients_list[ingredient_index].strip()
-        input_text = '{"prompt": ' + json.dumps(ingredients_list)
-    
-    # If recipe name is provided
-    elif recipe_name:
-        input_text = "Generate ingredients and cooking method for the recipe: " + recipe_name
-    else:
-        return "Invalid input"
-    
-    # Generate output from the model
+def perform_model_inference(ingredients_list):
+    for ingredient_index in range(len(ingredients_list)):
+        ingredients_list[ingredient_index] = ingredients_list[ingredient_index].strip()
+
+    input_text = '{"prompt": ' + json.dumps(ingredients_list)
+
     output = pipe(input_text, max_length=1024, temperature=0.1, do_sample=True, truncation=True)[0]["generated_text"]
+
     return format_output(output)
 
-def generate_recipe(ingredients=None, recipe_name=None):
-    # If ingredients are provided
-    if ingredients:
-        ingredients_list = ingredients.lower().split(',')
-        is_ingredients_valid = validate_ingredients(ingredients_list)
-
-        if is_ingredients_valid:
-            generated_text = perform_model_inference(ingredients_list=ingredients_list)
-            return {
-                generated_recipe: gr.Markdown(value=generated_text, label="Generated Recipe",
-                                              elem_id="recipe-container", visible=True)
-            }
-        else:
-            error_text = "## Invalid ingredients. Please include at least 2 ingredients in a comma-separated list. e.g. brown rice, onions, garlic"
-            return {
-                generated_recipe: gr.Markdown(value=error_text, elem_id="recipe-container", visible=True)
-            }
-
-    # If recipe name is provided
-    if recipe_name:
-        generated_text = perform_model_inference(recipe_name=recipe_name)
+
+def generate_recipe(ingredients):
+    ingredients_list = ingredients.lower().split(',')
+    is_ingredients_valid = validate_ingredients(ingredients_list)
+
+    if is_ingredients_valid:
+        generated_text = perform_model_inference(ingredients_list)
+
         return {
             generated_recipe: gr.Markdown(value=generated_text, label="Generated Recipe",
-                                          elem_id="recipe-container", visible=True)
+                                          elem_id="recipe-container", visible=True),
+            "state": "completed"
         }
+    else:
+        error_text = "## Invalid ingredients. Please include at least 2 ingredients in a comma-separated list. e.g. brown rice, onions, garlic"
+
+        return {
+            generated_recipe: gr.Markdown(value=error_text, elem_id="recipe-container", visible=True),
+            "state": "completed"
+        }
+
+
+with gr.Blocks(css="""
+    #chat-container {
+        background-color: #f7f7f8;
+        border-radius: 10px;
+        padding: 20px;
+        max-width: 800px;
+        margin: auto;
+        box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
+    }
+
+    .chat-message {
+        border-radius: 8px;
+        padding: 10px;
+        margin-bottom: 10px;
+        font-family: Arial, sans-serif;
+    }
+
+    .user-message {
+        background-color: #e6f7ff;
+        text-align: left;
+    }
+
+    .bot-message {
+        background-color: #f0f0f0;
+        text-align: left;
+    }
+
+    .gr-button {
+        background-color: #0073e6 !important;
+        color: white !important;
+        border: none !important;
+        border-radius: 5px !important;
+    }
+
+    .gr-textbox input {
+        border-radius: 5px;
+        border: 1px solid #ccc;
+        padding: 10px;
+    }
 
-    return {
-        generated_recipe: gr.Markdown(value="## Please enter either ingredients or a recipe name.", 
-                                      elem_id="recipe-container", visible=True)
+    .gradio-spinner {
+        display: block;
+        margin: auto;
     }
+""") as recipegen:
 
-# Gradio Interface
-with gr.Blocks(css="./css/styles.css") as recipegen:
-    gr.Image("./assets/dut.png", interactive=False, show_share_button=False, show_download_button=False,
-             show_fullscreen_button=False, show_label=False, elem_id="dut-logo", height=256)
-    gr.Markdown("#  Recipe Generator", elem_id="header")
+    gr.Markdown("# Recipe Generator", elem_id="header")
     gr.Markdown("### An AI Model Attempting To Produce Healthier, Diabetic-Friendly Recipes",
                 elem_id="header-sub-heading")
-    gr.Markdown("Start by entering a comma-separated list of ingredients or a recipe name below.", elem_id="header-instructions")
-
-    with gr.Column() as column:
-        user_ingredients = gr.Textbox(label="Ingredients", placeholder="e.g. chicken, onion, garlic", autofocus=True, max_lines=1, elem_id="ingredients-input")
-        user_recipe_name = gr.Textbox(label="Recipe Name", placeholder="e.g. Chicken Biryani", max_lines=1, elem_id="recipe-name-input")
-        generate_button = gr.Button(value="Generate")
-        
-    with gr.Column():
-        generated_recipe = gr.Markdown(visible=True)
+    gr.Markdown("Start by entering a comma-separated list of ingredients below.", elem_id="header-instructions")
+    
+    with gr.Column(elem_id="chat-container"):
+        # Create a chat interface to simulate ChatGPT
+        chatbot = gr.Chatbot(elem_id="chatbot-container", label="Recipe Generator Chat")
+        user_input = gr.Textbox(label="Enter Ingredients (comma-separated)", placeholder="e.g. chicken, onions, garlic", autofocus=True, max_lines=1, elem_id="ingredients-input")
+        generate_button = gr.Button(value="Generate Recipe")
+        clear_button = gr.Button(value="Clear")  # Clear button to reset the chat
+        loading_spinner = gr.Spinner(visible=False)  # This will be used to show the loading spinner
 
     examples = gr.Examples(
         elem_id="examples",
@@ -86,13 +111,33 @@ with gr.Blocks(css="./css/styles.css") as recipegen:
             "strawberries, vanilla, honey, rolled oats, almonds, butter",
             "hake, spring onion, lemon"
         ],
-        inputs=[user_ingredients]
+        inputs=[user_input]
     )
 
+    # Link the chatbot and input to the generate_recipe function, adding loading indicator
     generate_button.click(
         fn=generate_recipe,
-        inputs=[user_ingredients, user_recipe_name],
-        outputs=[generated_recipe]
+        inputs=[user_input],
+        outputs=[chatbot, loading_spinner]
     )
 
+    # Show loading spinner while processing
+    def show_loading_spinner():
+        return gr.update(visible=True), gr.update(visible=False)
+
+    # Hide loading spinner once result is available
+    def hide_loading_spinner():
+        return gr.update(visible=False), gr.update(visible=True)
+
+    # Set actions for the loading spinner
+    generate_button.click(fn=show_loading_spinner, outputs=[loading_spinner])
+    generate_button.click(fn=hide_loading_spinner, inputs=[chatbot], outputs=[loading_spinner])
+
+    # Clear inputs and outputs when the "Clear" button is clicked
+    def clear_all():
+        return gr.update(value=""), gr.update(value=""), gr.update(value="", visible=False)  # Clear input, output, and hide spinner
+
+    clear_button.click(fn=clear_all, outputs=[user_input, chatbot, loading_spinner])
+
 recipegen.launch(share=True)
+