diff options
Diffstat (limited to 'app/assets/javascripts/ci/runner/components/runner_type_icon.vue')
-rw-r--r-- | app/assets/javascripts/ci/runner/components/runner_type_icon.vue | 62 |
1 files changed, 62 insertions, 0 deletions
diff --git a/app/assets/javascripts/ci/runner/components/runner_type_icon.vue b/app/assets/javascripts/ci/runner/components/runner_type_icon.vue new file mode 100644 index 00000000000..c56f28e10a3 --- /dev/null +++ b/app/assets/javascripts/ci/runner/components/runner_type_icon.vue @@ -0,0 +1,62 @@ +<script> +import { GlIcon, GlTooltipDirective } from '@gitlab/ui'; +import { + INSTANCE_TYPE, + GROUP_TYPE, + PROJECT_TYPE, + I18N_INSTANCE_TYPE, + I18N_INSTANCE_RUNNER_DESCRIPTION, + I18N_GROUP_TYPE, + I18N_GROUP_RUNNER_DESCRIPTION, + I18N_PROJECT_TYPE, + I18N_PROJECT_RUNNER_DESCRIPTION, +} from '../constants'; + +const ICON_DATA = { + [INSTANCE_TYPE]: { + name: 'users', + tooltip: `${I18N_INSTANCE_TYPE}: ${I18N_INSTANCE_RUNNER_DESCRIPTION}`, + }, + [GROUP_TYPE]: { + name: 'group', + tooltip: `${I18N_GROUP_TYPE}: ${I18N_GROUP_RUNNER_DESCRIPTION}`, + }, + [PROJECT_TYPE]: { + name: 'project', + tooltip: `${I18N_PROJECT_TYPE}: ${I18N_PROJECT_RUNNER_DESCRIPTION}`, + }, +}; + +export default { + components: { + GlIcon, + }, + directives: { + GlTooltip: GlTooltipDirective, + }, + props: { + type: { + type: String, + required: false, + default: null, + validator(type) { + return Boolean(ICON_DATA[type]); + }, + }, + }, + computed: { + icon() { + return ICON_DATA[this.type]; + }, + }, +}; +</script> +<template> + <gl-icon + v-if="icon" + v-gl-tooltip="icon.tooltip" + :aria-label="icon.tooltip" + :name="icon.name" + v-bind="$attrs" + /> +</template> |