From 62e7ea5b2b85d4185c14a2b6f05ed7e296056780 Mon Sep 17 00:00:00 2001
From: NGPixel <github@ngpixel.com>
Date: Fri, 26 May 2017 18:30:40 -0400
Subject: [PATCH] refactor: modal-create-page - vue component

---
 client/js/components/modal-create-page.vue   | 17 ++++++++---------
 client/js/store/modules/modal-create-page.js |  7 ++-----
 2 files changed, 10 insertions(+), 14 deletions(-)

diff --git a/client/js/components/modal-create-page.vue b/client/js/components/modal-create-page.vue
index 889b2645..d25a40b9 100644
--- a/client/js/components/modal-create-page.vue
+++ b/client/js/components/modal-create-page.vue
@@ -7,7 +7,7 @@
         section
           label.label Enter the new document path:
           p.control.is-fullwidth(v-bind:class='{ "is-loading": isLoading }')
-            input.input(type='text', placeholder='page-name', v-model='entrypath', ref='createPageInput', @keyup.enter='create', @keyup.esc='cancel')
+            input.input(type='text', placeholder='page-name', v-model='userPath', ref='createPageInput', @keyup.enter='create', @keyup.esc='cancel')
             span.help.is-danger(v-show='isInvalid') This document path is invalid!
         footer
           a.button.is-grey.is-outlined(v-on:click='cancel') Discard
@@ -21,25 +21,25 @@
     data () {
       return {
         currentPath: '',
-        isLoading: false
+        userPath: '',
+        isLoading: false,
+        isInvalid: false
       }
     },
     computed: {
-      entrypath () { return this.$store.state.modalCreatePage.entrypath }
       isShown () {
         if(this.$store.state.modalCreatePage.shown) {
           this.makeSelection()
         }
         return this.$store.state.modalCreatePage.shown
       }
-      isInvalid () { return this.$store.state.modalCreatePage.invalid }
     },
     methods: {
       makeSelection: function () {
         let self = this;
         self._.delay(() => {
           let startPos = (self.currentPath.length > 0) ? self.currentPath.length + 1 : 0
-          self.$helpers.form.setInputSelection(self.$refs.createPageInput, startPos, self.entrypath.length)
+          self.$helpers.form.setInputSelection(self.$refs.createPageInput, startPos, self.userPath.length)
         }, 100)
       },
       cancel: function () {
@@ -47,9 +47,9 @@
       },
       create: function () {
         this.isInvalid = false
-        let newDocPath = this.$helpers.pages.makeSafePath(this.entrypath)
+        let newDocPath = this.$helpers.pages.makeSafePath(this.userPath)
         if (this._.isEmpty(newDocPath)) {
-          this.$store.createPage.commit('')
+          this.isInvalid = true
         } else {
           this.isLoading = true
           window.location.assign('/create/' + newDocPath)
@@ -58,8 +58,7 @@
     },
     mounted () {
       this.currentPath = (this.basepath === 'home') ? '' : this.basepath
-      let newPage = (this._.isEmpty(this.currentPath)) ? 'new-page' : this.currentPath + '/new-page'
-      this.$store.commit('modalCreatePage/pathChange', newPage)
+      this.userPath = (this._.isEmpty(this.currentPath)) ? 'new-page' : this.currentPath + '/new-page'
     }
   }
 </script>
diff --git a/client/js/store/modules/modal-create-page.js b/client/js/store/modules/modal-create-page.js
index 31733d5b..5b1d08c9 100644
--- a/client/js/store/modules/modal-create-page.js
+++ b/client/js/store/modules/modal-create-page.js
@@ -3,14 +3,11 @@
 export default {
   namespaced: true,
   state: {
-    entrypath: '',
-    shown: false,
-    invalid: false
+    shown: false
   },
   getters: {},
   mutations: {
-    shownChange: (state, shownState) => { state.shown = shownState },
-    pathChange: (state, newpath) => { state.entrypath = newpath }
+    shownChange: (state, shownState) => { state.shown = shownState }
   },
   actions: {
     open({ commit }) { commit('shownChange', true) },