Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixed validation name of access token when creating #33614

Closed
wants to merge 2 commits into from
Closed

Fixed validation name of access token when creating #33614

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
21ea1a6
Fixed validation name of access token when creating
BElluu Feb 16, 2025
0e6b925
Fix linter
BElluu Feb 16, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions options/locale/locale_en-US.ini
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -908,6 +908,7 @@ token_name = Token Name
generate_token = Generate Token
generate_token_success = Your new token has been generated. Copy it now as it will not be shown again.
generate_token_name_duplicate = <strong>%s</strong> has been used as an application name already. Please use a new one.
generate_token_name_required = Token Name is required.
delete_token = Delete
access_token_deletion = Delete Access Token
access_token_deletion_cancel_action = Cancel
Expand Down
13 changes: 9 additions & 4 deletions templates/user/settings/applications.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,10 +55,12 @@
</h5>
<form id="scoped-access-form" class="ui form ignore-dirty" action="{{.Link}}" method="post">
{{.CsrfTokenHtml}}
<div class="field {{if .Err_Name}}error{{end}}">
<label for="name">{{ctx.Locale.Tr "settings.token_name"}}</label>
<input id="name" name="name" value="{{.name}}" autofocus required maxlength="255">
</div>
<div class="field">
<label for="name">{{ctx.Locale.Tr "settings.token_name"}}</label>
<div id="scoped-access-token-name">
<input id="name" name="name" value="{{.name}}" autofocus required maxlength="255">
</div>
</div>
<div class="field">
<label>{{ctx.Locale.Tr "settings.repo_and_org_access"}}</label>
<label class="tw-cursor-pointer">
Expand Down Expand Up @@ -90,6 +92,9 @@
{{ctx.Locale.Tr "settings.generate_token"}}
</button>
</form>{{/* Fomantic ".ui.form .warning.message" is hidden by default, so put the warning message out of the form*/}}
<div id="token-name-warning" class="ui warning message center tw-hidden">
{{ctx.Locale.Tr "settings.generate_token_name_required"}}
</div>
<div id="scoped-access-warning" class="ui warning message center tw-hidden">
{{ctx.Locale.Tr "settings.at_least_one_permission"}}
</div>
Expand Down
29 changes: 20 additions & 9 deletions .../components/ScopedAccessTokenSelector.vue → ...c/js/components/ScopedAccessTokenForm.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,20 +38,31 @@ onUnmounted(() => {
function onClickSubmit(e: Event) {
e.preventDefault();

const nameInput = document.querySelector<HTMLInputElement>('#name');
const nameWarning = document.querySelector('#token-name-warning');
if (!nameInput?.value.trim()) {
showElem(nameWarning);
return;
}
hideElem(nameWarning);

const warningEl = document.querySelector('#scoped-access-warning');
// check that at least one scope has been selected
let hasSelectedScope = false;

for (const el of document.querySelectorAll<HTMLInputElement>('.access-token-select')) {
if (el.value) {
// Hide the error if it was visible from previous attempt.
hideElem(warningEl);
// Submit the form.
document.querySelector<HTMLFormElement>('#scoped-access-form').submit();
// Don't show the warning.
return;
hasSelectedScope = true;
break;
}
}
// no scopes selected, show validation error
showElem(warningEl);

if (!hasSelectedScope) {
showElem(warningEl);
return;
}

hideElem(warningEl);
document.querySelector<HTMLFormElement>('#scoped-access-form')?.submit();
}
</script>

Expand Down
6 changes: 3 additions & 3 deletions web_src/js/features/scoped-access-token.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,17 @@ export async function initScopedAccessTokenCategories() {
const el = document.querySelector('#scoped-access-token-selector');
if (!el) return;

const {default: ScopedAccessTokenSelector} = await import(/* webpackChunkName: "scoped-access-token-selector" */'../components/ScopedAccessTokenSelector.vue');
const {default: ScopedAccessTokenForm} = await import(/* webpackChunkName: "scoped-access-token-form" */'../components/ScopedAccessTokenForm.vue');
try {
const View = createApp(ScopedAccessTokenSelector, {
const View = createApp(ScopedAccessTokenForm, {
isAdmin: JSON.parse(el.getAttribute('data-is-admin')),
noAccessLabel: el.getAttribute('data-no-access-label'),
readLabel: el.getAttribute('data-read-label'),
writeLabel: el.getAttribute('data-write-label'),
});
View.mount(el);
} catch (err) {
console.error('ScopedAccessTokenSelector failed to load', err);
console.error('ScopedAccessTokenForm failed to load', err);
el.textContent = el.getAttribute('data-locale-component-failed-to-load');
}
}
Loading