Unify rendering :replace settings as keyword with strings

src/views/settings/components/Inputs.vue

@@ -283,8 +283,7 @@ export default {
   },
   methods: {
     editableKeyword(key, type) {
-      return key === ':replace' ||
+      return type === 'map' ||
-        type === 'map' ||
         (Array.isArray(type) && type.includes('keyword') && type.includes('integer')) ||
         (Array.isArray(type) && type.includes('keyword') && type.includes('string')) ||
         (Array.isArray(type) && type.includes('keyword') && type.findIndex(el => el.includes('list') && el.includes('string')) !== -1)
@@ -334,7 +333,7 @@ export default {
         type.includes('module') ||
         (type.includes('list') && type.includes('string')) ||
         (type.includes('list') && type.includes('atom')) ||
-        (type.includes('regex') && type.includes('string'))
+        (!type.includes('keyword') && type.includes('regex') && type.includes('string'))
       )
     },
     renderSingleSelect(type) {

src/views/settings/components/Setting.vue

@@ -121,8 +121,7 @@ export default {
     compound({ type, key, children }) {
       return type === 'keyword' ||
         type === 'map' ||
-        type.includes('keyword') ||
+        type.includes('keyword')
-        key === ':replace'
     },
     divideSetting(key) {
       return [':sslopts', ':tlsopts', ':adapter', ':poll_limits', ':queues', ':styling', ':invalidation', ':multi_factor_authentication'].includes(key)

src/views/settings/components/inputComponents/EditableKeywordInput.vue

@@ -1,14 +1,6 @@
 <template>
   <div class="editable-keyword-container">
-    <div v-if="setting.key === ':replace'" :data-search="setting.key || setting.group">
+    <div v-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="pattern" class="name-input" @input="parseEditableKeyword($event, 'key', element)"/> :
-        <el-input :value="getValue(element)" placeholder="replacement" class="value-input" @input="parseEditableKeyword($event, 'value', element)"/>
-        <el-button :size="isDesktop ? 'medium' : 'mini'" class="icon-minus-button" icon="el-icon-minus" circle @click="deleteEditableKeywordRow(element)"/>
-      </div>
-      <el-button :size="isDesktop ? 'medium' : 'mini'" icon="el-icon-plus" circle @click="addRowToEditableKeyword"/>
-    </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)"/>
@@ -16,10 +8,10 @@
       </div>
       <el-button :size="isDesktop ? 'medium' : 'mini'" icon="el-icon-plus" circle @click="addRowToEditableKeyword"/>
     </div>
-    <div v-if="editableKeywordWithString" :data-search="setting.key || setting.group">
+    <div v-else-if="editableKeywordWithString" :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 :value="getKey(element)" :placeholder="keyPlaceholder" class="name-input" @input="parseEditableKeyword($event, 'key', element)"/> :
-        <el-input :value="getValue(element)" placeholder="value" class="value-input" @input="parseEditableKeyword($event, 'value', element)"/>
+        <el-input :value="getValue(element)" :placeholder="valuePlaceholder" class="value-input" @input="parseEditableKeyword($event, 'value', element)"/>
         <el-button :size="isDesktop ? 'medium' : 'mini'" class="icon-minus-button" icon="el-icon-minus" circle @click="deleteEditableKeywordRow(element)"/>
       </div>
       <el-button :size="isDesktop ? 'medium' : 'mini'" icon="el-icon-plus" circle @click="addRowToEditableKeyword"/>
@@ -77,11 +69,17 @@ export default {
     isDesktop() {
       return this.$store.state.app.device === 'desktop'
     },
+    keyPlaceholder() {
+      return this.setting.key === ':replace' ? 'pattern' : 'key'
+    },
     settings() {
       return this.$store.state.settings.settings
     },
     updatedSettings() {
       return this.$store.state.settings.updatedSettings
+    },
+    valuePlaceholder() {
+      return this.setting.key === ':replace' ? 'replacement' : 'value'
     }
   },
   methods: {