mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2026-01-16 23:12:07 +00:00
Some Vue components were already lazy-loaded, but not all. There are three main changes: 1. Move init scripts outside Vue code. 2. Make the init scripts lazy-load the Vue components. 3. Deal with vue linters, because apparently if you do `export default` then some Vue linters will notice that's vue sfc. The rationale for this pull requests is that this reduces the size of the `index.js` file. - Uncompressed: 1.24 MB -> 954.40 kB - Compressed (gzip, via `reverse_proxy` of Caddy): 400.45 kB -> 298.95 kB - Compressed (zstd, via `bindata` tag): 363.75 kB -> 274.22 kB Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/9444 Reviewed-by: Otto <otto@codeberg.org> Co-authored-by: Gusted <postmaster@gusted.xyz> Co-committed-by: Gusted <postmaster@gusted.xyz>
97 lines
2.3 KiB
Vue
97 lines
2.3 KiB
Vue
<script>
|
|
import {hideElem, showElem} from '../utils/dom.js';
|
|
|
|
export default {
|
|
props: {
|
|
isAdmin: {
|
|
type: Boolean,
|
|
required: true,
|
|
},
|
|
noAccessLabel: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
readLabel: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
writeLabel: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
},
|
|
|
|
computed: {
|
|
categories() {
|
|
const categories = [
|
|
'activitypub',
|
|
];
|
|
if (this.isAdmin) {
|
|
categories.push('admin');
|
|
}
|
|
categories.push(
|
|
'issue',
|
|
'misc',
|
|
'notification',
|
|
'organization',
|
|
'package',
|
|
'repository',
|
|
'user');
|
|
return categories;
|
|
},
|
|
},
|
|
|
|
mounted() {
|
|
document.getElementById('scoped-access-submit').addEventListener('click', this.onClickSubmit);
|
|
},
|
|
|
|
unmounted() {
|
|
document.getElementById('scoped-access-submit').removeEventListener('click', this.onClickSubmit);
|
|
},
|
|
|
|
methods: {
|
|
onClickSubmit(e) {
|
|
e.preventDefault();
|
|
|
|
const warningEl = document.getElementById('scoped-access-warning');
|
|
// check that at least one scope has been selected
|
|
for (const el of document.getElementsByClassName('access-token-select')) {
|
|
if (el.value) {
|
|
// Hide the error if it was visible from previous attempt.
|
|
hideElem(warningEl);
|
|
// Submit the form.
|
|
document.getElementById('scoped-access-form').submit();
|
|
// Don't show the warning.
|
|
return;
|
|
}
|
|
}
|
|
// no scopes selected, show validation error
|
|
showElem(warningEl);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<template>
|
|
<div v-for="category in categories" :key="category" class="field tw-pl-1 tw-pb-1 access-token-category">
|
|
<label class="category-label" :for="'access-token-scope-' + category">
|
|
{{ category }}
|
|
</label>
|
|
<div class="gitea-select">
|
|
<select
|
|
class="ui selection access-token-select"
|
|
name="scope"
|
|
:id="'access-token-scope-' + category"
|
|
>
|
|
<option value="">
|
|
{{ noAccessLabel }}
|
|
</option>
|
|
<option :value="'read:' + category">
|
|
{{ readLabel }}
|
|
</option>
|
|
<option :value="'write:' + category">
|
|
{{ writeLabel }}
|
|
</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</template>
|