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

Add settings management infrastructure: models, API, views, and database loading

Browse Source 
Co-authored-by: christianlouis <361235+christianlouis@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot]
2026-02-07 22:31:06 +00:00
parent 24d09fc362
commit e1bb9de915
10 changed files with 1093 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/templates/base.html
+2
View File
@@ -47,6 +47,7 @@
<a href="/upload" class="text-gray-700 hover:text-gray-900">Upload</a>
<a href="/files" class="text-gray-700 hover:text-gray-900">Files</a>
<a href="/status" class="text-gray-700 hover:text-gray-900">Status</a>
<a href="/settings" class="text-gray-700 hover:text-gray-900">Settings</a>
<a href="/about" class="text-gray-700 hover:text-gray-900">About</a>
<!-- Dynamic Auth Section -->
@@ -82,6 +83,7 @@
<a href="/upload" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Upload</a>
<a href="/files" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Files</a>
<a href="/status" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Status</a>
<a href="/settings" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Settings</a>
<a href="/about" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">About</a>
<!-- Mobile Auth Section -->
frontend/templates/settings.html
+251
View File
@@ -0,0 +1,251 @@
{% extends "base.html" %}
{% block title %}Settings - DocuElevate{% endblock %}
{% block head_extra %}
<style>
.setting-input {
font-family: 'Courier New', monospace;
}
</style>
{% endblock %}
{% block content %}
<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">
Configure application settings through the web interface.
Settings saved here will take precedence over environment variables.
</p>
<div class="bg-yellow-100 border-l-4 border-yellow-500 text-yellow-700 p-4 my-4" role="alert">
<p class="font-bold">⚠️ Important Notes:</p>
<ul class="list-disc list-inside ml-4 mt-2">
<li>Settings marked with <span class="text-red-600">*</span> require an application restart to take effect.</li>
<li>Sensitive values (passwords, API keys) are masked for security.</li>
<li>Changes are persisted in the database and override environment variables.</li>
<li>Only administrators can access and modify these settings.</li>
</ul>
</div>
</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>
<!-- Form -->
<form @submit.prevent="saveSettings">
{% for category, settings_list in settings_data.items() %}
<div class="bg-white shadow rounded-lg mb-6">
<!-- Category Header -->
<div class="bg-gray-100 px-6 py-4 border-b border-gray-200">
<h2 class="text-xl font-semibold text-gray-800">{{ category }}</h2>
</div>
<!-- Settings in this category -->
<div class="px-6 py-4 space-y-6">
{% for setting in settings_list %}
<div class="border-b border-gray-200 pb-6 last:border-b-0">
<div class="flex justify-between items-start">
<div class="flex-1">
<label for="{{ setting.key }}" class="block text-sm font-medium text-gray-700 mb-1">
{{ setting.key.replace('_', ' ').title() }}
{% if setting.metadata.restart_required %}
<span class="text-red-600">*</span>
{% endif %}
{% if setting.metadata.required %}
<span class="text-red-600 text-xs">(required)</span>
{% endif %}
</label>
<p class="text-xs text-gray-500 mb-2">
{{ setting.metadata.description }}
</p>
{% if setting.metadata.type == 'boolean' %}
<!-- Boolean/Checkbox Input -->
<div class="flex items-center">
<input
type="checkbox"
id="{{ setting.key }}"
name="{{ setting.key }}"
:checked="formData['{{ setting.key }}'] === 'true' || formData['{{ setting.key }}'] === true"
@change="formData['{{ setting.key }}'] = $event.target.checked ? 'true' : 'false'"
class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
/>
<label for="{{ setting.key }}" class="ml-2 text-sm text-gray-700">
Enable {{ setting.key.replace('_', ' ').title() }}
</label>
</div>
{% else %}
<!-- Text Input -->
<div class="relative">
{% if setting.metadata.sensitive %}
<input
:type="showPassword['{{ setting.key }}'] ? 'text' : 'password'"
id="{{ setting.key }}"
name="{{ setting.key }}"
x-model="formData['{{ setting.key }}']"
class="setting-input w-full px-3 py-2 pr-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
placeholder="{{ setting.metadata.description }}"
{% if setting.metadata.required %}required{% endif %}
/>
<button
type="button"
@click="togglePassword('{{ setting.key }}')"
class="absolute inset-y-0 right-0 pr-3 flex items-center text-gray-400 hover:text-gray-600"
>
<i :class="showPassword['{{ setting.key }}'] ? 'fas fa-eye-slash' : 'fas fa-eye'"></i>
</button>
{% else %}
<input
type="text"
id="{{ setting.key }}"
name="{{ setting.key }}"
x-model="formData['{{ setting.key }}']"
class="setting-input w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
placeholder="{{ setting.metadata.description }}"
{% if setting.metadata.required %}required{% endif %}
/>
{% endif %}
</div>
{% endif %}
</div>
</div>
</div>
{% endfor %}
</div>
</div>
{% endfor %}
<!-- Action Buttons -->
<div class="flex justify-end space-x-4 mt-6">
<button
type="button"
@click="resetForm"
class="px-6 py-2 border border-gray-300 text-gray-700 rounded-md hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
>
Reset
</button>
<button
type="submit"
:disabled="saving"
class="px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
>
<span x-show="!saving">Save Settings</span>
<span x-show="saving">Saving...</span>
</button>
</div>
</form>
</div>
<script>
function settingsApp() {
return {
formData: {},
originalData: {},
showPassword: {},
saving: false,
showAlert: false,
alertType: 'success',
alertTitle: '',
alertMessage: '',
init() {
// Initialize form data from current settings
{% for category, settings_list in settings_data.items() %}
{% for setting in settings_list %}
this.formData['{{ setting.key }}'] = '{{ setting.value }}';
this.originalData['{{ setting.key }}'] = '{{ setting.value }}';
this.showPassword['{{ setting.key }}'] = false;
{% endfor %}
{% endfor %}
},
togglePassword(key) {
this.showPassword[key] = !this.showPassword[key];
},
resetForm() {
this.formData = { ...this.originalData };
this.hideAlert();
},
showSuccessAlert(title, message) {
this.alertType = 'success';
this.alertTitle = title;
this.alertMessage = message;
this.showAlert = true;
setTimeout(() => this.hideAlert(), 5000);
},
showErrorAlert(title, message) {
this.alertType = 'error';
this.alertTitle = title;
this.alertMessage = message;
this.showAlert = true;
setTimeout(() => this.hideAlert(), 10000);
},
hideAlert() {
this.showAlert = false;
},
async saveSettings() {
this.saving = true;
this.hideAlert();
try {
// Prepare updates array
const updates = [];
for (const [key, value] of Object.entries(this.formData)) {
// Only include changed settings
if (value !== this.originalData[key]) {
updates.push({ key, value });
}
}
if (updates.length === 0) {
this.showSuccessAlert('No Changes', 'No settings were modified.');
this.saving = false;
return;
}
// Send bulk update request
const response = await fetch('/api/settings/bulk-update', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(updates),
});
const result = await response.json();
if (response.ok && result.success) {
this.originalData = { ...this.formData };
let message = `${result.updated.length} setting(s) updated successfully.`;
if (result.restart_required) {
message += ' Please restart the application for changes to take effect.';
}
this.showSuccessAlert('Settings Saved', message);
} else {
const errorMessages = result.errors ? result.errors.map(e => `${e.key}: ${e.error}`).join(', ') : 'Unknown error';
this.showErrorAlert('Save Failed', errorMessages);
}
} catch (error) {
console.error('Error saving settings:', error);
this.showErrorAlert('Error', 'Failed to save settings. Please try again.');
} finally {
this.saving = false;
}
}
};
}
</script>
{% endblock %}