Update app.py

app.py

@@ -14,7 +14,7 @@ if api_key:
     except Exception as e:
         print(f"Error initializing Together client: {e}")
 
-def generate_app(image):
+def generate_gradio_app(image):
     if not api_key or not client:
         return "Error: TOGETHER_API_KEY not set or client initialization failed. Please check your API key."
 
@@ -26,35 +26,39 @@ def generate_app(image):
         
         # Prepare the messages for the API call
         messages = [
-            {"role": "system", "content": "You are an AI assistant that can analyze wireframe images and generate React code based on their content."},
+            {"role": "system", "content": "You are an AI assistant that can analyze wireframe images and generate Gradio code based on their content."},
             {"role": "user", "content": [
                 {"type": "image_url", "image_url": f"data:image/png;base64,{img_str}"},
-                {"type": "text", "text": "Analyze this wireframe image and generate React code with Tailwind CSS classes that could recreate the main elements seen in the image."}
+                {"type": "text", "text": "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."}
             ]}
         ]
         
         # Make the API call
         response = client.chat.completions.create(
-            model="meta-llama/Llama-2-70b-chat",
+            model="meta-llama/Llama-Vision-Free",
             messages=messages,
-            max_tokens=1024,
+            max_tokens=512,
             temperature=0.7,
             top_p=0.7,
             top_k=50,
             repetition_penalty=1,
-            stop=["<|im_end|>"]
+            stop=["<|eot_id|>", "<|eom_id|>"],
+            stream=True
         )
         
-        # Extract the generated code from the response
-        generated_code = response.choices[0].message.content
+        # Collect the streamed response
+        generated_code = ""
+        for chunk in response:
+            if chunk.choices[0].delta.content is not None:
+                generated_code += chunk.choices[0].delta.content
         
         return generated_code
     except Exception as e:
         return f"An error occurred: {str(e)}"
 
 with gr.Blocks() as demo:
-    gr.Markdown("# Turn your wireframe into an app")
-    gr.Markdown("Upload an image of your website design and we'll build it for you with React + Tailwind.")
+    gr.Markdown("# Turn your wireframe into a Gradio app")
+    gr.Markdown("Upload an image of your UI design and we'll build a Gradio app for you.")
     
     with gr.Row():
         with gr.Column():
@@ -62,17 +66,17 @@ with gr.Blocks() as demo:
             example_link = gr.Markdown("Need an example image? [Try ours](https://example.com/wireframe.png).")
             
             model_dropdown = gr.Dropdown(
-                choices=["Llama 2 70B Vision"],
-                value="Llama 2 70B Vision",
+                choices=["Llama-Vision-Free"],
+                value="Llama-Vision-Free",
                 label="AI Model"
             )
             
-            generate_button = gr.Button("Generate app", variant="primary")
+            generate_button = gr.Button("Generate Gradio app", variant="primary")
     
-    code_output = gr.Code(language="javascript", label="Generated React Code", lines=10)
+    code_output = gr.Code(language="python", label="Generated Gradio Code", lines=20)
     
     generate_button.click(
-        fn=generate_app,
+        fn=generate_gradio_app,
         inputs=[image_input],
         outputs=[code_output]
     )