From f34157b1db1141f55db0ae6b8f0276ba893f3f14 Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Fri, 10 Jul 2020 02:22:23 +0300
Subject: [PATCH] Add ability to wrap and parse nested settings in keyword
 inputs

---
 src/store/modules/normalizers.js              |  2 +-
 src/views/settings/components/Inputs.vue      |  5 ++-
 .../inputComponents/EditableKeywordInput.vue  | 32 +++++++++++++++++--
 3 files changed, 34 insertions(+), 5 deletions(-)

diff --git a/src/store/modules/normalizers.js b/src/store/modules/normalizers.js
index e4eb8816..927d3d65 100644
--- a/src/store/modules/normalizers.js
+++ b/src/store/modules/normalizers.js
@@ -93,7 +93,7 @@ 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] === ':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)}` }}]
       }, [])
diff --git a/src/views/settings/components/Inputs.vue b/src/views/settings/components/Inputs.vue
index 44ee957f..52cce435 100644
--- a/src/views/settings/components/Inputs.vue
+++ b/src/views/settings/components/Inputs.vue
@@ -96,7 +96,7 @@
         <!-- 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"/>
+        <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"/>
         <proxy-url-input v-if="setting.key === ':proxy_url'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting" :parents="settingParent"/>
@@ -254,6 +254,9 @@ export default {
       }
     },
     keywordData() {
+      if (this.settingParent.length > 0) {
+        return Array.isArray(this.data[this.setting.key]) ? this.data[this.setting.key] : []
+      }
       return Array.isArray(this.data) ? this.data : []
     },
     reducedSelects() {
diff --git a/src/views/settings/components/inputComponents/EditableKeywordInput.vue b/src/views/settings/components/inputComponents/EditableKeywordInput.vue
index 76002dd7..a364b3ce 100644
--- a/src/views/settings/components/inputComponents/EditableKeywordInput.vue
+++ b/src/views/settings/components/inputComponents/EditableKeywordInput.vue
@@ -36,6 +36,8 @@
 </template>
 
 <script>
+import { processNested } from '@/store/modules/normalizers'
+
 export default {
   name: 'EditableKeywordInput',
   props: {
@@ -45,6 +47,13 @@ export default {
         return {}
       }
     },
+    parents: {
+      type: Array,
+      default: function() {
+        return []
+      },
+      required: false
+    },
     setting: {
       type: Object,
       default: function() {
@@ -67,6 +76,12 @@ export default {
     },
     isDesktop() {
       return this.$store.state.app.device === 'desktop'
+    },
+    settings() {
+      return this.$store.state.settings.settings
+    },
+    updatedSettings() {
+      return this.$store.state.settings.updatedSettings
     }
   },
   methods: {
@@ -107,9 +122,20 @@ export default {
       this.updateSetting(updatedValue, this.settingGroup.group, this.settingGroup.key, this.setting.key, this.setting.type)
     },
     updateSetting(value, group, key, input, type) {
-      const updatedSettings = this.wrapUpdatedSettings(value, input, type)
-      this.$store.dispatch('UpdateSettings', { group, key, input, value: updatedSettings, type })
-      this.$store.dispatch('UpdateState', { group, key, input, value })
+      const wrappedSettings = this.wrapUpdatedSettings(value, input, type)
+
+      if (this.parents.length > 0) {
+        const { valueForState,
+          valueForUpdatedSettings,
+          setting } = processNested(value, wrappedSettings, group, key, this.parents.reverse(), this.settings, this.updatedSettings)
+        this.$store.dispatch('UpdateSettings',
+          { group, key, input: setting.key, value: valueForUpdatedSettings, type: setting.type })
+        this.$store.dispatch('UpdateState',
+          { group, key, input: setting.key, value: valueForState })
+      } else {
+        this.$store.dispatch('UpdateSettings', { group, key, input, value: wrappedSettings, type })
+        this.$store.dispatch('UpdateState', { group, key, input, value })
+      }
     },
     wrapUpdatedSettings(value, input, type) {
       return type === 'map'