gitea-admin/gh-christianlouis-docuelevate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(settings): per-option save, live worker sync, audit log, and rollback

Browse Source 
A) Per-option Save Button
- Add per-setting Save button in settings.html (visible only when value changed)
- Button calls POST /api/settings/{key} directly; existing bulk Save retained
- Add Audit Log link in settings page header

B) Immediate Worker Sync
- New app/utils/settings_sync.py with notify_settings_updated() (Redis version key)
  and register_settings_reload_signal() (Celery task_prerun handler)
- Register signal in celery_worker.py at startup
- All API write paths call notify_settings_updated() after successful saves

C) Audit Log
- Add SettingsAuditLog model (key, old_value, new_value, changed_by, changed_at, action)
- save_setting_to_db / delete_setting_from_db accept changed_by and write audit entries
- New get_audit_log() service function (masks sensitive values)
- New GET /api/settings/audit-log endpoint (admin-only)
- New GET /admin/settings/audit-log view + audit_log.html template
- Visible to all admins (per clarified requirement)

D) Config Rollback / History
- New get_setting_history() and rollback_setting() service functions
- New GET /api/settings/{key}/history endpoint
- New POST /api/settings/{key}/rollback/{history_id} endpoint
- Rollback buttons in audit_log.html with confirmation dialog
- Tests: 25 new tests covering audit log, rollback, worker sync helpers, and API endpoints

