Fix button in branch list, avoid unexpected page jump before restore branch actually done (#21562)
This patch: - Use `<button>` replace anchor link `<a>` in **_Delete/Restore Branch_** button to avoid unexpected page jump before restore branch actually done. - Also replace right side buttons with `<button>` in branch list, let some screen readers know they are buttons. ## Before click restore branch -> restore triggered -> page refreshed, but branch status not update -> manually refresh page <details> https://user-images.githubusercontent.com/76462613/197389108-5a0bd259-0455-40b2-92ac-4326900276f8.mp4 </details> ## After waiting restore done -> page refresh -> branch status update <details> https://user-images.githubusercontent.com/76462613/197428683-616fcbd2-70f9-4572-bf76-e0b7f77b6dd7.mp4 </details> Signed-off-by: baronbunny <its@baronbunny.cn> Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com> Co-authored-by: Lauris BH <lauris@nix.lv>
This commit is contained in:
parent
b2269dedf2
commit
26f941fbda
1 changed files with 15 additions and 11 deletions
|
@ -22,18 +22,18 @@
|
||||||
</td>
|
</td>
|
||||||
<td class="right aligned overflow-visible">
|
<td class="right aligned overflow-visible">
|
||||||
{{if and $.IsWriter (not $.Repository.IsArchived) (not .IsDeleted)}}
|
{{if and $.IsWriter (not $.Repository.IsArchived) (not .IsDeleted)}}
|
||||||
<div class="ui basic jump button icon tooltip show-create-branch-modal" data-content="{{$.locale.Tr "repo.branch.new_branch_from" ($.DefaultBranch)}}" data-branch-from="{{$.DefaultBranch}}" data-branch-from-urlcomponent="{{PathEscapeSegments $.DefaultBranch}}" data-modal="#create-branch-modal" data-position="top right">
|
<button class="ui basic jump button icon tooltip show-create-branch-modal" data-content="{{$.locale.Tr "repo.branch.new_branch_from" ($.DefaultBranch)}}" data-branch-from="{{$.DefaultBranch}}" data-branch-from-urlcomponent="{{PathEscapeSegments $.DefaultBranch}}" data-modal="#create-branch-modal" data-position="top right">
|
||||||
{{svg "octicon-git-branch"}}
|
{{svg "octicon-git-branch"}}
|
||||||
</div>
|
</button>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{if not $.DisableDownloadSourceArchives}}
|
{{if not $.DisableDownloadSourceArchives}}
|
||||||
<div class="ui basic jump dropdown icon button tooltip" data-content="{{$.locale.Tr "repo.branch.download" ($.DefaultBranch)}}" data-position="top right">
|
<button class="ui basic jump dropdown icon button tooltip" data-content="{{$.locale.Tr "repo.branch.download" ($.DefaultBranch)}}" data-position="top right">
|
||||||
{{svg "octicon-download"}}
|
{{svg "octicon-download"}}
|
||||||
<div class="menu">
|
<div class="menu">
|
||||||
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.DefaultBranch}}.zip" rel="nofollow">{{svg "octicon-file-zip"}} ZIP</a>
|
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.DefaultBranch}}.zip" rel="nofollow">{{svg "octicon-file-zip"}} ZIP</a>
|
||||||
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.DefaultBranch}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}} TAR.GZ</a>
|
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.DefaultBranch}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}} TAR.GZ</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</button>
|
||||||
{{end}}
|
{{end}}
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
@ -108,26 +108,30 @@
|
||||||
</td>
|
</td>
|
||||||
<td class="three wide right aligned overflow-visible">
|
<td class="three wide right aligned overflow-visible">
|
||||||
{{if and $.IsWriter (not $.Repository.IsArchived) (not .IsDeleted)}}
|
{{if and $.IsWriter (not $.Repository.IsArchived) (not .IsDeleted)}}
|
||||||
<div class="ui basic jump button icon tooltip show-create-branch-modal" data-branch-from="{{.Name}}" data-branch-from-urlcomponent="{{PathEscapeSegments .Name}}" data-content="{{$.locale.Tr "repo.branch.new_branch_from" .Name}}" data-position="top right" data-modal="#create-branch-modal" data-name="{{.Name}}">
|
<button class="ui basic jump button icon tooltip show-create-branch-modal" data-branch-from="{{.Name}}" data-branch-from-urlcomponent="{{PathEscapeSegments .Name}}" data-content="{{$.locale.Tr "repo.branch.new_branch_from" .Name}}" data-position="top right" data-modal="#create-branch-modal" data-name="{{.Name}}">
|
||||||
{{svg "octicon-git-branch"}}
|
{{svg "octicon-git-branch"}}
|
||||||
</div>
|
</button>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{if and (not .IsDeleted) (not $.DisableDownloadSourceArchives)}}
|
{{if and (not .IsDeleted) (not $.DisableDownloadSourceArchives)}}
|
||||||
<div class="ui basic jump dropdown icon button tooltip" data-content="{{$.locale.Tr "repo.branch.download" (.Name)}}" data-position="top right">
|
<button class="ui basic jump dropdown icon button tooltip" data-content="{{$.locale.Tr "repo.branch.download" (.Name)}}" data-position="top right">
|
||||||
{{svg "octicon-download"}}
|
{{svg "octicon-download"}}
|
||||||
<div class="menu">
|
<div class="menu">
|
||||||
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments .Name}}.zip" rel="nofollow">{{svg "octicon-file-zip"}} ZIP</a>
|
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments .Name}}.zip" rel="nofollow">{{svg "octicon-file-zip"}} ZIP</a>
|
||||||
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments .Name}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}} TAR.GZ</a>
|
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments .Name}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}} TAR.GZ</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</button>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{if and $.IsWriter (not $.IsMirror) (not $.Repository.IsArchived) (not .IsProtected)}}
|
{{if and $.IsWriter (not $.IsMirror) (not $.Repository.IsArchived) (not .IsProtected)}}
|
||||||
{{if .IsDeleted}}
|
{{if .IsDeleted}}
|
||||||
<a class="ui basic jump button icon tooltip undo-button" href data-url="{{$.Link}}/restore?branch_id={{.DeletedBranch.ID}}&name={{.DeletedBranch.Name}}" data-content="{{$.locale.Tr "repo.branch.restore" (.Name)}}" data-position="top right"><span class="text blue">{{svg "octicon-reply"}}</span></a>
|
<button class="ui basic jump button icon tooltip undo-button" data-url="{{$.Link}}/restore?branch_id={{.DeletedBranch.ID}}&name={{.DeletedBranch.Name}}" data-content="{{$.locale.Tr "repo.branch.restore" (.Name)}}" data-position="top right">
|
||||||
|
<span class="text blue">
|
||||||
|
{{svg "octicon-reply"}}
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
{{else}}
|
{{else}}
|
||||||
<a class="ui basic jump button icon tooltip delete-button delete-branch-button" href data-url="{{$.Link}}/delete?name={{.Name}}" data-content="{{$.locale.Tr "repo.branch.delete" (.Name)}}" data-position="top right" data-name="{{.Name}}">
|
<button class="ui basic jump button icon tooltip delete-button delete-branch-button" data-url="{{$.Link}}/delete?name={{.Name}}" data-content="{{$.locale.Tr "repo.branch.delete" (.Name)}}" data-position="top right" data-name="{{.Name}}">
|
||||||
{{svg "octicon-trash"}}
|
{{svg "octicon-trash"}}
|
||||||
</a>
|
</button>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{end}}
|
{{end}}
|
||||||
</td>
|
</td>
|
||||||
|
|
Loading…
Reference in a new issue