diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-10-20 08:43:02 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-10-20 08:43:02 +0000 |
commit | d9ab72d6080f594d0b3cae15f14b3ef2c6c638cb (patch) | |
tree | 2341ef426af70ad1e289c38036737e04b0aa5007 /app/assets/javascripts/runner/components | |
parent | d6e514dd13db8947884cd58fe2a9c2a063400a9b (diff) | |
download | gitlab-ce-d9ab72d6080f594d0b3cae15f14b3ef2c6c638cb.tar.gz |
Add latest changes from gitlab-org/gitlab@14-4-stable-eev14.4.0-rc42
Diffstat (limited to 'app/assets/javascripts/runner/components')
-rw-r--r-- | app/assets/javascripts/runner/components/cells/runner_actions_cell.vue | 20 | ||||
-rw-r--r-- | app/assets/javascripts/runner/components/cells/runner_summary_cell.vue (renamed from app/assets/javascripts/runner/components/cells/runner_name_cell.vue) | 19 | ||||
-rw-r--r-- | app/assets/javascripts/runner/components/cells/runner_type_cell.vue | 25 | ||||
-rw-r--r-- | app/assets/javascripts/runner/components/runner_list.vue | 14 | ||||
-rw-r--r-- | app/assets/javascripts/runner/components/runner_name.vue | 18 | ||||
-rw-r--r-- | app/assets/javascripts/runner/components/runner_state_locked_badge.vue | 25 | ||||
-rw-r--r-- | app/assets/javascripts/runner/components/runner_state_paused_badge.vue | 25 | ||||
-rw-r--r-- | app/assets/javascripts/runner/components/runner_type_badge.vue | 19 | ||||
-rw-r--r-- | app/assets/javascripts/runner/components/runner_type_help.vue | 60 |
9 files changed, 123 insertions, 102 deletions
diff --git a/app/assets/javascripts/runner/components/cells/runner_actions_cell.vue b/app/assets/javascripts/runner/components/cells/runner_actions_cell.vue index 863f0ab995f..e26bdbf1aea 100644 --- a/app/assets/javascripts/runner/components/cells/runner_actions_cell.vue +++ b/app/assets/javascripts/runner/components/cells/runner_actions_cell.vue @@ -1,7 +1,6 @@ <script> import { GlButton, GlButtonGroup, GlTooltipDirective } from '@gitlab/ui'; import createFlash from '~/flash'; -import { getIdFromGraphQLId } from '~/graphql_shared/utils'; import { __, s__ } from '~/locale'; import runnerDeleteMutation from '~/runner/graphql/runner_delete.mutation.graphql'; import runnerUpdateMutation from '~/runner/graphql/runner_update.mutation.graphql'; @@ -37,13 +36,6 @@ export default { }; }, computed: { - runnerNumericalId() { - return getIdFromGraphQLId(this.runner.id); - }, - runnerUrl() { - // TODO implement using webUrl from the API - return `${gon.gitlab_url || ''}/admin/runners/${this.runnerNumericalId}`; - }, isActive() { return this.runner.active; }, @@ -119,7 +111,7 @@ export default { }, }, awaitRefetchQueries: true, - refetchQueries: ['getRunners'], + refetchQueries: ['getRunners', 'getGroupRunners'], }); if (errors && errors.length) { throw new Error(errors.join(' ')); @@ -147,12 +139,20 @@ export default { <template> <gl-button-group> + <!-- + This button appears for administratos: those with + access to the adminUrl. More advanced permissions policies + will allow more granular permissions. + + See https://gitlab.com/gitlab-org/gitlab/-/issues/334802 + --> <gl-button + v-if="runner.adminUrl" v-gl-tooltip.hover.viewport + :href="runner.adminUrl" :title="$options.i18n.I18N_EDIT" :aria-label="$options.i18n.I18N_EDIT" icon="pencil" - :href="runnerUrl" data-testid="edit-runner" /> <gl-button diff --git a/app/assets/javascripts/runner/components/cells/runner_name_cell.vue b/app/assets/javascripts/runner/components/cells/runner_summary_cell.vue index 797a3359147..886b5cb29fc 100644 --- a/app/assets/javascripts/runner/components/cells/runner_name_cell.vue +++ b/app/assets/javascripts/runner/components/cells/runner_summary_cell.vue @@ -1,12 +1,11 @@ <script> -import { GlLink } from '@gitlab/ui'; -import { getIdFromGraphQLId } from '~/graphql_shared/utils'; import TooltipOnTruncate from '~/vue_shared/components/tooltip_on_truncate.vue'; +import RunnerName from '../runner_name.vue'; export default { components: { - GlLink, TooltipOnTruncate, + RunnerName, }, props: { runner: { @@ -15,26 +14,18 @@ export default { }, }, computed: { - runnerNumericalId() { - return getIdFromGraphQLId(this.runner.id); - }, - runnerUrl() { - // TODO implement using webUrl from the API - return `${gon.gitlab_url || ''}/admin/runners/${this.runnerNumericalId}`; - }, description() { return this.runner.description; }, - shortSha() { - return this.runner.shortSha; - }, }, }; </script> <template> <div> - <gl-link :href="runnerUrl"> #{{ runnerNumericalId }} ({{ shortSha }})</gl-link> + <slot :runner="runner" name="runner-name"> + <runner-name :runner="runner" /> + </slot> <tooltip-on-truncate class="gl-display-block" :title="description" truncate-target="child"> <div class="gl-text-truncate"> {{ description }} diff --git a/app/assets/javascripts/runner/components/cells/runner_type_cell.vue b/app/assets/javascripts/runner/components/cells/runner_type_cell.vue index f186a8daf72..c8cb0bf6088 100644 --- a/app/assets/javascripts/runner/components/cells/runner_type_cell.vue +++ b/app/assets/javascripts/runner/components/cells/runner_type_cell.vue @@ -1,11 +1,18 @@ <script> -import { GlBadge } from '@gitlab/ui'; +import { GlTooltipDirective } from '@gitlab/ui'; import RunnerTypeBadge from '../runner_type_badge.vue'; +import RunnerStateLockedBadge from '../runner_state_locked_badge.vue'; +import RunnerStatePausedBadge from '../runner_state_paused_badge.vue'; +import { I18N_LOCKED_RUNNER_DESCRIPTION, I18N_PAUSED_RUNNER_DESCRIPTION } from '../../constants'; export default { components: { - GlBadge, RunnerTypeBadge, + RunnerStateLockedBadge, + RunnerStatePausedBadge, + }, + directives: { + GlTooltip: GlTooltipDirective, }, props: { runner: { @@ -24,19 +31,17 @@ export default { return !this.runner.active; }, }, + i18n: { + I18N_LOCKED_RUNNER_DESCRIPTION, + I18N_PAUSED_RUNNER_DESCRIPTION, + }, }; </script> <template> <div> <runner-type-badge :type="runnerType" size="sm" /> - - <gl-badge v-if="locked" variant="warning" size="sm"> - {{ s__('Runners|locked') }} - </gl-badge> - - <gl-badge v-if="paused" variant="danger" size="sm"> - {{ s__('Runners|paused') }} - </gl-badge> + <runner-state-locked-badge v-if="locked" size="sm" /> + <runner-state-paused-badge v-if="paused" size="sm" /> </div> </template> diff --git a/app/assets/javascripts/runner/components/runner_list.vue b/app/assets/javascripts/runner/components/runner_list.vue index 69a1f106ca8..3f6ea389288 100644 --- a/app/assets/javascripts/runner/components/runner_list.vue +++ b/app/assets/javascripts/runner/components/runner_list.vue @@ -5,7 +5,7 @@ import { formatNumber, __, s__ } from '~/locale'; import TimeAgo from '~/vue_shared/components/time_ago_tooltip.vue'; import { RUNNER_JOB_COUNT_LIMIT } from '../constants'; import RunnerActionsCell from './cells/runner_actions_cell.vue'; -import RunnerNameCell from './cells/runner_name_cell.vue'; +import RunnerSummaryCell from './cells/runner_summary_cell.vue'; import RunnerTypeCell from './cells/runner_type_cell.vue'; import RunnerTags from './runner_tags.vue'; @@ -35,7 +35,7 @@ export default { GlSkeletonLoader, TimeAgo, RunnerActionsCell, - RunnerNameCell, + RunnerSummaryCell, RunnerTags, RunnerTypeCell, }, @@ -77,7 +77,7 @@ export default { }, fields: [ tableField({ key: 'type', label: __('Type/State') }), - tableField({ key: 'name', label: s__('Runners|Runner'), width: 30 }), + tableField({ key: 'summary', label: s__('Runners|Runner'), width: 30 }), tableField({ key: 'version', label: __('Version') }), tableField({ key: 'ipAddress', label: __('IP Address') }), tableField({ key: 'projectCount', label: __('Projects'), width: 5 }), @@ -107,8 +107,12 @@ export default { <runner-type-cell :runner="item" /> </template> - <template #cell(name)="{ item }"> - <runner-name-cell :runner="item" /> + <template #cell(summary)="{ item, index }"> + <runner-summary-cell :runner="item"> + <template #runner-name="{ runner }"> + <slot name="runner-name" :runner="runner" :index="index"></slot> + </template> + </runner-summary-cell> </template> <template #cell(version)="{ item: { version } }"> diff --git a/app/assets/javascripts/runner/components/runner_name.vue b/app/assets/javascripts/runner/components/runner_name.vue new file mode 100644 index 00000000000..8e495125e03 --- /dev/null +++ b/app/assets/javascripts/runner/components/runner_name.vue @@ -0,0 +1,18 @@ +<script> +import { getIdFromGraphQLId } from '~/graphql_shared/utils'; + +export default { + props: { + runner: { + type: Object, + required: true, + }, + }, + methods: { + getIdFromGraphQLId, + }, +}; +</script> +<template> + <span>#{{ getIdFromGraphQLId(runner.id) }} ({{ runner.shortSha }})</span> +</template> diff --git a/app/assets/javascripts/runner/components/runner_state_locked_badge.vue b/app/assets/javascripts/runner/components/runner_state_locked_badge.vue new file mode 100644 index 00000000000..458526010bc --- /dev/null +++ b/app/assets/javascripts/runner/components/runner_state_locked_badge.vue @@ -0,0 +1,25 @@ +<script> +import { GlBadge, GlTooltipDirective } from '@gitlab/ui'; +import { I18N_LOCKED_RUNNER_DESCRIPTION } from '../constants'; + +export default { + components: { + GlBadge, + }, + directives: { + GlTooltip: GlTooltipDirective, + }, + i18n: { + I18N_LOCKED_RUNNER_DESCRIPTION, + }, +}; +</script> +<template> + <gl-badge + v-gl-tooltip="$options.i18n.I18N_LOCKED_RUNNER_DESCRIPTION" + variant="warning" + v-bind="$attrs" + > + {{ s__('Runners|locked') }} + </gl-badge> +</template> diff --git a/app/assets/javascripts/runner/components/runner_state_paused_badge.vue b/app/assets/javascripts/runner/components/runner_state_paused_badge.vue new file mode 100644 index 00000000000..d1e6fa05e4d --- /dev/null +++ b/app/assets/javascripts/runner/components/runner_state_paused_badge.vue @@ -0,0 +1,25 @@ +<script> +import { GlBadge, GlTooltipDirective } from '@gitlab/ui'; +import { I18N_PAUSED_RUNNER_DESCRIPTION } from '../constants'; + +export default { + components: { + GlBadge, + }, + directives: { + GlTooltip: GlTooltipDirective, + }, + i18n: { + I18N_PAUSED_RUNNER_DESCRIPTION, + }, +}; +</script> +<template> + <gl-badge + v-gl-tooltip="$options.i18n.I18N_PAUSED_RUNNER_DESCRIPTION" + variant="danger" + v-bind="$attrs" + > + {{ s__('Runners|paused') }} + </gl-badge> +</template> diff --git a/app/assets/javascripts/runner/components/runner_type_badge.vue b/app/assets/javascripts/runner/components/runner_type_badge.vue index c2f43daa899..1a61b80184b 100644 --- a/app/assets/javascripts/runner/components/runner_type_badge.vue +++ b/app/assets/javascripts/runner/components/runner_type_badge.vue @@ -1,20 +1,30 @@ <script> -import { GlBadge } from '@gitlab/ui'; +import { GlBadge, GlTooltipDirective } from '@gitlab/ui'; import { s__ } from '~/locale'; -import { INSTANCE_TYPE, GROUP_TYPE, PROJECT_TYPE } from '../constants'; +import { + INSTANCE_TYPE, + GROUP_TYPE, + PROJECT_TYPE, + I18N_INSTANCE_RUNNER_DESCRIPTION, + I18N_GROUP_RUNNER_DESCRIPTION, + I18N_PROJECT_RUNNER_DESCRIPTION, +} from '../constants'; const BADGE_DATA = { [INSTANCE_TYPE]: { variant: 'success', text: s__('Runners|shared'), + tooltip: I18N_INSTANCE_RUNNER_DESCRIPTION, }, [GROUP_TYPE]: { variant: 'success', text: s__('Runners|group'), + tooltip: I18N_GROUP_RUNNER_DESCRIPTION, }, [PROJECT_TYPE]: { variant: 'info', text: s__('Runners|specific'), + tooltip: I18N_PROJECT_RUNNER_DESCRIPTION, }, }; @@ -22,6 +32,9 @@ export default { components: { GlBadge, }, + directives: { + GlTooltip: GlTooltipDirective, + }, props: { type: { type: String, @@ -40,7 +53,7 @@ export default { }; </script> <template> - <gl-badge v-if="badge" :variant="badge.variant" v-bind="$attrs"> + <gl-badge v-if="badge" v-gl-tooltip="badge.tooltip" :variant="badge.variant" v-bind="$attrs"> {{ badge.text }} </gl-badge> </template> diff --git a/app/assets/javascripts/runner/components/runner_type_help.vue b/app/assets/javascripts/runner/components/runner_type_help.vue deleted file mode 100644 index 70456b3ab65..00000000000 --- a/app/assets/javascripts/runner/components/runner_type_help.vue +++ /dev/null @@ -1,60 +0,0 @@ -<script> -import { GlBadge } from '@gitlab/ui'; -import { INSTANCE_TYPE, GROUP_TYPE, PROJECT_TYPE } from '../constants'; -import RunnerTypeBadge from './runner_type_badge.vue'; - -export default { - components: { - GlBadge, - RunnerTypeBadge, - }, - runnerTypes: { - INSTANCE_TYPE, - GROUP_TYPE, - PROJECT_TYPE, - }, -}; -</script> - -<template> - <div class="bs-callout"> - <p>{{ __('Runners are processes that pick up and execute CI/CD jobs for GitLab.') }}</p> - <p> - {{ - __( - 'You can register runners as separate users, on separate servers, and on your local machine. Register as many runners as you want.', - ) - }} - </p> - - <div> - <span> {{ __('Runners can be:') }}</span> - <ul> - <li> - <runner-type-badge :type="$options.runnerTypes.INSTANCE_TYPE" size="sm" /> - - {{ __('Runs jobs from all unassigned projects.') }} - </li> - <li> - <runner-type-badge :type="$options.runnerTypes.GROUP_TYPE" size="sm" /> - - {{ __('Runs jobs from all unassigned projects in its group.') }} - </li> - <li> - <runner-type-badge :type="$options.runnerTypes.PROJECT_TYPE" size="sm" /> - - {{ __('Runs jobs from assigned projects.') }} - </li> - <li> - <gl-badge variant="warning" size="sm"> - {{ s__('Runners|locked') }} - </gl-badge> - - {{ __('Cannot be assigned to other projects.') }} - </li> - <li> - <gl-badge variant="danger" size="sm"> - {{ s__('Runners|paused') }} - </gl-badge> - - {{ __('Not available to run jobs.') }} - </li> - </ul> - </div> - </div> -</template> |