Honey/MicroNAS
0
0 Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

Phase 3: full share CRUD + session login page

Browse Source 
Backend:
- SMB config parser/writer (_parse_smb_conf, _write_smb_conf) for
  safe whole-file rewrites instead of append-only
- NFS exports parser/writer (_parse_exports, _write_exports) with
  support for disabled (commented-out) exports
- DELETE/PATCH/toggle endpoints for SMB and NFS shares
- parse_smb() now returns enabled field (reads available = no)
- get_nfs_shares() uses the new parser and returns enabled field
- Replace HTTP Basic Auth with Flask session auth (secret key derived
  from MICRONAS_PASS so sessions survive restarts)
- /login GET/POST, /logout routes

Frontend:
- Login page (templates/login.html) with same dark theme
- Sign out button in header
- Edit modal pre-filled with current share values
- Delete buttons wired up (with confirm dialog)
- Enable/Disable toggle per share (green/grey dot status indicator)
- Disabled shares shown at reduced opacity

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
marcandClaude Sonnet 4.6 committed 2026-06-19 22:26:32 +02:00
1 parent 1118681fd2
commit 5d9a9e62ec
4 files changed
+487 -69
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

static/js/shares.js
+154 -20
View File
@@ -5,39 +5,53 @@ async function loadShares() {
const sb = document.getElementById('smbTableBody');
if (!shares.smb?.length) {
sb.innerHTML = `<tr><td colspan="4" style="color:var(--muted)">No SMB shares.</td></tr>`;
sb.innerHTML = `<tr><td colspan="5" style="color:var(--muted)">No SMB shares.</td></tr>`;
} else {
sb.innerHTML = shares.smb.map(s => `
<tr>
sb.innerHTML = shares.smb.map(s => {
const enabled = s.enabled !== false;
const statusDot = `<span class="dot ${enabled ? 'dot-green' : 'dot-red'}" style="margin-right:0"></span>`;
return `<tr style="${enabled ? '' : 'opacity:.55'}">
<td>${esc(s.name)}</td>
<td><code>${esc(s.path)}</code></td>
<td style="color:var(--muted); font-size:.87em">${esc(s.valid_users || '—')}</td>
<td>${statusDot}</td>
<td>
<button class="btn btn-sm me-1" style="border:1px solid var(--border); color:var(--muted)"
onclick="openQuotaModal('smb',${JSON.stringify(s.name)},${JSON.stringify(s.path)},${JSON.stringify(s.valid_users)})">
Quota
</button>
<button class="btn btn-sm btn-danger" disabled title="Coming in Phase 3">Delete</button>
onclick="openEditModal('smb',${JSON.stringify(s)})">Edit</button>
<button class="btn btn-sm me-1" style="border:1px solid var(--border); color:var(--muted)"
onclick="openQuotaModal('smb',${JSON.stringify(s.name)},${JSON.stringify(s.path)},${JSON.stringify(s.valid_users)})">Quota</button>
<button class="btn btn-sm me-1" style="border:1px solid var(--border); color:var(--muted)"
onclick="toggleShare('smb',${JSON.stringify(s.name)},${!enabled})">${enabled ? 'Disable' : 'Enable'}</button>
<button class="btn btn-sm btn-danger"
onclick="deleteShare('smb',${JSON.stringify(s.name)})">Delete</button>
</td>
</tr>`).join('');
</tr>`;
}).join('');
}
const nb = document.getElementById('nfsTableBody');
if (!shares.nfs?.length) {
nb.innerHTML = `<tr><td colspan="3" style="color:var(--muted)">No NFS exports.</td></tr>`;
nb.innerHTML = `<tr><td colspan="4" style="color:var(--muted)">No NFS exports.</td></tr>`;
} else {
nb.innerHTML = shares.nfs.map(s => `
<tr>
nb.innerHTML = shares.nfs.map(s => {
const enabled = s.enabled !== false;
const statusDot = `<span class="dot ${enabled ? 'dot-green' : 'dot-red'}" style="margin-right:0"></span>`;
return `<tr style="${enabled ? '' : 'opacity:.55'}">
<td><code>${esc(s.path)}</code></td>
<td style="color:var(--muted); font-size:.87em">${esc(s.clients)}</td>
<td>${statusDot}</td>
<td>
<button class="btn btn-sm me-1" style="border:1px solid var(--border); color:var(--muted)"
onclick="openQuotaModal('nfs',null,${JSON.stringify(s.path)},null)">
Quota
</button>
<button class="btn btn-sm btn-danger" disabled title="Coming in Phase 3">Delete</button>
onclick="openEditModal('nfs',${JSON.stringify(s)})">Edit</button>
<button class="btn btn-sm me-1" style="border:1px solid var(--border); color:var(--muted)"
onclick="openQuotaModal('nfs',null,${JSON.stringify(s.path)},null)">Quota</button>
<button class="btn btn-sm me-1" style="border:1px solid var(--border); color:var(--muted)"
onclick="toggleShare('nfs',${JSON.stringify(s.path)},${!enabled})">${enabled ? 'Disable' : 'Enable'}</button>
<button class="btn btn-sm btn-danger"
onclick="deleteShare('nfs',${JSON.stringify(s.path)})">Delete</button>
</td>
</tr>`).join('');
</tr>`;
}).join('');
}
}
@@ -58,8 +72,7 @@ async function addSMBShare() {
document.getElementById('smbName').value = '';
document.getElementById('smbPath').value = '';
document.getElementById('smbUsers').value = '';
loadShares();
loadDashboard();
loadShares(); loadDashboard();
}
async function addNFSShare() {
@@ -79,6 +92,127 @@ async function addNFSShare() {
document.getElementById('nfsPath').value = '';
document.getElementById('nfsClients').value = '';
document.getElementById('nfsReadOnly').checked = false;
loadShares();
loadDashboard();
loadShares(); loadDashboard();
}
// ===== EDIT =====
let _editCtx = null;
function openEditModal(type, share) {
_editCtx = { type, original: share };
document.getElementById('editModalTitle').textContent =
type === 'smb' ? `Edit SMB Share — ${esc(share.name)}` : `Edit NFS Export — ${esc(share.path)}`;
let body = '';
if (type === 'smb') {
body = `
<div class="mb-3">
<label class="form-label" style="color:var(--muted); font-size:.85rem">Share Name</label>
<input type="text" id="editName" class="form-control" value="${esc(share.name)}">
</div>
<div class="mb-3">
<label class="form-label" style="color:var(--muted); font-size:.85rem">Path</label>
<input type="text" id="editPath" class="form-control" value="${esc(share.path)}">
</div>
<div class="mb-3">
<label class="form-label" style="color:var(--muted); font-size:.85rem">Valid Users</label>
<input type="text" id="editUsers" class="form-control" value="${esc(share.valid_users || '')}">
</div>`;
} else {
const isRo = /\(ro[,)]/.test(share.clients);
const cleanClients = share.clients.replace(/\s*\(.*?\)/g, '').trim();
body = `
<div class="mb-3">
<label class="form-label" style="color:var(--muted); font-size:.85rem">Path</label>
<input type="text" class="form-control" value="${esc(share.path)}" readonly style="color:var(--muted)">
</div>
<div class="mb-3">
<label class="form-label" style="color:var(--muted); font-size:.85rem">Clients</label>
<input type="text" id="editClients" class="form-control" value="${esc(cleanClients)}">
</div>
<div class="form-check ms-1 mt-2">
<input type="checkbox" id="editReadOnly" class="form-check-input" ${isRo ? 'checked' : ''}>
<label class="form-check-label" for="editReadOnly" style="color:var(--muted)">Read only</label>
</div>`;
}
document.getElementById('editModalBody').innerHTML = body;
new bootstrap.Modal(document.getElementById('editModal')).show();
}
async function submitEdit() {
const ctx = _editCtx;
if (!ctx) return;
let res;
if (ctx.type === 'smb') {
const name = document.getElementById('editName').value.trim();
const path = document.getElementById('editPath').value.trim();
const validUsers = document.getElementById('editUsers').value.trim();
res = await apiFetch(`/api/share/smb/${encodeURIComponent(ctx.original.name)}`, {
method: 'PATCH', headers: {'Content-Type': 'application/json'},
body: JSON.stringify({name, path, validUsers}),
});
} else {
const clients = document.getElementById('editClients').value.trim();
const readOnly = document.getElementById('editReadOnly').checked;
res = await apiFetch('/api/share/nfs', {
method: 'PATCH', headers: {'Content-Type': 'application/json'},
body: JSON.stringify({path: ctx.original.path, clients, readOnly}),
});
}
if (!res) return;
const data = await res.json();
bootstrap.Modal.getInstance(document.getElementById('editModal')).hide();
if (!res.ok) return showToast('Error: ' + (data.error || res.status), 'danger');
showToast('Share updated.');
loadShares(); loadDashboard();
}
// ===== DELETE =====
async function deleteShare(type, identifier) {
const label = type === 'smb' ? `SMB share "${identifier}"` : `NFS export "${identifier}"`;
if (!confirm(`Delete ${label}? This cannot be undone.`)) return;
let res;
if (type === 'smb') {
res = await apiFetch(`/api/share/smb/${encodeURIComponent(identifier)}`, { method: 'DELETE' });
} else {
res = await apiFetch('/api/share/nfs', {
method: 'DELETE', headers: {'Content-Type': 'application/json'},
body: JSON.stringify({path: identifier}),
});
}
if (!res) return;
const data = await res.json();
if (!res.ok) return showToast('Error: ' + (data.error || res.status), 'danger');
showToast(`${label} deleted.`);
loadShares(); loadDashboard();
}
// ===== TOGGLE =====
async function toggleShare(type, identifier, enable) {
let res;
if (type === 'smb') {
res = await apiFetch(`/api/share/smb/${encodeURIComponent(identifier)}/toggle`, {
method: 'POST', headers: {'Content-Type': 'application/json'},
body: JSON.stringify({enabled: enable}),
});
} else {
res = await apiFetch('/api/share/nfs/toggle', {
method: 'POST', headers: {'Content-Type': 'application/json'},
body: JSON.stringify({path: identifier, enabled: enable}),
});
}
if (!res) return;
const data = await res.json();
if (!res.ok) return showToast('Error: ' + (data.error || res.status), 'danger');
showToast(`Share ${enable ? 'enabled' : 'disabled'}.`);
loadShares(); loadDashboard();
}