Clarify Unescape button #10158

New Issue

GiteaMirror · 2025-11-02T08:59:51-06:00

GiteaMirror commented

2025-11-02 08:59:51 -06:00

Originally created by @JVimes on GitHub (Jan 27, 2023).

Feature Description

I think this button could use clarification in the UI. Maybe a name change, tool tip, or other UX change would help.

I don't recognize the feature, it didn't change anything when I clicked, and I came up dry searching online. I imagine there are other confused users too.

Screenshots

No response

Originally created by @JVimes on GitHub (Jan 27, 2023). ### Feature Description I think this button could use clarification in the UI. Maybe a name change, tool tip, or other UX change would help. ![image](https://user-images.githubusercontent.com/6148201/215014712-83e7b356-47b5-4cb3-bd14-6c4e433b8c45.png) I don't recognize the feature, it didn't change anything when I clicked, and I came up dry searching online. I imagine there are other confused users too. ### Screenshots _No response_

GiteaMirror added the type/enhancement type/proposal labels 2025-11-02 08:59:51 -06:00

GiteaMirror commented

2025-11-02 08:59:51 -06:00

@delvh commented on GitHub (Jan 28, 2023):

That button is needed when there are some weird Unicode chars in your file that we had to escape.
For most cases, it is not needed.
But I agree, a tooltip won't hurt.

@delvh commented on GitHub (Jan 28, 2023): That button is needed when there are some weird Unicode chars in your file that we had to escape. For most cases, it is not needed. But I agree, a tooltip won't hurt.

GiteaMirror commented

2025-11-02 08:59:52 -06:00

@JVimes commented on GitHub (Jan 28, 2023):

Thanks. I think it would be good to hide the button when there are no special/escaped characters in the file diff. That would make the feature clear (probably even without tooltip) and clean up the view.

@JVimes commented on GitHub (Jan 28, 2023): Thanks. I think it would be good to hide the button when there are no special/escaped characters in the file diff. That would make the feature clear (probably even without tooltip) and clean up the view.

GiteaMirror commented

2025-11-02 08:59:52 -06:00

@zeripath commented on GitHub (Jan 28, 2023):

It should only show if there are escapable characters detected already.

@zeripath commented on GitHub (Jan 28, 2023): It should only show if there are escapable characters detected already.

GiteaMirror commented

2025-11-02 08:59:52 -06:00

@zeripath commented on GitHub (Jan 28, 2023):

6e22605793/templates/repo/view_file.tmpl (L35-L38)

@zeripath commented on GitHub (Jan 28, 2023): https://github.com/go-gitea/gitea/blob/6e226057933389710f2451b148faef8ed5ea1ca1/templates/repo/view_file.tmpl#L35-L38

GiteaMirror commented

2025-11-02 08:59:52 -06:00

@zeripath commented on GitHub (Jan 28, 2023):

Ah but not on the blame views.

I'm sure there were tooltips at some point not sure why those went missing.

@zeripath commented on GitHub (Jan 28, 2023): Ah but not on the blame views. I'm sure there were tooltips at some point not sure why those went missing.

GiteaMirror commented

2025-11-02 08:59:53 -06:00

@delvh commented on GitHub (Jan 28, 2023):

As far as I know, hiding elements entirely is an anti-pattern in UI design, as the user doesn't know then that it exists.
What about disabling it instead?

@delvh commented on GitHub (Jan 28, 2023): As far as I know, hiding elements entirely is an anti-pattern in UI design, as the user doesn't know then that it exists. What about disabling it instead?

GiteaMirror commented

2025-11-02 08:59:53 -06:00

@zeripath commented on GitHub (Jan 28, 2023):

OK making the unescape/escape buttons only show if there is escaped characters is easy on the blame view and is a four-line patch.

patch

