Add ability to delete http functions

2023-12-16 22:35:28 +11:00
parent 2365fa3987
commit 204000a668
5 changed files with 97 additions and 34 deletions
--- a/app.py
+++ b/app.py
@@ -89,10 +89,16 @@ def get_http_function_add_form():

@ app.route("/dashboard/http_functions/create", methods=["POST"])
 def create_http_function():
-    name = request.json.get('name')
-    script_content = request.json.get('script_content')
-    db.create_new_http_function(name, script_content)
-    return render_template("dashboard/http_functions/new.html", name=name, script=script_content)
+    try:
+        name = request.json.get('name')
+        script_content = request.json.get('script_content')
+        db.create_new_http_function(name, script_content)
+        
+        http_functions = db.get_http_functions()
+        http_functions = create_http_functions_view_model(http_functions)
+        return render_template("dashboard/http_functions.html", http_functions=http_functions)
+    except Exception as e:
+        return render_template("dashboard/http_functions/new.html", name=name, script=script_content)

@ app.route("/dashboard/http_functions/edit_form", methods=["GET"])
 def get_http_function_edit_form():
@@ -109,10 +115,25 @@ def edit_http_function():
        name = request.json.get('name')
        script_content = request.json.get('script_content')
        db.edit_http_function(name, script_content)
-        return redirect(url_for('dashboard_http_functions'))
+        
+        http_functions = db.get_http_functions()
+        http_functions = create_http_functions_view_model(http_functions)
+        return render_template("dashboard/http_functions.html", http_functions=http_functions)
    except Exception as e:
        return render_template("dashboard/http_functions/edit.html", name=name, script=script_content)

+@ app.route("/dashboard/http_functions/delete", methods=["DELETE"])
+def delete_http_function():
+    try:
+        name = request.args.get('name')
+        db.delete_http_function(name)
+        
+        http_functions = db.get_http_functions()
+        http_functions = create_http_functions_view_model(http_functions)
+        return render_template("dashboard/http_functions.html", http_functions=http_functions)
+    except Exception as e:
+        return jsonify({'error': str(e)}), 500
+
@ app.route("/dashboard/timer_functions", methods=["GET"])
 def dashboard_timer_functions():
    return render_template("dashboard/timer_functions.html")
--- a/db.py
+++ b/db.py
@@ -63,3 +63,7 @@ class DataBase():
    def edit_http_function(self, name, script_content):
        self.execute(
            'UPDATE http_functions SET script_content=%s WHERE NAME=%s', [script_content, name], commit=True)
+
+    def delete_http_function(self, name):
+        self.execute(
+            'DELETE FROM http_functions WHERE NAME=%s', [name], commit=True)
--- a/templates/client.html
+++ b/templates/client.html
@@ -2,6 +2,15 @@

 {% block content %}

+<div class="flex items-center pb-4" data-id="51">
+    <h1 class="font-semibold text-lg md:text-2xl" data-id="52">Try: {{ name }}</h1>
+    <button
+        class="inline-flex items-center justify-center text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-9 rounded-md px-3 ml-auto"
+        hx-get="{{ url_for('dashboard_http_functions') }}" hx-target="#container" hx-swap="innerHTML">
+        Cancel
+    </button>
+</div>
+
 <div class="mx-auto w-full">
    <form class="flex"><select
            class="px-4 py-2 border rounded-md border-gray-300 hover:border-orange-500 focus:outline-none bg-gray-100"
--- a/templates/dashboard/http_functions/edit.html
+++ b/templates/dashboard/http_functions/edit.html
@@ -1,13 +1,15 @@
 <div class="flex items-center" data-id="51">
-    <h1 class="font-semibold text-lg md:text-2xl" data-id="52">Update HTTP function</h1>
+    <h1 class="font-semibold text-lg md:text-2xl" data-id="52">Update: <span class="font-mono">{{ name }}</span></h1>
+    <button
+        class="inline-flex items-center justify-center text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-9 rounded-md px-3 ml-auto"
+        hx-get="{{ url_for('dashboard_http_functions') }}" hx-target="#container" hx-swap="innerHTML">
+        Cancel
+    </button>
 </div>

