summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/registry/explorer/components/delete_image.vue
blob: a313854f5e4f311f9d5567590bf442b96c294513 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<script>
import { produce } from 'immer';
import { GRAPHQL_PAGE_SIZE } from '../constants/index';
import deleteContainerRepositoryMutation from '../graphql/mutations/delete_container_repository.mutation.graphql';
import getContainerRepositoryDetailsQuery from '../graphql/queries/get_container_repository_details.query.graphql';

export default {
  props: {
    id: {
      type: String,
      required: false,
      default: null,
    },
    useUpdateFn: {
      type: Boolean,
      required: false,
      default: false,
    },
  },
  methods: {
    updateImageStatus(store, { data: { destroyContainerRepository } }) {
      const variables = {
        id: this.id,
        first: GRAPHQL_PAGE_SIZE,
      };
      const sourceData = store.readQuery({
        query: getContainerRepositoryDetailsQuery,
        variables,
      });

      const data = produce(sourceData, (draftState) => {
        draftState.containerRepository.status =
          destroyContainerRepository.containerRepository.status;
      });

      store.writeQuery({
        query: getContainerRepositoryDetailsQuery,
        variables,
        data,
      });
    },
    doDelete() {
      this.$emit('start');
      return this.$apollo
        .mutate({
          mutation: deleteContainerRepositoryMutation,
          variables: {
            id: this.id,
          },
          update: this.useUpdateFn ? this.updateImageStatus : undefined,
        })
        .then(({ data }) => {
          if (data?.destroyContainerRepository?.errors[0]) {
            this.$emit('error', data?.destroyContainerRepository?.errors);
            return;
          }
          this.$emit('success');
        })
        .catch((e) => {
          // note: we are adding an array to follow the same format of the error raised above
          this.$emit('error', [e]);
        })
        .finally(() => {
          this.$emit('end');
        });
    },
  },
  render() {
    if (this.$scopedSlots?.default) {
      return this.$scopedSlots.default({ doDelete: this.doDelete });
    }
    return null;
  },
};
</script>