feat: user edit UI + admin UI improvements + fixes

client/components/common/nav-header.vue

@@ -128,7 +128,7 @@
             v-list-tile-action: v-icon(color='grey') person_add
             v-list-tile-title Register
 
-    page-selector(mode='create', v-model='newPageModal')
+    page-selector(mode='create', v-model='newPageModal', :open-handler='pageNewCreate')
 </template>
 
 <script>
@@ -208,6 +208,9 @@ export default {
     pageNew () {
       this.newPageModal = true
     },
+    pageNewCreate ({ path, locale }) {
+      window.location.assign(`/e/${path}`)
+    },
     pageView () {
       window.location.assign(`/${this.path}`)
     },

client/components/common/page-selector.vue

@@ -50,13 +50,23 @@
             v-list-tile
               v-list-tile-avatar: v-icon insert_drive_file
               v-list-tile-title File D
-      v-card-text.grey.pa-2(:class='darkMode ? `darken-3-d5` : `lighten-1`')
+      v-card-actions.grey.pa-2(:class='darkMode ? `darken-3-d5` : `lighten-1`')
+        v-select(
+          solo
+          dark
+          background-color='grey darken-3-d2'
+          hide-details
+          single-line
+          :items='namespaces'
+          style='flex: 0 0 100px;'
+          v-model='currentLocale'
+          )
         v-text-field(
           solo
           hide-details
-          v-model='location'
+          prefix='/'
+          v-model='currentPath'
           flat
-          prepend-inner-icon='subdirectory_arrow_right'
           clearable
         )
       v-card-chin
@@ -76,17 +86,31 @@ export default {
       type: Boolean,
       default: false
     },
+    path: {
+      type: String,
+      default: 'new-page'
+    },
+    locale: {
+      type: String,
+      default: 'en'
+    },
     mode: {
       type: String,
       default: 'create'
+    },
+    openHandler: {
+      type: Function,
+      default: () => {}
     }
   },
   data() {
     return {
       searchLoading: false,
-      location: '/new-page',
+      currentLocale: 'en',
+      currentPath: 'new-page',
       tree: [],
-      treeChildren: []
+      treeChildren: [],
+      namespaces: ['en']
     }
   },
   computed: {
@@ -105,13 +129,25 @@ export default {
       ]
     }
   },
+  watch: {
+    isShown(newValue, oldValue) {
+      if (newValue && !oldValue) {
+        this.currentPath = this.path
+        this.currentLocale = this.locale
+      }
+    }
+  },
   methods: {
     close() {
       this.isShown = false
     },
     open() {
-      if (this.mode === 'create') {
-        window.location.assign(`/e${this.location}`)
+      const exit = this.openHandler({
+        locale: this.currentLocale,
+        path: this.currentPath
+      })
+      if (exit !== false) {
+        this.close()
       }
     },
     async fetchFolders(item) {

client/components/common/v-card-chin.vue

@@ -1,7 +1,7 @@
 <template lang='pug'>
   div
     v-divider.my-0
-    v-card-actions(:class='dark ? "" : "grey lighten-4"')
+    v-card-actions(:class='dark ? "grey darken-4-l5" : "grey lighten-4"')
       slot
 </template>