new code

agents/product_manager_agent.py

@@ -1,8 +1,6 @@
 from transformers import AutoTokenizer, AutoModelForCausalLM
 import torch
 from langchain_core.messages import AIMessage
-import asyncio
-from typing import Generator, Dict, Any
 
 MODEL_REPO = "Rahul-8799/product_manager_mistral"
 
@@ -13,43 +11,15 @@ model = AutoModelForCausalLM.from_pretrained(
     device_map="auto"
 )
 
-async def stream_inference(prompt: str) -> Generator[str, None, None]:
-    """Stream the model's output token by token"""
-    input_ids = tokenizer(prompt, return_tensors="pt").input_ids.to(model.device)
-    
-    # Generate tokens one by one
-    for _ in range(100):  # Limit to 100 tokens for streaming demo
-        output_ids = model.generate(
-            input_ids,
-            max_new_tokens=1,
-            pad_token_id=tokenizer.eos_token_id
-        )
-        
-        # Get the new token
-        new_token = output_ids[0][-1]
-        if new_token == tokenizer.eos_token_id:
-            break
-            
-        # Decode and yield the token
-        token_text = tokenizer.decode([new_token])
-        yield token_text
-        
-        # Update input_ids for next iteration
-        input_ids = output_ids
-        
-        # Small delay to simulate streaming
-        await asyncio.sleep(0.05)
-
-async def run(state: Dict[str, Any]) -> Dict[str, Any]:
-    """Product Manager generates structured product requirements with streaming output"""
+def run(state: dict) -> dict:
+    """Generates structured product requirements from user input prompt."""
     messages = state["messages"]
     prompt = messages[-1].content
