No GUI activity indication if HTMX rendering is enabled

[peteeckel]

Deployment Type

Self-hosted

NetBox Version

v4.0-beta1

Python Version

3.11

Steps to Reproduce

1. Enable "HTMX Rendering" in the user preferences
2. Restart NetBox
3. Click on any navigation item in the sidebar

Expected Behavior

The display in the main view panel changes immediately. If that isn't possible (as is currently the case because of the extremely long schema load times after restart that are probably caused by a strawberry-django bug, see Art's comment in #15520), at least there should be some indication that something is happening in the background.

Observed Behavior

Nothing whatsoever happens for a long time, then the UI is updated.

The user does not have any indication that the mouse click has been accepted, which is no good UX. For long-running background activity there should at least be some kind of indication that there is something happening in the background.

This is not directly linked to the strawberry-django issue, it's just a good way to reproduce it.

[arthanson]

Actually after discussion, this can remain a bug - really a global spinner / activity indicator for HTMX requests. However, I don't think the restart NetBox case is valid as it is actually not running then (it is trying to start up) so it can't do anything until it actually starts.

[peteeckel]

However, I don't think the restart NetBox case is valid as it is actually not running then (it is trying to start up) so it can't do anything until it actually starts.

Fair point. The problem is that with a clean out of the box install it might be difficult to reproduce ... I'll try to find a simple way to create an UI delay where the backend actually does something.

[peteeckel]

Steps to reproduce:

1. Create /opt/netbox/netbox/validators/delay.py with the following content:

import time

from extras.validators import CustomValidator

class Delay(CustomValidator):

    def validate(self, instance):
        time.sleep(10)

2. Configure this code as a custom validator for ipam.ipaddress:

from validators.delay import Delay

CUSTOM_VALIDATORS = {
    "ipam.ipaddress": [
        Delay(),
    ]
}

3. Restart NetBox
4. Enable HTMX navigation for the current user
5. Create a new IP address object and click on Create

Same results as above.

[jeremystretch]

We should be able to implement a "spinner" easily using hx-indicator.