refactor: split 'components/collections/addFolder.vue' to 'addFolder', 'editFolder'

components/collections/editFolder.vue

@@ -0,0 +1,70 @@
+<template>
+    <modal v-if="show" @close="show = false">
+        <div slot="header">
+            <ul>
+            <li>
+              <div class="flex-wrap">
+                <h3 class="title">Edit Folder</h3>
+                <div>
+                  <button class="icon" @click="hideModal">
+                  <i class="material-icons">close</i>
+                  </button>
+                </div>
+              </div>
+            </li>
+            </ul>
+        </div>
+        <div slot="body">
+            <ul>
+            <li>
+                <input type="text" v-model="name" v-bind:placeholder="folder.name" />
+            </li>
+            </ul>
+        </div>
+        <div slot="footer">
+          <ul>
+            <li>
+            <button class="icon" @click="editFolder">
+              <i class="material-icons">add</i>
+              <span>Save</span>
+            </button>
+            </li>
+          </ul>
+        </div>
+    </modal>
+</template>
+
+<script>
+import modal from "../../components/modal";
+
+export default {
+    props: {
+        show            : Boolean,
+        collection      : Object,
+        collectionIndex : Number,
+        folder          : Object,
+        folderIndex     : Number,
+    },
+    components: {
+        modal,
+    },
+    data() {
+        return {
+            name: undefined,
+        }
+    },
+    methods: {
+        editFolder() {
+            this.$store.commit('postwoman/editFolder', {
+              collectionIndex : this.$props.collectionIndex,
+              folder          : { ...this.$props.folder, name: this.$data.name },
+              folderIndex     : this.$props.folderIndex,
+            })
+            this.hideModal()
+        },
+        hideModal() {
+            this.$emit('hide-modal')
+        },
+    },
+};
+</script>