Update app.py

app.py

@@ -31,13 +31,24 @@ def generate_gradio_app(image):
         img_str = base64.b64encode(buffered.getvalue()).decode()
         
         # Prepare the messages for the API call
-        system_message = "You are an AI assistant that can analyze wireframe images and generate Gradio code based on their content."
+        system_message = """You are an AI assistant that can analyze wireframe images and generate detailed Gradio code based on their content. Your task is to provide a complete, runnable Gradio application that recreates the UI elements seen in the wireframe."""
+
         user_message = f"""
         <image>
         data:image/png;base64,{img_str}
         </image>
         
-        Analyze this wireframe image and generate Python code using Gradio that could recreate the main elements seen in the image. Use Gradio components that best represent the UI elements in the wireframe.
+        Analyze this wireframe image and generate a complete Python code using Gradio that recreates all the main elements seen in the image. Follow these guidelines:
+        1. Use appropriate Gradio components that best represent each UI element in the wireframe.
+        2. Include all necessary imports at the beginning of the code.
+        3. Implement placeholder functions for any interactive elements (buttons, inputs, etc.).
+        4. Use gr.Blocks() to create a layout that matches the wireframe as closely as possible.
+        5. Add appropriate labels and descriptions for all components.
+        6. Include the gr.Blocks().launch() call at the end of the code.
+        7. Provide a complete, runnable Gradio application that can be executed as-is.
+        8. Add comments explaining the purpose of each major section or component.
+
+        Please generate the entire code, including all necessary parts to make it a fully functional Gradio application.
         """
         
         messages = [
@@ -85,7 +96,7 @@ with gr.Blocks() as demo:
             
             generate_button = gr.Button("Generate Gradio app", variant="primary")
     
-    code_output = gr.Code(language="python", label="Generated Gradio Code", lines=20)
+    code_output = gr.Code(language="python", label="Generated Gradio Code", lines=30)
     
     generate_button.click(
         fn=generate_gradio_app,