wip

app/templates/dashboard/app_form.html

@@ -119,8 +119,6 @@
                     <select name="protocols[]" class="form-select">
                       <option value="TCP" {% if port.protocol=='TCP' %}selected{% endif %}>TCP</option>
                       <option value="UDP" {% if port.protocol=='UDP' %}selected{% endif %}>UDP</option>
-                      <option value="SCTP" {% if port.protocol=='SCTP' %}selected{% endif %}>SCTP</option>
-                      <option value="OTHER" {% if port.protocol=='OTHER' %}selected{% endif %}>OTHER</option>
                     </select>
                   </td>
                   <td>
@@ -144,8 +142,6 @@
                     <select name="protocols[]" class="form-select">
                       <option value="TCP" selected>TCP</option>
                       <option value="UDP">UDP</option>
-                      <option value="SCTP">SCTP</option>
-                      <option value="OTHER">OTHER</option>
                     </select>
                   </td>
                   <td>
@@ -251,9 +247,48 @@
 </script>
 
 <script>
+  // Make sure removePortRow is in the global scope
+  window.removePortRow = function (button) {
+    const tbody = document.querySelector('#ports-table tbody');
+    const row = button.closest('tr');
+
+    // Get current number of rows
+    const rowCount = tbody.querySelectorAll('tr').length;
+
+    // If this is the last row, clear its values instead of removing
+    if (rowCount <= 1) {
+      const inputs = row.querySelectorAll('input');
+      inputs.forEach(input => {
+        input.value = '';
+      });
+
+      // Reset protocol to TCP
+      const protocolSelect = row.querySelector('select[name="protocols[]"]');
+      if (protocolSelect) {
+        protocolSelect.value = 'TCP';
+      }
+
+      // Add a visual indicator that this row is empty
+      row.classList.add('table-secondary', 'opacity-50');
+
+      // Show a helping message
+      showNotification('Application saved with no ports. Use "Add Port" to add ports.', 'info');
+    } else {
+      // Remove the row if there are other rows
+      row.remove();
+    }
+  };
+
   // Port management functions
   function addPortRow(portNumber = '', protocol = 'TCP', description = '') {
     const tbody = document.querySelector('#ports-table tbody');
+
+    // Remove the empty row indicator if present
+    const emptyRows = tbody.querySelectorAll('tr.table-secondary.opacity-50');
+    if (emptyRows.length > 0) {
+      emptyRows.forEach(row => row.remove());
+    }
+
     const newRow = document.createElement('tr');
     newRow.innerHTML = `
       <td class="position-relative">
@@ -265,8 +300,6 @@
         <select name="protocols[]" class="form-select">
           <option value="TCP" ${protocol === 'TCP' ? 'selected' : ''}>TCP</option>
           <option value="UDP" ${protocol === 'UDP' ? 'selected' : ''}>UDP</option>
-          <option value="SCTP" ${protocol === 'SCTP' ? 'selected' : ''}>SCTP</option>
-          <option value="OTHER" ${protocol === 'OTHER' ? 'selected' : ''}>OTHER</option>
         </select>
       </td>
       <td>
@@ -285,10 +318,6 @@
     setTimeout(setupPortValidation, 50);
   }
 
-  function removePortRow(button) {
-    button.closest('tr').remove();
-  }
-
   async function generateRandomPort() {
     try {
       const serverId = document.querySelector('select[name="server_id"]').value;