Add ability to rename http functions

app.py

@@ -150,13 +150,15 @@ def edit_http_function():
     try:
         user_id = current_user.id
         name = request.json.get('name')
+        updated_name = request.json.get('updated_name')
         script_content = request.json.get('script_content')
         environment_info = request.json.get('environment_info')
         is_public = request.json.get('is_public')
         log_request = request.json.get('log_request')
         log_response = request.json.get('log_response')
         
-        db.edit_http_function(user_id, name, script_content, environment_info, is_public, log_request, log_response)
+        db.edit_http_function(user_id, name, updated_name, script_content, environment_info, is_public, log_request, log_response)
+
         return { "status": "success", "message": f'{name} updated' }
     except Exception as e:
         print(e)

db.py

@@ -64,10 +64,10 @@ class DataBase():
             commit=True
         )
 
-    def edit_http_function(self, user_id, name, script_content, environment_info, is_public, log_request, log_response):
+    def edit_http_function(self, user_id, name, updated_name, script_content, environment_info, is_public, log_request, log_response):
         self.execute(
-            'UPDATE http_functions SET script_content=%s, environment_info=%s, is_public=%s, log_request=%s, log_response=%s WHERE user_id=%s AND NAME=%s',
+            'UPDATE http_functions SET NAME=%s, script_content=%s, environment_info=%s, is_public=%s, log_request=%s, log_response=%s WHERE user_id=%s AND NAME=%s',
-            [script_content, environment_info, is_public, log_request, log_response, user_id, name],
+            [updated_name, script_content, environment_info, is_public, log_request, log_response, user_id, name],
             commit=True
         )
     

templates/function_editor.html

@@ -2,11 +2,9 @@
     <div class="flex space-x-2 p-2 border-b border-gray-200 dark:border-gray-800">
         <h1 class="font-semibold text-lg text-gray-400 font-mono flex items-center" data-id="52">Code</h1>
 
-        {% if is_add|default(false, true) %}
         <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 }}">
-        {% endif %}
 
         <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 justify-between"
@@ -233,7 +231,8 @@
         </button>
         <script>
             document.querySelector('#edit-http-function').addEventListener('click', () => {
-                let name = '{{ name }}';
+                let name = "{{ name }}";
+                let updated_name = document.querySelector('#function-name').value;
                 let script_content = editor.getValue().trim();
                 let environment_info = editor_environment.getValue().trim();
                 let is_public = document.querySelector('#is_public').checked
@@ -245,10 +244,21 @@
                     headers: {
                         'Content-Type': 'application/json',
                     },
-                    body: JSON.stringify({ name, script_content, environment_info, is_public, log_request, log_response }),
+                    body: JSON.stringify({ name, updated_name, script_content, environment_info, is_public, log_request, log_response }),
                 })
                     .then(response => response.json())
-                    .then(json => showAlert(json.message, json.status))
+                    .then(json => {
+                        if (name != updated_name) {
+                            htmx.ajax('GET', "{{ url_for('get_http_function_edit_form') }}", {
+                                target: '#container',
+                                swap: 'innerHTML',
+                                values: { name: updated_name }
+                            });
+                        }
+                        else {
+                            showAlert(json.message, json.status)
+                        }
+                    })
             })
         </script>
         {% endif %}