Add ability to manage relays

This commit is contained in:
Maxim Filippov 2019-10-17 22:59:25 +02:00
parent e500401698
commit 47dd86911f
7 changed files with 153 additions and 2 deletions

34
src/api/relays.js Normal file
View file

@ -0,0 +1,34 @@
import request from '@/utils/request'
import { getToken } from '@/utils/auth'
import { baseName } from './utils'
export async function fetchRelays(authHost, token) {
return await request({
baseURL: baseName(authHost),
url: '/api/pleroma/admin/relay',
method: 'get',
headers: authHeaders(token)
})
}
export async function addRelay(relay, authHost, token) {
return await request({
baseURL: baseName(authHost),
url: '/api/pleroma/admin/relay',
method: 'post',
headers: authHeaders(token),
data: { relay_url: relay }
})
}
export async function deleteRelay(relay, authHost, token) {
return await request({
baseURL: baseName(authHost),
url: '/api/pleroma/admin/relay',
method: 'delete',
headers: authHeaders(token),
data: { relay_url: `https://${relay}/actor` }
})
}
const authHeaders = (token) => token ? { 'Authorization': `Bearer ${getToken()}` } : {}

View file

@ -312,6 +312,7 @@ export default {
rateLimiters: 'Rate limiters',
database: 'Database',
other: 'Other',
relays: 'Relays',
success: 'Settings changed successfully!'
},
invites: {

View file

@ -5,6 +5,7 @@ import errorLog from './modules/errorLog'
import moderationLog from './modules/moderationLog'
import invites from './modules/invites'
import permission from './modules/permission'
import relays from './modules/relays'
import reports from './modules/reports'
import settings from './modules/settings'
import tagsView from './modules/tagsView'
@ -23,6 +24,7 @@ const store = new Vuex.Store({
moderationLog,
invites,
permission,
relays,
reports,
settings,
tagsView,

View file

@ -0,0 +1,44 @@
import { fetchRelays, addRelay, deleteRelay } from '@/api/relays'
const relays = {
state: {
fetchedRelays: [],
loading: true
},
mutations: {
SET_LOADING: (state, loading) => {
state.loading = loading
},
SET_RELAYS: (state, relays) => {
state.fetchedRelays = relays
},
ADD_RELAY: (state, relay) => {
state.fetchedRelays = [...state.fetchedRelays, relay]
},
DELETE_RELAY: (state, relay) => {
state.fetchedRelays = state.fetchedRelays.filter(fetchedRelay => fetchedRelay !== relay)
}
},
actions: {
async FetchRelays({ commit, getters }) {
commit('SET_LOADING', true)
const response = await fetchRelays(getters.authHost, getters.token)
commit('SET_RELAYS', response.data.relays)
commit('SET_LOADING', false)
},
async AddRelay({ commit, getters }, relay) {
commit('ADD_RELAY', relay)
await addRelay(relay, getters.authHost, getters.token)
},
async DeleteRelay({ commit, getters }, relay) {
commit('DELETE_RELAY', relay)
await deleteRelay(relay, getters.authHost, getters.token)
}
}
}
export default relays

View file

@ -0,0 +1,66 @@
<template>
<div v-if="!loading">
<el-row :gutter="5">
<el-col :span="8">
<el-input v-model="newRelay" placeholder="Follow new relay" @keyup.enter.native="followRelay"/>
</el-col>
<el-col :span="8">
<el-button @click.native="followRelay">Follow</el-button>
</el-col>
</el-row>
<el-table :data="relaysTable">
<el-table-column
prop="instance"
label="Instance URL"/>
<el-table-column fixed="right" width="120">
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click.native="deleteRelay(scope.row.instance)"
>Delete</el-button>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
name: 'Relays',
data() {
return {
newRelay: ''
}
},
computed: {
relays() {
return this.$store.state.relays.fetchedRelays
},
relaysTable() {
return this.relays.map(relay => {
return { instance: relay }
})
},
loading() {
return this.$store.state.relays.loading
}
},
mounted() {
this.$store.dispatch('FetchRelays')
},
methods: {
followRelay() {
this.$store.dispatch('AddRelay', this.newRelay)
},
deleteRelay(relay) {
this.$store.dispatch('DeleteRelay', relay)
}
}
}
</script>
<style rel='stylesheet/scss' lang='scss'>
@import '../styles/main';
@include settings
</style>

View file

@ -17,5 +17,6 @@ export { default as Metadata } from './Metadata'
export { default as Mrf } from './MRF'
export { default as Other } from './Other'
export { default as RateLimiters } from './RateLimiters'
export { default as Relays } from './Relays'
export { default as Upload } from './Upload'
export { default as WebPush } from './WebPush'

View file

@ -56,6 +56,9 @@
<el-tab-pane :label="$t('settings.rateLimiters')">
<rate-limiters/>
</el-tab-pane>
<el-tab-pane :label="$t('settings.relays')">
<relays/>
</el-tab-pane>
<el-tab-pane :label="$t('settings.upload')">
<upload/>
</el-tab-pane>
@ -70,10 +73,10 @@
</template>
<script>
import { ActivityPub, Authentication, AutoLinker, Captcha, Database, Endpoint, Esshd, Frontend, Gopher, Http, Instance, JobQueue, Logger, Mailer, MediaProxy, Metadata, Mrf, Other, RateLimiters, Upload, WebPush } from './components'
import { ActivityPub, Authentication, AutoLinker, Captcha, Database, Endpoint, Esshd, Frontend, Gopher, Http, Instance, JobQueue, Logger, Mailer, MediaProxy, Metadata, Mrf, Other, RateLimiters, Relays, Upload, WebPush } from './components'
export default {
components: { ActivityPub, Authentication, AutoLinker, Captcha, Database, Endpoint, Esshd, Frontend, Gopher, Http, Instance, JobQueue, Logger, Mailer, MediaProxy, Metadata, Mrf, Other, RateLimiters, Upload, WebPush },
components: { ActivityPub, Authentication, AutoLinker, Captcha, Database, Endpoint, Esshd, Frontend, Gopher, Http, Instance, JobQueue, Logger, Mailer, MediaProxy, Metadata, Mrf, Other, RateLimiters, Relays, Upload, WebPush },
computed: {
isMobile() {
return this.$store.state.app.device === 'mobile'