Add ability to wrap and parse nested settings in keyword inputs

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)}` }}]
       }, [])

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() {

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)
+      const wrappedSettings = this.wrapUpdatedSettings(value, input, type)
-      this.$store.dispatch('UpdateSettings', { group, key, input, value: updatedSettings, type })
+
-      this.$store.dispatch('UpdateState', { group, key, input, value })
+      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'