context-hub/templates/editor.html

65 lines
2.6 KiB
HTML

{% extends "base.html" %}
{% block content %}
<div class="mb-6 flex items-center justify-between">
<div>
<h1 class="text-3xl font-bold text-white uppercase">{{ scope }} Scope Editor</h1>
<p class="text-gray-400 mt-2">Edit rules for the <span class="font-bold text-gray-200">{{ scope }}</span> scope (JSON format).</p>
</div>
<a href="/dashboard" class="text-gray-400 hover:text-white">&larr; Back to Dashboard</a>
</div>
<div class="bg-gray-800 rounded-lg shadow border border-gray-700 p-6">
<div id="alert-box" class="hidden mb-4 p-4 rounded-md text-sm"></div>
<form id="editor-form" class="space-y-4">
<div>
<textarea id="json-editor" rows="20" class="w-full bg-gray-900 text-gray-100 font-mono text-sm p-4 rounded-md border border-gray-600 focus:border-nyora focus:ring-1 focus:ring-nyora transition"></textarea>
</div>
<div class="flex justify-end">
<button type="button" onclick="saveRules()" class="px-6 py-2 bg-nyora text-gray-900 font-medium rounded-md hover:bg-yellow-500 transition shadow-sm">Save Changes</button>
</div>
</form>
</div>
<script>
const initialContent = {{ content | tojson | safe }};
const textarea = document.getElementById('json-editor');
const alertBox = document.getElementById('alert-box');
const scope = "{{ scope }}";
textarea.value = JSON.stringify(initialContent, null, 2);
function showAlert(message, isError=false) {
alertBox.textContent = message;
alertBox.className = `mb-4 p-4 rounded-md text-sm font-medium ${isError ? 'bg-red-900 text-red-200 border border-red-700' : 'bg-green-900 text-green-200 border border-green-700'}`;
alertBox.classList.remove('hidden');
setTimeout(() => { alertBox.classList.add('hidden'); }, 4000);
}
async function saveRules() {
let data;
try {
data = JSON.parse(textarea.value);
} catch (e) {
showAlert("Invalid JSON format. Please check syntax.", true);
return;
}
try {
const response = await fetch(`/api/admin/rules/${scope}`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
if (response.ok) {
showAlert("Rules successfully saved!");
} else {
showAlert("Error saving rules: " + response.statusText, true);
}
} catch(e) {
showAlert("Network error.", true);
}
}
</script>
{% endblock %}