<template>
  <note-form
    :note="currentNote"
    @save="editNote"
    @hide="hide"/>
</template>

<script>
  import NoteForm from '@/components/notes/NoteForm';

  import UPDATE_NOTE_MUTATION from '@/graphql/gql/mutations/updateNote.gql';
  import MODULE_DETAILS_QUERY from '@/graphql/gql/queries/modules/moduleDetailsQuery.gql';
  import INSTRUMENT_QUERY from '@/graphql/gql/queries/instrumentQuery.gql';

  import {mapGetters} from 'vuex';

  export default {
    components: {
      NoteForm
    },

    computed: {
      ...mapGetters(['currentNote'])
    },

    methods: {
      editNote(note) {
        const slug = this.$route.params.slug;
        const routeName = this.$route.name;

        this.$apollo.mutate({
          mutation: UPDATE_NOTE_MUTATION,
          variables: {
            input: {
              note
            }
          },
          refetchQueries() {
            let query;
            if (routeName === 'instrument') {
              query = {
                query: INSTRUMENT_QUERY,
                variables: {
                  slug
                }
              };
            } else {
              query = {
                query: MODULE_DETAILS_QUERY,
                variables: {
                  slug
                }
              };
            }
            return [query];
          }
        }).then(() => {
          this.$store.dispatch('hideModal');
        });
      },
      hide() {
        this.$store.dispatch('hideModal');
      }
    }
  };
</script>
