Subscription button

[amiller911]

Please tell me how to add this code button subscription (unsubscribe)?

Code # 1

`import Helpers from '../mixins/Helpers';

export default { mixins: [Helpers],

data() {
    return {
        subscribedFilter: '',
        showMenu: false,
        showSubMenu: false
    };
},

computed: {
    showDiscoverChannels() {
        return (
            this.channels.length < this.channelsLimit &&
            !this.subscribedFilter &&
            Store.settings.rightSidebar.channelsFilter == 'subscribed'
        );
    },

    channels() {
        // subscribed
        return Store.state.subscribedChannels;
    },

    channelsCount() {
        return this.channels.length;
    },

    showChannelAvatars() {
        return Store.settings.rightSidebar.showChannelAvatars;
    },

    channelsLimit() {
        return Store.settings.rightSidebar.channelsLimit;
    },

    filter() {
        return Store.settings.rightSidebar.channelsFilter;
    },

    filterForHumans() {
        if (this.filter == 'subscribed') return 'Subscribed Channels';

        if (this.filter == 'bookmarked') return 'Bookmarked Channels';

        if (this.filter == 'moderating') return 'Moderating Channels';
    },

    sortedSubscribeds() {
        let self = this;

        return _.orderBy(
            self.channels.filter(
                channel => channel.name.toLowerCase().indexOf(self.subscribedFilter.toLowerCase()) !== -1
            ),
            'subscribers_count',
            'desc'
        ).slice(0, self.channelsLimit > 2 ? self.channelsLimit : 2);
    },
},

created() {
    this.$eventHub.$on('pressed-esc', this.closeMenu);
},

methods: {
    closeMenu() {
        this.showMenu = false;
    },

    moreChannels() {
        Store.settings.rightSidebar.channelsLimit += 15;
    },

    pushToDiscoverChannels() {
        this.$router.push({ name: 'discover-channels' });
    },

    lessChannels() {
        Store.settings.rightSidebar.channelsLimit -= 15;
    },
            subscribe: _.debounce(
            function() {
            this.subscribed = !this.subscribed;

            axios
                .post(`/channels/${this.list.id}/subscribe`)
                .catch(() => {
                this.subscribed = !this.subscribed;
                });

                this.$emit('subscribed');
                },
                200,
                { leading: true, trailing: false }
            )
}

};`

Need to add this button

`<el-tooltip :content="subscribed ? 'Unsubscribe' : 'Subscribe'" placement="top" transition="false" :open-delay="500"

<i class="subscribe-icon" :class="subscribed ? 'go-red el-icon-remove' : 'go-green el-icon-circle-plus-outline'" @click="subscribe" `

Code # 2 `subscribed: { get() { return Store.state.subscribedAt.indexOf(this.list.id) !== -1 ? true : false; },

        set() {
            if (Store.state.subscribedAt.indexOf(this.list.id) !== -1) {
                let removeItem = this.list.id;
                Store.state.subscribedChannels = Store.state.subscribedChannels.filter(
                    (channel) => channel.id != removeItem
                );

                let index = Store.state.subscribedAt.indexOf(this.list.id);
                Store.state.subscribedAt.splice(index, 1);

                return;
            }

            Store.state.subscribedChannels.push(this.list);
            Store.state.subscribedAt.push(this.list.id);
        }
    },`

How to merge code # 2 and code # 1 for operation of buttons subscription (unsubscribe)?

[BoKKeR]

This is not really a voten issue.