-    
-    # Stream the output
-    output = ""
-    async for token in stream_inference(prompt):
-        output += token
-    
+
+    input_ids = tokenizer(prompt, return_tensors="pt").input_ids.to(model.device)
+    output_ids = model.generate(input_ids, max_new_tokens=3000)
+    output = tokenizer.decode(output_ids[0], skip_special_tokens=True)
+
     return {
         "messages": [AIMessage(content=output)],
         "chat_log": state["chat_log"] + [{"role": "Product Manager", "content": output}],

agents/software_engineer_agent.py

@@ -1,8 +1,6 @@
 from transformers import AutoTokenizer, AutoModelForCausalLM
 import torch
 from langchain_core.messages import AIMessage
-import asyncio
-from typing import Generator, Dict, Any
 
 MODEL_REPO = "Rahul-8799/software_engineer_mellum"
 
@@ -13,79 +11,79 @@ model = AutoModelForCausalLM.from_pretrained(
     device_map="auto"
 )
 
-async def stream_inference(prompt: str) -> Generator[str, None, None]:
-    """Stream the model's output token by token"""
-    input_ids = tokenizer(prompt, return_tensors="pt").input_ids.to(model.device)
-    
-    for _ in range(100):
-        output_ids = model.generate(
-            input_ids,
-            max_new_tokens=1,
-            pad_token_id=tokenizer.eos_token_id
-        )
-        
-        new_token = output_ids[0][-1]
-        if new_token == tokenizer.eos_token_id:
-            break
-            
-        token_text = tokenizer.decode([new_token])
-        yield token_text
-        
-        input_ids = output_ids
-        await asyncio.sleep(0.05)
-
-async def run(state: Dict[str, Any]) -> Dict[str, Any]:
-    """Software Engineer generates responsive and interactive UI code"""
+def run(state: dict) -> dict:
+    """Software Engineer generates clean, modern UI code using best practices"""
     messages = state["messages"]
     prompt = messages[-1].content
     
-    # Enhance the prompt with modern web development requirements
+    # Enhance the prompt with UI implementation guidelines
     enhanced_prompt = f"""
-    Generate modern, responsive, and interactive UI code following these requirements:
-    1. Use Tailwind CSS for responsive design
-    2. Implement JavaScript for interactivity
-    3. Add smooth animations and transitions
-    4. Ensure mobile-first approach
-    5. Include proper error handling
-    6. Add loading states and feedback
-    
+    Objective
+
+Generate modern, responsive, and accessible UI code that is visually appealing and adheres to current frontend development best practices.
+
+1. Styling Framework: Tailwind CSS
+	•	Use Tailwind CSS utility classes for styling all elements.
+	•	Apply spacing, typography, sizing, and layout using Tailwind classes.
+	•	Follow a mobile-first design approach.
+	•	Use Tailwind’s built-in responsive breakpoints (sm, md, lg, xl, 2xl) to adapt layouts for different screen sizes.
+
+2. Layout Techniques
+	•	Use CSS Grid for complex, multi-column or two-dimensional layouts.
+	•	Use Flexbox for flexible alignment of components like navigation bars, cards, buttons, and modals.
+	•	Maintain consistent spacing with utility classes such as gap, space-x, space-y, p-*, and m-*.
+
+3. Semantic HTML
+	•	Use semantic HTML tags appropriately: <header>, <nav>, <main>, <section>, <article>, <footer>, etc.
+	•	Avoid unnecessary <div> elements to prevent cluttered and unstructured markup.
+	•	Ensure proper nesting and hierarchy of elements.
+
+4. Accessibility
+	•	Add ARIA labels, role attributes, and alt text where needed for screen reader support.
+	•	Ensure keyboard accessibility with tabindex, proper focus states, and interactive elements being navigable.
+	•	Use <label> elements properly linked to form fields via the for attribute.
+
+5. Responsive Design
+	•	Use Tailwind’s responsive utilities to adjust layouts across various screen sizes.
+	•	Design components to be fully usable on both desktop and mobile devices.
+	•	Use collapsible or toggleable UI patterns (e.g., hamburger menus) for smaller viewports.
+
+6. Theming and Styling Consistency
+	•	Define and use CSS variables (--primary-color, --font-family, etc.) for theme consistency across components.
+	•	Maintain a clear visual hierarchy with consistent font sizes, weights, and colors.
+	•	Customize Tailwind’s theme configuration if needed for project-specific design tokens.
+
+7. JavaScript and Interactivity
+	•	Add interactivity using plain JavaScript, Alpine.js, or React if specified.
+	•	Implement common UI components such as modals, dropdowns, tooltips, accordions with appropriate open/close behavior.
+	•	Provide user feedback through form validations, dynamic updates, and transitions.
+
+8. Loading and Error States
+	•	Implement loading states using spinners, skeleton screens, or placeholders while data is being fetched or actions are processing.
+	•	Show error states using alerts, banners, or toast messages when applicable.
+	•	Use conditional rendering or state flags to handle visibility and transitions between states.
+
+9. Component Structure and Reusability
+	•	Break down the UI into modular, reusable components (e.g., Button, Card, Modal, Form).
+	•	Each component should:
+	•	Be self-contained with a clear purpose.
+	•	Accept inputs or props when necessary.
+	•	Maintain responsive and accessible markup by default.
+
+10. Code Quality Standards
+	•	Write clean, readable, and maintainable code.
+	•	Remove unused classes, scripts, or markup.
+	•	Follow consistent naming conventions and indentation rules.
+	•	Add comments only when necessary for clarity.
+
+
     Original requirements: {prompt}
-    
-    Generate the following files:
-    
-    1. index.html - Main HTML structure
-    2. styles.css - Custom styles (if needed beyond Tailwind)
-    3. script.js - Interactive features
-    4. tailwind.config.js - Tailwind configuration
-    
-    Format the output as:
-    
-    ## HTML Structure
-    ```html
-    [HTML code]
-    ```
-    
-    ## CSS Styles
-    ```css
-    [CSS code]
-    ```
-    
-    ## JavaScript
-    ```javascript
-    [JavaScript code]
-    ```
-    
-    ## Tailwind Config
-    ```javascript
-    [Tailwind configuration]
-    ```
     """
     
-    # Stream the output
-    output = ""
-    async for token in stream_inference(enhanced_prompt):
-        output += token
-    
+    input_ids = tokenizer(enhanced_prompt, return_tensors="pt").input_ids.to(model.device)
+    output_ids = model.generate(input_ids, max_new_tokens=3000)
+    output = tokenizer.decode(output_ids[0], skip_special_tokens=True)
+
     return {
         "messages": [AIMessage(content=output)],
         "chat_log": state["chat_log"] + [{"role": "Software Engineer", "content": output}],

agents/ui_designer_agent.py

@@ -1,10 +1,8 @@
 from transformers import AutoTokenizer, AutoModelForCausalLM
 import torch
 from langchain_core.messages import AIMessage
-import asyncio
-from typing import Generator, Dict, Any
 
-MODEL_REPO = "Rahul-8799/ui_designer_mistral"
+MODEL_REPO = "Rahul-8799/product_manager_mistral"
 
 tokenizer = AutoTokenizer.from_pretrained(MODEL_REPO, trust_remote_code=True)
 model = AutoModelForCausalLM.from_pretrained(
@@ -13,64 +11,30 @@ model = AutoModelForCausalLM.from_pretrained(
     device_map="auto"
 )
 
-async def stream_inference(prompt: str) -> Generator[str, None, None]:
-    """Stream the model's output token by token"""
-    input_ids = tokenizer(prompt, return_tensors="pt").input_ids.to(model.device)
-    
-    for _ in range(100):
-        output_ids = model.generate(
-            input_ids,
-            max_new_tokens=1,
-            pad_token_id=tokenizer.eos_token_id
-        )
-        
-        new_token = output_ids[0][-1]
-        if new_token == tokenizer.eos_token_id:
-            break
-            
-        token_text = tokenizer.decode([new_token])
-        yield token_text
-        
-        input_ids = output_ids
-        await asyncio.sleep(0.05)
-
-async def run(state: Dict[str, Any]) -> Dict[str, Any]:
-    """UI Designer creates responsive and interactive UI designs"""
+def run(state: dict) -> dict:
+    """UI Designer creates beautiful and structured UI designs with proper spacing and layout"""
     messages = state["messages"]
     prompt = messages[-1].content
     
-    # Enhance the prompt with responsive design requirements
+    # Enhance the prompt with UI design principles
     enhanced_prompt = f"""
-    Create a modern, responsive UI design following these requirements:
-    1. Mobile-first approach with responsive breakpoints
-    2. Modern CSS features (Flexbox, Grid, CSS Variables)
-    3. Interactive elements with JavaScript
-    4. Smooth animations and transitions
-    5. Accessibility features
-    6. Cross-browser compatibility
+    Create a beautiful and well-structured UI design following these principles:
+    1. Use proper spacing and padding (recommended: 1rem/16px for padding, 2rem/32px for margins)
+    2. Implement a consistent color scheme
+    3. Ensure proper hierarchy with clear headings
+    4. Use responsive design principles
+    5. Implement proper grid system
+    6. Add smooth transitions and hover effects
+    7. Ensure proper contrast and readability
+    8. Use modern UI components and patterns
     
     Original requirements: {prompt}
-    
-    Provide the design in this format:
-    
-    ## Responsive Layout
-    [Describe the responsive layout structure]
-    
-    ## CSS Framework
-    [Specify CSS framework and custom styles]
-    
-    ## JavaScript Features
-    [List interactive features and animations]
-    
-    ## Component Structure
-    [Describe component hierarchy and relationships]
     """
     
-    # Stream the output
-    output = ""
-    async for token in stream_inference(enhanced_prompt):
-        output += token
-    
+    input_ids = tokenizer(enhanced_prompt, return_tensors="pt").input_ids.to(model.device)
+    output_ids = model.generate(input_ids, max_new_tokens=3000)
+    output = tokenizer.decode(output_ids[0], skip_special_tokens=True)
+
     return {
         "messages": [AIMessage(content=output)],
         "chat_log": state["chat_log"] + [{"role": "UI Designer", "content": output}],

app.py

@@ -1,148 +1,21 @@
 import gradio as gr
-import asyncio
-from typing import Generator, List, Dict, Any
 from utils.langgraph_pipeline import run_pipeline_and_save
 
-class AgentInference:
-    def __init__(self):
-        self.current_agent = None
-        self.chat_log = []
-        self.is_running = False
-
-    async def stream_agent_output(self, agent_name: str, prompt: str) -> Generator[str, None, None]:
-        """Stream output from a single agent"""
-        self.current_agent = agent_name
-        # Simulate streaming output with delays
-        yield f"🤖 {agent_name} is thinking..."
-        await asyncio.sleep(1)
-        
-        # Get agent output
-        result = await self.get_agent_output(agent_name, prompt)
-        
-        # Stream the output word by word
-        words = result.split()
-        for word in words:
-            yield f"{word} "
-            await asyncio.sleep(0.1)
-        
-        self.chat_log.append({"role": agent_name, "content": result})
-        yield "\n\n"
-
-    async def get_agent_output(self, agent_name: str, prompt: str) -> str:
-        """Get output from a specific agent"""
-        # This would be replaced with actual agent calls
-        agents = {
-            "Product Manager": "Analyzing requirements and defining product specifications...",
-            "Project Manager": "Creating project timeline and resource allocation...",
-            "Software Architect": "Designing system architecture and technical specifications...",
-            "UI Designer": "Creating beautiful and user-friendly interface designs...",
-            "Software Engineer": "Implementing the UI components and functionality...",
-            "Quality Assurance": "Reviewing and testing the implementation..."
-        }
-        return agents.get(agent_name, "Processing...")
-
-    async def run_inference(self, prompt: str) -> Generator[Dict[str, Any], None, None]:
-        """Run inference through all agents with streaming output"""
-        self.is_running = True
-        self.chat_log = []
-        
-        agents = [
-            "Product Manager",
-            "Project Manager",
-            "Software Architect",
-            "UI Designer",
-            "Software Engineer",
-            "Quality Assurance"
-        ]
-        
-        for agent in agents:
-            if not self.is_running:
-                break
-                
-            async for output in self.stream_agent_output(agent, prompt):
-                yield {
-                    "agent": agent,
-                    "output": output,
-                    "chat_log": self.chat_log
-                }
-            
-            # Add a small delay between agents
-            await asyncio.sleep(0.5)
-        
-        # Generate final output
-        yield {
-            "agent": "System",
-            "output": "🎉 UI Generation Complete!",
-            "chat_log": self.chat_log
-        }
-
-inference_engine = AgentInference()
-
-def format_chat_log(chat_log: List[Dict[str, Any]]) -> List[tuple]:
-    """Format chat log for display"""
-    formatted_log = []
-    for entry in chat_log:
-        role = entry["role"]
-        content = entry["content"]
-        formatted_log.append((f"**{role}**:", content))
-    return formatted_log
-
-async def handle_run(prompt: str) -> Generator[tuple, None, None]:
-    """Handle the run button click with streaming output"""
-    async for update in inference_engine.run_inference(prompt):
-        formatted_log = format_chat_log(update["chat_log"])
-        yield formatted_log, None  # None for file_output until complete
+def handle_run(prompt):
+    chat_log, zip_path = run_pipeline_and_save(prompt)
+    return chat_log, zip_path
 
 with gr.Blocks() as demo:
-    gr.Markdown("""
-    # 🔧 Multi-Agent UI Generator (Real-time Inference)
-    
-    This system uses multiple AI agents working together to generate beautiful UI designs in real-time:
-    1. Product Manager: Defines requirements
-    2. Project Manager: Creates project plan
-    3. Software Architect: Designs system architecture
-    4. UI Designer: Creates beautiful UI design
-    5. Software Engineer: Implements the code
-    6. Quality Assurance: Reviews and suggests improvements
-    
-    Watch as each agent contributes to the design in real-time!
-    """)
-    
-    with gr.Row():
-        with gr.Column(scale=2):
-            input_box = gr.Textbox(
-                lines=4,
-                label="Enter your product idea prompt",
-                placeholder="Describe the website or UI you want to create..."
-            )
-            run_btn = gr.Button("Generate Website", variant="primary")
-            stop_btn = gr.Button("Stop Generation", variant="stop")
-        
-        with gr.Column(scale=3):
-            chatbox = gr.Chatbot(
-                label="Agent Conversation Log",
-                type="messages",
-                height=600
-            )
-            file_output = gr.File(label="Download UI ZIP")
-    
-    # Handle run button click
+    gr.Markdown("# 🔧 Multi-Agent UI Generator")
+    input_box   = gr.Textbox(lines=4, label="Enter your product idea prompt")
+    run_btn     = gr.Button("Generate Website")
+    chatbox     = gr.Chatbot(label="Agent Conversation Log", type="messages")
+    file_output = gr.File(label="Download UI ZIP")
+
     run_btn.click(
         fn=handle_run,
         inputs=[input_box],
         outputs=[chatbox, file_output],
-        api_name="generate"
-    )
-    
-    # Handle stop button click
-    def stop_generation():
-        inference_engine.is_running = False
-        return "Generation stopped by user"
-    
-    stop_btn.click(
-        fn=stop_generation,
-        outputs=[chatbox]
     )
 
-demo.queue()
 demo.launch()

utils/langgraph_pipeline.py

@@ -1,4 +1,4 @@
-import uuid, zipfile, re, json
+import uuid, zipfile, re
 from pathlib import Path
 from typing import TypedDict, List, Dict, Any, Tuple
 
@@ -21,8 +21,6 @@ from agents import (
 class InputState(TypedDict):
     messages: List[BaseMessage]
     chat_log: List[Dict[str, Any]]
-    iteration: int
-    feedback: str
 
 class OutputState(TypedDict):
     pm_output: str
@@ -32,8 +30,6 @@ class OutputState(TypedDict):
     dev_output: str
     qa_output: str
     chat_log: List[Dict[str, Any]]
-    iteration: int
-    feedback: str
 
 # ——————————————
 # 2) Wrap agents so they see full history
@@ -41,21 +37,12 @@ class OutputState(TypedDict):
 def wrap_agent(agent_run, output_key: str):
     def node(state: Dict[str, Any]) -> Dict[str, Any]:
         history = state["messages"]
-        log = state["chat_log"]
-        iteration = state.get("iteration", 0)
-        feedback = state.get("feedback", "")
-        
-        # Add feedback to the prompt if it exists
-        if feedback:
-            history = history + [AIMessage(content=f"Previous feedback: {feedback}")]
-        
-        result = agent_run({"messages": history, "chat_log": log})
+        log     = state["chat_log"]
+        result  = agent_run({"messages": history, "chat_log": log})
         return {
             "messages": history + result["messages"],
-            "chat_log": result["chat_log"],
-            output_key: result[output_key],
-            "iteration": iteration,
-            "feedback": feedback
+            "chat_log":  result["chat_log"],
+            output_key:  result[output_key],
         }
     return node
 
@@ -64,84 +51,50 @@ def wrap_agent(agent_run, output_key: str):
 # ——————————————
 def bridge_to_pm(state: Dict[str, Any]) -> Dict[str, Any]:
     history = state["messages"]
-    log = state["chat_log"]
-    iteration = state.get("iteration", 0)
-    feedback = state.get("feedback", "")
-    
+    log     = state["chat_log"]
     if not history or not isinstance(history[-1], HumanMessage):
         raise ValueError("bridge_to_pm expected a HumanMessage at history end")
-    
     prompt = history[-1].content
     spec_prompt = (
-        f"# Stakeholder Prompt (Iteration {iteration})\n\n"
+        f"# Stakeholder Prompt\n\n"
         f"\"{prompt}\"\n\n"
-    )
-    
-    if feedback:
-        spec_prompt += f"Previous feedback to consider:\n{feedback}\n\n"
-    
-    spec_prompt += (
         "Generate a structured product specification including:\n"
         "- Goals\n"
         "- Key features\n"
         "- User stories\n"
         "- Success metrics\n"
     )
-    
     return {
         "messages": [AIMessage(content=spec_prompt)],
         "chat_log": log + [{"role": "System", "content": spec_prompt}],
-        "iteration": iteration,
-        "feedback": feedback
     }
 
 # ——————————————
-# 4) Feedback Loop Handler
-# ——————————————
-def handle_feedback(state: Dict[str, Any]) -> Dict[str, Any]:
-    qa_output = state["qa_output"]
-    iteration = state.get("iteration", 0)
-    
-    # Check if we need another iteration
-    if iteration < 3:  # Maximum 3 iterations
-        return {
-            "messages": state["messages"],
-            "chat_log": state["chat_log"],
-            "iteration": iteration + 1,
-            "feedback": f"Iteration {iteration + 1} feedback: {qa_output}"
-        }
-    return END
-
-# ——————————————
-# 5) Build & compile the LangGraph
+# 4) Build & compile the LangGraph
 # ——————————————
 graph = StateGraph(input=InputState, output=OutputState)
 
-# Add nodes
-graph.add_node("BridgePM", bridge_to_pm)
-graph.add_node("ProductManager", wrap_agent(product_manager_agent.run, "pm_output"))
-graph.add_node("ProjectManager", wrap_agent(project_manager_agent.run, "proj_output"))
-graph.add_node("SoftwareArchitect", wrap_agent(software_architect_agent.run, "arch_output"))
-graph.add_node("UIDesigner", wrap_agent(ui_designer_agent.run, "ui_design_output"))
-graph.add_node("SoftwareEngineer", wrap_agent(software_engineer_agent.run, "dev_output"))
-graph.add_node("QualityAssurance", wrap_agent(quality_assurance_agent.run, "qa_output"))
-graph.add_node("FeedbackHandler", handle_feedback)
+graph.add_node("BridgePM",         bridge_to_pm)
+graph.add_node("ProductManager",   wrap_agent(product_manager_agent.run,   "pm_output"))
+graph.add_node("ProjectManager",   wrap_agent(project_manager_agent.run,   "proj_output"))
+graph.add_node("SoftwareArchitect",wrap_agent(software_architect_agent.run, "arch_output"))
+graph.add_node("UIDesigner",       wrap_agent(ui_designer_agent.run,       "ui_design_output"))
+graph.add_node("SoftwareEngineer", wrap_agent(software_engineer_agent.run,  "dev_output"))
+graph.add_node("QualityAssurance", wrap_agent(quality_assurance_agent.run,  "qa_output"))
 
-# Add edges with feedback loop
 graph.set_entry_point("BridgePM")
-graph.add_edge("BridgePM", "ProductManager")
-graph.add_edge("ProductManager", "ProjectManager")
-graph.add_edge("ProjectManager", "SoftwareArchitect")
-graph.add_edge("SoftwareArchitect", "UIDesigner")
-graph.add_edge("UIDesigner", "SoftwareEngineer")
+graph.add_edge("BridgePM",         "ProductManager")
+graph.add_edge("ProductManager",   "ProjectManager")
+graph.add_edge("ProjectManager",   "SoftwareArchitect")
+graph.add_edge("SoftwareArchitect","UIDesigner")
+graph.add_edge("UIDesigner",       "SoftwareEngineer")
 graph.add_edge("SoftwareEngineer", "QualityAssurance")
-graph.add_edge("QualityAssurance", "FeedbackHandler")
-graph.add_edge("FeedbackHandler", "BridgePM")  # Feedback loop back to start
+graph.add_edge("QualityAssurance", END)
 
 compiled_graph = graph.compile()
 
 # ——————————————
-# 6) Parse spec into sections
+# 5) Parse spec into sections
 # ——————————————
 def parse_spec(spec: str) -> Dict[str, List[str]]:
     sections: Dict[str, List[str]] = {}
@@ -152,115 +105,75 @@ def parse_spec(spec: str) -> Dict[str, List[str]]:
     return sections
 
 # ——————————————
-# 7) Run pipeline, generate site, zip, return (chat_log, zip_path)
+# 6) Run pipeline, generate site, zip, return (chat_log, zip_path)
 # ——————————————
 def run_pipeline_and_save(prompt: str) -> Tuple[List[Dict[str, Any]], str]:
     # a) invoke agents
-    initial_state = {"messages": [HumanMessage(content=prompt)], "chat_log": [], "iteration": 0, "feedback": ""}
-    final_state = compiled_graph.invoke(initial_state)
-
-    chat_log = final_state["chat_log"]
-    dev_output = final_state["dev_output"]
+    initial_state = {"messages": [HumanMessage(content=prompt)], "chat_log": []}
+    final_state   = compiled_graph.invoke(initial_state)
+
+    chat_log  = final_state["chat_log"]
+    qa_output = final_state["qa_output"]
+
+    # b) parse spec
+    spec = parse_spec(qa_output)
+    features     = spec.get("Key features", [])
+    testimonials = spec.get("User stories", [])
+
+    # c) build HTML
+    title = prompt.title()
+    domain = prompt.replace(" ", "").lower() + ".com"
+    cards_html = "\n".join(f"<div class='card'><h3>{f}</h3></div>" for f in features)
+    test_html  = "\n".join(f"<blockquote>{t}</blockquote>" for t in testimonials)
+
+    html_code = f"""<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>{title}</title>
+  <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+  <header><h1>{title}</h1></header>
+  <section id="features">
+    <h2>Features</h2>
+    <div class="cards">
+      {cards_html}
+    </div>
+  </section>
+  <section id="testimonials">
+    <h2>Testimonials</h2>
+    {test_html or '<p>No testimonials provided.</p>'}
+  </section>
+  <section id="contact">
+    <h2>Contact Us</h2>
+    <p>Email: info@{domain}</p>
+  </section>
+</body>
+</html>"""
+
+    # d) basic CSS
+    css_code = """
+body { font-family: Arial, sans-serif; margin: 1em; line-height: 1.5; }
+header { text-align: center; margin-bottom: 2em; }
+.cards { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 1em; }
+.card { background: #f9f9f9; padding: 1em; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); text-align: center; }
+blockquote { font-style: italic; margin: 1em; padding: 0.5em; background: #eef; border-left: 4px solid #99f; }
+"""
 
-    # b) parse the developer output to extract code sections
-    sections = parse_code_sections(dev_output)
-    
-    # c) write & zip
-    site_id = uuid.uuid4().hex
-    out_dir = Path("output")
+    # e) write & zip
+    site_id  = uuid.uuid4().hex
+    out_dir  = Path("output")
     site_dir = out_dir / f"site_{site_id}"
     site_dir.mkdir(parents=True, exist_ok=True)
 
-    # Write HTML file
-    (site_dir / "index.html").write_text(sections.get("HTML Structure", ""), encoding="utf-8")
-    
-    # Write CSS file
-    (site_dir / "styles.css").write_text(sections.get("CSS Styles", ""), encoding="utf-8")
-    
-    # Write JavaScript file
-    (site_dir / "script.js").write_text(sections.get("JavaScript", ""), encoding="utf-8")
-    
-    # Write Tailwind config
-    (site_dir / "tailwind.config.js").write_text(sections.get("Tailwind Config", ""), encoding="utf-8")
-    
-    # Create package.json for dependencies
-    package_json = {
-        "name": f"site_{site_id}",
-        "version": "1.0.0",
-        "description": "Generated responsive website",
-        "scripts": {
-            "build": "tailwindcss -i ./styles.css -o ./dist/output.css",
-            "watch": "tailwindcss -i ./styles.css -o ./dist/output.css --watch"
-        },
-        "dependencies": {
-            "tailwindcss": "^3.4.1",
-            "alpinejs": "^3.13.3"
-        }
-    }
-    
-    (site_dir / "package.json").write_text(
-        json.dumps(package_json, indent=2),
-        encoding="utf-8"
-    )
-
-    # Create README
-    readme_content = f"""# Generated Website
-
-This is a responsive website generated by the Multi-Agent UI Generator.
-
-## Setup
-
-1. Install dependencies:
-   ```bash
-   npm install
-   ```
-
-2. Build the CSS:
-   ```bash
-   npm run build
-   ```
-
-3. For development with live reload:
-   ```bash
-   npm run watch
-   ```
+    (site_dir / "index.html").write_text(html_code, encoding="utf-8")
+    (site_dir / "styles.css").write_text(css_code,  encoding="utf-8")
 
-## Features
-
-- Responsive design using Tailwind CSS
-- Interactive elements with JavaScript
-- Modern animations and transitions
-- Mobile-first approach
-"""
-    
-    (site_dir / "README.md").write_text(readme_content, encoding="utf-8")
-
-    # Create zip file
     zip_path = out_dir / f"site_{site_id}.zip"
     with zipfile.ZipFile(zip_path, "w", zipfile.ZIP_DEFLATED) as zf:
         for f in site_dir.iterdir():
             zf.write(f, arcname=f.name)
 
     return chat_log, str(zip_path)
-
-def parse_code_sections(output: str) -> Dict[str, str]:
-    """Parse code sections from the developer output"""
-    sections = {}
-    current_section = None
-    current_code = []
-    
-    for line in output.split("\n"):
-        if line.startswith("## "):
-            if current_section:
-                sections[current_section] = "\n".join(current_code)
-            current_section = line[3:].strip()
-            current_code = []
-        elif line.startswith("```"):
-            continue
-        elif current_section:
-            current_code.append(line)
-    
-    if current_section:
-        sections[current_section] = "\n".join(current_code)
-    
-    return sections