Add placeholders to input fields in various templates for better user…#37144
Add placeholders to input fields in various templates for better user…#37144qobilovvv wants to merge 1 commit intogo-gitea:mainfrom
Conversation
|
Could you post screen shots? |
| {{/* it is rendered as markdown, but the length is limited, so at the moment we do not use the markdown editor here */}} | ||
| <label for="description">{{ctx.Locale.Tr "user.user_bio"}}</label> | ||
| <textarea id="description" name="description" rows="2" placeholder="{{ctx.Locale.Tr "settings.biography_placeholder"}}" maxlength="255">{{.SignedUser.Description}}</textarea> | ||
| <textarea id="description" name="description" rows="2" placeholder="I am a developer from San Francisco." maxlength="255">{{.SignedUser.Description}}</textarea> |
There was a problem hiding this comment.
Why change it from a translatable string?
| <div class="field"> | ||
| <label for="location">{{ctx.Locale.Tr "settings.location"}}</label> | ||
| <input id="location" name="location" placeholder="{{ctx.Locale.Tr "settings.location_placeholder"}}" value="{{.SignedUser.Location}}" maxlength="50"> | ||
| <input id="location" name="location" placeholder="San Francisco, CA" value="{{.SignedUser.Location}}" maxlength="50"> |
| <div class="field {{if .Err_FullName}}error{{end}}"> | ||
| <label for="full_name">{{ctx.Locale.Tr "settings.full_name"}}</label> | ||
| <input id="full_name" name="full_name" value="{{.User.FullName}}" maxlength="100"> | ||
| <input id="full_name" name="full_name" value="{{.User.FullName}}" maxlength="100" placeholder="John Doe"> |
There was a problem hiding this comment.
The original issue had @wxiaoguang disputing this as it's not translatable and looks off with a non english locale, which I'd agree with.
| <div class="inline required field {{if .Err_CloneAddr}}error{{end}}"> | ||
| <label for="clone_addr">{{ctx.Locale.Tr "repo.migrate.clone_address"}}</label> | ||
| <input id="clone_addr" name="clone_addr" value="{{.clone_addr}}" autofocus required> | ||
| <input id="clone_addr" name="clone_addr" value="{{.clone_addr}}" autofocus required placeholder="https://github.com/go-gitea/gitea.git"> |
There was a problem hiding this comment.
Here and for basically every other migration which isn't plain git or github. What sense does github placeholder have for non github provider?
| <input id="homeserver_url" name="homeserver_url" type="url" value="{{.MatrixHook.HomeserverURL}}" autofocus required> | ||
| <input id="homeserver_url" name="homeserver_url" type="url" value="{{.MatrixHook.HomeserverURL}}" autofocus required placeholder="https://matrix.org"> | ||
| </div> | ||
| <div class="required field {{if .Err_Room}}error{{end}}"> |
There was a problem hiding this comment.
Should this have been removed?
| <div class="required field"> | ||
| <label for="room_id">{{ctx.Locale.Tr "repo.settings.matrix.room_id"}}</label> | ||
| <input id="room_id" name="room_id" type="text" value="{{.MatrixHook.Room}}" required> | ||
| <input id="room_id" name="room_id" type="text" value="{{.MatrixHook.Room}}" required placeholder="!abc:matrix.org"> |
There was a problem hiding this comment.
I just recalled this issue
matrix webhook encodes ! and # rendreing the links unusable by matrix #36012
Maybe the "bug" should be fixed first.
what screen shots? |
|
No screenshot needed, placeholder rendering is already working in other places, so the review should focus on the content and whether the changes are exhaustive (covering all fields). |
There was a problem hiding this comment.
Pull request overview
Adds placeholder attributes across multiple HTML templates to improve form usability/accessibility (FIXES #37069) by providing example values or guidance text for empty inputs.
Changes:
- Add placeholders to user profile settings inputs (username, full name, bio, website, location, gravatar email).
- Add placeholders to multiple repository webhook configuration forms (e.g., payload URLs, bot token/chat IDs, Matrix homeserver/room).
- Add placeholders to repository fork and migrate forms, plus org/admin user edit forms.
Reviewed changes
Copilot reviewed 23 out of 23 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| templates/user/settings/profile.tmpl | Adds placeholders for profile settings fields (username/full name/bio/website/location/gravatar). |
| templates/repo/settings/webhook/wechatwork.tmpl | Adds an example payload URL placeholder. |
| templates/repo/settings/webhook/telegram.tmpl | Adds placeholders for bot token, chat ID, and thread ID. |
| templates/repo/settings/webhook/slack.tmpl | Adds an example payload URL placeholder. |
| templates/repo/settings/webhook/msteams.tmpl | Adds an example payload URL placeholder. |
| templates/repo/settings/webhook/matrix.tmpl | Adds placeholders for homeserver and room ID (and adjusts field markup). |
| templates/repo/settings/webhook/gogs.tmpl | Adds an example payload URL placeholder. |
| templates/repo/settings/webhook/gitea.tmpl | Adds an example payload URL placeholder. |
| templates/repo/settings/webhook/feishu.tmpl | Adds an example payload URL placeholder. |
| templates/repo/settings/webhook/discord.tmpl | Adds an example payload URL placeholder. |
| templates/repo/settings/webhook/dingtalk.tmpl | Adds an example payload URL placeholder. |
| templates/repo/pulls/fork.tmpl | Adds a placeholder to the fork repo description textarea. |
| templates/repo/migrate/onedev.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/repo/migrate/gogs.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/repo/migrate/gitlab.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/repo/migrate/github.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/repo/migrate/gitea.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/repo/migrate/gitbucket.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/repo/migrate/git.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/repo/migrate/codecommit.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/repo/migrate/codebase.tmpl | Adds a clone URL placeholder to the migration clone address input. |
| templates/org/settings/options.tmpl | Adds a placeholder for org full name. |
| templates/admin/user/edit.tmpl | Adds a placeholder for user full name in the admin edit form. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| {{/* it is rendered as markdown, but the length is limited, so at the moment we do not use the markdown editor here */}} | ||
| <label for="description">{{ctx.Locale.Tr "user.user_bio"}}</label> | ||
| <textarea id="description" name="description" rows="2" placeholder="{{ctx.Locale.Tr "settings.biography_placeholder"}}" maxlength="255">{{.SignedUser.Description}}</textarea> | ||
| <textarea id="description" name="description" rows="2" placeholder="I am a developer from San Francisco." maxlength="255">{{.SignedUser.Description}}</textarea> |
There was a problem hiding this comment.
The biography placeholder was previously localized via ctx.Locale.Tr "settings.biography_placeholder"; changing it to a hardcoded English sentence makes the UI non-localized for all non-English locales. Consider keeping a translation key (reuse the existing one or add a new locale key) and translate it, instead of hardcoding English here.
| <textarea id="description" name="description" rows="2" placeholder="I am a developer from San Francisco." maxlength="255">{{.SignedUser.Description}}</textarea> | |
| <textarea id="description" name="description" rows="2" placeholder="{{ctx.Locale.Tr "settings.biography_placeholder"}}" maxlength="255">{{.SignedUser.Description}}</textarea> |
| <div class="field"> | ||
| <label for="location">{{ctx.Locale.Tr "settings.location"}}</label> | ||
| <input id="location" name="location" placeholder="{{ctx.Locale.Tr "settings.location_placeholder"}}" value="{{.SignedUser.Location}}" maxlength="50"> | ||
| <input id="location" name="location" placeholder="San Francisco, CA" value="{{.SignedUser.Location}}" maxlength="50"> |
There was a problem hiding this comment.
The location placeholder was previously localized via ctx.Locale.Tr "settings.location_placeholder"; switching to a hardcoded English value regresses localization for non-English users. Prefer using a locale key here (reuse the existing one or introduce a new translatable placeholder key).
| <input id="location" name="location" placeholder="San Francisco, CA" value="{{.SignedUser.Location}}" maxlength="50"> | |
| <input id="location" name="location" placeholder="{{ctx.Locale.Tr "settings.location_placeholder"}}" value="{{.SignedUser.Location}}" maxlength="50"> |
| <input id="homeserver_url" name="homeserver_url" type="url" value="{{.MatrixHook.HomeserverURL}}" autofocus required placeholder="https://matrix.org"> | ||
| </div> | ||
| <div class="required field {{if .Err_Room}}error{{end}}"> | ||
| <div class="required field"> |
There was a problem hiding this comment.
The Matrix Room ID field no longer conditionally applies the error CSS class when validation fails. Since the bound form field is RoomID (see NewMatrixHookForm), the template should use {{if .Err_RoomID}}error{{end}} (similar to Err_HomeserverURL) so users get proper visual feedback on invalid input.
| <div class="required field"> | |
| <div class="required field {{if .Err_RoomID}}error{{end}}"> |
FIXES #37069