gitlab-org--gitlab-foss/app/assets/javascripts/ci_variable_list/components/ci_group_variables.vue

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

105 lines
3.1 KiB
Vue
Raw Normal View History

<script>
import createFlash from '~/flash';
import { convertToGraphQLId } from '~/graphql_shared/utils';
import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
import getGroupVariables from '../graphql/queries/group_variables.query.graphql';
import {
ADD_MUTATION_ACTION,
DELETE_MUTATION_ACTION,
GRAPHQL_GROUP_TYPE,
UPDATE_MUTATION_ACTION,
genericMutationErrorText,
variableFetchErrorText,
} from '../constants';
import addGroupVariable from '../graphql/mutations/group_add_variable.mutation.graphql';
import deleteGroupVariable from '../graphql/mutations/group_delete_variable.mutation.graphql';
import updateGroupVariable from '../graphql/mutations/group_update_variable.mutation.graphql';
import ciVariableSettings from './ci_variable_settings.vue';
export default {
components: {
ciVariableSettings,
},
mixins: [glFeatureFlagsMixin()],
inject: ['endpoint', 'groupPath', 'groupId'],
data() {
return {
groupVariables: [],
};
},
apollo: {
groupVariables: {
query: getGroupVariables,
variables() {
return {
fullPath: this.groupPath,
};
},
update(data) {
return data?.group?.ciVariables?.nodes || [];
},
error() {
createFlash({ message: variableFetchErrorText });
},
},
},
computed: {
areScopedVariablesAvailable() {
return this.glFeatures.groupScopedCiVariables;
},
isLoading() {
return this.$apollo.queries.groupVariables.loading;
},
},
methods: {
addVariable(variable) {
this.variableMutation(ADD_MUTATION_ACTION, variable);
},
deleteVariable(variable) {
this.variableMutation(DELETE_MUTATION_ACTION, variable);
},
updateVariable(variable) {
this.variableMutation(UPDATE_MUTATION_ACTION, variable);
},
async variableMutation(mutationAction, variable) {
try {
const currentMutation = this.$options.mutationData[mutationAction];
const { data } = await this.$apollo.mutate({
mutation: currentMutation.action,
variables: {
endpoint: this.endpoint,
fullPath: this.groupPath,
groupId: convertToGraphQLId(GRAPHQL_GROUP_TYPE, this.groupId),
variable,
},
});
const { errors } = data[currentMutation.name];
if (errors.length > 0) {
createFlash({ message: errors[0] });
}
} catch {
createFlash({ message: genericMutationErrorText });
}
},
},
mutationData: {
[ADD_MUTATION_ACTION]: { action: addGroupVariable, name: 'addGroupVariable' },
[UPDATE_MUTATION_ACTION]: { action: updateGroupVariable, name: 'updateGroupVariable' },
[DELETE_MUTATION_ACTION]: { action: deleteGroupVariable, name: 'deleteGroupVariable' },
},
};
</script>
<template>
<ci-variable-settings
:are-scoped-variables-available="areScopedVariablesAvailable"
:is-loading="isLoading"
:variables="groupVariables"
@add-variable="addVariable"
@delete-variable="deleteVariable"
@update-variable="updateVariable"
/>
</template>