diff --git a/templates/repo/blame.tmpl b/templates/repo/blame.tmpl
index e4a10ee57..91225e8ab 100644
--- a/templates/repo/blame.tmpl
+++ b/templates/repo/blame.tmpl
@@ -11,8 +11,10 @@
 				{{end}}
 				<a class="ui tiny button" href="{{.RepoLink}}/src/{{.BranchNameSubURL}}/{{.TreePath | PathEscapeSegments}}">{{.locale.Tr "repo.normal_view"}}</a>
 				<a class="ui tiny button" href="{{.RepoLink}}/commits/{{.BranchNameSubURL}}/{{.TreePath | PathEscapeSegments}}">{{.locale.Tr "repo.file_history"}}</a>
-				<a class="ui tiny button unescape-button">{{.locale.Tr "repo.unescape_control_characters"}}</a>
-				<a class="ui tiny button escape-button" style="display: none;">{{.locale.Tr "repo.escape_control_characters"}}</a>
+				{{if .EscapeStatus.Escaped}}
+					<a class="ui tiny button unescape-button">{{.locale.Tr "repo.unescape_control_characters"}}</a>
+					<a class="ui tiny button escape-button" style="display: none;">{{.locale.Tr "repo.escape_control_characters"}}</a>
+				{{end}}
 			</div>
 		</div>
 	</h4>

For the diff that's a bit more difficult as we only find out if there is anything to be escaped as we render the diff. That means it would need to be a javascript thing that would run rendering of the diffs.

Feel free to take the above patch and make a PR - otherwise come up with a suitable tooltip for the button and make a PR.

@zeripath commented on GitHub (Jan 28, 2023): OK making the unescape/escape buttons only show if there is escaped characters is easy on the blame view and is a four-line patch. <details><summary>patch</summary> ```patch diff --git a/templates/repo/blame.tmpl b/templates/repo/blame.tmpl index e4a10ee57..91225e8ab 100644 --- a/templates/repo/blame.tmpl +++ b/templates/repo/blame.tmpl @@ -11,8 +11,10 @@ {{end}} <a class="ui tiny button" href="{{.RepoLink}}/src/{{.BranchNameSubURL}}/{{.TreePath | PathEscapeSegments}}">{{.locale.Tr "repo.normal_view"}}</a> <a class="ui tiny button" href="{{.RepoLink}}/commits/{{.BranchNameSubURL}}/{{.TreePath | PathEscapeSegments}}">{{.locale.Tr "repo.file_history"}}</a> - <a class="ui tiny button unescape-button">{{.locale.Tr "repo.unescape_control_characters"}}</a> - <a class="ui tiny button escape-button" style="display: none;">{{.locale.Tr "repo.escape_control_characters"}}</a> + {{if .EscapeStatus.Escaped}} + <a class="ui tiny button unescape-button">{{.locale.Tr "repo.unescape_control_characters"}}</a> + <a class="ui tiny button escape-button" style="display: none;">{{.locale.Tr "repo.escape_control_characters"}}</a> + {{end}} </div> </div> </h4> ``` </details> For the diff that's a bit more difficult as we only find out if there is anything to be escaped as we render the diff. That means it would need to be a javascript thing that would run rendering of the diffs. Feel free to take the above patch and make a PR - otherwise come up with a suitable tooltip for the button and make a PR.

GiteaMirror commented

2025-11-02 08:59:53 -06:00

@JVimes commented on GitHub (Jan 28, 2023):

If disable instead of hide, might consider nesting under a meatball button so it takes up less space on mobile. I'm assuming this tool doesn't get used frequently (?). Or maybe use an icon instead of label.

@JVimes commented on GitHub (Jan 28, 2023): If disable instead of hide, might consider nesting under a meatball button so it takes up less space on mobile. I'm assuming this tool doesn't get used frequently (?). Or maybe use an icon instead of label.

GiteaMirror commented

2025-11-02 08:59:53 -06:00

@zeripath commented on GitHub (Jan 28, 2023):

PRs are welcome.

@zeripath commented on GitHub (Jan 28, 2023): PRs are welcome.

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github-starred/gitea#10158