Stared work on the manager side

Web UI Project/app/templates/index.html

@@ -0,0 +1,52 @@
+{% extends "base.html" %}
+{% block connect %}
+
+<!-- Run action button -->
+ <div id="connect-Button">
+  {% if connected %}
+    <form
+      hx-post="/disconnect"
+      hx-target="#connect-Button"
+      hx-swap="outerHTML"
+    >
+      <button class="px-4 py-2 rounded bg-green-600 text-white hover:bg-red-600">
+        Printer is connected. (Press to disconnect)
+      </button>
+    </form>
+
+    <!-- Live status panel, will load once when revealed and then the returned fragment polls itself -->
+    <div id="live-status" hx-post="/status" hx-trigger="load" hx-swap="outerHTML" class="mt-4"></div>
+  {% else %}
+    <form
+      hx-post="/connect"
+      hx-target="#connect-Button"
+      hx-swap="outerHTML"
+    >
+      <button class="px-4 py-2 rounded bg-indigo-600 text-white hover:bg-indigo-500">
+        Connect to Printer
+      </button>
+    </form>
+  {% endif %}
+</div>
+
+
+{% endblock %}
+
+{% block status %}
+<!--
+<form
+  hx-post="/status"
+  hx-target="#status-result"
+  hx-swap="innerHTML"
+>
+  <button class="px-4 py-2 rounded bg-indigo-600 text-white hover:bg-indigo-500">
+    Get Printer Status
+  </button>
+</form>
+<div id="status-result" class="mt-4"></div>
+-->
+
+
+
+
+{% endblock %}