-
-
Notifications
You must be signed in to change notification settings - Fork 5.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Auto-update the system status in admin dashboard #29163
Auto-update the system status in admin dashboard #29163
Conversation
- Refactored the system status list into its own template - Changed the backend to return only the system status if the request was initiated by htmx - `hx-get="{{$.Link}}"`: reuse the backend handler - `hx-swap="innerHTML"`: replace the `<div>`'s innerHTML (essentially the new template) - `hx-trigger="every 5s"`: call every 5 seconds - `hx-indicator=".divider"`: the `is-loading` class shouldn't be added to the div during the request, so set it on an element it has no effect on - Render "Since Last GC Time" with `<relative-time>`, so we send a timestamp Signed-off-by: Yarden Shoham <[email protected]>
Hmm… Sounds acceptable for me. |
Not a big problem. Can htmx diff the DOM and only update the changed nodes? That would be the ideal solution. |
I tried |
I checked htmx docks, does not seems it can do DOM diffing. Such a feature is usually something that requrires a library like React or Vue. |
|
Save it for a future PR? |
I think https://htmx.org/extensions/morphdom-swap/ is the better solution that does not require backend changes and it might prove useful for other cases as well. Yes, does not have to be here. |
I'd even argue that morphdom swap should be the default swapping behaviour. With it, it will preserve selection, caret, CSS transition state, etc in swapped content. Plain htmx swap is fast but too destructive. |
Such a refresh won't work properly in case of distributed Gitea with multiple servers, because stats would flip around confusingly when they come from different servers. Not a blocker, but I thought to mention it at least. |
@silverwind good enough to get your approval? |
Not super happy that it won't work in distributed deployment, though I guess it's barely acceptable as a minor broken thing. |
The previous way also won't work no? |
I can accept it with this TODO added. |
Co-authored-by: silverwind <[email protected]>
Co-authored-by: silverwind <[email protected]>
cc @anbraten if you do implement websockets, maybe you can rewrite this PR with it |
* giteaofficial/main: (23 commits) Remove jQuery from SSH key form parser (go-gitea#29193) Refactor request function (go-gitea#29187) Docker Tag Information in Docs (go-gitea#29047) Fix gitea-action user avatar broken on edited menu (go-gitea#29190) Disable parallel Make execution (go-gitea#29186) Auto-update the system status in admin dashboard (go-gitea#29163) Avoid vue warning in dev mode (go-gitea#29188) Update JS and PY dependencies (go-gitea#29184) [skip ci] Updated translations via Crowdin Implement contributors graph (go-gitea#27882) Add support for action artifact serve direct (go-gitea#29120) Advertise WebAuthn support (go-gitea#29176) Tweak repo header (go-gitea#29134) Change webhook-type in create-view (go-gitea#29114) Remove jQuery from the comment task list (go-gitea#29170) Fix can not select team reviewers when reviewers is empty (go-gitea#29174) move sign in labels to be above inputs (go-gitea#28753) Refactor locale&string&template related code (go-gitea#29165) Extract linguist code to method (go-gitea#29168) bump to use go 1.22 (go-gitea#29119) ...
- Refactor the system status list into its own template - Change the backend to return only the system status if htmx initiated the request - `hx-get="{{$.Link}}/system_status`: reuse the backend handler - `hx-swap="innerHTML"`: replace the `<div>`'s innerHTML (essentially the new template) - `hx-trigger="every 5s"`: call every 5 seconds - `hx-indicator=".divider"`: the `is-loading` class shouldn't be added to the div during the request, so set it on an element it has no effect on - Render "Since Last GC Time" with `<relative-time>`, so we send a timestamp # Auto-update in action GIF ![action](https://github.com/go-gitea/gitea/assets/20454870/c6e1f220-f0fb-4460-ac3b-59f315e30e29) --------- Signed-off-by: Yarden Shoham <[email protected]> Co-authored-by: silverwind <[email protected]>
- Refactor the system status list into its own template - Change the backend to return only the system status if htmx initiated the request - `hx-get="{{$.Link}}/system_status`: reuse the backend handler - `hx-swap="innerHTML"`: replace the `<div>`'s innerHTML (essentially the new template) - `hx-trigger="every 5s"`: call every 5 seconds - `hx-indicator=".divider"`: the `is-loading` class shouldn't be added to the div during the request, so set it on an element it has no effect on - Render "Since Last GC Time" with `<relative-time>`, so we send a timestamp # Auto-update in action GIF ![action](https://github.com/go-gitea/gitea/assets/20454870/c6e1f220-f0fb-4460-ac3b-59f315e30e29) --------- Signed-off-by: Yarden Shoham <[email protected]> Co-authored-by: silverwind <[email protected]> (cherry picked from commit c70f65e)
Automatically locked because of our CONTRIBUTING guidelines |
hx-get="{{$.Link}}/system_status
: reuse the backend handlerhx-swap="innerHTML"
: replace the<div>
's innerHTML (essentially the new template)hx-trigger="every 5s"
: call every 5 secondshx-indicator=".divider"
: theis-loading
class shouldn't be added to the div during the request, so set it on an element it has no effect on<relative-time>
, so we send a timestampAuto-update in action GIF