From 1b42d74657235f2e3daad4e6672c23ce55b383fa Mon Sep 17 00:00:00 2001
From: bossm747 <admin@tmseven-47.com>
Date: Sat, 9 Nov 2024 03:29:21 +0000
Subject: [PATCH 1/4] ok

---
 flask_app/app.py               |  12 ++
 flask_app/requirements.txt     |   3 +
 flask_app/static/css/style.css | 268 +++++++++++++++++++++++++++++++++
 flask_app/static/js/app.js     | 235 +++++++++++++++++++++++++++++
 flask_app/static/manifest.json |  25 +++
 flask_app/templates/index.html | 150 ++++++++++++++++++
 6 files changed, 693 insertions(+)
 create mode 100644 flask_app/app.py
 create mode 100644 flask_app/requirements.txt
 create mode 100644 flask_app/static/css/style.css
 create mode 100644 flask_app/static/js/app.js
 create mode 100644 flask_app/static/manifest.json
 create mode 100644 flask_app/templates/index.html

diff --git a/flask_app/app.py b/flask_app/app.py
new file mode 100644
index 0000000..45abe74
--- /dev/null
+++ b/flask_app/app.py
@@ -0,0 +1,12 @@
+from flask import Flask, render_template
+from flask_cors import CORS
+
+app = Flask(__name__)
+CORS(app)
+
+@app.route('/')
+def index():
+    return render_template('index.html')
+
+if __name__ == '__main__':
+    app.run(debug=True, host='0.0.0.0', port=5000)
diff --git a/flask_app/requirements.txt b/flask_app/requirements.txt
new file mode 100644
index 0000000..bb4e894
--- /dev/null
+++ b/flask_app/requirements.txt
@@ -0,0 +1,3 @@
+flask==2.3.3
+flask-cors==4.0.0
+werkzeug==2.3.7
diff --git a/flask_app/static/css/style.css b/flask_app/static/css/style.css
new file mode 100644
index 0000000..45428df
--- /dev/null
+++ b/flask_app/static/css/style.css
@@ -0,0 +1,268 @@
+:root {
+    --primary-color: #2196F3;
+    --secondary-color: #1976D2;
+    --background-color: #f5f5f5;
+    --sidebar-bg: #fff;
+    --text-color: #333;
+    --border-color: #e0e0e0;
+}
+
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+html {
+    font-size: 16px;
+}
+
+body {
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+    background-color: var(--background-color);
+    color: var(--text-color);
+    line-height: 1.5;
+}
+
+/* Mobile First Layout */
+.app-container {
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+}
+
+/* Mobile Navigation */
+.sidebar {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background-color: var(--sidebar-bg);
+    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
+    z-index: 1000;
+}
+
+.logo-container {
+    display: none; /* Hidden on mobile */
+}
+
+.nav-links {
+    list-style: none;
+    display: flex;
+    justify-content: space-around;
+    padding: 0.5rem;
+}
+
+.nav-links li {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 0.5rem;
+    font-size: 0.75rem;
+    cursor: pointer;
+}
+
+.nav-links li i {
+    font-size: 1.5rem;
+    margin-bottom: 0.25rem;
+}
+
+.nav-links li span {
+    display: none;
+}
+
+/* Main Content */
+.main-content {
+    flex: 1;
+    padding: 1rem;
+    margin-bottom: 4rem; /* Space for bottom navigation */
+}
+
+.page {
+    display: none;
+    max-width: 100%;
+    margin: 0 auto;
+}
+
+.page.active {
+    display: block;
+}
+
+h1 {
+    font-size: 1.5rem;
+    margin-bottom: 1rem;
+    padding: 0.5rem;
+}
+
+h2 {
+    font-size: 1.25rem;
+    margin-bottom: 0.75rem;
+}
+
+/* Cards */
+.crew-item, .tool-item, .agent-item, .task-item {
+    background: white;
+    border-radius: 0.5rem;
+    padding: 1rem;
+    margin-bottom: 1rem;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+/* Buttons */
+.add-btn, .kickoff-btn, .export-btn, .import-btn {
+    width: 100%;
+    background-color: var(--primary-color);
+    color: white;
+    border: none;
+    padding: 1rem;
+    border-radius: 0.5rem;
+    font-size: 1rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 0.5rem;
+    margin: 1rem 0;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+
+.add-btn:hover, .kickoff-btn:hover, .export-btn:hover, .import-btn:hover {
+    background-color: var(--secondary-color);
+}
+
+/* Form Elements */
+select, input[type="file"] {
+    width: 100%;
+    padding: 0.75rem;
+    margin-bottom: 1rem;
+    border: 1px solid var(--border-color);
+    border-radius: 0.5rem;
+    font-size: 1rem;
+}
+
+/* Containers */
+.crews-container, .tools-container, .agents-container, .tasks-container {
+    padding: 1rem;
+}
+
+.execution-output {
+    background: white;
+    padding: 1rem;
+    border-radius: 0.5rem;
+    margin-top: 1rem;
+    overflow-x: auto;
+}
+
+.export-container {
+    display: grid;
+    gap: 1rem;
+}
+
+.export-section, .import-section {
+    background: white;
+    padding: 1rem;
+    border-radius: 0.5rem;
+}
+
+/* Action buttons within items */
+.crew-actions, .tool-actions, .agent-actions, .task-actions {
+    display: flex;
+    gap: 0.5rem;
+    margin-top: 0.5rem;
+}
+
+.crew-actions button, .tool-actions button, .agent-actions button, .task-actions button {
+    padding: 0.5rem;
+    border: none;
+    background: none;
+    cursor: pointer;
+    color: var(--primary-color);
+}
+
+/* Tablet and up */
+@media (min-width: 768px) {
+    .app-container {
+        flex-direction: row;
+    }
+
+    .sidebar {
+        position: static;
+        width: 250px;
+        padding: 1rem 0;
+    }
+
+    .logo-container {
+        display: block;
+        padding: 1rem;
+        margin-bottom: 2rem;
+    }
+
+    .nav-links {
+        flex-direction: column;
+    }
+
+    .nav-links li {
+        flex-direction: row;
+        padding: 1rem;
+        font-size: 1rem;
+    }
+
+    .nav-links li span {
+        display: inline;
+        margin-left: 0.5rem;
+    }
+
+    .main-content {
+        margin-bottom: 0;
+        padding: 2rem;
+    }
+
+    .export-container {
+        grid-template-columns: repeat(2, 1fr);
+    }
+
+    .add-btn, .kickoff-btn, .export-btn, .import-btn {
+        width: auto;
+    }
+}
+
+/* Desktop */
+@media (min-width: 1024px) {
+    .main-content {
+        padding: 2rem 3rem;
+    }
+
+    .page {
+        max-width: 1200px;
+    }
+
+    .crew-list, .tool-list, .agent-list, .task-list {
+        display: grid;
+        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+        gap: 1rem;
+    }
+
+    h1 {
+        font-size: 2rem;
+    }
+}
+
+/* Dark mode support */
+@media (prefers-color-scheme: dark) {
+    :root {
+        --background-color: #121212;
+        --sidebar-bg: #1e1e1e;
+        --text-color: #ffffff;
+        --border-color: #333333;
+    }
+
+    .crew-item, .tool-item, .agent-item, .task-item,
+    .export-section, .import-section, .execution-output {
+        background: #1e1e1e;
+    }
+
+    select, input[type="file"] {
+        background: #1e1e1e;
+        color: white;
+    }
+}
diff --git a/flask_app/static/js/app.js b/flask_app/static/js/app.js
new file mode 100644
index 0000000..6417951
--- /dev/null
+++ b/flask_app/static/js/app.js
@@ -0,0 +1,235 @@
+// State management
+let state = {
+    crews: [],
+    tools: [],
+    agents: [],
+    tasks: [],
+    toolsState: []
+};
+
+// API Functions
+const api = {
+    async get(endpoint) {
+        try {
+            const response = await fetch(`/api/${endpoint}`);
+            return await response.json();
+        } catch (error) {
+            console.error(`Error fetching ${endpoint}:`, error);
+            return null;
+        }
+    },
+
+    async loadAllData() {
+        state.crews = await this.get('crews');
+        state.tools = await this.get('tools');
+        state.agents = await this.get('agents');
+        state.tasks = await this.get('tasks');
+        state.toolsState = await this.get('tools/state');
+        renderAllData();
+    }
+};
+
+// Navigation
+function setupNavigation() {
+    const navLinks = document.querySelectorAll('.nav-links li');
+    navLinks.forEach(link => {
+        link.addEventListener('click', () => {
+            const page = link.dataset.page;
+            // Update active states
+            document.querySelector('.nav-links li.active').classList.remove('active');
+            link.classList.add('active');
+            // Hide all pages and show selected
+            document.querySelector('.page.active').classList.remove('active');
+            document.getElementById(`${page}-page`).classList.add('active');
+        });
+    });
+}
+
+// Rendering Functions
+function renderCrews() {
+    const crewList = document.querySelector('.crew-list');
+    crewList.innerHTML = state.crews.map(crew => `
+        <div class="crew-item" data-id="${crew.id}">
+            <h3>${crew.name}</h3>
+            <p>${crew.description || 'No description'}</p>
+            <div class="crew-actions">
+                <button onclick="editCrew('${crew.id}')">
+                    <i class="material-icons">edit</i>
+                </button>
+                <button onclick="deleteCrew('${crew.id}')">
+                    <i class="material-icons">delete</i>
+                </button>
+            </div>
+        </div>
+    `).join('');
+}
+
+function renderTools() {
+    const toolList = document.querySelector('.tool-list');
+    toolList.innerHTML = state.tools.map(tool => `
+        <div class="tool-item" data-id="${tool.id}">
+            <h3>${tool.name}</h3>
+            <p>${tool.description || 'No description'}</p>
+            <div class="tool-actions">
+                <button onclick="editTool('${tool.id}')">
+                    <i class="material-icons">edit</i>
+                </button>
+                <button onclick="deleteTool('${tool.id}')">
+                    <i class="material-icons">delete</i>
+                </button>
+            </div>
+        </div>
+    `).join('');
+}
+
+function renderAgents() {
+    const agentList = document.querySelector('.agent-list');
+    agentList.innerHTML = state.agents.map(agent => `
+        <div class="agent-item" data-id="${agent.id}">
+            <h3>${agent.name}</h3>
+            <p>${agent.description || 'No description'}</p>
+            <div class="agent-actions">
+                <button onclick="editAgent('${agent.id}')">
+                    <i class="material-icons">edit</i>
+                </button>
+                <button onclick="deleteAgent('${agent.id}')">
+                    <i class="material-icons">delete</i>
+                </button>
+            </div>
+        </div>
+    `).join('');
+}
+
+function renderTasks() {
+    const taskList = document.querySelector('.task-list');
+    taskList.innerHTML = state.tasks.map(task => `
+        <div class="task-item" data-id="${task.id}">
+            <h3>${task.name}</h3>
+            <p>${task.description || 'No description'}</p>
+            <div class="task-actions">
+                <button onclick="editTask('${task.id}')">
+                    <i class="material-icons">edit</i>
+                </button>
+                <button onclick="deleteTask('${task.id}')">
+                    <i class="material-icons">delete</i>
+                </button>
+            </div>
+        </div>
+    `).join('');
+}
+
+function renderAllData() {
+    renderCrews();
+    renderTools();
+    renderAgents();
+    renderTasks();
+    updateCrewSelects();
+}
+
+function updateCrewSelects() {
+    const crewSelects = document.querySelectorAll('#crew-select, #export-crew-select');
+    const options = state.crews.map(crew => 
+        `<option value="${crew.id}">${crew.name}</option>`
+    ).join('');
+    
+    crewSelects.forEach(select => {
+        select.innerHTML = `<option value="">Select a crew...</option>${options}`;
+    });
+}
+
+// Event Handlers
+document.getElementById('add-crew').addEventListener('click', () => {
+    // Implementation for adding new crew
+    console.log('Add crew clicked');
+});
+
+document.getElementById('add-tool').addEventListener('click', () => {
+    // Implementation for adding new tool
+    console.log('Add tool clicked');
+});
+
+document.getElementById('add-agent').addEventListener('click', () => {
+    // Implementation for adding new agent
+    console.log('Add agent clicked');
+});
+
+document.getElementById('add-task').addEventListener('click', () => {
+    // Implementation for adding new task
+    console.log('Add task clicked');
+});
+
+document.getElementById('start-crew').addEventListener('click', async () => {
+    const crewId = document.getElementById('crew-select').value;
+    if (!crewId) {
+        alert('Please select a crew first');
+        return;
+    }
+    
+    const outputDiv = document.querySelector('.execution-output');
+    outputDiv.innerHTML = 'Starting crew execution...';
+    
+    try {
+        const response = await fetch(`/api/crews/${crewId}/run`, {
+            method: 'POST'
+        });
+        const result = await response.json();
+        outputDiv.innerHTML = `<pre>${JSON.stringify(result, null, 2)}</pre>`;
+    } catch (error) {
+        outputDiv.innerHTML = `Error: ${error.message}`;
+    }
+});
+
+document.getElementById('export-crew').addEventListener('click', async () => {
+    const crewId = document.getElementById('export-crew-select').value;
+    if (!crewId) {
+        alert('Please select a crew to export');
+        return;
+    }
+    
+    try {
+        const response = await fetch(`/api/crews/${crewId}/export`);
+        const blob = await response.blob();
+        const url = window.URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = `crew-${crewId}.json`;
+        document.body.appendChild(a);
+        a.click();
+        window.URL.revokeObjectURL(url);
+        document.body.removeChild(a);
+    } catch (error) {
+        alert(`Error exporting crew: ${error.message}`);
+    }
+});
+
+document.getElementById('import-crew').addEventListener('click', async () => {
+    const fileInput = document.getElementById('import-file');
+    const file = fileInput.files[0];
+    
+    if (!file) {
+        alert('Please select a file to import');
+        return;
+    }
+    
+    try {
+        const formData = new FormData();
+        formData.append('file', file);
+        
+        const response = await fetch('/api/crews/import', {
+            method: 'POST',
+            body: formData
+        });
+        
+        const result = await response.json();
+        alert('Crew imported successfully');
+        api.loadAllData(); // Refresh data
+    } catch (error) {
+        alert(`Error importing crew: ${error.message}`);
+    }
+});
+
+// Initialize
+document.addEventListener('DOMContentLoaded', () => {
+    setupNavigation();
+    api.loadAllData();
+});
diff --git a/flask_app/static/manifest.json b/flask_app/static/manifest.json
new file mode 100644
index 0000000..b3f811d
--- /dev/null
+++ b/flask_app/static/manifest.json
@@ -0,0 +1,25 @@
+{
+    "name": "CrewAI Studio",
+    "short_name": "CrewAI",
+    "description": "A mobile-first web application for managing AI crews, tools, agents, and tasks",
+    "start_url": "/",
+    "display": "standalone",
+    "background_color": "#f5f5f5",
+    "theme_color": "#2196F3",
+    "orientation": "portrait-primary",
+    "icons": [
+        {
+            "src": "/static/img/icon-192.png",
+            "type": "image/png",
+            "sizes": "192x192",
+            "purpose": "any maskable"
+        },
+        {
+            "src": "/static/img/icon-512.png",
+            "type": "image/png",
+            "sizes": "512x512",
+            "purpose": "any maskable"
+        }
+    ],
+    "prefer_related_applications": false
+}
diff --git a/flask_app/templates/index.html b/flask_app/templates/index.html
new file mode 100644
index 0000000..483021a
--- /dev/null
+++ b/flask_app/templates/index.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="theme-color" content="#2196F3">
+    <title>CrewAI Studio</title>
+    <link rel="manifest" href="{{ url_for('static', filename='manifest.json') }}">
+    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+    <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
+</head>
+<body>
+    <div class="app-container">
+        <nav class="sidebar">
+            <div class="logo-container">
+                <h1>CrewAI Studio</h1>
+            </div>
+            <ul class="nav-links" role="navigation">
+                <li data-page="crews" class="active" role="button" aria-label="Crews">
+                    <i class="material-icons" aria-hidden="true">group_work</i>
+                    <span>Crews</span>
+                </li>
+                <li data-page="tools" role="button" aria-label="Tools">
+                    <i class="material-icons" aria-hidden="true">build</i>
+                    <span>Tools</span>
+                </li>
+                <li data-page="agents" role="button" aria-label="Agents">
+                    <i class="material-icons" aria-hidden="true">person</i>
+                    <span>Agents</span>
+                </li>
+                <li data-page="tasks" role="button" aria-label="Tasks">
+                    <i class="material-icons" aria-hidden="true">assignment</i>
+                    <span>Tasks</span>
+                </li>
+                <li data-page="kickoff" role="button" aria-label="Kickoff">
+                    <i class="material-icons" aria-hidden="true">play_arrow</i>
+                    <span>Kickoff</span>
+                </li>
+                <li data-page="export" role="button" aria-label="Import/Export">
+                    <i class="material-icons" aria-hidden="true">import_export</i>
+                    <span>Import/Export</span>
+                </li>
+            </ul>
+        </nav>
+
+        <main class="main-content">
+            <section id="crews-page" class="page active" aria-label="Crews">
+                <header>
+                    <h2>Crews</h2>
+                </header>
+                <div class="crews-container">
+                    <div class="crew-list" role="list"></div>
+                    <button class="add-btn" id="add-crew" aria-label="Add new crew">
+                        <i class="material-icons" aria-hidden="true">add</i>
+                        <span>Add Crew</span>
+                    </button>
+                </div>
+            </section>
+
+            <section id="tools-page" class="page" aria-label="Tools">
+                <header>
+                    <h2>Tools</h2>
+                </header>
+                <div class="tools-container">
+                    <div class="tool-list" role="list"></div>
+                    <button class="add-btn" id="add-tool" aria-label="Add new tool">
+                        <i class="material-icons" aria-hidden="true">add</i>
+                        <span>Add Tool</span>
+                    </button>
+                </div>
+            </section>
+
+            <section id="agents-page" class="page" aria-label="Agents">
+                <header>
+                    <h2>Agents</h2>
+                </header>
+                <div class="agents-container">
+                    <div class="agent-list" role="list"></div>
+                    <button class="add-btn" id="add-agent" aria-label="Add new agent">
+                        <i class="material-icons" aria-hidden="true">add</i>
+                        <span>Add Agent</span>
+                    </button>
+                </div>
+            </section>
+
+            <section id="tasks-page" class="page" aria-label="Tasks">
+                <header>
+                    <h2>Tasks</h2>
+                </header>
+                <div class="tasks-container">
+                    <div class="task-list" role="list"></div>
+                    <button class="add-btn" id="add-task" aria-label="Add new task">
+                        <i class="material-icons" aria-hidden="true">add</i>
+                        <span>Add Task</span>
+                    </button>
+                </div>
+            </section>
+
+            <section id="kickoff-page" class="page" aria-label="Kickoff">
+                <header>
+                    <h2>Kickoff!</h2>
+                </header>
+                <div class="kickoff-container">
+                    <div class="crew-selection">
+                        <label for="crew-select">Select Crew</label>
+                        <select id="crew-select" aria-label="Select a crew to run">
+                            <option value="">Select a crew...</option>
+                        </select>
+                    </div>
+                    <button class="kickoff-btn" id="start-crew" aria-label="Start selected crew">
+                        <i class="material-icons" aria-hidden="true">play_arrow</i>
+                        <span>Start Crew</span>
+                    </button>
+                    <div class="execution-output" role="log" aria-live="polite"></div>
+                </div>
+            </section>
+
+            <section id="export-page" class="page" aria-label="Import/Export">
+                <header>
+                    <h2>Import/Export</h2>
+                </header>
+                <div class="export-container">
+                    <div class="export-section">
+                        <h3>Export Crew</h3>
+                        <label for="export-crew-select">Select Crew to Export</label>
+                        <select id="export-crew-select" aria-label="Select a crew to export">
+                            <option value="">Select a crew...</option>
+                        </select>
+                        <button class="export-btn" id="export-crew" aria-label="Export selected crew">
+                            <i class="material-icons" aria-hidden="true">file_download</i>
+                            <span>Export</span>
+                        </button>
+                    </div>
+                    <div class="import-section">
+                        <h3>Import Crew</h3>
+                        <label for="import-file">Select File to Import</label>
+                        <input type="file" id="import-file" accept=".json" aria-label="Select a crew file to import">
+                        <button class="import-btn" id="import-crew" aria-label="Import selected crew file">
+                            <i class="material-icons" aria-hidden="true">file_upload</i>
+                            <span>Import</span>
+                        </button>
+                    </div>
+                </div>
+            </section>
+        </main>
+    </div>
+
+    <script src="{{ url_for('static', filename='js/app.js') }}"></script>
+</body>
+</html>

From 8f235e9a11fc60e545b6646baf9e73d1b53b309c Mon Sep 17 00:00:00 2001
From: bossm747 <admin@tmseven-47.com>
Date: Sat, 9 Nov 2024 04:48:27 +0000
Subject: [PATCH 2/4] feat: add API endpoints for crews, tools, agents, tasks,
 and tools state

---
 flask_app/app.py | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/flask_app/app.py b/flask_app/app.py
index 45abe74..961b907 100644
--- a/flask_app/app.py
+++ b/flask_app/app.py
@@ -1,4 +1,4 @@
-from flask import Flask, render_template
+from flask import Flask, render_template, jsonify
 from flask_cors import CORS
 
 app = Flask(__name__)
@@ -8,5 +8,25 @@
 def index():
     return render_template('index.html')
 
+@app.route('/api/crews', methods=['GET'])
+def get_crews():
+    return jsonify([])
+
+@app.route('/api/tools', methods=['GET'])
+def get_tools():
+    return jsonify([])
+
+@app.route('/api/agents', methods=['GET'])
+def get_agents():
+    return jsonify([])
+
+@app.route('/api/tasks', methods=['GET'])
+def get_tasks():
+    return jsonify([])
+
+@app.route('/api/tools/state', methods=['GET'])
+def get_tools_state():
+    return jsonify([])
+
 if __name__ == '__main__':
     app.run(debug=True, host='0.0.0.0', port=5000)

From 590e081e13a09f76d0e7e5f2c508fc2d6608d624 Mon Sep 17 00:00:00 2001
From: bossm747 <admin@tmseven-47.com>
Date: Sat, 9 Nov 2024 04:48:42 +0000
Subject: [PATCH 3/4] nicd

---
 flask_app/CrewAI-Studio.code-workspace | 12 +++++
 flask_app/app.py                       | 62 +++++++++++++++++++++-----
 flask_app/requirements.txt             |  2 +
 flask_app/static/img/icon-192.png      |  0
 4 files changed, 66 insertions(+), 10 deletions(-)
 create mode 100644 flask_app/CrewAI-Studio.code-workspace
 create mode 100644 flask_app/static/img/icon-192.png

diff --git a/flask_app/CrewAI-Studio.code-workspace b/flask_app/CrewAI-Studio.code-workspace
new file mode 100644
index 0000000..bfac6e2
--- /dev/null
+++ b/flask_app/CrewAI-Studio.code-workspace
@@ -0,0 +1,12 @@
+{
+	"folders": [
+		{
+			"path": ".."
+		}
+	],
+	"settings": {
+		"githubPullRequests.ignoredPullRequestBranches": [
+			"main"
+		]
+	}
+}
\ No newline at end of file
diff --git a/flask_app/app.py b/flask_app/app.py
index 961b907..7d9181b 100644
--- a/flask_app/app.py
+++ b/flask_app/app.py
@@ -1,32 +1,74 @@
-from flask import Flask, render_template, jsonify
+from flask import Flask, render_template, jsonify, request
 from flask_cors import CORS
+import json
 
 app = Flask(__name__)
 CORS(app)
 
+crews = []
+tools = []
+agents = []
+tasks = []
+tools_state = []
+
 @app.route('/')
 def index():
     return render_template('index.html')
 
-@app.route('/api/crews', methods=['GET'])
+@app.route('/api/crews', methods=['GET', 'POST'])
 def get_crews():
-    return jsonify([])
+    if request.method == 'GET':
+        return jsonify(crews)
+    elif request.method == 'POST':
+        new_crew = request.get_json()
+        crews.append(new_crew)
+        return jsonify({'message': 'Crew added'}), 201
 
-@app.route('/api/tools', methods=['GET'])
+@app.route('/api/tools', methods=['GET', 'POST'])
 def get_tools():
-    return jsonify([])
+    if request.method == 'GET':
+        return jsonify(tools)
+    elif request.method == 'POST':
+        new_tool = request.get_json()
+        tools.append(new_tool)
+        return jsonify({'message': 'Tool added'}), 201
 
-@app.route('/api/agents', methods=['GET'])
+@app.route('/api/agents', methods=['GET', 'POST'])
 def get_agents():
-    return jsonify([])
+    if request.method == 'GET':
+        return jsonify(agents)
+    elif request.method == 'POST':
+        new_agent = request.get_json()
+        agents.append(new_agent)
+        return jsonify({'message': 'Agent added'}), 201
 
-@app.route('/api/tasks', methods=['GET'])
+@app.route('/api/tasks', methods=['GET', 'POST'])
 def get_tasks():
-    return jsonify([])
+    if request.method == 'GET':
+        return jsonify(tasks)
+    elif request.method == 'POST':
+        new_task = request.get_json()
+        tasks.append(new_task)
+        return jsonify({'message': 'Task added'}), 201
 
 @app.route('/api/tools/state', methods=['GET'])
 def get_tools_state():
-    return jsonify([])
+    return jsonify(tools_state)
+
+@app.route('/api/crews/<int:crew_id>/run', methods=['POST'])
+def run_crew(crew_id):
+    return jsonify({'message': f'Crew {crew_id} started'})
+
+@app.route('/api/crews/<int:crew_id>/export', methods=['GET'])
+def export_crew(crew_id):
+    # Placeholder for exporting crew data
+    return jsonify({'message': f'Crew {crew_id} exported'})
+
+@app.route('/api/crews/import', methods=['POST'])
+def import_crew():
+    # Placeholder for importing crew data
+    return jsonify({'message': 'Crew imported'})
+
 
 if __name__ == '__main__':
     app.run(debug=True, host='0.0.0.0', port=5000)
diff --git a/flask_app/requirements.txt b/flask_app/requirements.txt
index bb4e894..5218500 100644
--- a/flask_app/requirements.txt
+++ b/flask_app/requirements.txt
@@ -1,3 +1,5 @@
 flask==2.3.3
 flask-cors==4.0.0
 werkzeug==2.3.7
+crewai_tools
+
diff --git a/flask_app/static/img/icon-192.png b/flask_app/static/img/icon-192.png
new file mode 100644
index 0000000..e69de29

From 65570cfa0a9b1fbb73f0f423b898399dda8ea171 Mon Sep 17 00:00:00 2001
From: snyk-bot <snyk-bot@snyk.io>
Date: Thu, 15 May 2025 07:33:44 +0000
Subject: [PATCH 4/4] fix: Dockerfile to reduce vulnerabilities

The following vulnerabilities are fixed with an upgrade:
- https://snyk.io/vuln/SNYK-DEBIAN12-EXPAT-7855502
- https://snyk.io/vuln/SNYK-DEBIAN12-EXPAT-7855503
- https://snyk.io/vuln/SNYK-DEBIAN12-EXPAT-7855507
- https://snyk.io/vuln/SNYK-DEBIAN12-SQLITE3-6139924
- https://snyk.io/vuln/SNYK-DEBIAN12-LIBTASN16-8689970
---
 Dockerfile | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Dockerfile b/Dockerfile
index a48b832..5b82e84 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,5 +1,5 @@
 # Baseimage
-FROM python:3.12.5-slim-bookworm
+FROM python:3.13.2-slim-bookworm
 
 # Update Packages
 RUN apt update