{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {
    "colab": {
     "base_uri": "https://localhost:8080/"
    },
    "id": "Fe71FFKEm3Jr",
    "outputId": "ddb17146-9f0b-4d35-9160-5d2cf8a370e2"
   },
   "outputs": [
    {
     "output_type": "stream",
     "name": "stdout",
     "text": [
      "\u001b[31mERROR: pip's dependency resolver does not currently take into account all the packages that are installed. This behaviour is the source of the following dependency conflicts.\n",
      "llmx 0.0.15a0 requires cohere, which is not installed.\n",
      "llmx 0.0.15a0 requires tiktoken, which is not installed.\u001b[0m\u001b[31m\n",
      "\u001b[0m\u001b[33mWARNING: Running pip as the 'root' user can result in broken permissions and conflicting behaviour with the system package manager. It is recommended to use a virtual environment instead: https://pip.pypa.io/warnings/venv\u001b[0m\u001b[33m\n",
      "\u001b[0m"
     ]
    }
   ],
   "source": [
    "!pip install -Uqqq pip --progress-bar off\n",
    "!pip install -qqq pyautogen==0.1.14 --progress-bar off"
   ]
  },
  {
   "cell_type": "code",
   "source": [
    "from getpass import getpass\n",
    "\n",
    "from autogen import AssistantAgent, GroupChat, GroupChatManager, UserProxyAgent"
   ],
   "metadata": {
    "id": "-zXe7mw2kOmb"
   },
   "execution_count": 1,
   "outputs": []
  },
  {
   "cell_type": "code",
   "source": [
    "OPENAI_API_KEY = getpass()"
   ],
   "metadata": {
    "id": "NAktMfNDhTq1",
    "colab": {
     "base_uri": "https://localhost:8080/"
    },
    "outputId": "f443e5c3-ca7d-4328-d0fc-447c15e643d5"
   },
   "execution_count": 2,
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "··········\n"
     ]
    }
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {
    "id": "Pys3Hxd-ak26"
   },
   "outputs": [],
   "source": [
    "gpt_config_list = [\n",
    "    {\n",
    "        # 'model': 'gpt-4',\n",
    "        # 'model': \"gpt-3.5-turbo\",\n",
    "        \"model\": \"gpt-3.5-turbo-16k\",\n",
    "        \"api_key\": OPENAI_API_KEY,\n",
    "    }\n",
    "]\n",
    "\n",
    "llm_config = {\"config_list\": gpt_config_list, \"use_cache\": False, \"temperature\": 0}"
   ]
  },
  {
   "cell_type": "code",
   "source": [
    "user_proxy = UserProxyAgent(\n",
    "    name=\"Admin\",\n",
    "    system_message=\"\"\"A human admin. Interact with the planner to discuss the plan.\n",
    "   Plan execution needs to be approved by this admin.\"\"\",\n",
    "    code_execution_config=False,\n",
    ")\n",
    "\n",
    "engineer = AssistantAgent(\n",
    "    name=\"Engineer\",\n",
    "    llm_config=llm_config,\n",
    "    system_message=\"\"\"Engineer. You follow an approved plan. You write python/shell code to solve tasks. Wrap the\n",
    "    code in a code block that specifies the script type. The user can't modify your code. So do not suggest\n",
    "    incomplete code which requires others to modify. Don't use a code block if it's not intended to be executed by\n",
    "    the executor. Don't include multiple code blocks in one response. Do not ask others to copy and paste the result.\n",
    "    Check the execution result returned by the executor. If the result indicates there is an error, fix the error and\n",
    "    output the code again. Suggest the full code instead of partial code or code changes. If the error can't be fixed\n",
    "    or if the task is not solved even after the code is executed successfully, analyze the problem, revisit your\n",
    "    assumption, collect additional info you need, and think of a different approach to try.\"\"\",\n",
    ")\n",
    "\n",
    "planner = AssistantAgent(\n",
    "    name=\"Planner\",\n",
    "    system_message=\"\"\"Planner. Suggest a plan. Revise the plan based on feedback from admin and Karen, until admin\n",
    "    approval. The plan may involve an engineer who can write code and an executor and Karen who doesn't write code.\n",
    "    Explain the plan first. Be clear which step is performed by an engineer, executor, and Karen.\"\"\",\n",
    "    llm_config=llm_config,\n",
    ")\n",
    "\n",
    "executor = AssistantAgent(\n",
    "    name=\"Executor\",\n",
    "    system_message=\"Executor. Execute the code written by the engineer and report the result.\",\n",
    "    code_execution_config={\"last_n_messages\": 3, \"work_dir\": \"source\"},\n",
    ")\n",
    "\n",
    "critic = AssistantAgent(\n",
    "    name=\"Karen\",\n",
    "    system_message=\"Karen. Double check plan, claims, code from other agents and provide feedback (whine as a real-world Karen).\",\n",
    "    llm_config=llm_config,\n",
    ")\n",
    "\n",
    "groupchat = GroupChat(\n",
    "    agents=[user_proxy, engineer, planner, executor, critic], messages=[], max_round=50\n",
    ")\n",
    "manager = GroupChatManager(groupchat=groupchat, llm_config=llm_config)"
   ],
   "metadata": {
    "id": "80LOUK_WlIbN"
   },
   "execution_count": 4,
   "outputs": []
  },
  {
   "cell_type": "code",
   "source": [
    "message = \"\"\"\n",
    "Build a landing page for a SaaS that creates chatbots using ChatGPT from a set of documents.\n",
    "Think of a name for the product and a short tagline. Add a form to collect user email\n",
    "for when the product is ready. Add an admin page that shows a table of added emails.\n",
    "Use flask for the app, Tailwind CSS for styling (must be centered and look good on mobile devices too),\n",
    "and sqlite3 as a database.\n",
    "\"\"\""
   ],
   "metadata": {
    "id": "q3iktVa2sRNW"
   },
   "execution_count": 5,
   "outputs": []
  },
  {
   "cell_type": "code",
   "source": [
    "user_proxy.initiate_chat(manager, message=message)"
   ],
   "metadata": {
    "colab": {
     "base_uri": "https://localhost:8080/"
    },
    "id": "jwLx_X58aGeg",
    "outputId": "38763d26-769e-400a-d609-e4d15e2952dd"
   },
   "execution_count": 6,
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Admin (to chat_manager):\n",
      "\n",
      "\n",
      "Build a landing page for a SaaS that creates chatbots using ChatGPT from a set of documents.\n",
      "Think of a name for the product and a short tagline. Add a form to collect user email\n",
      "for when the product is ready. Add an admin page that shows a table of added emails.\n",
      "Use flask for the app, Tailwind CSS for styling (must be centered and look good on mobile devices too), \n",
      "and sqlite3 as a database.\n",
      "\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Planner (to chat_manager):\n",
      "\n",
      "Plan:\n",
      "\n",
      "Step 1: Naming and Tagline\n",
      "- Executor: Come up with a name for the product and a short tagline that reflects its purpose and benefits.\n",
      "\n",
      "Step 2: Design the Landing Page\n",
      "- Engineer: Use Flask to create a landing page with a form to collect user emails.\n",
      "- Engineer: Utilize Tailwind CSS to style the landing page, ensuring it is centered and looks good on mobile devices.\n",
      "\n",
      "Step 3: Database Integration\n",
      "- Engineer: Set up a SQLite3 database to store the collected user emails.\n",
      "- Engineer: Implement the necessary backend code to store the user emails in the database when submitted through the form.\n",
      "\n",
      "Step 4: Admin Page\n",
      "- Engineer: Create an admin page that displays a table of the added emails.\n",
      "- Engineer: Implement the necessary backend code to retrieve the emails from the database and display them in the admin page.\n",
      "\n",
      "Step 5: Testing and Deployment\n",
      "- Executor: Test the landing page, form submission, and admin page to ensure they function correctly.\n",
      "- Executor: Deploy the application to a hosting platform, such as Heroku, to make it accessible to users.\n",
      "\n",
      "Step 6: Feedback and Iteration\n",
      "- Critic: Gather feedback from users and stakeholders regarding the landing page, form, and admin page.\n",
      "- Engineer: Make necessary revisions and improvements based on the feedback received.\n",
      "\n",
      "Step 7: Final Approval and Launch\n",
      "- Admin: Review the final version of the landing page, form, and admin page.\n",
      "- Admin: Provide approval for the launch of the SaaS landing page.\n",
      "\n",
      "Note: The engineer will be responsible for writing the code, the executor will handle testing and deployment, and the critic will gather feedback and provide suggestions for improvement. The admin will review and approve the final version before launch.\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Engineer (to chat_manager):\n",
      "\n",
      "I have completed Step 1 of the plan. Here is the name and tagline for the product:\n",
      "\n",
      "Name: BotGenius\n",
      "Tagline: Unleash the Power of Chatbots\n",
      "\n",
      "Please proceed to Step 2 to start building the landing page.\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Planner (to chat_manager):\n",
      "\n",
      "Great! The name \"BotGenius\" and the tagline \"Unleash the Power of Chatbots\" sound compelling and align well with the purpose of the product. Let's move on to Step 2.\n",
      "\n",
      "Engineer: \n",
      "1. Set up a Flask project.\n",
      "2. Create a landing page with a form to collect user emails.\n",
      "3. Use Tailwind CSS to style the landing page, ensuring it is centered and looks good on mobile devices.\n",
      "\n",
      "Once you have completed Step 2, please let me know, and we can proceed to Step 3.\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Engineer (to chat_manager):\n",
      "\n",
      "Engineer:\n",
      "\n",
      "Here is the code to set up a Flask project, create a landing page with a form, and style it using Tailwind CSS:\n",
      "\n",
      "```python\n",
      "# Step 2: Design the Landing Page\n",
      "\n",
      "# 1. Set up a Flask project\n",
      "from flask import Flask, render_template, request\n",
      "import sqlite3\n",
      "\n",
      "app = Flask(__name__)\n",
      "\n",
      "# 2. Create a landing page with a form to collect user emails\n",
      "@app.route('/', methods=['GET', 'POST'])\n",
      "def landing_page():\n",
      "    if request.method == 'POST':\n",
      "        email = request.form['email']\n",
      "        if email:\n",
      "            # 3. Store the user email in the database\n",
      "            conn = sqlite3.connect('emails.db')\n",
      "            c = conn.cursor()\n",
      "            c.execute(\"INSERT INTO emails (email) VALUES (?)\", (email,))\n",
      "            conn.commit()\n",
      "            conn.close()\n",
      "            return render_template('thank_you.html')\n",
      "    return render_template('landing_page.html')\n",
      "\n",
      "# 4. Create an admin page that displays a table of added emails\n",
      "@app.route('/admin')\n",
      "def admin_page():\n",
      "    conn = sqlite3.connect('emails.db')\n",
      "    c = conn.cursor()\n",
      "    c.execute(\"SELECT * FROM emails\")\n",
      "    emails = c.fetchall()\n",
      "    conn.close()\n",
      "    return render_template('admin_page.html', emails=emails)\n",
      "\n",
      "if __name__ == '__main__':\n",
      "    app.run(debug=True)\n",
      "```\n",
      "\n",
      "Please make sure to have the necessary dependencies installed, such as Flask and sqlite3. Once you have completed this step, let me know, and we can proceed to Step 3.\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Provide feedback to chat_manager. Press enter to skip and use auto-reply, or type 'exit' to end the conversation: Add the name and tagline to the flask app, pass it to the templates, create the sqlite3 table if it doesnt exist\n",
      "Admin (to chat_manager):\n",
      "\n",
      "Add the name and tagline to the flask app, pass it to the templates, create the sqlite3 table if it doesnt exist\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Engineer (to chat_manager):\n",
      "\n",
      "Engineer:\n",
      "\n",
      "Here is the updated code that includes the name and tagline, passes them to the templates, and creates the SQLite3 table if it doesn't exist:\n",
      "\n",
      "```python\n",
      "# Step 2: Design the Landing Page\n",
      "\n",
      "# 1. Set up a Flask project\n",
      "from flask import Flask, render_template, request\n",
      "import sqlite3\n",
      "\n",
      "app = Flask(__name__)\n",
      "\n",
      "# Name and Tagline\n",
      "app.config['PRODUCT_NAME'] = 'BotGenius'\n",
      "app.config['TAGLINE'] = 'Unleash the Power of Chatbots'\n",
      "\n",
      "# 2. Create a landing page with a form to collect user emails\n",
      "@app.route('/', methods=['GET', 'POST'])\n",
      "def landing_page():\n",
      "    if request.method == 'POST':\n",
      "        email = request.form['email']\n",
      "        if email:\n",
      "            # 3. Store the user email in the database\n",
      "            conn = sqlite3.connect('emails.db')\n",
      "            c = conn.cursor()\n",
      "            c.execute(\"INSERT INTO emails (email) VALUES (?)\", (email,))\n",
      "            conn.commit()\n",
      "            conn.close()\n",
      "            return render_template('thank_you.html', product_name=app.config['PRODUCT_NAME'])\n",
      "    return render_template('landing_page.html', product_name=app.config['PRODUCT_NAME'], tagline=app.config['TAGLINE'])\n",
      "\n",
      "# 4. Create an admin page that displays a table of added emails\n",
      "@app.route('/admin')\n",
      "def admin_page():\n",
      "    conn = sqlite3.connect('emails.db')\n",
      "    c = conn.cursor()\n",
      "    c.execute(\"SELECT * FROM emails\")\n",
      "    emails = c.fetchall()\n",
      "    conn.close()\n",
      "    return render_template('admin_page.html', emails=emails)\n",
      "\n",
      "# Create the SQLite3 table if it doesn't exist\n",
      "def create_table():\n",
      "    conn = sqlite3.connect('emails.db')\n",
      "    c = conn.cursor()\n",
      "    c.execute(\"CREATE TABLE IF NOT EXISTS emails (email TEXT)\")\n",
      "    conn.commit()\n",
      "    conn.close()\n",
      "\n",
      "if __name__ == '__main__':\n",
      "    create_table()\n",
      "    app.run(debug=True)\n",
      "```\n",
      "\n",
      "Make sure to have the necessary dependencies installed, such as Flask and sqlite3. This code will create the `emails` table if it doesn't exist in the `emails.db` database. Once you have completed this step, let me know, and we can proceed to Step 3.\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Provide feedback to chat_manager. Press enter to skip and use auto-reply, or type 'exit' to end the conversation: Create the templates\n",
      "Admin (to chat_manager):\n",
      "\n",
      "Create the templates\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Engineer (to chat_manager):\n",
      "\n",
      "Engineer:\n",
      "\n",
      "Here are the templates for the landing page, thank you page, and admin page:\n",
      "\n",
      "1. `templates/landing_page.html`:\n",
      "```html\n",
      "<!DOCTYPE html>\n",
      "<html lang=\"en\">\n",
      "<head>\n",
      "    <meta charset=\"UTF-8\">\n",
      "    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n",
      "    <title>{{ product_name }}</title>\n",
      "    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css\">\n",
      "    <style>\n",
      "        .container {\n",
      "            display: flex;\n",
      "            justify-content: center;\n",
      "            align-items: center;\n",
      "            height: 100vh;\n",
      "        }\n",
      "    </style>\n",
      "</head>\n",
      "<body>\n",
      "    <div class=\"container\">\n",
      "        <div class=\"max-w-md w-full\">\n",
      "            <h1 class=\"text-4xl font-bold mb-4\">{{ product_name }}</h1>\n",
      "            <p class=\"text-lg mb-8\">{{ tagline }}</p>\n",
      "            <form action=\"/\" method=\"POST\">\n",
      "                <input type=\"email\" name=\"email\" placeholder=\"Enter your email\" class=\"border border-gray-300 rounded px-4 py-2 w-full mb-4\">\n",
      "                <button type=\"submit\" class=\"bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 px-4 rounded\">Get Notified</button>\n",
      "            </form>\n",
      "        </div>\n",
      "    </div>\n",
      "</body>\n",
      "</html>\n",
      "```\n",
      "\n",
      "2. `templates/thank_you.html`:\n",
      "```html\n",
      "<!DOCTYPE html>\n",
      "<html lang=\"en\">\n",
      "<head>\n",
      "    <meta charset=\"UTF-8\">\n",
      "    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n",
      "    <title>Thank You</title>\n",
      "    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css\">\n",
      "    <style>\n",
      "        .container {\n",
      "            display: flex;\n",
      "            justify-content: center;\n",
      "            align-items: center;\n",
      "            height: 100vh;\n",
      "        }\n",
      "    </style>\n",
      "</head>\n",
      "<body>\n",
      "    <div class=\"container\">\n",
      "        <div class=\"max-w-md w-full\">\n",
      "            <h1 class=\"text-4xl font-bold mb-4\">Thank You!</h1>\n",
      "            <p class=\"text-lg mb-8\">We will notify you when {{ product_name }} is ready.</p>\n",
      "        </div>\n",
      "    </div>\n",
      "</body>\n",
      "</html>\n",
      "```\n",
      "\n",
      "3. `templates/admin_page.html`:\n",
      "```html\n",
      "<!DOCTYPE html>\n",
      "<html lang=\"en\">\n",
      "<head>\n",
      "    <meta charset=\"UTF-8\">\n",
      "    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n",
      "    <title>Admin Page</title>\n",
      "    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css\">\n",
      "    <style>\n",
      "        .container {\n",
      "            display: flex;\n",
      "            justify-content: center;\n",
      "            align-items: center;\n",
      "            height: 100vh;\n",
      "        }\n",
      "    </style>\n",
      "</head>\n",
      "<body>\n",
      "    <div class=\"container\">\n",
      "        <div class=\"max-w-md w-full\">\n",
      "            <h1 class=\"text-4xl font-bold mb-4\">Admin Page</h1>\n",
      "            <table class=\"table-auto w-full\">\n",
      "                <thead>\n",
      "                    <tr>\n",
      "                        <th class=\"px-4 py-2\">Email</th>\n",
      "                    </tr>\n",
      "                </thead>\n",
      "                <tbody>\n",
      "                    {% for email in emails %}\n",
      "                    <tr>\n",
      "                        <td class=\"border px-4 py-2\">{{ email[0] }}</td>\n",
      "                    </tr>\n",
      "                    {% endfor %}\n",
      "                </tbody>\n",
      "            </table>\n",
      "        </div>\n",
      "    </div>\n",
      "</body>\n",
      "</html>\n",
      "```\n",
      "\n",
      "Make sure to have the necessary dependencies installed, such as Flask and sqlite3. Once you have completed this step, let me know, and we can proceed to Step 3.\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "\n",
      ">>>>>>>> EXECUTING CODE BLOCK 0 (inferred language is html)...\n",
      "Executor (to chat_manager):\n",
      "\n",
      "exitcode: 1 (execution failed)\n",
      "Code output: \n",
      "unknown language html\n",
      "\n",
      "--------------------------------------------------------------------------------\n",
      "Provide feedback to chat_manager. Press enter to skip and use auto-reply, or type 'exit' to end the conversation: exit\n"
     ]
    }
   ]
  }
 ],
 "metadata": {
  "colab": {
   "provenance": []
  },
  "kernelspec": {
   "display_name": "Python 3",
   "name": "python3"
  },
  "language_info": {
   "name": "python"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 0
}