229 lines
8.7 KiB
Vue
229 lines
8.7 KiB
Vue
<template>
|
|
<div class="side-bar__panel side-bar__panel--menu">
|
|
<div class="side-bar__info" v-if="isCurrentTemp">
|
|
<p><b>{{currentFileName}}</b> can not be published as it's a temporary file.</p>
|
|
</div>
|
|
<div v-else>
|
|
<div class="side-bar__info" v-if="noToken">
|
|
<p>You have to <b>link an account</b> to start publishing files.</p>
|
|
</div>
|
|
<div class="side-bar__info" v-if="publishLocations.length">
|
|
<p><b>{{currentFileName}}</b> is already published.</p>
|
|
<menu-entry @click.native="requestPublish">
|
|
<icon-upload slot="icon"></icon-upload>
|
|
<div>Publish now</div>
|
|
<span>Update current file publications.</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="managePublish">
|
|
<icon-view-list slot="icon"></icon-view-list>
|
|
<div>File publication</div>
|
|
<span>Manage current file publication locations.</span>
|
|
</menu-entry>
|
|
</div>
|
|
<hr>
|
|
<div v-for="token in googleDriveTokens" :key="token.sub">
|
|
<menu-entry @click.native="publishGoogleDrive(token)">
|
|
<icon-provider slot="icon" provider-id="googleDrive"></icon-provider>
|
|
<div>Publish to Google Drive</div>
|
|
<span>{{token.name}}</span>
|
|
</menu-entry>
|
|
</div>
|
|
<div v-for="token in dropboxTokens" :key="token.sub">
|
|
<menu-entry @click.native="publishDropbox(token)">
|
|
<icon-provider slot="icon" provider-id="dropbox"></icon-provider>
|
|
<div>Publish to Dropbox</div>
|
|
<span>{{token.name}}</span>
|
|
</menu-entry>
|
|
</div>
|
|
<div v-for="token in githubTokens" :key="token.sub">
|
|
<menu-entry @click.native="publishGithub(token)">
|
|
<icon-provider slot="icon" provider-id="github"></icon-provider>
|
|
<div>Publish to GitHub</div>
|
|
<span>{{token.name}}</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="publishGist(token)">
|
|
<icon-provider slot="icon" provider-id="gist"></icon-provider>
|
|
<div>Publish to Gist</div>
|
|
<span>{{token.name}}</span>
|
|
</menu-entry>
|
|
</div>
|
|
<div v-for="token in wordpressTokens" :key="token.sub">
|
|
<menu-entry @click.native="publishWordpress(token)">
|
|
<icon-provider slot="icon" provider-id="wordpress"></icon-provider>
|
|
<div>Publish to WordPress</div>
|
|
<span>{{token.name}}</span>
|
|
</menu-entry>
|
|
</div>
|
|
<div v-for="token in bloggerTokens" :key="token.sub">
|
|
<menu-entry @click.native="publishBlogger(token)">
|
|
<icon-provider slot="icon" provider-id="blogger"></icon-provider>
|
|
<div>Publish to Blogger</div>
|
|
<span>{{token.name}}</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="publishBloggerPage(token)">
|
|
<icon-provider slot="icon" provider-id="bloggerPage"></icon-provider>
|
|
<div>Publish to Blogger Page</div>
|
|
<span>{{token.name}}</span>
|
|
</menu-entry>
|
|
</div>
|
|
<div v-for="token in zendeskTokens" :key="token.sub">
|
|
<menu-entry @click.native="publishZendesk(token)">
|
|
<icon-provider slot="icon" provider-id="zendesk"></icon-provider>
|
|
<div>Publish to Zendesk Help Center</div>
|
|
<span>{{token.name}} — {{token.subdomain}}</span>
|
|
</menu-entry>
|
|
</div>
|
|
<hr>
|
|
<menu-entry @click.native="addGoogleDriveAccount">
|
|
<icon-provider slot="icon" provider-id="googleDrive"></icon-provider>
|
|
<span>Add Google Drive account</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="addDropboxAccount">
|
|
<icon-provider slot="icon" provider-id="dropbox"></icon-provider>
|
|
<span>Add Dropbox account</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="addGithubAccount">
|
|
<icon-provider slot="icon" provider-id="github"></icon-provider>
|
|
<span>Add GitHub account</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="addWordpressAccount">
|
|
<icon-provider slot="icon" provider-id="wordpress"></icon-provider>
|
|
<span>Add WordPress account</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="addBloggerAccount">
|
|
<icon-provider slot="icon" provider-id="blogger"></icon-provider>
|
|
<span>Add Blogger account</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="addZendeskAccount">
|
|
<icon-provider slot="icon" provider-id="zendesk"></icon-provider>
|
|
<span>Add Zendesk account</span>
|
|
</menu-entry>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState, mapGetters } from 'vuex';
|
|
import MenuEntry from './common/MenuEntry';
|
|
import googleHelper from '../../services/providers/helpers/googleHelper';
|
|
import dropboxHelper from '../../services/providers/helpers/dropboxHelper';
|
|
import githubHelper from '../../services/providers/helpers/githubHelper';
|
|
import wordpressHelper from '../../services/providers/helpers/wordpressHelper';
|
|
import zendeskHelper from '../../services/providers/helpers/zendeskHelper';
|
|
import publishSvc from '../../services/publishSvc';
|
|
import store from '../../store';
|
|
|
|
const tokensToArray = (tokens, filter = () => true) => Object.keys(tokens)
|
|
.map(sub => tokens[sub])
|
|
.filter(token => filter(token))
|
|
.sort((token1, token2) => token1.name.localeCompare(token2.name));
|
|
|
|
const publishModalOpener = type => async (token) => {
|
|
try {
|
|
const publishLocation = await store.dispatch('modal/open', {
|
|
type,
|
|
token,
|
|
});
|
|
publishSvc.createPublishLocation(publishLocation);
|
|
} catch (e) { /* cancel */ }
|
|
};
|
|
|
|
export default {
|
|
components: {
|
|
MenuEntry,
|
|
},
|
|
computed: {
|
|
...mapState('queue', [
|
|
'isPublishRequested',
|
|
]),
|
|
...mapGetters('file', [
|
|
'isCurrentTemp',
|
|
]),
|
|
...mapGetters('publishLocation', {
|
|
publishLocations: 'current',
|
|
}),
|
|
currentFileName() {
|
|
return this.$store.getters['file/current'].name;
|
|
},
|
|
googleDriveTokens() {
|
|
return tokensToArray(this.$store.getters['data/googleTokens'], token => token.isDrive);
|
|
},
|
|
dropboxTokens() {
|
|
return tokensToArray(this.$store.getters['data/dropboxTokens']);
|
|
},
|
|
githubTokens() {
|
|
return tokensToArray(this.$store.getters['data/githubTokens']);
|
|
},
|
|
wordpressTokens() {
|
|
return tokensToArray(this.$store.getters['data/wordpressTokens']);
|
|
},
|
|
bloggerTokens() {
|
|
return tokensToArray(this.$store.getters['data/googleTokens'], token => token.isBlogger);
|
|
},
|
|
zendeskTokens() {
|
|
return tokensToArray(this.$store.getters['data/zendeskTokens']);
|
|
},
|
|
noToken() {
|
|
return !this.googleDriveTokens.length
|
|
&& !this.dropboxTokens.length
|
|
&& !this.githubTokens.length
|
|
&& !this.wordpressTokens.length
|
|
&& !this.bloggerTokens.length
|
|
&& !this.zendeskTokens.length;
|
|
},
|
|
},
|
|
methods: {
|
|
requestPublish() {
|
|
if (!this.isPublishRequested) {
|
|
publishSvc.requestPublish();
|
|
}
|
|
},
|
|
managePublish() {
|
|
return this.$store.dispatch('modal/open', 'publishManagement');
|
|
},
|
|
async addGoogleDriveAccount() {
|
|
try {
|
|
await this.$store.dispatch('modal/open', { type: 'googleDriveAccount' });
|
|
await googleHelper.addDriveAccount(!store.getters['data/localSettings'].googleDriveRestrictedAccess);
|
|
} catch (e) { /* cancel */ }
|
|
},
|
|
async addDropboxAccount() {
|
|
try {
|
|
await this.$store.dispatch('modal/open', { type: 'dropboxAccount' });
|
|
await dropboxHelper.addAccount(!store.getters['data/localSettings'].dropboxRestrictedAccess);
|
|
} catch (e) { /* cancel */ }
|
|
},
|
|
async addGithubAccount() {
|
|
try {
|
|
await this.$store.dispatch('modal/open', { type: 'githubAccount' });
|
|
await githubHelper.addAccount(store.getters['data/localSettings'].githubRepoFullAccess);
|
|
} catch (e) { /* cancel */ }
|
|
},
|
|
async addWordpressAccount() {
|
|
try {
|
|
await wordpressHelper.addAccount();
|
|
} catch (e) { /* cancel */ }
|
|
},
|
|
async addBloggerAccount() {
|
|
try {
|
|
await googleHelper.addBloggerAccount();
|
|
} catch (e) { /* cancel */ }
|
|
},
|
|
async addZendeskAccount() {
|
|
try {
|
|
const { subdomain, clientId } = await this.$store.dispatch('modal/open', { type: 'zendeskAccount' });
|
|
await zendeskHelper.addAccount(subdomain, clientId);
|
|
} catch (e) { /* cancel */ }
|
|
},
|
|
publishGoogleDrive: publishModalOpener('googleDrivePublish'),
|
|
publishDropbox: publishModalOpener('dropboxPublish'),
|
|
publishGithub: publishModalOpener('githubPublish'),
|
|
publishGist: publishModalOpener('gistPublish'),
|
|
publishWordpress: publishModalOpener('wordpressPublish'),
|
|
publishBlogger: publishModalOpener('bloggerPublish'),
|
|
publishBloggerPage: publishModalOpener('bloggerPagePublish'),
|
|
publishZendesk: publishModalOpener('zendeskPublish'),
|
|
},
|
|
};
|
|
</script>
|