<template>
<b-modal id="add-member-modal" title="Add member" ok-title="Add" @ok="addMember">
  <SearchUser ref="searchUser" />
</b-modal>
</template>

<script>
import client from 'api-client';
import SearchUser from './SearchUser.vue'
import {
  mapState
} from 'vuex';

export default {
  name: 'AddMemberModal',
  components: {
    SearchUser
  },
  methods: {
    addMember: function(event) {
      // Prevent modal from closing
      event.preventDefault();

      let userId = this.$refs.searchUser.selectedUser;
      let permission = this.$refs.searchUser.permission;

      client.addMember(userId, permission, this.$store.state.input)
        .then(res => {
          this.$store.commit('updateMembersPanel', res);
          this.$bvModal.hide('add-member-modal');
        });
    }
  }
};
</script>
