jojo/templates/user/settings/applications.tmpl
Mathieu Fenniak aef91ab1a3 ui: move "New access token" to a separate UI page (#11659)
We are updating the user's personal access token page (`/user/settings/applications`) to allow the creation of repo-specific tokens, adding a third option to "Repository and Organization Access".  In preparation for this new UI, this PR moves the creation of access tokens to a new page accessed by "New access token".

This also resolves a pet-peeve: the "Select permissions" dropdown on the inline edit form hides a *required* input for an access token.  This section is expanded on the new dedicated page.  (The Vue component used here is replaced with a JS-free alternative as well.  This form component used to lose selected values when an error occurred, and it didn't make sense as a Vue component, so it has been translated into an HTML template instead.)

## Checklist

The [contributor guide](https://forgejo.org/docs/next/contributor/) contains information that will be helpful to first time contributors. There also are a few [conditions for merging Pull Requests in Forgejo repositories](https://codeberg.org/forgejo/governance/src/branch/main/PullRequestsAgreement.md). You are also welcome to join the [Forgejo development chatroom](https://matrix.to/#/#forgejo-development:matrix.org).

### Tests for Go changes

- I added test coverage for Go changes...
  - [ ] in their respective `*_test.go` for unit tests.
  - [ ] in the `tests/integration` directory if it involves interactions with a live Forgejo server.
- I ran...
  - [x] `make pr-go` before pushing

### Tests for JavaScript changes

- I added test coverage for JavaScript changes...
  - [ ] in `web_src/js/*.test.js` if it can be unit tested.
  - [x] in `tests/e2e/*.test.e2e.js` if it requires interactions with a live Forgejo server (see also the [developer guide for JavaScript testing](https://codeberg.org/forgejo/forgejo/src/branch/forgejo/tests/e2e/README.md#end-to-end-tests)).

### Documentation

- [ ] I created a pull request [to the documentation](https://codeberg.org/forgejo/docs) to explain to Forgejo users how to use this change.
- [x] I did not document these changes and I do not expect someone else to do it.

### Release notes

- [x] This change will be noticed by a Forgejo user or admin (feature, bug fix, performance, etc.). I suggest to include a release note for this change.
- [ ] This change is not visible to a Forgejo user or admin (refactor, dependency upgrade, etc.). I think there is no need to add a release note for this change.

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/11659
Reviewed-by: Andreas Ahlenstorf <aahlenst@noreply.codeberg.org>
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Co-authored-by: Mathieu Fenniak <mathieu@fenniak.net>
Co-committed-by: Mathieu Fenniak <mathieu@fenniak.net>
2026-03-18 22:33:14 +01:00

95 lines
3.8 KiB
Go HTML Template

{{template "user/settings/layout_head" (dict "ctxData" . "pageClass" "user settings applications")}}
<div class="user-setting-content">
<h4 class="ui top attached header">
{{ctx.Locale.Tr "settings.manage_access_token"}}
<div class="ui right">
<a class="ui primary tiny button" href="{{AppSubUrl}}/user/settings/applications/tokens/new">{{ctx.Locale.Tr "settings.new_access_token"}}</a>
</div>
</h4>
<div class="ui attached segment">
<div class="flex-list">
<div class="flex-item">
{{ctx.Locale.Tr "settings.tokens_desc"}}
</div>
{{range .TokensWithResources}}
<div class="flex-item">
<div class="flex-item-leading">
<span class="text {{if .Token.HasRecentActivity}}green{{end}}" {{if .Token.HasRecentActivity}}data-tooltip-content="{{ctx.Locale.Tr "settings.token_state_desc"}}"{{end}}>
{{svg "fontawesome-send" 32}}
</span>
</div>
<div class="flex-item-main">
<details>
<summary><span class="flex-item-title">{{.Token.Name}}</span></summary>
{{if .Token.ResourceAllRepos}}
<p class="tw-my-1">{{ctx.Locale.Tr "settings.repo_and_org_access"}}:</p>
{{if .Token.DisplayPublicOnly}}
{{ctx.Locale.Tr "settings.permissions_public_only"}}
{{else}}
{{ctx.Locale.Tr "settings.permissions_access_all"}}
{{end}}
{{else}}
<p class="tw-my-1">{{ctx.Locale.Tr "settings.specific_repo_access"}}:</p>
<ul class="tw-my-1">
{{range .Repositories}}
<li><a href="{{.HTMLURL}}">{{.FullName}}</a></li>
{{end}}
</ul>
{{end}}
<p class="tw-my-1">{{ctx.Locale.Tr "settings.permissions_list"}}</p>
<ul class="tw-my-1">
{{range .Token.Scope.StringSlice}}
{{if (ne . $.AccessTokenScopePublicOnly)}}
<li>{{.}}</li>
{{end}}
{{end}}
</ul>
</details>
<div class="flex-item-body">
<p>{{ctx.Locale.Tr "settings.added_on" (DateUtils.AbsoluteShort .Token.CreatedUnix)}}{{svg "octicon-info"}} {{if .Token.HasUsed}}{{ctx.Locale.Tr "settings.last_used"}} <span {{if .Token.HasRecentActivity}}class="text green"{{end}}>{{DateUtils.AbsoluteShort .Token.UpdatedUnix}}</span>{{else}}{{ctx.Locale.Tr "settings.no_activity"}}{{end}}</p>
</div>
</div>
<div class="flex-item-trailing">
<button class="ui primary tiny button delete-button" data-modal-id="regenerate-token" data-url="{{$.Link}}/tokens/regenerate" data-id="{{.Token.ID}}">
{{svg "octicon-issue-reopened" 16 "tw-mr-1"}}
{{ctx.Locale.Tr "settings.regenerate_token"}}
</button>
<button class="ui red tiny button delete-button" data-modal-id="delete-token" data-url="{{$.Link}}/tokens/delete" data-id="{{.Token.ID}}">
{{svg "octicon-trash" 16 "tw-mr-1"}}
{{ctx.Locale.Tr "settings.delete_token"}}
</button>
</div>
</div>
{{end}}
</div>
</div>
{{if .EnableOAuth2}}
{{template "user/settings/grants_oauth2" .}}
{{template "user/settings/applications_oauth2" .}}
{{end}}
</div>
<div class="ui g-modal-confirm delete modal" id="regenerate-token">
<div class="header">
{{svg "octicon-issue-reopened" 16 "tw-mr-1"}}
{{ctx.Locale.Tr "settings.access_token_regeneration"}}
</div>
<div class="content">
<p>{{ctx.Locale.Tr "settings.access_token_regeneration_desc"}}</p>
</div>
{{template "base/modal_actions_confirm" (dict "ModalButtonColors" "primary")}}
</div>
<div class="ui g-modal-confirm delete modal" id="delete-token">
<div class="header">
{{svg "octicon-trash"}}
{{ctx.Locale.Tr "settings.access_token_deletion"}}
</div>
<div class="content">
<p>{{ctx.Locale.Tr "settings.access_token_deletion_desc"}}</p>
</div>
{{template "base/modal_actions_confirm"}}
</div>
{{template "user/settings/layout_footer" .}}