switch from ownCloud to minIO

buttons in table are buttons and do edit and delete properly

static/js/container-details.js

@@ -0,0 +1,23 @@
+document.addEventListener('DOMContentLoaded', function() {
+    const table = document.getElementById('objectTable');
+    if (!table) return;
+
+    table.addEventListener('click', function(e) {
+        const row = e.target.closest('.selectable-row');
+        if (!row) return;
+
+        // Remove selection from all rows
+        table.querySelectorAll('.selected-row').forEach(selectedRow => {
+            selectedRow.classList.remove('selected-row');
+        });
+
+        // Add selection to clicked row
+        row.classList.add('selected-row');
+
+        // Get container ID and redirect to show its details
+        const containerId = row.dataset.id;
+        const currentUrl = new URL(window.location.href);
+        currentUrl.searchParams.set('selected', containerId);
+        window.location.href = currentUrl.toString();
+    });
+});

static/js/crud-list.js

@@ -4,6 +4,8 @@ document.addEventListener('DOMContentLoaded', function() {
 
     const selectionMode = table.dataset.selectionMode || 'single';
     const toggleSelectAllBtn = document.getElementById('toggleSelectAllBtn');
+    const editBtn = document.getElementById('editBtn');
+    const deleteBtn = document.getElementById('deleteBtn');
 
     if (table.dataset.selectionMode === 'multiple') {
         toggleSelectAllBtn.style.display = 'inline-block';
@@ -26,19 +28,10 @@ document.addEventListener('DOMContentLoaded', function() {
         row.classList.toggle('selected-row');
         checkbox.checked = !checkbox.checked;
         const selectedRows = table.querySelectorAll('.selected-row');
+
         document.querySelectorAll('[data-requires-selection]').forEach(button => {
             button.disabled = selectedRows.length === 0;
         });
-        const objectId = row.dataset.id;
-        const editBtn = document.getElementById('editBtn');
-        const deleteBtn = document.getElementById('deleteBtn');
-        if (editBtn) {
-            editBtn.removeAttribute('disabled');
-            editBtn.href = editBtn.dataset.url?.replace('0', objectId);
-        }
-        if (deleteBtn) {
-            deleteBtn.removeAttribute('disabled');
-        }
     });
 
     let allSelected = false;
@@ -56,4 +49,81 @@ document.addEventListener('DOMContentLoaded', function() {
         this.textContent = allSelected ? 'Unselect All' : 'Select All';
     });
 
+    // Edit button click handler
+    if (editBtn) {
+        editBtn.addEventListener('click', function() {
+            const selectedRow = table.querySelector('.selected-row');
+            if (selectedRow) {
+                const objectId = selectedRow.dataset.id;
+                const editUrl = editBtn.dataset.url.replace('0', objectId);
+                window.location.href = editUrl;
+            }
+        });
+    }
+
+    // Delete modal logic
+    const deleteModal = document.getElementById('deleteModal');
+    const cancelDelete = document.getElementById('cancelDelete');
+    const confirmDelete = document.getElementById('confirmDelete');
+    let selectedId = null;
+
+    if (deleteBtn) {
+        deleteBtn.addEventListener('click', function() {
+            const selectedRow = table.querySelector('.selected-row');
+            if (selectedRow) {
+                selectedId = selectedRow.dataset.id;
+                deleteModal.style.display = 'block';
+            }
+        });
+    }
+
+    cancelDelete.addEventListener('click', function() {
+        deleteModal.style.display = 'none';
+    });
+
+confirmDelete.addEventListener('click', function() {
+    if (selectedId) {
+        const deleteUrl = deleteBtn.dataset.url.replace('0', selectedId);
+
+        fetch(deleteUrl, {
+            method: 'POST',
+            headers: {
+                'X-CSRFToken': getCookie('csrftoken')
+            },
+        })
+        .then(response => {
+            if (response.ok) {
+                window.location.reload(); // This reloads the page after success
+            } else {
+                alert('Error deleting item');
+            }
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            alert('Error deleting item');
+        });
+    }
+    deleteModal.style.display = 'none';
+});
+
+    window.addEventListener('click', function(event) {
+        if (event.target === deleteModal) {
+            deleteModal.style.display = 'none';
+        }
+    });
+
+    function getCookie(name) {
+        let cookieValue = null;
+        if (document.cookie && document.cookie !== '') {
+            const cookies = document.cookie.split(';');
+            for (let i = 0; i < cookies.length; i++) {
+                const cookie = cookies[i].trim();
+                if (cookie.substring(0, name.length + 1) === (name + '=')) {
+                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
+                    break;
+                }
+            }
+        }
+        return cookieValue;
+    }
 });

static/styles/details.css

@@ -0,0 +1,97 @@
+.search-card {
+    background: #EDDECB;
+    border: 1px solid #E1C6A8;
+    border-radius: 8px;
+    margin-bottom: 1.5rem;
+}
+
+.search-body {
+    padding: 1rem;
+}
+
+.search-group {
+    display: flex;
+    gap: 0.5rem;
+}
+
+.search-button {
+    flex-shrink: 0;
+}
+
+/*.btn-primary {*/
+/*    background: #EDDECB;*/
+/*    color: white;*/
+/*    border: none;*/
+/*    padding: 0.5rem 1rem;*/
+/*    border-radius: 8px;*/
+/*    cursor: pointer;*/
+/*}*/
+
+/*.btn-primary:hover {*/
+/*    background: #0056b3;*/
+/*}*/
+
+.details-card {
+    background: #EDDECB;
+    border: 1px solid #E1C6A8;
+    border-radius: 8px;
+    margin-bottom: 1.5rem;
+}
+
+.card-header {
+    background: #E1C6A8;
+    padding: 1rem;
+    border-bottom: 1px solid #E1C6A8;
+}
+
+.card-header h5 {
+    margin: 0;
+    font-size: 1.1rem;
+}
+
+.details-body {
+    padding: 1rem;
+}
+
+.details-grid {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: 1rem;
+}
+
+.details-column {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+}
+
+.detail-row {
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+}
+
+.detail-label {
+    flex: 0 0 45%;
+    text-align: right;
+    font-weight: bold;
+    color: #555;
+}
+
+.detail-value {
+    flex: 1;
+}
+
+/* Form styling */
+input[type="text"] {
+    padding: 0.5rem;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    width: 100%;
+}
+
+input[type="text"]:focus {
+    outline: none;
+    border-color: #007bff;
+    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
+}

static/styles/forms.css

@@ -84,6 +84,15 @@ button.btn-secondary {
     border: 1px solid #a57d52;
     border-radius: 4px;
     cursor: pointer;
+
+    /*background-color: #702222;*/
+    /*padding: 6px 20px;  !* Reduced from 10px to 6px *!*/
+    /*border: 1px solid #ae3975;*/
+    /*border-radius: 4px;*/
+    /*cursor: pointer;*/
+    /*height: 32px;  !* Add explicit height *!*/
+    /*line-height: 1.2;  !* Add line height for better text alignment *!*/
+
 }
 
 button[type="submit"]:hover,