-
 <div>
    <div class="flex space-x-2 p-2 border-b border-gray-200 dark:border-gray-800">
-        <input type="text" id="function-name"
-            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 max-w-fit"
-            placeholder="foo" required="" value="{{ name }}">
+
        <button
            class="inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2 text-gray-600 dark:text-gray-400"
            id="executeBtn">
@@ -29,23 +31,39 @@
                <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"></path>
            </svg>
        </button>
-        <button
-            class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-2 border border-blue-500 hover:border-transparent rounded flex"
-            id="add-http-function">
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
-                stroke="currentColor" class="w-6 h-6 mr-2">
-                <path stroke-linecap="round" stroke-linejoin="round"
-                    d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" />
-            </svg>
-
-
-            <p> Update</p>
-        </button>

    </div>

    <div id="editor" class="relative rounded-lg shadow-lg p-4 mb-4">{{ script }}
    </div>
+
+    <div class="flex">
+        <button
+            class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded flex mr-2"
+            id="add-http-function">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
+                stroke="currentColor" class="w-4 h-4 mr-2">
+                <path stroke-linecap="round" stroke-linejoin="round"
+                    d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" />
+            </svg>
+
+            <p> Update</p>
+        </button>
+
+        <button class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded inline-flex items-center"
+            hx-delete="{{ url_for('delete_http_function', name=name) }}" hx-target="#container" hx-swap="innerHTML"
+            hx-confirm="Are you sure you want to delete {{ name }}?">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
+                stroke="currentColor" class="w-4 h-4 mr-2">
+                <path stroke-linecap="round" stroke-linejoin="round"
+                    d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0" />
+            </svg>
+
+            <span>Delete</span>
+        </button>
+
+    </div>
+
 </div>

 <div id="output">
@@ -135,7 +153,7 @@
    });

    document.querySelector('#add-http-function').addEventListener('click', () => {
-        let name = document.querySelector('#function-name').value;
+        let name = '{{ name }}';
        let script_content = editor.getValue();

        fetch("{{ url_for('edit_http_function') }}", {
--- a/templates/dashboard/http_functions/new.html
+++ b/templates/dashboard/http_functions/new.html
@@ -1,5 +1,10 @@
 <div class="flex items-center" data-id="51">
    <h1 class="font-semibold text-lg md:text-2xl" data-id="52">New HTTP function</h1>
+    <button
+        class="inline-flex items-center justify-center text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-9 rounded-md px-3 ml-auto"
+        hx-get="{{ url_for('dashboard_http_functions') }}" hx-target="#container" hx-swap="innerHTML">
+        Cancel
+    </button>
 </div>


@@ -29,22 +34,23 @@
                <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"></path>
            </svg>
        </button>
-        <button
-            class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-2 border border-blue-500 hover:border-transparent rounded flex"
-            id="add-http-function">
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
-                stroke="currentColor" class="w-6 h-6 mr-2" data-darkreader-inline-stroke=""
-                style="--darkreader-inline-stroke: currentColor;">
-                <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"></path>
-            </svg>
-
-            <p> Add</p>
-        </button>

    </div>

    <div id="editor" class="relative rounded-lg shadow-lg p-4 mb-4">{{ script }}
    </div>
+
+    <button
+        class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded flex"
+        id="add-http-function">
+        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
+            class="w-6 h-6 mr-2" data-darkreader-inline-stroke="" style="--darkreader-inline-stroke: currentColor;">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"></path>
+        </svg>
+
+        <p> Add</p>
+    </button>
+
 </div>

 <div id="output">
@@ -144,5 +150,10 @@
            },
            body: JSON.stringify({ name, script_content }),
        })
+            .then(response => response.text())
+            .then(text => {
+                document.querySelector('#container').innerHTML = text
+                htmx.process(htmx.find('#container'))
+            })
    })
 </script>