diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-04-22 21:09:22 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-04-22 21:09:22 +0300 |
commit | eab22d334fd451ce793fde56f73568b0f7948ed2 (patch) | |
tree | 069fdd7e7e223e3a69e0192ee11de163d25f51c8 /app/assets/javascripts/runner | |
parent | 4136fdda4ca0ec8de51c17efe48425ac35dee590 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/runner')
3 files changed, 120 insertions, 89 deletions
diff --git a/app/assets/javascripts/runner/admin_runner_edit/admin_runner_edit_app.vue b/app/assets/javascripts/runner/admin_runner_edit/admin_runner_edit_app.vue index c2db3b9facd..406081e4422 100644 --- a/app/assets/javascripts/runner/admin_runner_edit/admin_runner_edit_app.vue +++ b/app/assets/javascripts/runner/admin_runner_edit/admin_runner_edit_app.vue @@ -19,6 +19,11 @@ export default { type: String, required: true, }, + runnerUrl: { + type: String, + required: false, + default: null, + }, }, data() { return { @@ -40,6 +45,11 @@ export default { }, }, }, + computed: { + loading() { + return this.$apollo.queries.runner.loading; + }, + }, errorCaptured(error) { this.reportToSentry(error); }, @@ -53,6 +63,11 @@ export default { <template> <div> <runner-header v-if="runner" :runner="runner" /> - <runner-update-form :runner="runner" class="gl-my-5" /> + <runner-update-form + :loading="loading" + :runner="runner" + :runner-url="runnerUrl" + class="gl-my-5" + /> </div> </template> diff --git a/app/assets/javascripts/runner/admin_runner_edit/index.js b/app/assets/javascripts/runner/admin_runner_edit/index.js index adb420f9963..876422534c1 100644 --- a/app/assets/javascripts/runner/admin_runner_edit/index.js +++ b/app/assets/javascripts/runner/admin_runner_edit/index.js @@ -12,7 +12,7 @@ export const initAdminRunnerEdit = (selector = '#js-admin-runner-edit') => { return null; } - const { runnerId } = el.dataset; + const { runnerId, runnerUrl } = el.dataset; const apolloProvider = new VueApollo({ defaultClient: createDefaultClient(), @@ -25,6 +25,7 @@ export const initAdminRunnerEdit = (selector = '#js-admin-runner-edit') => { return h(AdminRunnerEditApp, { props: { runnerId, + runnerUrl, }, }); }, diff --git a/app/assets/javascripts/runner/components/runner_update_form.vue b/app/assets/javascripts/runner/components/runner_update_form.vue index 119e5236f85..16381a0a853 100644 --- a/app/assets/javascripts/runner/components/runner_update_form.vue +++ b/app/assets/javascripts/runner/components/runner_update_form.vue @@ -1,10 +1,12 @@ <script> import { GlButton, + GlIcon, GlForm, GlFormCheckbox, GlFormGroup, GlFormInputGroup, + GlSkeletonLoader, GlTooltipDirective, } from '@gitlab/ui'; import { @@ -21,10 +23,12 @@ export default { name: 'RunnerUpdateForm', components: { GlButton, + GlIcon, GlForm, GlFormCheckbox, GlFormGroup, GlFormInputGroup, + GlSkeletonLoader, RunnerUpdateCostFactorFields: () => import('ee_component/runner/components/runner_update_cost_factor_fields.vue'), }, @@ -37,6 +41,16 @@ export default { required: false, default: null, }, + loading: { + type: Boolean, + required: false, + default: false, + }, + runnerUrl: { + type: String, + required: false, + default: null, + }, }, data() { return { @@ -48,9 +62,6 @@ export default { canBeLockedToProject() { return this.runner?.runnerType === PROJECT_TYPE; }, - readonlyIpAddress() { - return this.runner?.ipAddress; - }, }, watch: { runner(newVal, oldVal) { @@ -100,104 +111,108 @@ export default { </script> <template> <gl-form @submit.prevent="onSubmit"> - <gl-form-checkbox - v-model="model.active" - data-testid="runner-field-paused" - :value="false" - :unchecked-value="true" - > - {{ __('Paused') }} - <template #help> - {{ s__('Runners|Stop the runner from accepting new jobs.') }} - </template> - </gl-form-checkbox> - - <gl-form-checkbox - v-model="model.accessLevel" - data-testid="runner-field-protected" - :value="$options.ACCESS_LEVEL_REF_PROTECTED" - :unchecked-value="$options.ACCESS_LEVEL_NOT_PROTECTED" - > - {{ __('Protected') }} - <template #help> - {{ s__('Runners|Use the runner on pipelines for protected branches only.') }} - </template> - </gl-form-checkbox> - - <gl-form-checkbox v-model="model.runUntagged" data-testid="runner-field-run-untagged"> - {{ __('Run untagged jobs') }} - <template #help> - {{ s__('Runners|Use the runner for jobs without tags, in addition to tagged jobs.') }} - </template> - </gl-form-checkbox> - - <gl-form-checkbox - v-if="canBeLockedToProject" - v-model="model.locked" - data-testid="runner-field-locked" - > - {{ __('Lock to current projects') }} - <template #help> - {{ - s__( - 'Runners|Use the runner for the currently assigned projects only. Only administrators can change the assigned projects.', - ) - }} - </template> - </gl-form-checkbox> - - <gl-form-group :label="__('IP Address')" data-testid="runner-field-ip-address"> - <gl-form-input-group :value="readonlyIpAddress" readonly select-on-click> - <template #append> - <gl-button - v-gl-tooltip.hover - :title="__('Copy IP Address')" - :aria-label="__('Copy IP Address')" - :data-clipboard-text="readonlyIpAddress" - icon="copy-to-clipboard" - class="d-inline-flex" - /> - </template> - </gl-form-input-group> - </gl-form-group> + <h4 class="gl-font-lg gl-my-5">{{ s__('Runners|Details') }}</h4> - <gl-form-group :label="__('Description')" data-testid="runner-field-description"> + <gl-skeleton-loader v-if="loading" /> + <gl-form-group v-else :label="__('Description')" data-testid="runner-field-description"> <gl-form-input-group v-model="model.description" /> </gl-form-group> - <gl-form-group - data-testid="runner-field-max-timeout" - :label="__('Maximum job timeout')" - :description=" - s__( - 'Runners|Enter the number of seconds. This timeout takes precedence over lower timeouts set for the project.', - ) - " - > - <gl-form-input-group v-model.number="model.maximumTimeout" type="number" /> - </gl-form-group> + <hr /> - <gl-form-group - data-testid="runner-field-tags" - :label="__('Tags')" - :description=" - __('You can set up jobs to only use runners with specific tags. Separate tags with commas.') - " - > - <gl-form-input-group v-model="model.tagList" /> - </gl-form-group> + <h4 class="gl-font-lg gl-my-5">{{ s__('Runners|Configuration') }}</h4> + + <template v-if="loading"> + <gl-skeleton-loader v-for="i in 3" :key="i" /> + </template> + <template v-else> + <div class="gl-mb-5"> + <gl-form-checkbox + v-model="model.active" + data-testid="runner-field-paused" + :value="false" + :unchecked-value="true" + > + {{ __('Paused') }} + <template #help> + {{ s__('Runners|Stop the runner from accepting new jobs.') }} + </template> + </gl-form-checkbox> - <runner-update-cost-factor-fields v-model="model" /> + <gl-form-checkbox + v-model="model.accessLevel" + data-testid="runner-field-protected" + :value="$options.ACCESS_LEVEL_REF_PROTECTED" + :unchecked-value="$options.ACCESS_LEVEL_NOT_PROTECTED" + > + {{ __('Protected') }} + <template #help> + {{ s__('Runners|Use the runner on pipelines for protected branches only.') }} + </template> + </gl-form-checkbox> - <div class="form-actions"> + <gl-form-checkbox v-model="model.runUntagged" data-testid="runner-field-run-untagged"> + {{ __('Run untagged jobs') }} + <template #help> + {{ s__('Runners|Use the runner for jobs without tags, in addition to tagged jobs.') }} + </template> + </gl-form-checkbox> + + <gl-form-checkbox + v-if="canBeLockedToProject" + v-model="model.locked" + data-testid="runner-field-locked" + > + {{ __('Lock to current projects') }} <gl-icon name="lock" /> + <template #help> + {{ + s__( + 'Runners|Use the runner for the currently assigned projects only. Only administrators can change the assigned projects.', + ) + }} + </template> + </gl-form-checkbox> + </div> + + <gl-form-group + data-testid="runner-field-max-timeout" + :label="__('Maximum job timeout')" + :description=" + s__( + 'Runners|Enter the number of seconds. This timeout takes precedence over lower timeouts set for the project.', + ) + " + > + <gl-form-input-group v-model.number="model.maximumTimeout" type="number" /> + </gl-form-group> + + <gl-form-group + data-testid="runner-field-tags" + :label="__('Tags')" + :description=" + __( + 'You can set up jobs to only use runners with specific tags. Separate tags with commas.', + ) + " + > + <gl-form-input-group v-model="model.tagList" /> + </gl-form-group> + + <runner-update-cost-factor-fields v-model="model" /> + </template> + + <div class="gl-mt-6"> <gl-button type="submit" variant="confirm" class="js-no-auto-disable" - :loading="saving || !runner" + :loading="loading || saving" > {{ __('Save changes') }} </gl-button> + <gl-button :href="runnerUrl"> + {{ __('Cancel') }} + </gl-button> </div> </gl-form> </template> |