1 files changed, 64 insertions, 0 deletions

diff --git a/templates/instances/config.html b/templates/instances/config.html
new file mode 100644
index 0000000..192a123
--- /dev/null
+++ b/templates/instances/config.html
@@ -0,0 +1,64 @@
+{% extends "base.html" %} {% block content %}
+<div class="page-header">
+  <h1>Config Files: {{ instance_name }}</h1>
+  <a href="/instances/{{ instance_id }}/edit" class="btn"
+    >&larr; Back to Instance</a
+  >
+</div>
+
+{% if saved %}
+<div class="flash flash-ok">File saved successfully.</div>
+{% endif %} {% if let Some(err) = error %}
+<div class="flash flash-err">{{ err }}</div>
+{% endif %}
+
+<div style="display: flex; gap: 1.5rem; align-items: flex-start">
+  {# File list sidebar #}
+  <div class="card" style="flex: 0 0 260px; max-height: 70vh; overflow-y: auto">
+    <h3 style="margin-bottom: 0.5rem">Files</h3>
+    {% if files.is_empty() %}
+    <p style="font-size: 0.85rem; color: var(--fg-muted)">
+      No config files yet.<br />Start the server to generate them.
+    </p>
+    {% else %}
+    <ul style="list-style: none; padding: 0; margin: 0; font-size: 0.85rem">
+      {% for f in files %}
+      <li style="padding: 0.25rem 0">
+        <a
+          href="/instances/{{ instance_id }}/config?path={{ f }}"
+          style="{% if selected_file.as_deref() == Some(f) %}font-weight:bold;color:var(--ok){% endif %}"
+        >
+          {{ f }}
+        </a>
+      </li>
+      {% endfor %}
+    </ul>
+    {% endif %}
+  </div>
+
+  {# Editor area #}
+  <div class="card" style="flex: 1">
+    {% if let Some(file) = selected_file %}
+    <h3 style="margin-bottom: 0.5rem">{{ file }}</h3>
+    {% if let Some(content) = content %}
+    <form method="post" action="/instances/{{ instance_id }}/config">
+      <input type="hidden" name="path" value="{{ file }}" />
+      <textarea
+        name="content"
+        rows="30"
+        style="width: 100%; font-family: monospace; font-size: 0.8rem"
+        spellcheck="false"
+      >
+{{ content }}</textarea>
+      <div style="margin-top: 0.5rem">
+        <button type="submit" class="btn-ok">Save</button>
+      </div>
+    </form>
+    {% else %}
+    <p style="color: var(--fg-muted)">Could not load file content.</p>
+    {% endif %} {% else %}
+    <p style="color: var(--fg-muted)">Select a file from the list to edit.</p>
+    {% endif %}
+  </div>
+</div>
+{% endblock %}