sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP: Add Discord auth (#3239)

Browse Source 
* Add Discord auth

* Apply review 175263424
This commit is contained in:
Acid Chicken (硫酸鶏)
2018-11-15 19:15:04 +09:00
committed by syuilo
parent a34fdc2068
commit 9d8f7b081d
17 changed files with 522 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/client/app/admin/views/instance.vue
View File

@@ -76,6 +76,17 @@
<ui-button @click="updateMeta">{{ $t('save') }}</ui-button>
</section>
</ui-card>
<ui-card>
<div slot="title"><fa :icon="['fab', 'discord']"/> {{ $t('discord-integration-config') }}</div>
<section>
<ui-switch v-model="enableDiscordIntegration">{{ $t('enable-discord-integration') }}</ui-switch>
<ui-info>{{ $t('discord-integration-info') }}</ui-info>
<ui-input v-model="discordClientId" :disabled="!enableDiscordIntegration"><i slot="icon"><fa icon="key"/></i>{{ $t('discord-integration-client-id') }}</ui-input>
<ui-input v-model="discordClientSecret" :disabled="!enableDiscordIntegration"><i slot="icon"><fa icon="key"/></i>{{ $t('discord-integration-client-secret') }}</ui-input>
<ui-button @click="updateMeta">{{ $t('save') }}</ui-button>
</section>
</ui-card>
</div>
</template>
@@ -113,6 +124,9 @@ export default Vue.extend({
enableGithubIntegration: false,
githubClientId: null,
githubClientSecret: null,
enableDiscordIntegration: false,
discordClientId: null,
discordClientSecret: null,
proxyAccount: null,
inviteCode: null,
faHeadset, faShieldAlt, faGhost
@@ -141,6 +155,9 @@ export default Vue.extend({
this.enableGithubIntegration = meta.enableGithubIntegration;
this.githubClientId = meta.githubClientId;
this.githubClientSecret = meta.githubClientSecret;
this.enableDiscordIntegration = meta.enableDiscordIntegration;
this.discordClientId = meta.discordClientId;
this.discordClientSecret = meta.discordClientSecret;
});
},
@@ -180,6 +197,9 @@ export default Vue.extend({
enableGithubIntegration: this.enableGithubIntegration,
githubClientId: this.githubClientId,
githubClientSecret: this.githubClientSecret,
enableDiscordIntegration: this.enableDiscordIntegration,
discordClientId: this.discordClientId,
discordClientSecret: this.discordClientSecret
}).then(() => {
this.$root.alert({
type: 'success',

64
src/client/app/common/views/components/discord-setting.vue Normal file
View File

@@ -0,0 +1,64 @@
<template>
<div class="mk-discord-setting">
<p>{{ $t('description') }}</p>
<p class="account" v-if="$store.state.i.discord" :title="`Discord ID: ${$store.state.i.discord.id}`">{{ $t('connected-to') }}: <a :href="`https://discordapp.com/users/${$store.state.i.discord.id}`" target="_blank">@{{ $store.state.i.discord.username }}#{{ $store.state.i.discord.discriminator }}</a></p>
<p>
<a :href="`${apiUrl}/connect/discord`" target="_blank" @click.prevent="connect">{{ $store.state.i.discord ? this.$t('reconnect') : this.$t('connect') }}</a>
<span v-if="$store.state.i.discord"> or </span>
<a :href="`${apiUrl}/disconnect/discord`" target="_blank" v-if="$store.state.i.discord" @click.prevent="disconnect">{{ $t('disconnect') }}</a>
</p>
<p class="id" v-if="$store.state.i.discord">Discord ID: {{ $store.state.i.discord.id }}</p>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import i18n from '../../../i18n';
import { apiUrl } from '../../../config';
export default Vue.extend({
i18n: i18n('common/views/components/discord-setting.vue'),
data() {
return {
form: null,
apiUrl
};
},
mounted() {
this.$watch('$store.state.i', () => {
if (this.$store.state.i.discord && this.form)
this.form.close();
}, {
deep: true
});
},
methods: {
connect() {
this.form = window.open(apiUrl + '/connect/discord',
'discord_connect_window',
'height=570, width=520');
},
disconnect() {
window.open(apiUrl + '/disconnect/discord',
'discord_disconnect_window',
'height=570, width=520');
}
}
});
</script>
<style lang="stylus" scoped>
.mk-discord-setting
.account
border solid 1px #e1e8ed
border-radius 4px
padding 16px
a
font-weight bold
color inherit
.id
color #8899a6
</style>

2
src/client/app/common/views/components/index.ts
View File

@@ -29,6 +29,7 @@ import ellipsis from './ellipsis.vue';
import urlPreview from './url-preview.vue';
import twitterSetting from './twitter-setting.vue';
import githubSetting from './github-setting.vue';
import discordSetting from './discord-setting.vue';
import fileTypeIcon from './file-type-icon.vue';
import emoji from './emoji.vue';
import welcomeTimeline from './welcome-timeline.vue';
@@ -74,6 +75,7 @@ Vue.component('mk-ellipsis', ellipsis);
Vue.component('mk-url-preview', urlPreview);
Vue.component('mk-twitter-setting', twitterSetting);
Vue.component('mk-github-setting', githubSetting);
Vue.component('mk-discord-setting', discordSetting);
Vue.component('mk-file-type-icon', fileTypeIcon);
Vue.component('mk-emoji', emoji);
Vue.component('mk-welcome-timeline', welcomeTimeline);

1
src/client/app/common/views/components/signin.vue
View File

@@ -14,6 +14,7 @@
<ui-button type="submit" :disabled="signing">{{ signing ? $t('signing-in') : $t('signin') }}</ui-button>
<p style="margin: 8px 0;"><a :href="`${apiUrl}/signin/twitter`">{{ $t('signin-with-twitter') }}</a></p>
<p style="margin: 8px 0;"><a :href="`${apiUrl}/signin/github`">{{ $t('signin-with-github') }}</a></p>
<p style="margin: 8px 0;"><a :href="`${apiUrl}/signin/discord`">{{ $t('signin-with-discord') /* TODO: Make these layouts better */ }}</a></p>
</form>
</template>

7
src/client/app/desktop/views/components/settings.vue
View File

@@ -30,6 +30,13 @@
<mk-github-setting/>
</section>
</ui-card>
<ui-card>
<div slot="title"><fa :icon="['fab', 'discord']"/> {{ $t('discord') }}</div>
<section>
<mk-discord-setting/>
</section>
</ui-card>
</div>
<ui-card class="theme" v-show="page == 'theme'">

26
src/client/app/desktop/views/pages/user/user.discord.vue Normal file
View File

@@ -0,0 +1,26 @@
<template>
<div class="lkafjvabenanajk17kwqpsatoushincb">
<span><fa :icon="['fab', 'discord']"/><a :href="`https://discordapp.com/users/${user.discord.id}`" target="_blank">@{{ user.discord.username }}#{{ user.discord.discriminator }}</a></span>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
props: ['user']
});
</script>
<style lang="stylus" scoped>
.lkafjvabenanajk17kwqpsatoushincb
padding 32px
background #7289da
border-radius 6px
color #fff
a
margin-left 8px
color #fff
</style>

5
src/client/app/desktop/views/pages/user/user.vue
View File

@@ -14,6 +14,7 @@
<x-profile :user="user"/>
<x-twitter :user="user" v-if="!user.host && user.twitter"/>
<x-github :user="user" v-if="!user.host && user.github"/>
<x-discord :user="user" v-if="!user.host && user.discord"/>
<mk-calendar @chosen="warp" :start="new Date(user.createdAt)"/>
<mk-activity :user="user"/>
<x-photos :user="user"/>
@@ -39,6 +40,7 @@ import XFollowersYouKnow from './user.followers-you-know.vue';
import XFriends from './user.friends.vue';
import XTwitter from './user.twitter.vue';
import XGithub from './user.github.vue'; // ?MEM: Don't fix the intentional typo. (XGitHub -> `<x-git-hub>`)
import XDiscord from './user.discord.vue';
export default Vue.extend({
i18n: i18n(),
@@ -50,7 +52,8 @@ export default Vue.extend({
XFollowersYouKnow,
XFriends,
XTwitter,
XGithub // ?MEM: Don't fix the intentional typo. (see L41)
XGithub, // ?MEM: Don't fix the intentional typo. (see L41)
XDiscord
},
data() {
return {

4
src/client/app/init.ts
View File

@@ -143,6 +143,7 @@ import {
import {
faTwitter as fabTwitter,
faGithub as fabGithub,
faDiscord as fabDiscord
} from '@fortawesome/free-brands-svg-icons';
import i18n from './i18n';
@@ -259,7 +260,8 @@ library.add(
farHdd,
fabTwitter,
fabGithub
fabGithub,
fabDiscord
);
//#endregion

13
src/client/app/mobile/views/pages/settings.vue
View File

@@ -140,6 +140,19 @@
</section>
</ui-card>
<ui-card>
<div slot="title"><fa :icon="['fab', 'discord']"/> {{ $t('discord') }}</div>
<section>
<p class="account" v-if="$store.state.i.discord"><a :href="`https://discordapp.com/users/${$store.state.i.discord.id}`" target="_blank">@{{ $store.state.i.discord.username }}#{{ $store.state.i.discord.discriminator }}</a></p>
<p>
<a :href="`${apiUrl}/connect/discord`" target="_blank">{{ $store.state.i.discord ? this.$t('discord-reconnect') : this.$t('discord-connect') }}</a>
<span v-if="$store.state.i.discord"> or </span>
<a :href="`${apiUrl}/disconnect/discord`" target="_blank" v-if="$store.state.i.discord">{{ $t('discord-disconnect') }}</a>
</p>
</section>
</ui-card>
<x-api-settings />
<ui-card>