Merge branch 'feature/rename-auto-linker' into 'develop'

Move Auto Linker settings to Link Formatter Tab

Closes #131

See merge request pleroma/admin-fe!146
This commit is contained in:
Angelina Filippova 2020-07-27 22:09:36 +00:00
commit 7a6b9f2e3f
14 changed files with 124 additions and 173 deletions

View file

@ -31,6 +31,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
- Displays both labels and description in the header of group of settiings - Displays both labels and description in the header of group of settiings
- Ability to add custom values in Pleroma.Upload.Filter.Mogrify setting - Ability to add custom values in Pleroma.Upload.Filter.Mogrify setting
- Show only those MRF settings that have been enabled in MRF Policies setting - Show only those MRF settings that have been enabled in MRF Policies setting
- Move Auto Linker settings to Link Formatter Tab as its configuration was moved to :pleroma, Pleroma.Formatter
### Fixed ### Fixed

View file

@ -358,10 +358,10 @@ export default {
instance: 'Instance', instance: 'Instance',
upload: 'Upload', upload: 'Upload',
mailer: 'Mailer', mailer: 'Mailer',
linkFormatter: 'Link Formatter',
logger: 'Logger', logger: 'Logger',
activityPub: 'ActivityPub', activityPub: 'ActivityPub',
auth: 'Authentication', auth: 'Authentication',
autoLinker: 'Auto Linker',
captcha: 'Captcha', captcha: 'Captcha',
frontend: 'Frontend', frontend: 'Frontend',
http: 'HTTP', http: 'HTTP',

View file

@ -9,28 +9,6 @@ export const getBooleanValue = value => {
return value return value
} }
export const checkPartialUpdate = (settings, updatedSettings, description) => {
return Object.keys(updatedSettings).reduce((acc, group) => {
acc[group] = Object.keys(updatedSettings[group]).reduce((acc, key) => {
if (!partialUpdate(group, key)) {
const updated = Object.keys(settings[group][key]).reduce((acc, settingName) => {
const setting = description
.find(element => element.group === group && element.key === key).children
.find(child => child.key === settingName)
const type = setting ? setting.type : ''
acc[settingName] = [type, settings[group][key][settingName]]
return acc
}, {})
acc[key] = updated
return acc
}
acc[key] = updatedSettings[group][key]
return acc
}, {})
return acc
}, {})
}
const getCurrentValue = (type, value, path) => { const getCurrentValue = (type, value, path) => {
if (type === 'state') { if (type === 'state') {
return _.get(value, path) return _.get(value, path)
@ -50,7 +28,7 @@ const getCurrentValue = (type, value, path) => {
} }
const getValueWithoutKey = (key, [type, value]) => { const getValueWithoutKey = (key, [type, value]) => {
if (type === 'atom' && value.length > 1) { if (prependWithСolon(type, value)) {
return `:${value}` return `:${value}`
} else if (key === ':backends') { } else if (key === ':backends') {
const index = value.findIndex(el => el === ':ex_syslogger') const index = value.findIndex(el => el === ':ex_syslogger')
@ -154,8 +132,9 @@ const parseProxyUrl = value => {
return { socks5: false, host: null, port: null } return { socks5: false, host: null, port: null }
} }
const partialUpdate = (group, key) => { const prependWithСolon = (type, value) => {
return !(group === ':auto_linker' && key === ':opts') return (type === 'atom' && value.length > 0) ||
(Array.isArray(type) && type.includes('boolean') && type.includes('atom') && typeof value === 'string')
} }
export const processNested = (valueForState, valueForUpdatedSettings, group, parentKey, parents, settings, updatedSettings) => { export const processNested = (valueForState, valueForUpdatedSettings, group, parentKey, parents, settings, updatedSettings) => {
@ -242,7 +221,7 @@ const wrapValues = (settings, currentState) => {
setting === ':replace' setting === ':replace'
) { ) {
return { 'tuple': [setting, wrapValues(value, currentState)] } return { 'tuple': [setting, wrapValues(value, currentState)] }
} else if (type === 'atom' && value.length > 0) { } else if (prependWithСolon(type, value)) {
return { 'tuple': [setting, `:${value}`] } return { 'tuple': [setting, `:${value}`] }
} else if (type.includes('tuple') && (type.includes('string') || type.includes('atom'))) { } else if (type.includes('tuple') && (type.includes('string') || type.includes('atom'))) {
return typeof value === 'string' return typeof value === 'string'

View file

@ -1,5 +1,5 @@
import { fetchDescription, fetchSettings, removeSettings, updateSettings } from '@/api/settings' import { fetchDescription, fetchSettings, removeSettings, updateSettings } from '@/api/settings'
import { checkPartialUpdate, formSearchObject, parseNonTuples, parseTuples, valueHasTuples, wrapUpdatedSettings } from './normalizers' import { formSearchObject, parseNonTuples, parseTuples, valueHasTuples, wrapUpdatedSettings } from './normalizers'
import _ from 'lodash' import _ from 'lodash'
const settings = { const settings = {
@ -101,9 +101,8 @@ const settings = {
commit('SET_ACTIVE_TAB', tab) commit('SET_ACTIVE_TAB', tab)
}, },
async SubmitChanges({ getters, commit, state }) { async SubmitChanges({ getters, commit, state }) {
const updatedData = checkPartialUpdate(state.settings, state.updatedSettings, state.description) const configs = Object.keys(state.updatedSettings).reduce((acc, group) => {
const configs = Object.keys(updatedData).reduce((acc, group) => { return [...acc, ...wrapUpdatedSettings(group, state.updatedSettings[group], state.settings)]
return [...acc, ...wrapUpdatedSettings(group, updatedData[group], state.settings)]
}, []) }, [])
await updateSettings(configs, getters.authHost, getters.token) await updateSettings(configs, getters.authHost, getters.token)

View file

@ -102,10 +102,10 @@
<template slot="prepend">:</template> <template slot="prepend">:</template>
</el-input> </el-input>
<!-- special inputs --> <!-- special inputs -->
<auto-linker-input v-if="settingGroup.group === ':auto_linker'" :data="data" :setting-group="settingGroup" :setting="setting"/>
<crontab-input v-if="setting.key === ':crontab'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting"/> <crontab-input v-if="setting.key === ':crontab'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting"/>
<editable-keyword-input v-if="editableKeyword(setting.key, setting.type)" :data="keywordData" :setting-group="settingGroup" :setting="setting"/> <editable-keyword-input v-if="editableKeyword(setting.key, setting.type)" :data="keywordData" :setting-group="settingGroup" :setting="setting"/>
<icons-input v-if="setting.key === ':icons'" :data="iconsData" :setting-group="settingGroup" :setting="setting"/> <icons-input v-if="setting.key === ':icons'" :data="iconsData" :setting-group="settingGroup" :setting="setting"/>
<link-formatter-input v-if="booleanCombinedInput" :data="data" :setting-group="settingGroup" :setting="setting"/>
<mascots-input v-if="setting.key === ':mascots'" :data="keywordData" :setting-group="settingGroup" :setting="setting"/> <mascots-input v-if="setting.key === ':mascots'" :data="keywordData" :setting-group="settingGroup" :setting="setting"/>
<proxy-url-input v-if="setting.key === ':proxy_url'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting" :parents="settingParent"/> <proxy-url-input v-if="setting.key === ':proxy_url'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting" :parents="settingParent"/>
<prune-input v-if="setting.key === ':prune'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting"/> <prune-input v-if="setting.key === ':prune'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting"/>
@ -129,11 +129,11 @@
<script> <script>
import i18n from '@/lang' import i18n from '@/lang'
import { import {
AutoLinkerInput,
CrontabInput, CrontabInput,
EditableKeywordInput, EditableKeywordInput,
IconsInput, IconsInput,
ImageUploadInput, ImageUploadInput,
LinkFormatterInput,
MascotsInput, MascotsInput,
ProxyUrlInput, ProxyUrlInput,
PruneInput, PruneInput,
@ -148,11 +148,11 @@ import marked from 'marked'
export default { export default {
name: 'Inputs', name: 'Inputs',
components: { components: {
AutoLinkerInput,
CrontabInput, CrontabInput,
EditableKeywordInput, EditableKeywordInput,
IconsInput, IconsInput,
ImageUploadInput, ImageUploadInput,
LinkFormatterInput,
MascotsInput, MascotsInput,
ProxyUrlInput, ProxyUrlInput,
PruneInput, PruneInput,
@ -216,6 +216,9 @@ export default {
} }
}, },
computed: { computed: {
booleanCombinedInput() {
return Array.isArray(this.setting.type) && this.setting.type.includes('boolean')
},
canBeDeleted() { canBeDeleted() {
const { group, key } = this.settingGroup const { group, key } = this.settingGroup
return _.get(this.$store.state.settings.db, [group, key]) && return _.get(this.$store.state.settings.db, [group, key]) &&

View file

@ -1,7 +1,7 @@
<template> <template>
<div v-if="!loading" :class="isSidebarOpen" class="form-container"> <div v-if="!loading" :class="isSidebarOpen" class="form-container">
<el-form :model="autoLinkerData" :label-position="labelPosition" :label-width="labelWidth"> <el-form :model="linkFormatterData" :label-position="labelPosition" :label-width="labelWidth">
<setting :setting-group="autoLinker" :data="autoLinkerData"/> <setting :setting-group="linkFormatter" :data="linkFormatterData"/>
</el-form> </el-form>
<div class="submit-button-container"> <div class="submit-button-container">
<el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button> <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
@ -16,17 +16,17 @@ import Setting from './Setting'
import _ from 'lodash' import _ from 'lodash'
export default { export default {
name: 'AutoLinker', name: 'LinkFormatter',
components: { Setting }, components: { Setting },
computed: { computed: {
...mapGetters([ ...mapGetters([
'settings' 'settings'
]), ]),
autoLinker() { linkFormatter() {
return this.settings.description.find(setting => setting.key === ':opts') return this.settings.description.find(setting => setting.key === 'Pleroma.Formatter')
}, },
autoLinkerData() { linkFormatterData() {
return _.get(this.settings.settings, [':auto_linker', ':opts']) || {} return _.get(this.settings.settings, [':pleroma', 'Pleroma.Formatter']) || {}
}, },
isMobile() { isMobile() {
return this.$store.state.app.device === 'mobile' return this.$store.state.app.device === 'mobile'

View file

@ -1,6 +1,5 @@
export { default as ActivityPub } from './ActivityPub' export { default as ActivityPub } from './ActivityPub'
export { default as Authentication } from './Authentication' export { default as Authentication } from './Authentication'
export { default as AutoLinker } from './AutoLinker'
export { default as Captcha } from './Captcha' export { default as Captcha } from './Captcha'
export { default as Esshd } from './Esshd' export { default as Esshd } from './Esshd'
export { default as Frontend } from './Frontend' export { default as Frontend } from './Frontend'
@ -8,6 +7,7 @@ export { default as Gopher } from './Gopher'
export { default as Http } from './Http' export { default as Http } from './Http'
export { default as Instance } from './Instance' export { default as Instance } from './Instance'
export { default as JobQueue } from './JobQueue' export { default as JobQueue } from './JobQueue'
export { default as LinkFormatter } from './LinkFormatter'
export { default as Logger } from './Logger' export { default as Logger } from './Logger'
export { default as Mailer } from './Mailer' export { default as Mailer } from './Mailer'
export { default as MediaProxy } from './MediaProxy' export { default as MediaProxy } from './MediaProxy'

View file

@ -1,69 +0,0 @@
<template>
<div>
<div v-if="setting.key === ':class' || setting.key === ':rel'" :data-search="setting.key || setting.group">
<el-switch :value="autoLinkerBooleanValue(setting.key)" @change="processTwoTypeValue($event, setting.key)"/>
<el-input v-if="autoLinkerBooleanValue(setting.key)" :value="autoLinkerStringValue(setting.key)" @input="processTwoTypeValue($event, setting.key)"/>
</div>
<div v-if="setting.key === ':truncate'" :data-search="setting.key || setting.group">
<el-switch :value="autoLinkerBooleanValue(setting.key)" @change="processTwoTypeValue($event, setting.key)"/>
<el-input-number v-if="autoLinkerBooleanValue(setting.key)" :value="autoLinkerIntegerValue(setting.key)" @input="processTwoTypeValue($event, setting.key)"/>
</div>
</div>
</template>
<script>
export default {
name: 'AutoLinkerInput',
props: {
data: {
type: [Object, Array],
default: function() {
return {}
}
},
setting: {
type: Object,
default: function() {
return {}
}
},
settingGroup: {
type: Object,
default: function() {
return {}
}
}
},
methods: {
autoLinkerBooleanValue(key) {
const value = this.data[this.setting.key]
return typeof value === 'string' || typeof value === 'number'
},
autoLinkerIntegerValue(key) {
const value = this.data[this.setting.key]
return value || 0
},
autoLinkerStringValue(key) {
const value = this.data[this.setting.key]
return value || ''
},
processTwoTypeValue(value, input) {
if (value === true) {
const data = input === ':truncate' ? 0 : ''
this.updateSetting(data, this.settingGroup.group, this.settingGroup.key, input, this.setting.type)
} else {
this.updateSetting(value, this.settingGroup.group, this.settingGroup.key, input, this.setting.type)
}
},
updateSetting(value, group, key, input, type) {
this.$store.dispatch('UpdateSettings', { group, key, input, value, type })
this.$store.dispatch('UpdateState', { group, key, input, value })
}
}
}
</script>
<style rel='stylesheet/scss' lang='scss'>
@import '../../styles/main';
@include settings
</style>

View file

@ -0,0 +1,90 @@
<template>
<div>
<div v-if="setting.type.includes('string')" :data-search="setting.key || setting.group">
<el-switch :value="autoLinkerBooleanValue" @change="processTwoTypeValue($event, setting.key)"/>
<el-input
v-if="autoLinkerBooleanValue"
:value="autoLinkerStringValue"
@input="processTwoTypeValue($event, setting.key)"/>
</div>
<div v-if="setting.type.includes('integer')" :data-search="setting.key || setting.group">
<el-switch :value="autoLinkerBooleanValue" @change="processTwoTypeValue($event, setting.key)"/>
<el-input-number
v-if="autoLinkerBooleanValue"
:value="autoLinkerIntegerValue"
@input="processTwoTypeValue($event, setting.key)"/>
</div>
<div v-if="setting.type.includes('atom')" :data-search="setting.key || setting.group">
<el-switch :value="autoLinkerBooleanValue" @change="processTwoTypeValue($event, setting.key)"/>
<el-input
v-if="autoLinkerBooleanValue"
:value="autoLinkerAtomValue"
@input="processTwoTypeValue($event, setting.key)">
<template slot="prepend">:</template>
</el-input>
</div>
</div>
</template>
<script>
export default {
name: 'LinkFormatterInput',
props: {
data: {
type: [Object, Array],
default: function() {
return {}
}
},
setting: {
type: Object,
default: function() {
return {}
}
},
settingGroup: {
type: Object,
default: function() {
return {}
}
}
},
computed: {
autoLinkerAtomValue() {
return this.data[this.setting.key] &&
this.data[this.setting.key][0] === ':' ? this.data[this.setting.key].substr(1) : this.data[this.setting.key]
},
autoLinkerBooleanValue() {
const value = this.data[this.setting.key]
return typeof value === 'string' || typeof value === 'number'
},
autoLinkerIntegerValue() {
const value = this.data[this.setting.key]
return value || 0
},
autoLinkerStringValue() {
const value = this.data[this.setting.key]
return value || ''
}
},
methods: {
processTwoTypeValue(value, input) {
if (value === true) {
const data = input === ':truncate' ? 0 : ''
this.updateSetting(data, this.settingGroup.group, this.settingGroup.key, input, this.setting.type)
} else {
this.updateSetting(value, this.settingGroup.group, this.settingGroup.key, input, this.setting.type)
}
},
updateSetting(value, group, key, input, type) {
this.$store.dispatch('UpdateSettings', { group, key, input, value, type })
this.$store.dispatch('UpdateState', { group, key, input, value })
}
}
}
</script>
<style rel='stylesheet/scss' lang='scss'>
@import '../../styles/main';
@include settings
</style>

View file

@ -1,8 +1,8 @@
export { default as AutoLinkerInput } from './AutoLinkerInput'
export { default as EditableKeywordInput } from './EditableKeywordInput' export { default as EditableKeywordInput } from './EditableKeywordInput'
export { default as CrontabInput } from './CrontabInput' export { default as CrontabInput } from './CrontabInput'
export { default as IconsInput } from './IconsInput' export { default as IconsInput } from './IconsInput'
export { default as ImageUploadInput } from './ImageUploadInput' export { default as ImageUploadInput } from './ImageUploadInput'
export { default as LinkFormatterInput } from './LinkFormatterInput'
export { default as MascotsInput } from './MascotsInput' export { default as MascotsInput } from './MascotsInput'
export { default as ProxyUrlInput } from './ProxyUrlInput' export { default as ProxyUrlInput } from './ProxyUrlInput'
export { default as PruneInput } from './PruneInput' export { default as PruneInput } from './PruneInput'

View file

@ -7,10 +7,6 @@ export const tabs = {
label: 'settings.auth', label: 'settings.auth',
settings: [':auth', ':ldap', ':oauth2', 'Pleroma.Web.Auth.Authenticator'] settings: [':auth', ':ldap', ':oauth2', 'Pleroma.Web.Auth.Authenticator']
}, },
'auto-linker': {
label: 'settings.autoLinker',
settings: [':opts']
},
'esshd': { 'esshd': {
label: 'settings.esshd', label: 'settings.esshd',
settings: [':esshd'] settings: [':esshd']
@ -39,6 +35,10 @@ export const tabs = {
label: 'settings.jobQueue', label: 'settings.jobQueue',
settings: ['Pleroma.ActivityExpiration', 'Oban', ':workers'] settings: ['Pleroma.ActivityExpiration', 'Oban', ':workers']
}, },
'link-formatter': {
label: 'settings.linkFormatter',
settings: ['Pleroma.Formatter']
},
'logger': { 'logger': {
label: 'settings.logger', label: 'settings.logger',
settings: [':console', ':ex_syslogger', ':quack', ':logger'] settings: [':console', ':ex_syslogger', ':quack', ':logger']

View file

@ -69,7 +69,7 @@
<div class="settings-search-input-container"/> <div class="settings-search-input-container"/>
<activity-pub v-if="activeTab === 'activityPub'"/> <activity-pub v-if="activeTab === 'activityPub'"/>
<authentication v-if="activeTab === 'auth'"/> <authentication v-if="activeTab === 'auth'"/>
<auto-linker v-if="activeTab === 'autoLinker'"/> <link-formatter v-if="activeTab === 'linkFormatter'"/>
<esshd v-if="activeTab === 'esshd'"/> <esshd v-if="activeTab === 'esshd'"/>
<captcha v-if="activeTab === 'captcha'"/> <captcha v-if="activeTab === 'captcha'"/>
<frontend v-if="activeTab === 'frontend'"/> <frontend v-if="activeTab === 'frontend'"/>
@ -97,7 +97,6 @@ import { tabs } from './components/tabs'
import { import {
ActivityPub, ActivityPub,
Authentication, Authentication,
AutoLinker,
Captcha, Captcha,
Esshd, Esshd,
Frontend, Frontend,
@ -105,6 +104,7 @@ import {
Http, Http,
Instance, Instance,
JobQueue, JobQueue,
LinkFormatter,
Logger, Logger,
Mailer, Mailer,
MediaProxy, MediaProxy,
@ -122,7 +122,6 @@ export default {
components: { components: {
ActivityPub, ActivityPub,
Authentication, Authentication,
AutoLinker,
Captcha, Captcha,
Esshd, Esshd,
Frontend, Frontend,
@ -130,6 +129,7 @@ export default {
Http, Http,
Instance, Instance,
JobQueue, JobQueue,
LinkFormatter,
Logger, Logger,
Mailer, Mailer,
MediaProxy, MediaProxy,
@ -147,7 +147,7 @@ export default {
options: [ options: [
{ value: 'activityPub', label: i18n.t('settings.activityPub') }, { value: 'activityPub', label: i18n.t('settings.activityPub') },
{ value: 'auth', label: i18n.t('settings.auth') }, { value: 'auth', label: i18n.t('settings.auth') },
{ value: 'autoLinker', label: i18n.t('settings.autoLinker') }, { value: 'linkFormatter', label: i18n.t('settings.linkFormatter') },
{ value: 'esshd', label: i18n.t('settings.esshd') }, { value: 'esshd', label: i18n.t('settings.esshd') },
{ value: 'captcha', label: i18n.t('settings.captcha') }, { value: 'captcha', label: i18n.t('settings.captcha') },
{ value: 'frontend', label: i18n.t('settings.frontend') }, { value: 'frontend', label: i18n.t('settings.frontend') },
@ -222,9 +222,7 @@ export default {
querySearch(queryString, cb) { querySearch(queryString, cb) {
const results = this.searchData.filter(searchObj => searchObj.search.find(el => el.includes(queryString.toLowerCase()))) const results = this.searchData.filter(searchObj => searchObj.search.find(el => el.includes(queryString.toLowerCase())))
.map(searchObj => { .map(searchObj => {
return searchObj.groupKey === ':opts' return { value: `${searchObj.label} in ${searchObj.groupLabel}`, group: searchObj.groupKey, key: searchObj.key }
? { value: `${searchObj.label} in Auto Linker`, group: searchObj.groupKey, key: searchObj.key }
: { value: `${searchObj.label} in ${searchObj.groupLabel}`, group: searchObj.groupKey, key: searchObj.key }
}) })
cb(results) cb(results)
}, },

View file

@ -1,48 +0,0 @@
import { checkPartialUpdate } from '@/store/modules/normalizers'
import _ from 'lodash'
describe('Partial update', () => {
it('partial update for settings that do not allow partial update', () => {
const settings = { ':auto_linker': { ':opts':
{ ':strip_prefix': true, ':new_window': false, ':rel': 'ugc', ':truncate': 3 }
}}
const updatedSettings = { ':auto_linker': { ':opts': { ':new_window': false }}}
const description = [{
children: [
{ key: ':strip_prefix', type: 'boolean' },
{ key: ':truncate', type: ['integer', false] },
{ key: ':new_window', type: 'boolean' }],
description: 'Configuration for the auto_linker library',
group: ':auto_linker',
key: ':opts',
label: 'Opts',
type: 'group'
}]
const expectedData = { ':auto_linker': { ':opts': {
':strip_prefix': ['boolean', true],
':new_window': ['boolean', false],
':rel': ['', 'ugc'],
':truncate': [['integer', false], 3]
}}}
const updatedData = checkPartialUpdate(settings, updatedSettings, description)
expect(_.isEqual(updatedData, expectedData)).toBeTruthy()
})
it('partial update for settings that allow partial update', () => {
const settings = { ':pleroma': { 'Pleroma.Captcha': { ':enabled': true, ':seconds_valid': 70, ':method': 'Pleroma.Captcha.Kocaptcha' }}}
const updatedSettings = { ':pleroma': { 'Pleroma.Captcha': { ':seconds_valid': ['integer', 70] }}}
const description = [{
children: [],
description: 'Captcha-related settings',
group: ':pleroma',
key: 'Pleroma.Captcha',
label: 'Pleroma.Captcha',
type: 'group'
}]
const expectedData = { ':pleroma': { 'Pleroma.Captcha': { ':seconds_valid': ['integer', 70] }}}
const updatedData = checkPartialUpdate(settings, updatedSettings, description)
expect(_.isEqual(updatedData, expectedData)).toBeTruthy()
})
})

View file

@ -58,8 +58,6 @@ describe('Settings search', () => {
wrapper.vm.handleSearchSelect({ group: ':media_proxy', key: ':ssl_options' }) wrapper.vm.handleSearchSelect({ group: ':media_proxy', key: ':ssl_options' })
expect(store.state.settings.activeTab).toBe('media-proxy') expect(store.state.settings.activeTab).toBe('media-proxy')
wrapper.vm.handleSearchSelect({ group: ':opts', key: ':opts' })
expect(store.state.settings.activeTab).toBe('auto-linker')
done() done()
}) })
}) })