Co-authored-by: christianlouis <361235+christianlouis@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot]
2026-02-23 02:28:08 +00:00
parent 05d03531b9
commit 90e5e0037c
9 changed files with 1321 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/templates/audit_log.html
+157
View File
@@ -0,0 +1,157 @@
{% extends "base.html" %}
{% block title %}Settings Audit Log - DocuElevate{% endblock %}
{% block content %}
<div class="container mx-auto px-4 py-8" x-data="auditLogApp()">
<!-- Header -->
<div class="mb-8 flex justify-between items-start">
<div>
<h1 class="text-3xl font-bold mb-2">Settings Audit Log</h1>
<p class="text-gray-600">
Chronological record of all configuration changes made via the settings UI.
Sensitive values are masked. Use the rollback button to revert any setting to a prior value.
</p>
</div>
<a href="/settings"
class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
<i class="fas fa-cog mr-2"></i> Back to Settings
</a>
</div>
<!-- Alert Messages -->
<div x-show="showAlert" x-transition class="mb-4">
<div :class="alertType === 'success' ? 'bg-green-100 border-green-500 text-green-700' : 'bg-red-100 border-red-500 text-red-700'"
class="border-l-4 p-4" role="alert">
<p class="font-bold" x-text="alertTitle"></p>
<p x-text="alertMessage"></p>
</div>
</div>
{% if entries %}
<div class="bg-white shadow rounded-lg overflow-hidden">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">When</th>
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Changed By</th>
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Setting Key</th>
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Action</th>
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Old Value</th>
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">New Value</th>
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Rollback</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
{% for entry in entries %}
<tr class="hover:bg-gray-50">
<td class="px-4 py-3 text-sm text-gray-600 whitespace-nowrap">{{ entry.changed_at }}</td>
<td class="px-4 py-3 text-sm text-gray-800 font-medium">{{ entry.changed_by }}</td>
<td class="px-4 py-3 text-sm font-mono text-blue-700">{{ entry.key }}</td>
<td class="px-4 py-3 text-sm">
{% if entry.action == 'delete' %}
<span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-red-100 text-red-800">delete</span>
{% elif entry.action == 'rollback' %}
<span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-purple-100 text-purple-800">rollback</span>
{% else %}
<span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-green-100 text-green-800">update</span>
{% endif %}
</td>
<td class="px-4 py-3 text-sm text-gray-600 font-mono max-w-xs truncate" title="{{ entry.old_value or '' }}">
{% if entry.old_value %}
<span class="text-gray-500">{{ entry.old_value }}</span>
{% else %}
<span class="italic text-gray-400">—</span>
{% endif %}
</td>
<td class="px-4 py-3 text-sm text-gray-800 font-mono max-w-xs truncate" title="{{ entry.new_value or '' }}">
{% if entry.new_value %}
{{ entry.new_value }}
{% else %}
<span class="italic text-gray-400">— (deleted)</span>
{% endif %}
</td>
<td class="px-4 py-3 text-sm">
<button
type="button"
@click="rollback('{{ entry.key }}', {{ entry.id }}, '{{ entry.new_value or '' }}')"
:disabled="rollingBack === {{ entry.id }}"
class="inline-flex items-center px-2 py-1 text-xs font-medium rounded border border-gray-300 text-gray-700 bg-white hover:bg-yellow-50 hover:border-yellow-400 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-yellow-400 disabled:opacity-50 disabled:cursor-not-allowed"
title="Revert '{{ entry.key }}' to the value in this log entry"
>
<span x-show="rollingBack !== {{ entry.id }}"><i class="fas fa-undo mr-1"></i>Rollback</span>
<span x-show="rollingBack === {{ entry.id }}">Working…</span>
</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<div class="bg-white shadow rounded-lg p-8 text-center text-gray-500">
<i class="fas fa-history text-4xl mb-4 block text-gray-300"></i>
<p class="text-lg">No configuration changes recorded yet.</p>
<p class="text-sm mt-2">Changes you make on the <a href="/settings" class="text-blue-600 hover:underline">Settings page</a> will appear here.</p>
</div>
{% endif %}
</div>
<script>
function auditLogApp() {
return {
rollingBack: null,
showAlert: false,
alertType: 'success',
alertTitle: '',
alertMessage: '',
showSuccessAlert(title, message) {
this.alertType = 'success';
this.alertTitle = title;
this.alertMessage = message;
this.showAlert = true;
setTimeout(() => this.showAlert = false, 6000);
},
showErrorAlert(title, message) {
this.alertType = 'error';
this.alertTitle = title;
this.alertMessage = message;
this.showAlert = true;
setTimeout(() => this.showAlert = false, 10000);
},
async rollback(key, historyId, targetValue) {
const label = targetValue ? `'${targetValue}'` : '(deleted / ENV default)';
if (!confirm(`Revert '${key}' to ${label}?\n\nThis will write a new audit log entry.`)) {
return;
}
this.rollingBack = historyId;
this.showAlert = false;
try {
const response = await fetch(`/api/settings/${key}/rollback/${historyId}`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
});
const result = await response.json();
if (response.ok && result.success) {
this.showSuccessAlert('Rollback Successful', `Setting '${key}' has been reverted. Reloading…`);
setTimeout(() => window.location.reload(), 1500);
} else {
this.showErrorAlert('Rollback Failed', result.detail || 'Unknown error');
}
} catch (error) {
console.error('Rollback error:', error);
this.showErrorAlert('Error', 'Failed to perform rollback. Please try again.');
} finally {
this.rollingBack = null;
}
}
};
}
</script>
{% endblock %}
frontend/templates/settings.html
+61 -4
View File
@@ -13,10 +13,18 @@
<div class="container mx-auto px-4 py-8" x-data="settingsApp()">
<!-- Header -->
<div class="mb-8">
<h1 class="text-3xl font-bold mb-2">Application Settings</h1>
<p class="text-gray-600">
This is a convenience feature to view and edit application settings through the web interface.
</p>
<div class="flex justify-between items-start">
<div>
<h1 class="text-3xl font-bold mb-2">Application Settings</h1>
<p class="text-gray-600">
This is a convenience feature to view and edit application settings through the web interface.
</p>
</div>
<a href="/admin/settings/audit-log"
class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
<i class="fas fa-history mr-2"></i> Audit Log
</a>
</div>
<div class="bg-blue-50 border-l-4 border-blue-500 text-blue-700 p-4 my-4" role="alert">
<p class="font-bold">📋 Settings Precedence Order:</p>
<ul class="list-disc list-inside ml-4 mt-2">
@@ -150,6 +158,22 @@
</div>
{% endif %}
</div>
<!-- Per-setting Save button (visible only when value has changed) -->
<div class="ml-4 flex-shrink-0 flex flex-col items-end gap-1 pt-1">
<button
type="button"
x-show="formData['{{ setting.key }}'] !== originalData['{{ setting.key }}']"
x-transition
@click="saveSetting('{{ setting.key }}')"
:disabled="savingKey === '{{ setting.key }}'"
class="px-3 py-1 text-sm bg-green-600 text-white rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 disabled:opacity-50 disabled:cursor-not-allowed whitespace-nowrap"
title="Save this setting"
>
<span x-show="savingKey !== '{{ setting.key }}'"><i class="fas fa-save mr-1"></i>Save</span>
<span x-show="savingKey === '{{ setting.key }}'">Saving…</span>
</button>
</div>
</div>
</div>
{% endfor %}
@@ -185,6 +209,7 @@ function settingsApp() {
originalData: {},
showPassword: {},
saving: false,
savingKey: null,
showAlert: false,
alertType: 'success',
alertTitle: '',
@@ -230,6 +255,38 @@ function settingsApp() {
this.showAlert = false;
},
async saveSetting(key) {
this.savingKey = key;
this.hideAlert();
try {
const value = this.formData[key];
const response = await fetch(`/api/settings/${key}`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ key, value }),
});
const result = await response.json();
if (response.ok && result.success) {
this.originalData[key] = value;
let message = `Setting '${key}' saved successfully.`;
if (result.restart_required) {
message += ' Please restart the application for this change to take effect.';
}
this.showSuccessAlert('Setting Saved', message);
} else {
this.showErrorAlert('Save Failed', result.detail || 'Unknown error');
}
} catch (error) {
console.error('Error saving setting:', error);
this.showErrorAlert('Error', 'Failed to save setting. Please try again.');
} finally {
this.savingKey = null;
}
},
async saveSettings() {
this.saving = true;
this.hideAlert();