Mirrors/gitea
0
0
Fork 0
mirror of https://github.com/go-gitea/gitea.git synced 2026-05-17 21:00:38 +02:00
Code Issues Activity

fix(stopwatch): prevent page reload when stopping/cancelling from navbar popup

Browse Source 
The navbar popup stop/cancel forms used form-fetch-action, which always
reloads the page when the server returns an empty redirect. Remove that
class and add a dedicated delegated submit handler in stopwatch.ts that
POSTs the action silently; the WebSocket push (or periodic poller) then
updates the icon without any navigation.
This commit is contained in:
Epid 2026-04-02 04:55:34 +03:00
parent 0dc3607cf7
commit 075af8eaf5
2 changed files with 14 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
templates/base/head_navbar.tmpl
View File

@ -159,14 +159,14 @@
<span class="stopwatch-issue">{{if $activeStopwatch}}{{$activeStopwatch.RepoSlug}}#{{$activeStopwatch.IssueIndex}}{{end}}</span> <span class="stopwatch-issue">{{if $activeStopwatch}}{{$activeStopwatch.RepoSlug}}#{{$activeStopwatch.IssueIndex}}{{end}}</span>
</a> </a>
<div class="tw-flex tw-gap-1"> <div class="tw-flex tw-gap-1">
<form class="stopwatch-commit form-fetch-action" method="post" action="{{if $activeStopwatch}}{{$activeStopwatch.IssueLink}}/times/stopwatch/stop{{end}}"> <form class="stopwatch-commit" method="post" action="{{if $activeStopwatch}}{{$activeStopwatch.IssueLink}}/times/stopwatch/stop{{end}}">
<button <button
type="submit" type="submit"
class="ui button mini compact basic icon tw-mr-0" class="ui button mini compact basic icon tw-mr-0"
data-tooltip-content="{{ctx.Locale.Tr "repo.issues.stop_tracking"}}" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.stop_tracking"}}"
>{{svg "octicon-square-fill"}}</button> >{{svg "octicon-square-fill"}}</button>
</form> </form>
<form class="stopwatch-cancel form-fetch-action" method="post" action="{{if $activeStopwatch}}{{$activeStopwatch.IssueLink}}/times/stopwatch/cancel{{end}}"> <form class="stopwatch-cancel" method="post" action="{{if $activeStopwatch}}{{$activeStopwatch.IssueLink}}/times/stopwatch/cancel{{end}}">
<button <button
type="submit" type="submit"
class="ui button mini compact basic icon tw-mr-0" class="ui button mini compact basic icon tw-mr-0"

14
web_src/js/features/stopwatch.ts
View File

@ -1,6 +1,6 @@
import {createTippy} from '../modules/tippy.ts'; import {createTippy} from '../modules/tippy.ts';
import {GET} from '../modules/fetch.ts'; import {GET, POST} from '../modules/fetch.ts';
import {hideElem, queryElems, showElem} from '../utils/dom.ts'; import {addDelegatedEventListener, hideElem, queryElems, showElem} from '../utils/dom.ts';
import {UserEventsSharedWorker} from '../modules/worker.ts'; import {UserEventsSharedWorker} from '../modules/worker.ts';
const {appSubUrl, notificationSettings, enableTimeTracking} = window.config; const {appSubUrl, notificationSettings, enableTimeTracking} = window.config;
@ -42,6 +42,16 @@ export function initStopwatch() {
}); });
} }
// Handle stop/cancel from the navbar popup without triggering a page reload.
// These forms are not form-fetch-action so they won't navigate; the WebSocket
// push (or periodic poller) updates the icon after the action completes.
addDelegatedEventListener(document, 'submit', '.stopwatch-commit,.stopwatch-cancel', async (form: HTMLFormElement, e: SubmitEvent) => {
e.preventDefault();
const action = form.getAttribute('action');
if (!action) return;
await POST(action, {data: new FormData(form)});
});
let usingPeriodicPoller = false; let usingPeriodicPoller = false;
const startPeriodicPoller = (timeout: number) => { const startPeriodicPoller = (timeout: number) => {
if (timeout <= 0 || !Number.isFinite(timeout)) return; if (timeout <= 0 || !Number.isFinite(timeout)) return;