Fix frontend bugs from staging

orthos2/frontend/static/frontend/custom.css

@@ -1,9 +1,34 @@
 body {
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  /* Bound the whole page to the viewport height instead of letting the
+     document scroll: the header (a flex-shrink:0 sibling of #app-shell)
+     then never scrolls out of view, and #app-shell's own children get a
+     real height to scroll independently within (see #sidenav/
+     #page-content-wrapper below). */
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  margin: 0;
+}
+
+.navbar {
+  flex-shrink: 0;
 }
 
 #app-shell {
-  min-height: 100vh;
+  flex: 1 1 auto;
+  /* Without this, a flex item won't shrink below its content's intrinsic
+     height, so overflow-y: auto on its children would never actually
+     kick in - #app-shell would just grow past the viewport instead. */
+  min-height: 0;
+}
+
+#sidenav {
+  overflow-y: auto;
+}
+
+#page-content-wrapper {
+  overflow-y: auto;
 }
 
 /* .offcanvas-lg resets background/width to transparent/auto above the lg

orthos2/frontend/templates/frontend/architectures/architecture.html

@@ -29,10 +29,6 @@
           >API:
           <a href="{% url 'api:architecture' %}?name={{ architecture.name }}"
             >{% url 'api:architecture' %}?name={{ architecture.name }}</a
-          >
-          | Edit:
-          <a href="{% url 'frontend:edit_architecture' architecture.id %}"
-            >{% url 'frontend:edit_architecture' architecture.id %}</a
           ></span
         >
       </main>

orthos2/frontend/templates/frontend/dailytasks/dailytask.html

@@ -29,10 +29,6 @@
           >API:
           <a href="{% url 'api:dailytask' %}?id={{ dailytask.pk }}"
             >{% url 'api:dailytask' %}?id={{ dailytask.pk }}</a
-          >
-          | Edit:
-          <a href="{% url 'frontend:edit_dailytask' dailytask.id %}"
-            >{% url 'frontend:edit_dailytask' dailytask.id %}</a
           ></span
         >
       </main>

orthos2/frontend/templates/frontend/devicetypes/detail/actions.html

@@ -13,12 +13,22 @@ <h5>Actions</h5>
 </div>
 <br />
 <div class="btn-group-vertical d-flex">
-  <a
-    class="btn btn-secondary btn-sm"
-    href="{% url 'frontend:devicetype_netbox_fetch' devicetype.pk %}"
-    role="button"
-    >Fetch Netbox</a
-  >
+  {% if devicetype.netbox_id %}
+    <a
+      class="btn btn-secondary btn-sm"
+      href="{% url 'frontend:devicetype_netbox_fetch' devicetype.pk %}"
+      role="button"
+      >Fetch Netbox</a
+    >
+  {% else %}
+    <a
+      class="btn btn-secondary btn-sm disabled"
+      href="#"
+      role="button"
+      title="Not linked to NetBox"
+      >Fetch Netbox</a
+    >
+  {% endif %}
 </div>
 <br />
 <div class="btn-group-vertical d-flex">

orthos2/frontend/templates/frontend/devicetypes/detail/netbox_comparison.html

@@ -4,12 +4,22 @@
 {% block tabcontent %}
   <div style="display: table; width: 100%;">
     <div style="display: table-row;" class="float-end">
-      <a
-        class="text-end btn btn-secondary btn-sm"
-        href="{% url 'frontend:devicetype_netbox_compare' devicetype.id %}"
-        role="button"
-        >Preview and Compare data with NetBox</a
-      >
+      {% if devicetype.netbox_id %}
+        <a
+          class="text-end btn btn-secondary btn-sm"
+          href="{% url 'frontend:devicetype_netbox_compare' devicetype.id %}"
+          role="button"
+          >Preview and Compare data with NetBox</a
+        >
+      {% else %}
+        <a
+          class="text-end btn btn-secondary btn-sm disabled"
+          href="#"
+          role="button"
+          title="Not linked to NetBox"
+          >Preview and Compare data with NetBox</a
+        >
+      {% endif %}
     </div>
   </div>
 

orthos2/frontend/templates/frontend/devicetypes/devicetype.html

@@ -36,10 +36,6 @@
           >API:
           <a href="{% url 'api:devicetype' %}?name={{ devicetype.name }}"
             >{% url 'api:devicetype' %}?name={{ devicetype.name }}</a
-          >
-          | Edit:
-          <a href="{% url 'frontend:edit_devicetype' devicetype.id %}"
-            >{% url 'frontend:edit_devicetype' devicetype.id %}</a
           ></span
         >
       </main>

orthos2/frontend/templates/frontend/domains/detail/overview.html

@@ -26,7 +26,13 @@ <h5>{{ domain.name }}</h5>
             </tr>
             <tr>
               <td class="th fw-bold">TFTP Server</td>
-              <td>{{ domain.tftp_server|default_if_none:"-" }}</td>
+              <td>
+                {% if domain.tftp_server %}
+                <a href="{% url 'frontend:detail' domain.tftp_server.id %}">{{ domain.tftp_server }}</a>
+                {% else %}
+                -
+                {% endif %}
+              </td>
             </tr>
             <tr>
               <td class="th fw-bold">CScreen Server</td>

orthos2/frontend/templates/frontend/domains/domain.html

@@ -33,9 +33,9 @@
           {% endblock %}
         </div>
         <span style="font-size: 0.7em; font-family: Monospace;"
-          >Edit:
-          <a href="{% url 'frontend:edit_domain' domain.id %}"
-            >{% url 'frontend:edit_domain' domain.id %}</a
+          >API:
+          <a href="{% url 'api:domain' %}?name={{ domain.name }}"
+            >{% url 'api:domain' %}?name={{ domain.name }}</a
           ></span
         >
       </main>

orthos2/frontend/templates/frontend/enclosures/detail/actions.html

@@ -13,12 +13,22 @@ <h5>Actions</h5>
 </div>
 <br />
 <div class="btn-group-vertical d-flex">
-  <a
-    class="btn btn-secondary btn-sm"
-    href="{% url 'frontend:enclosure_netbox_fetch' enclosure.pk %}"
-    role="button"
-    >Fetch Netbox</a
-  >
+  {% if enclosure.netbox_id %}
+    <a
+      class="btn btn-secondary btn-sm"
+      href="{% url 'frontend:enclosure_netbox_fetch' enclosure.pk %}"
+      role="button"
+      >Fetch Netbox</a
+    >
+  {% else %}
+    <a
+      class="btn btn-secondary btn-sm disabled"
+      href="#"
+      role="button"
+      title="Not linked to NetBox"
+      >Fetch Netbox</a
+    >
+  {% endif %}
 </div>
 <br />
 <div class="btn-group-vertical d-flex">

orthos2/frontend/templates/frontend/enclosures/detail/netbox_comparison.html

@@ -4,7 +4,11 @@
 {% block tabcontent %}
 <div style="display: table; width: 100%;">
 <div style="display: table-row;" class="float-end">
-  <a class="text-end btn btn-secondary btn-sm" href="{% url 'frontend:enclosure_netbox_compare' enclosure.id %}" role="button">Preview and Compare data with NetBox</a>
+  {% if enclosure.netbox_id %}
+    <a class="text-end btn btn-secondary btn-sm" href="{% url 'frontend:enclosure_netbox_compare' enclosure.id %}" role="button">Preview and Compare data with NetBox</a>
+  {% else %}
+    <a class="text-end btn btn-secondary btn-sm disabled" href="#" role="button" title="Not linked to NetBox">Preview and Compare data with NetBox</a>
+  {% endif %}
 </div>
 </div>
 

orthos2/frontend/templates/frontend/enclosures/enclosure.html

@@ -39,10 +39,6 @@
           >API:
           <a href="{% url 'api:enclosure' %}?name={{ enclosure.name }}"
             >{% url 'api:enclosure' %}?name={{ enclosure.name }}</a
-          >
-          | Edit:
-          <a href="{% url 'frontend:edit_enclosure' enclosure.id %}"
-            >{% url 'frontend:edit_enclosure' enclosure.id %}</a
           ></span
         >
       </main>

orthos2/frontend/templates/frontend/enclosures/enclosures_filterbar.html

@@ -20,6 +20,15 @@
 
       <span class="ms-2"></span>
 
+      <span class="hint" style="margin-right: 0.5rem;">NetBox Synchronized</span>
+      <div class="btn-group" role="group" style="margin-right: 0.5rem;">
+        <a class="btn btn-secondary btn-sm {% active request '1' %}" href="?{% url_replace request 'has_netbox' '1' %}" role="button">Yes</a>
+        <a class="btn btn-secondary btn-sm {% active request '0' %}" href="?{% url_replace request 'has_netbox' '0' %}" role="button">No</a>
+        <a class="btn btn-secondary btn-sm" href="?{% url_replace request 'has_netbox' '' True %}" role="button">&#215;</a>
+      </div>
+
+      <span class="ms-2"></span>
+
       {% include 'frontend/snippet.search.html' with search_hint='Name' %}
 
       <span class="ms-2"></span>

orthos2/frontend/templates/frontend/groups/detail/overview.html

@@ -56,12 +56,5 @@ <h5>Actions</h5>
         </div>
       </div>
     </div>
-
-    <span style="font-size: 0.7em; font-family: Monospace;"
-      >Edit:
-      <a href="{% url 'frontend:edit_group' group.id %}"
-        >{% url 'frontend:edit_group' group.id %}</a
-      ></span
-    >
   </div>
 {% endblock %}

orthos2/frontend/templates/frontend/machines/detail/edit_machine.html

@@ -43,6 +43,11 @@ <h5>VIRTUALIZATION SERVER</h5>
                   >
                 </div>
               </div>
+            {% else %}
+              {# Field isn't relevant for this system, but it's still a
+                 required part of the form - submit its unchanged value as
+                 hidden so unrelated edits don't fail validation. #}
+              {{ field.as_hidden }}
             {% endif %}
           {% elif field.name == "hypervisor" %}
             {% if object.system.virtual %}
@@ -61,6 +66,8 @@ <h5>VIRTUALIZATION CLIENT</h5>
                   >
                 </div>
               </div>
+            {% else %}
+              {{ field.as_hidden }}
             {% endif %}
           {% else %}
             {{ field.errors }}

orthos2/frontend/templates/frontend/machines/detail/netboxcomparison.html

@@ -4,7 +4,11 @@
 {% block tabcontent %}
 <div style="display: table; width: 100%;">
 <div style="display: table-row;" class="float-end">
-  <a class="text-end btn btn-secondary btn-sm" href="{% url 'frontend:netbox_compare' machine.id %}" role="button">Preview and Compare data with NetBox</a>
+  {% if machine.netbox_id %}
+    <a class="text-end btn btn-secondary btn-sm" href="{% url 'frontend:netbox_compare' machine.id %}" role="button">Preview and Compare data with NetBox</a>
+  {% else %}
+    <a class="text-end btn btn-secondary btn-sm disabled" href="#" role="button" title="Not linked to NetBox">Preview and Compare data with NetBox</a>
+  {% endif %}
 </div>
 </div>
 

orthos2/frontend/templates/frontend/machines/detail/remotepower.html

@@ -2,60 +2,71 @@
 {% load filters %}
 
 {% block tabcontent %}
-  <div class="title d-flex align-items-center">
-    <h5>Remote Power</h5>
-    {% if request.user.is_superuser and not machine.has_remotepower %}
-      <a
-        class="btn btn-success btn-sm ms-auto"
-        href="{% url 'frontend:new_remotepower' machine.pk %}"
-        >+</a
-      >
-    {% endif %}
-  </div>
-
   {% if machine.has_remotepower %}
-    <table class="table table-bordered small">
-      <tbody class="thead-default">
-        <tr>
-          <td class="th fw-bold" width="200px">Fence Agent</td>
-          <td>{{ machine.remotepower.get_remotepower_fence.name }}</td>
-        </tr>
-        <tr>
-          <td class="th fw-bold">Remote Power Device</td>
-          <td>{{ machine.remotepower.remote_power_device }}</td>
-        </tr>
-        <tr>
-          <td class="th fw-bold">Port</td>
-          <td>{{ machine.remotepower.port }}</td>
-        </tr>
-        <tr>
-          <td class="th fw-bold">Comment</td>
-          <td>{{ machine.remotepower.comment }}</td>
-        </tr>
-        <tr>
-          <td class="th fw-bold">Options</td>
-          <td>{{ machine.remotepower.options }}</td>
-        </tr>
-      </tbody>
-    </table>
-    {% if request.user.is_superuser %}
-      <div class="btn-group-vertical d-flex" style="max-width: 200px;">
-        <a
-          class="btn btn-warning btn-sm"
-          href="{% url 'frontend:edit_remotepower' machine.pk %}"
-          >Edit Remote Power</a
-        >
+    <div class="row">
+      <div class="col-10">
+        <div class="title">
+          <h5>Remote Power</h5>
+        </div>
+        <table class="table table-bordered small">
+          <tbody class="thead-default">
+            <tr>
+              <td class="th fw-bold" width="200px">Fence Agent</td>
+              <td>{{ machine.remotepower.get_remotepower_fence.name }}</td>
+            </tr>
+            <tr>
+              <td class="th fw-bold">Remote Power Device</td>
+              <td>{{ machine.remotepower.remote_power_device }}</td>
+            </tr>
+            <tr>
+              <td class="th fw-bold">Port</td>
+              <td>{{ machine.remotepower.port }}</td>
+            </tr>
+            <tr>
+              <td class="th fw-bold">Comment</td>
+              <td>{{ machine.remotepower.comment }}</td>
+            </tr>
+            <tr>
+              <td class="th fw-bold">Options</td>
+              <td>{{ machine.remotepower.options }}</td>
+            </tr>
+          </tbody>
+        </table>
       </div>
-      <br />
-      <div class="btn-group-vertical d-flex" style="max-width: 200px;">
+      {% if request.user.is_superuser %}
+        <div class="col-2">
+          <div class="title">
+            <h5>Actions</h5>
+          </div>
+          <div class="btn-group-vertical d-flex">
+            <a
+              class="btn btn-warning btn-sm"
+              href="{% url 'frontend:edit_remotepower' machine.pk %}"
+              >Edit Remote Power</a
+            >
+          </div>
+          <br />
+          <div class="btn-group-vertical d-flex">
+            <a
+              class="btn btn-danger btn-sm"
+              href="{% url 'frontend:delete_remotepower' machine.pk %}"
+              >Delete Remote Power</a
+            >
+          </div>
+        </div>
+      {% endif %}
+    </div>
+  {% else %}
+    <div class="title d-flex align-items-center">
+      <h5>Remote Power</h5>
+      {% if request.user.is_superuser %}
         <a
-          class="btn btn-danger btn-sm"
-          href="{% url 'frontend:delete_remotepower' machine.pk %}"
-          >Delete Remote Power</a
+          class="btn btn-success btn-sm ms-auto"
+          href="{% url 'frontend:new_remotepower' machine.pk %}"
+          >+</a
         >
-      </div>
-    {% endif %}
-  {% else %}
+      {% endif %}
+    </div>
     <div class="alert alert-info">
       No remote power configured for this machine!
     </div>