Added test and small fixes

templates/settings.html

@@ -55,11 +55,20 @@
 
     <div class="form-row" id="row-key">
       <label for="sftp_key">Private key (PEM)</label>
-      <textarea id="sftp_key" name="sftp_key" rows="8" placeholder="-----BEGIN RSA PRIVATE KEY-----
-...
------END RSA PRIVATE KEY-----"></textarea>
       {% if has_key %}
-        <p class="muted small">A key is already configured. Paste a new one above to replace it, or leave blank to keep the existing key.</p>
+        <div class="key-status">
+          <span class="badge badge-uploaded">Key configured</span>
+          <code class="key-fingerprint">{{ key_fingerprint }}</code>
+        </div>
+        <details style="margin-top:0.5rem">
+          <summary class="muted small" style="cursor:pointer">Replace key</summary>
+          <textarea id="sftp_key" name="sftp_key" rows="8" style="margin-top:0.5rem"
+                    placeholder="-----BEGIN RSA PRIVATE KEY-----&#10;...&#10;-----END RSA PRIVATE KEY-----"></textarea>
+          <p class="muted small">Leave blank to keep the existing key.</p>
+        </details>
+      {% else %}
+        <textarea id="sftp_key" name="sftp_key" rows="8"
+                  placeholder="-----BEGIN RSA PRIVATE KEY-----&#10;...&#10;-----END RSA PRIVATE KEY-----"></textarea>
       {% endif %}
     </div>
 
@@ -68,6 +77,11 @@
       <input id="sftp_password" name="sftp_password" type="password"
              value="{{ s.get('sftp_password','') }}">
     </div>
+
+    <div class="form-row">
+      <button type="button" class="btn btn-secondary" onclick="testConn('ssh', this)">Test SSH connection</button>
+      <p id="test-ssh-result" class="test-result"></p>
+    </div>
   </section>
 
   <section class="form-section">
@@ -89,6 +103,11 @@
       <input id="calibre_pass" name="calibre_pass" type="password"
              value="{{ s.get('calibre_pass','') }}">
     </div>
+
+    <div class="form-row">
+      <button type="button" class="btn btn-secondary" onclick="testConn('calibre', this)">Test Calibre-Web connection</button>
+      <p id="test-calibre-result" class="test-result"></p>
+    </div>
   </section>
 
   <section class="form-section">
@@ -134,7 +153,26 @@ function toggleAuth(method) {
   document.getElementById("row-key").style.display = method === "key" ? "" : "none";
   document.getElementById("row-password").style.display = method === "password" ? "" : "none";
 }
-// Init on load
 toggleAuth(document.querySelector('[name=sftp_auth_method]:checked')?.value || "key");
+
+async function testConn(type, btn) {
+  const result = document.getElementById(`test-${type}-result`);
+  btn.disabled = true;
+  btn.textContent = "Testing…";
+  result.className = "test-result";
+  result.textContent = "";
+  try {
+    const r = await fetch(`/api/test/${type}`);
+    const data = await r.json();
+    result.textContent = data.message;
+    result.className = "test-result " + (data.ok ? "test-ok" : "test-fail");
+  } catch (e) {
+    result.textContent = "Request failed: " + e;
+    result.className = "test-result test-fail";
+  } finally {
+    btn.disabled = false;
+    btn.textContent = type === "ssh" ? "Test SSH connection" : "Test Calibre-Web connection";
+  }
+}
 </script>
 {% endblock %}