From 6577376642bb9f109fa6c31f5dcd779de10059e5 Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Sat, 11 Jul 2020 19:42:38 +0300
Subject: [PATCH] Move rendering Crontab settings to Editable keywords after
updating its type
---
src/store/modules/normalizers.js | 18 ++--
src/views/settings/components/Inputs.vue | 3 -
.../inputComponents/CrontabInput.vue | 86 -------------------
.../inputComponents/EditableKeywordInput.vue | 39 ++++++++-
.../components/inputComponents/index.js | 1 -
5 files changed, 47 insertions(+), 100 deletions(-)
delete mode 100644 src/views/settings/components/inputComponents/CrontabInput.vue
diff --git a/src/store/modules/normalizers.js b/src/store/modules/normalizers.js
index 927d3d65..2fec92ab 100644
--- a/src/store/modules/normalizers.js
+++ b/src/store/modules/normalizers.js
@@ -93,14 +93,16 @@ export const parseTuples = (tuples, key) => {
return [...acc, { [mascot.tuple[0]]: { ...mascot.tuple[1], id: `f${(~~(Math.random() * 1e8)).toString(16)}` }}]
}, [])
} else if (Array.isArray(item.tuple[1]) &&
- (item.tuple[0] === ':groups' || item.tuple[0] === ':replace' || item.tuple[0] === ':retries' || item.tuple[0] === ':headers' || item.tuple[0] === ':params')) {
- accum[item.tuple[0]] = item.tuple[1].reduce((acc, group) => {
- return [...acc, { [group.tuple[0]]: { value: group.tuple[1], id: `f${(~~(Math.random() * 1e8)).toString(16)}` }}]
- }, [])
- } else if (item.tuple[0] === ':crontab') {
- accum[item.tuple[0]] = item.tuple[1].reduce((acc, group) => {
- return { ...acc, [group.tuple[1]]: group.tuple[0] }
- }, {})
+ (item.tuple[0] === ':groups' || item.tuple[0] === ':replace' || item.tuple[0] === ':retries' || item.tuple[0] === ':headers' || item.tuple[0] === ':params' || item.tuple[0] === ':crontab')) {
+ if (item.tuple[0] === ':crontab') {
+ accum[item.tuple[0]] = item.tuple[1].reduce((acc, group) => {
+ return [...acc, { [group.tuple[1]]: { value: group.tuple[0], id: `f${(~~(Math.random() * 1e8)).toString(16)}` }}]
+ }, [])
+ } else {
+ accum[item.tuple[0]] = item.tuple[1].reduce((acc, group) => {
+ return [...acc, { [group.tuple[0]]: { value: group.tuple[1], id: `f${(~~(Math.random() * 1e8)).toString(16)}` }}]
+ }, [])
+ }
} else if (item.tuple[0] === ':match_actor') {
accum[item.tuple[0]] = Object.keys(item.tuple[1]).reduce((acc, regex) => {
return [...acc, { [regex]: { value: item.tuple[1][regex], id: `f${(~~(Math.random() * 1e8)).toString(16)}` }}]
diff --git a/src/views/settings/components/Inputs.vue b/src/views/settings/components/Inputs.vue
index ef4bf246..0ba74f55 100644
--- a/src/views/settings/components/Inputs.vue
+++ b/src/views/settings/components/Inputs.vue
@@ -95,7 +95,6 @@
</el-input>
<!-- 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"/>
<editable-keyword-input v-if="editableKeyword(setting.key, setting.type)" :data="keywordData" :setting-group="settingGroup" :setting="setting" :parents="settingParent"/>
<icons-input v-if="setting.key === ':icons'" :data="iconsData" :setting-group="settingGroup" :setting="setting"/>
<mascots-input v-if="setting.key === ':mascots'" :data="keywordData" :setting-group="settingGroup" :setting="setting"/>
@@ -122,7 +121,6 @@
import i18n from '@/lang'
import {
AutoLinkerInput,
- CrontabInput,
EditableKeywordInput,
IconsInput,
MascotsInput,
@@ -140,7 +138,6 @@ export default {
name: 'Inputs',
components: {
AutoLinkerInput,
- CrontabInput,
EditableKeywordInput,
IconsInput,
MascotsInput,
diff --git a/src/views/settings/components/inputComponents/CrontabInput.vue b/src/views/settings/components/inputComponents/CrontabInput.vue
deleted file mode 100644
index 89a14915..00000000
--- a/src/views/settings/components/inputComponents/CrontabInput.vue
+++ /dev/null
@@ -1,86 +0,0 @@
-<template>
- <el-form :label-width="labelWidth" :label-position="isMobile ? 'top' : 'right'" class="crontab">
- <el-form-item v-for="worker in workers" :key="worker" :label="worker" :data-search="setting.key" class="crontab-container">
- <el-input
- :value="data[worker]"
- :placeholder="getSuggestion(worker) || null"
- class="input setting-input"
- @input="update($event, worker)"/>
- </el-form-item>
- </el-form>
-</template>
-
-<script>
-export default {
- name: 'CrontabInput',
- props: {
- data: {
- type: Object,
- default: function() {
- return {}
- }
- },
- setting: {
- type: Object,
- default: function() {
- return {}
- }
- },
- settingGroup: {
- type: Object,
- default: function() {
- return {}
- }
- }
- },
- computed: {
- isDesktop() {
- return this.$store.state.app.device === 'desktop'
- },
- isMobile() {
- return this.$store.state.app.device === 'mobile'
- },
- isTablet() {
- return this.$store.state.app.device === 'tablet'
- },
- labelWidth() {
- if (this.isMobile) {
- return '100%'
- } else {
- return '380px'
- }
- },
- workers() {
- return this.setting.suggestions.map(worker => worker[1])
- }
- },
- methods: {
- getSuggestion(worker) {
- return this.setting.suggestions.find(suggestion => suggestion[1] === worker)[0]
- },
- update(value, worker) {
- const currentValue = this.$store.state.settings.settings[this.settingGroup.group][this.settingGroup.key][this.setting.key]
- const updatedValue = { ...currentValue, [worker]: value }
- const updatedValueWithType = Object.keys(currentValue).reduce((acc, key) => {
- if (key === worker) {
- return { ...acc, [key]: ['reversed_tuple', value] }
- } else {
- return { ...acc, [key]: ['reversed_tuple', currentValue[key]] }
- }
- }, {})
-
- this.$store.dispatch('UpdateSettings',
- { group: this.settingGroup.group, key: this.settingGroup.key, input: this.setting.key, value: updatedValueWithType, type: this.setting.type }
- )
- this.$store.dispatch('UpdateState',
- { group: this.settingGroup.group, key: this.settingGroup.key, input: this.setting.key, value: updatedValue }
- )
- }
- }
-}
-</script>
-
-<style rel='stylesheet/scss' lang='scss'>
-@import '../../styles/main';
-@include settings
-</style>
diff --git a/src/views/settings/components/inputComponents/EditableKeywordInput.vue b/src/views/settings/components/inputComponents/EditableKeywordInput.vue
index ff641756..6939547a 100644
--- a/src/views/settings/components/inputComponents/EditableKeywordInput.vue
+++ b/src/views/settings/components/inputComponents/EditableKeywordInput.vue
@@ -1,6 +1,15 @@
<template>
<div class="editable-keyword-container">
- <div v-if="editableKeywordWithInteger" :data-search="setting.key || setting.group">
+ <div v-if="setting.key === ':crontab'" :data-search="setting.key" class="crontab">
+ <el-form-item v-for="worker in data" :key="getId(worker)" :label="getCrontabWorkerLabel(worker)" class="crontab-container">
+ <el-input
+ :value="getValue(worker)"
+ :placeholder="getSuggestion(worker) || null"
+ class="input setting-input"
+ @input="updateCrontab($event, 'value', worker)"/>
+ </el-form-item>
+ </div>
+ <div v-else-if="editableKeywordWithInteger" :data-search="setting.key || setting.group">
<div v-for="element in data" :key="getId(element)" class="setting-input">
<el-input :value="getKey(element)" placeholder="key" class="name-input" @input="parseEditableKeyword($event, 'key', element)"/> :
<el-input-number :value="getValue(element)" :min="0" size="large" class="value-input" @change="parseEditableKeyword($event, 'value', element)"/>
@@ -64,7 +73,7 @@ export default {
return Array.isArray(this.setting.type) && this.setting.type.includes('keyword') && this.setting.type.includes('integer')
},
editableKeywordWithString() {
- return Array.isArray(this.setting.type) && (
+ return Array.isArray(this.setting.type) && this.setting.key !== ':crontab' && (
(this.setting.type.includes('keyword') && this.setting.type.includes('string')) ||
(this.setting.type.includes('tuple') && this.setting.type.includes('list'))
)
@@ -98,6 +107,10 @@ export default {
generateID() {
return `f${(~~(Math.random() * 1e8)).toString(16)}`
},
+ getCrontabWorkerLabel(worker) {
+ const workerKey = this.getKey(worker)
+ return workerKey.includes('Pleroma.Workers.Cron.') ? workerKey.replace('Pleroma.Workers.Cron.', '') : workerKey
+ },
getKey(element) {
return Object.keys(element)[0]
},
@@ -105,6 +118,9 @@ export default {
const { id } = Object.values(element)[0]
return id
},
+ getSuggestion(worker) {
+ return this.setting.suggestions.find(suggestion => suggestion[1] === this.getKey(worker))[0]
+ },
getValue(element) {
const { value } = Object.values(element)[0]
return value
@@ -122,6 +138,25 @@ export default {
this.updateSetting(updatedValue, this.settingGroup.group, this.settingGroup.key, this.setting.key, this.setting.type)
},
+ updateCrontab(value, inputType, worker) {
+ const updatedId = this.getId(worker)
+ const updatedValue = this.data.map((worker, index) => {
+ if (Object.values(worker)[0].id === updatedId) {
+ return { [Object.keys(worker)[0]]: { ...Object.values(this.data[index])[0], value }}
+ }
+ return worker
+ })
+ const updatedValueWithType = updatedValue.reduce((acc, worker) => {
+ return { ...acc, [Object.keys(worker)[0]]: ['reversed_tuple', Object.values(worker)[0].value] }
+ }, {})
+
+ this.$store.dispatch('UpdateSettings',
+ { group: this.settingGroup.group, key: this.settingGroup.key, input: this.setting.key, value: updatedValueWithType, type: this.setting.type }
+ )
+ this.$store.dispatch('UpdateState',
+ { group: this.settingGroup.group, key: this.settingGroup.key, input: this.setting.key, value: updatedValue }
+ )
+ },
updateSetting(value, group, key, input, type) {
const wrappedSettings = this.wrapUpdatedSettings(value, input, type)
diff --git a/src/views/settings/components/inputComponents/index.js b/src/views/settings/components/inputComponents/index.js
index 3b9bc788..d95ebd05 100644
--- a/src/views/settings/components/inputComponents/index.js
+++ b/src/views/settings/components/inputComponents/index.js
@@ -1,6 +1,5 @@
export { default as AutoLinkerInput } from './AutoLinkerInput'
export { default as EditableKeywordInput } from './EditableKeywordInput'
-export { default as CrontabInput } from './CrontabInput'
export { default as IconsInput } from './IconsInput'
export { default as MascotsInput } from './MascotsInput'
export { default as ProxyUrlInput } from './ProxyUrlInput'
--
GitLab