refactor: cleanup and update README.md with new features and usage instructions

.env.example

@@ -6,17 +6,3 @@ API_KEY=
 GRADIO_HOST=127.0.0.1
 GRADIO_PORT=7860
 GRADIO_DEBUG=true
-
-# Planning Agent Settings
-PLANNING_VERBOSITY=1
-MAX_PLANNING_STEPS=10
-
-# Coding Agent Settings
-CODING_VERBOSITY=2
-MAX_CODING_STEPS=20
-CODE_MODEL_ID=Qwen/Qwen2.5-Coder-32B-Instruct
-
-# Testing Agent Settings
-TESTING_VERBOSITY=2
-MAX_TESTING_STEPS=15
-TEST_MODEL_ID=Qwen/Qwen2.5-Coder-32B-Instruct

README.md

@@ -15,26 +15,95 @@ authors:
 tags:
   - agent-demo-track
 ---
+# 💗 Likable: It's almost lovable...
 
-# 💗 Likable
+[![Hugging Face Spaces](https://img.shields.io/badge/🤗%20Hugging%20Face-Spaces-blue)](https://huggingface.co/spaces/ZwischenholtzW/likable)
+[![License: Apache 2.0](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0)
 
-A powerful AI coding assistant that can create and preview Gradio applications in real-time.
+**Likable is a powerful, real-time AI coding assistant that allows you to develop and preview Gradio applications through a conversational interface.**
 
-## Features
+Just describe the application you want to build, and watch as the AI agent writes the code, handles dependencies, and spins up a live, interactive preview for you in real-time. It's the fastest way to go from idea to a working Gradio app.
 
-- **Real-time Code Generation**: AI agent that can write and modify code
-- **Live Preview**: See your applications running instantly in an iframe
-- **Multiple AI Providers**: Support for Anthropic, OpenAI, Mistral, and more
-- **File Management**: Edit and save files directly in the interface
-- **API Key Management**: Secure configuration for different AI providers
+This project is a submission for the [Gradio Agents & MCP Hackathon 2025](https://huggingface.co/Agents-MCP-Hackathon).
 
-## Usage
+---
+
+## ✨ Features
+
+- **🤖 Conversational AI Development**: Simply chat with the agent to build, modify, and extend your Gradio applications.
+- **⚡ Real-time Live Preview**: The agent automatically runs your application in a sandboxed environment, and you can interact with it instantly in the "Preview" tab.
+- **📝 In-App Code Editor**: View, edit, and save the code generated by the agent directly within the "Code" tab.
+- **🛠️ Autonomous Tool Use**: The agent can:
+    - Create and edit Python files.
+    - Install necessary Python packages using `pip`.
+    - List and view files to understand the project context.
+    - Test the generated code to ensure it runs without errors.
+- **🔐 Secure API Key Management**: Easily configure API keys for various LLM providers through the "Settings" tab.
+- **🔄 Multi-Provider Support**: Powered by `LiteLLM`, allowing for integration with OpenAI, Anthropic, Mistral, Qwen, and more.
+
+---
+
+## 🚀 Getting Started (Local Development)
+
+Likable is designed to run in a Docker container, mirroring its Hugging Face Spaces environment.
+
+**Prerequisites:**
+- [Docker](https://www.docker.com/get-started) installed on your system.
+- Git.
+
+**1. Clone the repository:**
+```bash
+git clone https://huggingface.co/spaces/ZwischenholtzW/likable
+cd likable
+```
+
+**2. Create your environment file:**
+Create a `.env` file in the root of the project. This is where you'll put your API key.
+```bash
+cp .env.example .env
+```
+Now, open `.env` and add your API key:
+```dotenv
+# .env
+API_KEY="your_secret_api_key_here"
+MODEL_ID="anthropic/claude-sonnet-4-20250514"
+```
+
+**3. Build and run the Docker container:**
+```bash
+docker build -t likable-app .
+docker run -p 7860:7860 --env-file .env likable-app
+```
+
+**4. Open the application:**
+Navigate to [http://127.0.0.1:7860](http://127.0.0.1:7860) in your web browser.
 
-1. Configure your API keys in the Settings tab
-2. Ask the AI to create or modify applications
-3. View the live preview in the Preview tab
-4. Edit code directly in the Code tab
+---
+
+## 🛠️ How It Works
+
+Likable uses a `smolagents` based AI agent specifically prompted for Gradio development. The workflow is as follows:
+
+1.  **User Prompt**: You provide a task in the chat interface (e.g., "Create a simple calculator app").
+2.  **Agent Execution**: The agent receives the prompt and uses its available tools (`create_new_file`, `python_editor`, `install_package`, `test_app_py`) to accomplish the task. All generated code is created inside a secure `sandbox` directory.
+3.  **Code Generation**: The agent writes or modifies an `app.py` file within the sandbox. It is critically instructed to include the necessary boilerplate to make the app launchable.
+4.  **Live Preview Subprocess**: The main application detects changes to `sandbox/app.py` and launches it in a separate, isolated subprocess.
+5.  **Iframe Display**: The running Gradio app is served on an internal port and displayed to the user through an iframe in the "Preview" tab, with cache-busting to ensure the latest version is always shown.
+
+This cycle repeats as you provide more instructions, allowing for iterative and interactive development.
+
+---
+
+## 💻 Technology Stack
+
+- **Backend & UI**: [Gradio](https://www.gradio.app/)
+- **AI Agent Framework**: [smol-agents](https://github.com/smol-ai/developer)
+- **LLM Integration**: [LiteLLM](https://github.com/BerriAI/litellm)
+- **Containerization**: [Docker](https://www.docker.com/)
+- **Code Quality**: `ruff` and `pre-commit`
+
+---
 
-## Docker Deployment
+## 📜 License
 
-This Space runs a simplified Docker configuration optimized for Hugging Face Spaces, with the main Gradio application running directly on port 7860.
+This project is licensed under the [Apache 2.0 License](LICENSE).

app.py → src/app.py

@@ -10,8 +10,8 @@ from pathlib import Path
 import gradio as gr
 from smolagents.agents import MultiStepAgent
 
-from ui_helpers import stream_to_gradio
-from utils import load_file
+from .ui_helpers import stream_to_gradio
+from .utils import load_file
 
 preview_process = None
 PREVIEW_PORT = 7861  # Internal port for preview apps
@@ -385,7 +385,7 @@ def get_default_model_for_provider(provider: str) -> str:
     provider_model_map = {
         "Anthropic": "anthropic/claude-sonnet-4-20250514",
         "OpenAI": "openai/gpt-4.1",
-        "Mistral": "mistral/devstral-latest",
+        "Mistral": "mistral/devstral-small-latest",
         "SambaNova": "sambanova/Qwen3-32B",
         "Hugging Face": "huggingface/together/Qwen/Qwen2.5-Coder-32B-Instruct",
     }
@@ -947,7 +947,7 @@ class GradioUI:
 
     def recreate_agent_with_new_model(self, session_state, provider=None):
         """Recreate the agent with updated model configuration."""
-        from kiss_agent import KISSAgent
+        from .kiss_agent import KISSAgent
 
         # Get the new model ID if provider is specified
         if provider and provider != "Hugging Face":
@@ -978,7 +978,7 @@ class GradioUI:
 if __name__ == "__main__":
     import sys
 
-    from kiss_agent import KISSAgent
+    from .kiss_agent import KISSAgent
 
     # Initialize model configuration based on available API keys
     print("🔍 Checking for available API keys...")

kiss_agent.py → src/kiss_agent.py

@@ -5,7 +5,7 @@ from pathlib import Path
 
 from smolagents import LiteLLMModel, ToolCallingAgent, tool
 
-from settings import settings
+from .settings import settings
 
 PROMPT_TEMPLATE = """You are an expert software developer for Gradio.
 You are given a task to develop a Gradio application and can use all the tools \

settings.py → src/settings.py

@@ -23,30 +23,11 @@ class Settings:
         self.api_base_url: str | None = os.getenv("API_BASE_URL")
         self.api_key: str | None = os.getenv("API_KEY")
 
-        # Manager Agent Settings
-        self.manager_model_id: str = os.getenv("MANAGER_MODEL_ID", self.model_id)
-        self.manager_verbosity: int = int(os.getenv("MANAGER_VERBOSITY", "1"))
-        self.max_manager_steps: int = int(os.getenv("MAX_MANAGER_STEPS", "15"))
-
-        # Coding Agent Settings
-        self.code_model_id: str = os.getenv("CODE_MODEL_ID", self.model_id)
-        self.coding_verbosity: int = int(os.getenv("CODING_VERBOSITY", "2"))
-        self.max_coding_steps: int = int(os.getenv("MAX_CODING_STEPS", "20"))
-
-        # Testing Agent Settings
-        self.test_model_id: str = os.getenv("TEST_MODEL_ID", self.model_id)
-        self.testing_verbosity: int = int(os.getenv("TESTING_VERBOSITY", "2"))
-        self.max_testing_steps: int = int(os.getenv("MAX_TESTING_STEPS", "15"))
-
         # Application Settings
         self.gradio_host: str = os.getenv("GRADIO_HOST", "127.0.0.1")
         self.gradio_port: int = int(os.getenv("GRADIO_PORT", "7860"))
         self.gradio_debug: bool = os.getenv("GRADIO_DEBUG", "false").lower() == "true"
 
-        # Planning Agent Settings
-        self.planning_verbosity: int = int(os.getenv("PLANNING_VERBOSITY", "1"))
-        self.max_planning_steps: int = int(os.getenv("MAX_PLANNING_STEPS", "10"))
-
         # Validate critical settings
         self._validate()
 
@@ -55,47 +36,12 @@ class Settings:
 
         if not self.api_key:
             print("⚠️  Warning: API_KEY not set in environment variables.")
-            print(
-                "   The planning and coding agents may not work \
-without a valid API key."
-            )
+            print("   The agent may not work without a valid API key.")
             print("   Set it in your .env file or as an environment variable.")
             print()
 
-        if self.manager_verbosity not in [0, 1, 2]:
-            print(
-                f"⚠️  Warning: MANAGER_VERBOSITY={self.manager_verbosity} is not \
-in valid range [0, 1, 2]"
-            )
-            print("   Using default value of 1")
-            self.manager_verbosity = 1
-
-        if self.planning_verbosity not in [0, 1, 2]:
-            print(
-                f"⚠️  Warning: PLANNING_VERBOSITY={self.planning_verbosity} is not \
-in valid range [0, 1, 2]"
-            )
-            print("   Using default value of 1")
-            self.planning_verbosity = 1
-
-        if self.coding_verbosity not in [0, 1, 2]:
-            print(
-                f"⚠️  Warning: CODING_VERBOSITY={self.coding_verbosity} is not \
-in valid range [0, 1, 2]"
-            )
-            print("   Using default value of 2")
-            self.coding_verbosity = 2
-
-        if self.testing_verbosity not in [0, 1, 2]:
-            print(
-                f"⚠️  Warning: TESTING_VERBOSITY={self.testing_verbosity} is not \
-in valid range [0, 1, 2]"
-            )
-            print("   Using default value of 2")
-            self.testing_verbosity = 2
-
     def get_model_config(self) -> dict:
-        """Get model configuration for the planning agent."""
+        """Get model configuration for the agent."""
         config = {"model_id": self.model_id, "api_key": self.api_key}
 
         if self.api_base_url:
@@ -105,28 +51,6 @@ in valid range [0, 1, 2]"
 
         return config
 
-    def get_manager_model_config(self) -> dict:
-        """Get model configuration for the manager agent."""
-        config = {"model_id": self.manager_model_id, "api_key": self.api_key}
-
-        if self.api_base_url:
-            config["api_base_url"] = self.api_base_url
-        if self.api_key:
-            config["api_key"] = self.api_key
-
-        return config
-
-    def get_code_model_config(self) -> dict:
-        """Get model configuration for the coding agent."""
-        config = {"model_id": self.code_model_id, "api_key": self.api_key}
-
-        if self.api_base_url:
-            config["api_base_url"] = self.api_base_url
-        if self.api_key:
-            config["api_key"] = self.api_key
-
-        return config
-
     def get_gradio_config(self) -> dict:
         """Get Gradio launch configuration."""
         return {
@@ -135,65 +59,15 @@ in valid range [0, 1, 2]"
             "debug": self.gradio_debug,
         }
 
-    def get_manager_config(self) -> dict:
-        """Get manager agent configuration."""
-        return {
-            "verbosity_level": self.manager_verbosity,
-            "max_steps": self.max_manager_steps,
-        }
-
-    def get_planning_config(self) -> dict:
-        """Get planning agent configuration."""
-        return {
-            "verbosity_level": self.planning_verbosity,
-            "max_steps": self.max_planning_steps,
-        }
-
-    def get_coding_config(self) -> dict:
-        """Get coding agent configuration."""
-        return {
-            "verbosity_level": self.coding_verbosity,
-            "max_steps": self.max_coding_steps,
-        }
-
-    def get_test_model_config(self) -> dict:
-        """Get model configuration for the testing agent."""
-        config = {"model_id": self.test_model_id, "api_key": self.api_key}
-
-        if self.api_base_url:
-            config["api_base_url"] = self.api_base_url
-        if self.api_key:
-            config["api_key"] = self.api_key
-
-        return config
-
-    def get_testing_config(self) -> dict:
-        """Get testing agent configuration."""
-        return {
-            "verbosity_level": self.testing_verbosity,
-            "max_steps": self.max_testing_steps,
-        }
-
     def __repr__(self) -> str:
         """String representation of settings (excluding sensitive data)."""
         return f"""Settings(
     model_id='{self.model_id}',
-    manager_model_id='{self.manager_model_id}',
-    code_model_id='{self.code_model_id}',
-    test_model_id='{self.test_model_id}',
     api_key={'***' if self.api_key else 'None'},
     api_base_url='{self.api_base_url}',
     gradio_host='{self.gradio_host}',
     gradio_port={self.gradio_port},
-    gradio_debug={self.gradio_debug},
-    manager_verbosity={self.manager_verbosity},
-    max_manager_steps={self.max_manager_steps},
-    planning_verbosity={self.planning_verbosity},
-    max_planning_steps={self.max_planning_steps},
-    coding_verbosity={self.coding_verbosity},
-    max_coding_steps={self.max_coding_steps},
-    testing_verbosity={self.testing_verbosity},
-    max_testing_steps={self.max_testing_steps}
+    gradio_debug={self.gradio_debug}
 )"""
 
 
@@ -220,23 +94,5 @@ if __name__ == "__main__":
     print("Model Config:")
     print(settings.get_model_config())
     print()
-    print("Manager Model Config:")
-    print(settings.get_manager_model_config())
-    print()
-    print("Code Model Config:")
-    print(settings.get_code_model_config())
-    print()
     print("Gradio Config:")
     print(settings.get_gradio_config())
-    print()
-    print("Manager Config:")
-    print(settings.get_manager_config())
-    print()
-    print("Planning Config:")
-    print(settings.get_planning_config())
-    print()
-    print("Coding Config:")
-    print(settings.get_coding_config())
-    print()
-    print("Testing Config:")
-    print(settings.get_testing_config())

ui_helpers.py → src/ui_helpers.py

@@ -218,35 +218,6 @@ def _process_action_step(
     # )
 
 
-def _process_planning_step(
-    step_log: PlanningStep, skip_model_outputs: bool = False
-) -> Generator:
-    """
-    Process a [`PlanningStep`] and yield appropriate gradio.ChatMessage objects.
-
-    Args:
-        step_log ([`PlanningStep`]): PlanningStep to process.
-
-    Yields:
-        `gradio.ChatMessage`: Gradio ChatMessages representing the planning step.
-    """
-    import gradio as gr
-
-    if not skip_model_outputs:
-        yield gr.ChatMessage(
-            role="assistant", content="**Planning step**", metadata={"status": "done"}
-        )
-        yield gr.ChatMessage(
-            role="assistant", content=step_log.plan, metadata={"status": "done"}
-        )
-    yield gr.ChatMessage(
-        role="assistant",
-        content=get_step_footnote_content(step_log, "Planning step"),
-        metadata={"status": "done"},
-    )
-    yield gr.ChatMessage(role="assistant", content="-----", metadata={"status": "done"})
-
-
 def _process_final_answer_step(step_log: FinalAnswerStep) -> Generator:
     """
     Process a [`FinalAnswerStep`] and yield appropriate gradio.ChatMessage objects.
@@ -287,35 +258,24 @@ def _process_final_answer_step(step_log: FinalAnswerStep) -> Generator:
 
 
 def pull_messages_from_step(
-    step_log: ActionStep | PlanningStep | FinalAnswerStep,
+    step_log: ActionStep | FinalAnswerStep,
     skip_model_outputs: bool = False,
     parent_id: str | None = None,
 ):
-    """Extract Gradio ChatMessage objects from agent steps with proper nesting.
+    """
+    Pulls and yields messages from a given step log.
 
     Args:
-        step_log: The step log to display as gr.ChatMessage objects.
-        skip_model_outputs: If True, skip the model outputs when creating
-            the gr.ChatMessage objects:
-            This is used for instance when streaming model outputs have
-            already been displayed.
-        parent_id: The ID of the parent message. Only used for nested thoughts.
-            Nested thoughts can be nested by setting the parent_id to the id
-            of the parent thought.
+        step_log (`ActionStep` | `PlanningStep` | `FinalAnswerStep`):
+        The step log to process.
+        skip_model_outputs (`bool`): Whether to skip model outputs.
     """
-    if not _is_package_available("gradio"):
-        raise ModuleNotFoundError(
-            "Please install 'gradio' extra to use the GradioUI: "
-            "`pip install 'smolagents[gradio]'`"
-        )
     if isinstance(step_log, ActionStep):
-        yield from _process_action_step(step_log, skip_model_outputs, parent_id)
-    elif isinstance(step_log, PlanningStep):
-        yield from _process_planning_step(step_log, skip_model_outputs)
+        yield from _process_action_step(
+            step_log, skip_model_outputs=skip_model_outputs, parent_id=parent_id
+        )
     elif isinstance(step_log, FinalAnswerStep):
         yield from _process_final_answer_step(step_log)
-    else:
-        raise ValueError(f"Unsupported step type: {type(step_log)}")
 
 
 def stream_to_gradio(
@@ -342,7 +302,7 @@ def stream_to_gradio(
         reset=reset_agent_memory,
         additional_args=additional_args,
     ):
-        if isinstance(event, ActionStep | PlanningStep | FinalAnswerStep):
+        if isinstance(event, ActionStep | FinalAnswerStep):
             intermediate_text = ""
             yield from pull_messages_from_step(
                 event,

start.sh

@@ -6,4 +6,4 @@ nginx -c /app/nginx.conf &
 
 # Start the main Gradio app
 echo "Starting Gradio app on port 7862..."
-exec python -u app.py --server-port 7862 --server-name 0.0.0.0
+exec python -u -m src.app --server-port 7862 --server-name 0.0.0.0