From bc4f8250bb19131f65eefb1f73d16761fc9d84df Mon Sep 17 00:00:00 2001
From: Milos Stojanovic <alcalbg@gmail.com>
Date: Tue, 25 Jun 2019 18:47:58 +0200
Subject: [PATCH] vue linter

---
 .eslintrc.js                           |   5 +-
 .travis.yml                            |   2 +
 frontend/App.vue                       |   8 +-
 frontend/views/Browser.vue             | 227 ++++++++++++-------------
 frontend/views/Login.vue               |  10 +-
 frontend/views/Users.vue               |  73 ++++----
 frontend/views/partials/Menu.vue       |  19 +--
 frontend/views/partials/Pagination.vue |  20 ++-
 frontend/views/partials/Profile.vue    |  16 +-
 frontend/views/partials/Tree.vue       |  10 +-
 frontend/views/partials/TreeNode.vue   |  14 +-
 frontend/views/partials/Upload.vue     |  28 +--
 frontend/views/partials/UserEdit.vue   |  36 ++--
 13 files changed, 243 insertions(+), 225 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 7e5241d..1a3f86b 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,12 +1,13 @@
 module.exports = {
   extends: [
     // add more generic rulesets here, such as:
+    'eslint:recommended',
     'plugin:vue/recommended'
   ],
   rules: {
     // override/add rules settings here, such as:
-    'vue/no-unused-vars': 'error',
+    'no-unused-vars': 'error',
     'vue/require-prop-types': 0,
-    'vue/require-default-prop': 0
+    'vue/max-attributes-per-line': 10
   }
 }
diff --git a/.travis.yml b/.travis.yml
index 43c20ef..f867e1d 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -9,9 +9,11 @@ before_script:
   - cp configuration_sample.php configuration.php
   - composer self-update
   - composer install --no-interaction
+  - npm install
 
 script:
   - vendor/bin/phpunit --coverage-clover=coverage.xml
+  - npm run lint
 
 after_success:
   - bash <(curl -s https://codecov.io/bash)
diff --git a/frontend/App.vue b/frontend/App.vue
index 3790eb2..7bf127a 100644
--- a/frontend/App.vue
+++ b/frontend/App.vue
@@ -1,8 +1,8 @@
 <template>
-  <div id="wrapper" v-if="$store.state.initialized">
-    <Login v-if="is('guest') && ! can('write') && ! can('read') && ! can('upload')"/>
-    <div id="inner" v-else>
-      <router-view/>
+  <div v-if="$store.state.initialized" id="wrapper">
+    <Login v-if="is('guest') && ! can('write') && ! can('read') && ! can('upload')" />
+    <div v-else id="inner">
+      <router-view />
     </div>
   </div>
 </template>
diff --git a/frontend/views/Browser.vue b/frontend/views/Browser.vue
index 6c1357a..ae3dd5e 100644
--- a/frontend/views/Browser.vue
+++ b/frontend/views/Browser.vue
@@ -1,23 +1,21 @@
 <template>
   <div id="dropzone" class="container"
-                     @dragover="dropZone = can('upload') && ! isLoading ? true : false"
-                     @dragleave="dropZone = false"
-                     @drop="dropZone = false">
+       @dragover="dropZone = can('upload') && ! isLoading ? true : false"
+       @dragleave="dropZone = false"
+       @drop="dropZone = false"
+  >
+    <div v-if="isLoading" id="loading" />
 
-    <div id="loading" v-if="isLoading"></div>
+    <Upload v-if="can('upload')" v-show="dropZone == false" :files="files" :drop-zone="dropZone" />
 
-    <Upload v-if="can('upload')" v-show="dropZone == false" :files="files" :dropZone="dropZone"></Upload>
-
-    <b-upload v-if="dropZone && ! isLoading" @input="files = $event" multiple drag-drop>
+    <b-upload v-if="dropZone && ! isLoading" multiple drag-drop @input="files = $event">
       <b class="drop-info">{{ lang('Drop files to upload') }}</b>
     </b-upload>
 
-    <div class="container" v-if="!dropZone">
-
-      <Menu></Menu>
+    <div v-if="!dropZone" class="container">
+      <Menu />
 
       <div id="browser">
-
         <div v-if="can('read')" class="is-flex is-justify-between">
           <div class="breadcrumb" aria-label="breadcrumbs">
             <ul>
@@ -28,7 +26,7 @@
           </div>
           <div>
             <a class="is-paddingless" @click="selectDir">
-              <b-icon icon="sitemap" class="is-marginless" size="is-small"></b-icon>
+              <b-icon icon="sitemap" class="is-marginless" size="is-small" />
             </a>
           </div>
         </div>
@@ -36,45 +34,45 @@
         <section class="actions is-flex is-justify-between">
           <div>
             <b-field v-if="can('upload') && ! checked.length" class="file is-inline-block">
-              <b-upload @input="files = $event" multiple native>
+              <b-upload multiple native @input="files = $event">
                 <a v-if="! checked.length" class="is-inline-block">
-                  <b-icon icon="upload" size="is-small"></b-icon> {{ lang('Add files') }}
+                  <b-icon icon="upload" size="is-small" /> {{ lang('Add files') }}
                 </a>
               </b-upload>
             </b-field>
             <a v-if="can(['read', 'write']) && ! checked.length" class="is-inline-block">
               <b-dropdown aria-role="list" :disabled="checked.length > 0">
                 <span slot="trigger">
-                  <b-icon icon="plus" size="is-small"></b-icon> {{ lang('New') }}
+                  <b-icon icon="plus" size="is-small" /> {{ lang('New') }}
                 </span>
 
-                <b-dropdown-item @click="create('dir')" aria-role="listitem">
-                  <b-icon icon="folder" size="is-small"></b-icon> {{ lang('Folder') }}
+                <b-dropdown-item aria-role="listitem" @click="create('dir')">
+                  <b-icon icon="folder" size="is-small" /> {{ lang('Folder') }}
                 </b-dropdown-item>
-                <b-dropdown-item @click="create('file')" aria-role="listitem">
-                  <b-icon icon="file" size="is-small"></b-icon> {{ lang('File') }}
+                <b-dropdown-item aria-role="listitem" @click="create('file')">
+                  <b-icon icon="file" size="is-small" /> {{ lang('File') }}
                 </b-dropdown-item>
 
               </b-dropdown>
             </a>
-            <a v-if="can('batchdownload') && checked.length" @click="batchDownload" class="is-inline-block">
-              <b-icon icon="download" size="is-small"></b-icon> {{ lang('Download') }}
+            <a v-if="can('batchdownload') && checked.length" class="is-inline-block" @click="batchDownload">
+              <b-icon icon="download" size="is-small" /> {{ lang('Download') }}
             </a>
-            <a v-if="can('write') && checked.length" @click="copy" class="is-inline-block">
-              <b-icon icon="copy" size="is-small"></b-icon> {{ lang('Copy') }}
+            <a v-if="can('write') && checked.length" class="is-inline-block" @click="copy">
+              <b-icon icon="copy" size="is-small" /> {{ lang('Copy') }}
             </a>
-            <a v-if="can('write') && checked.length" @click="move" class="is-inline-block">
-              <b-icon icon="external-link-square-alt" size="is-small"></b-icon> {{ lang('Move') }}
+            <a v-if="can('write') && checked.length" class="is-inline-block" @click="move">
+              <b-icon icon="external-link-square-alt" size="is-small" /> {{ lang('Move') }}
             </a>
-            <a v-if="can(['write', 'zip']) && checked.length" @click="zip" class="is-inline-block">
-              <b-icon icon="file-archive" size="is-small"></b-icon> {{ lang('Zip') }}
+            <a v-if="can(['write', 'zip']) && checked.length" class="is-inline-block" @click="zip">
+              <b-icon icon="file-archive" size="is-small" /> {{ lang('Zip') }}
             </a>
-            <a v-if="can('write') && checked.length" @click="remove" class="is-inline-block">
-              <b-icon icon="trash-alt" size="is-small"></b-icon> {{ lang('Delete') }}
+            <a v-if="can('write') && checked.length" class="is-inline-block" @click="remove">
+              <b-icon icon="trash-alt" size="is-small" /> {{ lang('Delete') }}
             </a>
           </div>
           <div v-if="can('read')">
-            <Pagination :perpage="perPage" @selected="perPage = $event"></Pagination>
+            <Pagination :perpage="perPage" @selected="perPage = $event" />
           </div>
         </section>
 
@@ -89,65 +87,61 @@
                  :row-class="(row) => 'file-row type-'+row.type"
                  :checked-rows.sync="checked"
                  :loading="isLoading"
-                 checkable>
-                 <template slot-scope="props">
+                 checkable
+        >
+          <template slot-scope="props">
+            <b-table-column field="data.name" :label="lang('Name')" :custom-sort="sortByName" sortable>
+              <a class="is-block name" @click="itemClick(props.row)">
+                {{ props.row.name }}
+              </a>
+            </b-table-column>
 
-                   <b-table-column field="data.name" :label="lang('Name')" :custom-sort="sortByName" sortable>
-                     <a @click="itemClick(props.row)" class="is-block name">
-                       {{ props.row.name }}
-                     </a>
-                   </b-table-column>
+            <b-table-column field="data.size" :label="lang('Size')" :custom-sort="sortBySize" sortable numeric width="150">
+              {{ props.row.type == 'back' || props.row.type == 'dir' ? lang('Folder') : formatBytes(props.row.size) }}
+            </b-table-column>
 
-                   <b-table-column field="data.size" :label="lang('Size')" :custom-sort="sortBySize" sortable numeric width="150">
-                     {{ props.row.type == 'back' || props.row.type == 'dir' ? lang('Folder') : formatBytes(props.row.size) }}
-                   </b-table-column>
+            <b-table-column field="data.time" :label="lang('Time')" :custom-sort="sortByTime" sortable numeric width="200">
+              {{ props.row.time ? formatDate(props.row.time) : '' }}
+            </b-table-column>
 
-                   <b-table-column field="data.time" :label="lang('Time')" :custom-sort="sortByTime" sortable numeric width="200">
-                     {{ props.row.time ? formatDate(props.row.time) : '' }}
-                   </b-table-column>
+            <b-table-column class="action-padding" width="51">
+              <b-dropdown v-if="props.row.type != 'back'" aria-role="list" position="is-bottom-left" :disabled="checked.length > 0">
+                <button slot="trigger" class="button is-small">
+                  <b-icon icon="ellipsis-h" size="is-small" />
+                </button>
 
-                   <b-table-column class="action-padding" width="51">
-                     <b-dropdown v-if="props.row.type != 'back'" aria-role="list" position="is-bottom-left" :disabled="checked.length > 0">
-                       <button class="button is-small" slot="trigger">
-                         <b-icon icon="ellipsis-h" size="is-small"></b-icon>
-                       </button>
-
-                       <b-dropdown-item v-if="props.row.type == 'file' && can('download')" @click="download(props.row)" aria-role="listitem">
-                         <b-icon icon="download" size="is-small"></b-icon> {{ lang('Download') }}
-                       </b-dropdown-item>
-                       <b-dropdown-item v-if="can('write')" @click="copy($event, props.row)" aria-role="listitem">
-                         <b-icon icon="copy" size="is-small"></b-icon> {{ lang('Copy') }}
-                       </b-dropdown-item>
-                       <b-dropdown-item v-if="can('write')" @click="move($event, props.row)" aria-role="listitem">
-                         <b-icon icon="external-link-square-alt" size="is-small"></b-icon> {{ lang('Move') }}
-                       </b-dropdown-item>
-                       <b-dropdown-item v-if="can('write')" @click="rename($event, props.row)" aria-role="listitem">
-                         <b-icon icon="file-signature" size="is-small"></b-icon> {{ lang('Rename') }}
-                       </b-dropdown-item>
-                       <b-dropdown-item v-if="can(['write', 'zip']) && isArchive(props.row)" @click="unzip($event, props.row)" aria-role="listitem">
-                         <b-icon icon="file-archive" size="is-small"></b-icon> {{ lang('Unzip') }}
-                       </b-dropdown-item>
-                       <b-dropdown-item v-if="can(['write', 'zip']) && ! isArchive(props.row)" @click="zip($event, props.row)" aria-role="listitem">
-                         <b-icon icon="file-archive" size="is-small"></b-icon> {{ lang('Zip') }}
-                       </b-dropdown-item>
-                       <b-dropdown-item v-if="can('write')" @click="remove($event, props.row)" aria-role="listitem">
-                         <b-icon icon="trash-alt" size="is-small"></b-icon> {{ lang('Delete') }}
-                       </b-dropdown-item>
-                       <b-dropdown-item v-if="props.row.type == 'file' && can('download')" v-clipboard:copy="getDownloadLink(props.row)" aria-role="listitem">
-                         <b-icon icon="clipboard" size="is-small"></b-icon> {{ lang('Copy link') }}
-                       </b-dropdown-item>
-
-                     </b-dropdown>
-                   </b-table-column>
-
-                 </template>
-
-                 <template slot="bottom-left">
-                   <span>{{ lang('Selected', checked.length, totalCount) }}</span>
-                 </template>
+                <b-dropdown-item v-if="props.row.type == 'file' && can('download')" aria-role="listitem" @click="download(props.row)">
+                  <b-icon icon="download" size="is-small" /> {{ lang('Download') }}
+                </b-dropdown-item>
+                <b-dropdown-item v-if="can('write')" aria-role="listitem" @click="copy($event, props.row)">
+                  <b-icon icon="copy" size="is-small" /> {{ lang('Copy') }}
+                </b-dropdown-item>
+                <b-dropdown-item v-if="can('write')" aria-role="listitem" @click="move($event, props.row)">
+                  <b-icon icon="external-link-square-alt" size="is-small" /> {{ lang('Move') }}
+                </b-dropdown-item>
+                <b-dropdown-item v-if="can('write')" aria-role="listitem" @click="rename($event, props.row)">
+                  <b-icon icon="file-signature" size="is-small" /> {{ lang('Rename') }}
+                </b-dropdown-item>
+                <b-dropdown-item v-if="can(['write', 'zip']) && isArchive(props.row)" aria-role="listitem" @click="unzip($event, props.row)">
+                  <b-icon icon="file-archive" size="is-small" /> {{ lang('Unzip') }}
+                </b-dropdown-item>
+                <b-dropdown-item v-if="can(['write', 'zip']) && ! isArchive(props.row)" aria-role="listitem" @click="zip($event, props.row)">
+                  <b-icon icon="file-archive" size="is-small" /> {{ lang('Zip') }}
+                </b-dropdown-item>
+                <b-dropdown-item v-if="can('write')" aria-role="listitem" @click="remove($event, props.row)">
+                  <b-icon icon="trash-alt" size="is-small" /> {{ lang('Delete') }}
+                </b-dropdown-item>
+                <b-dropdown-item v-if="props.row.type == 'file' && can('download')" v-clipboard:copy="getDownloadLink(props.row)" aria-role="listitem">
+                  <b-icon icon="clipboard" size="is-small" /> {{ lang('Copy link') }}
+                </b-dropdown-item>
+              </b-dropdown>
+            </b-table-column>
+          </template>
 
+          <template slot="bottom-left">
+            <span>{{ lang('Selected', checked.length, totalCount) }}</span>
+          </template>
         </b-table>
-
       </div>
     </div>
   </div>
@@ -161,6 +155,7 @@ import Pagination from './partials/Pagination'
 import Upload from './partials/Upload'
 import api from '../api/api'
 import VueClipboard from 'vue-clipboard2'
+import _ from 'lodash'
 
 Vue.use(VueClipboard)
 
@@ -178,32 +173,6 @@ export default {
       files: [],
     }
   },
-  mounted() {
-    if (this.can('read')) {
-      this.loadFiles()
-    }
-  },
-  watch: {
-    '$route' (to, from) {
-      this.isLoading = true
-      this.checked = []
-      this.currentPage = 1
-      api.changeDir({
-        to: to.query.cd
-      })
-        .then(ret => {
-          this.$store.commit('setCwd', {
-            content: ret.files,
-            location: ret.location,
-          })
-          this.isLoading = false
-        })
-        .catch(error => {
-          this.isLoading = false
-          this.handleError(error)
-        })
-    },
-  },
   computed: {
     breadcrumbs() {
       let path = ''
@@ -228,6 +197,32 @@ export default {
       }) || 0
     },
   },
+  watch: {
+    '$route' (to) {
+      this.isLoading = true
+      this.checked = []
+      this.currentPage = 1
+      api.changeDir({
+        to: to.query.cd
+      })
+        .then(ret => {
+          this.$store.commit('setCwd', {
+            content: ret.files,
+            location: ret.location,
+          })
+          this.isLoading = false
+        })
+        .catch(error => {
+          this.isLoading = false
+          this.handleError(error)
+        })
+    },
+  },
+  mounted() {
+    if (this.can('read')) {
+      this.loadFiles()
+    }
+  },
   methods: {
     loadFiles() {
       api.getDir({
@@ -281,7 +276,7 @@ export default {
               destination: dir.path,
               items: item ? [item] : this.getSelected(),
             })
-              .then(res => {
+              .then(() => {
                 this.isLoading = false
               })
               .catch(error => {
@@ -305,7 +300,7 @@ export default {
               destination: dir.path,
               items: item ? [item] : this.getSelected(),
             })
-              .then(res => {
+              .then(() => {
                 this.isLoading = false
               })
               .catch(error => {
@@ -366,7 +361,7 @@ export default {
             item: item.path,
             destination: this.$store.state.cwd.location,
           })
-            .then(res => {
+            .then(() => {
               this.isLoading = false
               this.loadFiles()
             })
@@ -399,7 +394,7 @@ export default {
             items: item ? [item] : this.getSelected(),
             destination: this.$store.state.cwd.location,
           })
-            .then(ret => {
+            .then(() => {
               this.isLoading = false
               this.loadFiles()
             })
@@ -428,7 +423,7 @@ export default {
             to: value,
             destination: this.$store.state.cwd.location,
           })
-            .then(res => {
+            .then(() => {
               this.isLoading = false
               this.loadFiles()
             })
@@ -457,7 +452,7 @@ export default {
             destination: this.$store.state.cwd.location,
           })
           // TODO: cors is triggering this too early?
-            .then(ret => {
+            .then(() => {
               this.isLoading = false
               this.loadFiles()
             })
@@ -480,7 +475,7 @@ export default {
           api.removeItems({
             items: item ? [item] : this.getSelected(),
           })
-            .then(ret => {
+            .then(() => {
               this.isLoading = false
               this.loadFiles()
             })
diff --git a/frontend/views/Login.vue b/frontend/views/Login.vue
index 698ab8f..ea6e05f 100644
--- a/frontend/views/Login.vue
+++ b/frontend/views/Login.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <a v-if="can('read')" @click="$router.push('/')" id="back-arrow">
-      <b-icon icon="times"></b-icon>
+    <a v-if="can('read')" id="back-arrow" @click="$router.push('/')">
+      <b-icon icon="times" />
     </a>
 
     <div id="login" class="columns is-centered">
@@ -13,10 +13,10 @@
             </div>
             <br>
             <b-field :label="lang('Username')">
-              <b-input name="username" v-model="username" @input="error = ''" required></b-input>
+              <b-input v-model="username" name="username" required @input="error = ''" />
             </b-field>
             <b-field :label="lang('Password')">
-              <b-input type="password" name="password" v-model="password"  @input="error = ''" required></b-input>
+              <b-input v-model="password" type="password" name="password" required @input="error = ''" />
             </b-field>
 
             <div class="is-flex is-justify-end">
@@ -28,12 +28,10 @@
             <div v-if="error">
               <code>{{ error }}</code>
             </div>
-
           </div>
         </form>
       </div>
     </div>
-
   </div>
 </template>
 
diff --git a/frontend/views/Users.vue b/frontend/views/Users.vue
index 24ffff1..5ac41a6 100644
--- a/frontend/views/Users.vue
+++ b/frontend/views/Users.vue
@@ -1,56 +1,55 @@
 <template>
   <div class="container">
-    <Menu></Menu>
+    <Menu />
 
     <section class="actions is-flex is-justify-between">
       <div>
         <a @click="addUser">
-          <b-icon icon="plus" size="is-small"></b-icon> {{ lang('New') }}
+          <b-icon icon="plus" size="is-small" /> {{ lang('New') }}
         </a>
       </div>
       <div>
-        <Pagination :perpage="perPage" @selected="perPage = $event"></Pagination>
+        <Pagination :perpage="perPage" @selected="perPage = $event" />
       </div>
     </section>
 
-      <b-table
-         :data="users"
-         :default-sort="defaultSort"
-         :paginated="perPage > 0"
-         :per-page="perPage"
-         :current-page.sync="currentPage"
-         :hoverable="true"
-         :loading="isLoading">
-         <template slot-scope="props">
+    <b-table
+      :data="users"
+      :default-sort="defaultSort"
+      :paginated="perPage > 0"
+      :per-page="perPage"
+      :current-page.sync="currentPage"
+      :hoverable="true"
+      :loading="isLoading"
+    >
+      <template slot-scope="props">
+        <b-table-column field="name" :label="lang('Name')" sortable>
+          <a @click="editUser(props.row)">
+            {{ props.row.name }}
+          </a>
+        </b-table-column>
 
-           <b-table-column field="name" :label="lang('Name')" sortable>
-             <a @click="editUser(props.row)">
-               {{ props.row.name }}
-             </a>
-           </b-table-column>
+        <b-table-column field="username" :label="lang('Username')" sortable>
+          <a @click="editUser(props.row)">
+            {{ props.row.username }}
+          </a>
+        </b-table-column>
 
-           <b-table-column field="username" :label="lang('Username')" sortable>
-             <a @click="editUser(props.row)">
-               {{ props.row.username }}
-             </a>
-           </b-table-column>
+        <b-table-column field="role" :label="lang('Permissions')">
+          {{ permissions(props.row.permissions) }}
+        </b-table-column>
 
-           <b-table-column field="role" :label="lang('Permissions')">
-             {{ permissions(props.row.permissions) }}
-           </b-table-column>
+        <b-table-column field="role" :label="lang('Role')" sortable>
+          {{ props.row.role }}
+        </b-table-column>
 
-           <b-table-column field="role" :label="lang('Role')" sortable>
-             {{ props.row.role }}
-           </b-table-column>
-
-           <b-table-column>
-             <a v-if="props.row.role != 'guest'" @click="remove(props.row)">
-               <b-icon icon="trash-alt" size="is-small"></b-icon>
-             </a>
-           </b-table-column>
-
-         </template>
-      </b-table>
+        <b-table-column>
+          <a v-if="props.row.role != 'guest'" @click="remove(props.row)">
+            <b-icon icon="trash-alt" size="is-small" />
+          </a>
+        </b-table-column>
+      </template>
+    </b-table>
   </div>
 </template>
 
diff --git a/frontend/views/partials/Menu.vue b/frontend/views/partials/Menu.vue
index 38bdb6b..2324fd9 100644
--- a/frontend/views/partials/Menu.vue
+++ b/frontend/views/partials/Menu.vue
@@ -5,33 +5,32 @@
         <img :src="this.$store.state.config.logo">
       </a>
 
-      <a @click="navbarActive = !navbarActive" role="button" :class="[navbarActive ? 'is-active' : '', 'navbar-burger burger']" aria-label="menu" aria-expanded="false">
-        <span aria-hidden="true"></span>
-        <span aria-hidden="true"></span>
-        <span aria-hidden="true"></span>
+      <a role="button" :class="[navbarActive ? 'is-active' : '', 'navbar-burger burger']" aria-label="menu" aria-expanded="false" @click="navbarActive = !navbarActive">
+        <span aria-hidden="true" />
+        <span aria-hidden="true" />
+        <span aria-hidden="true" />
       </a>
     </div>
 
     <div :class="[navbarActive ? 'is-active' : '', 'navbar-menu']">
       <div class="navbar-end">
-        <a @click="$router.push('/')" v-if="is('admin')" class="navbar-item">
+        <a v-if="is('admin')" class="navbar-item" @click="$router.push('/')">
           {{ lang('Files') }}
         </a>
-        <a @click="$router.push('/users')" v-if="is('admin')" class="navbar-item">
+        <a v-if="is('admin')" class="navbar-item" @click="$router.push('/users')">
           {{ lang('Users') }}
         </a>
-        <a @click="login" v-if="is('guest')" class="navbar-item">
+        <a v-if="is('guest')" class="navbar-item" @click="login">
           {{ lang('Login') }}
         </a>
-        <a @click="profile" v-if="!is('guest')" class="navbar-item">
+        <a v-if="!is('guest')" class="navbar-item" @click="profile">
           {{ lang('Profile') }}
         </a>
-        <a @click="logout" v-if="!is('guest')" class="navbar-item">
+        <a v-if="!is('guest')" class="navbar-item" @click="logout">
           {{ lang('Logout') }}
         </a>
       </div>
     </div>
-
   </nav>
 </template>
 
diff --git a/frontend/views/partials/Pagination.vue b/frontend/views/partials/Pagination.vue
index 8c1fdd4..3bd0773 100644
--- a/frontend/views/partials/Pagination.vue
+++ b/frontend/views/partials/Pagination.vue
@@ -1,11 +1,19 @@
 <template>
   <div>
-      <b-select :value="perpage" @input="$emit('selected', $event)" size="is-small">
-        <option value="">{{ lang('No pagination') }}</option>
-        <option value="5">{{ lang('Per page', 5) }}</option>
-        <option value="10">{{ lang('Per page', 10) }}</option>
-        <option value="15">{{ lang('Per page', 15) }}</option>
-      </b-select>
+    <b-select :value="perpage" size="is-small" @input="$emit('selected', $event)">
+      <option value="">
+        {{ lang('No pagination') }}
+      </option>
+      <option value="5">
+        {{ lang('Per page', 5) }}
+      </option>
+      <option value="10">
+        {{ lang('Per page', 10) }}
+      </option>
+      <option value="15">
+        {{ lang('Per page', 15) }}
+      </option>
+    </b-select>
   </div>
 </template>
 
diff --git a/frontend/views/partials/Profile.vue b/frontend/views/partials/Profile.vue
index 270c35f..8f088d2 100644
--- a/frontend/views/partials/Profile.vue
+++ b/frontend/views/partials/Profile.vue
@@ -1,22 +1,28 @@
 <template>
   <div class="modal-card">
     <header class="modal-card-head">
-      <p class="modal-card-title">{{ $store.state.user.name }}</p>
+      <p class="modal-card-title">
+        {{ $store.state.user.name }}
+      </p>
     </header>
     <section class="modal-card-body">
       <form @submit="save">
         <b-field :label="lang('Old password')" :type="formErrors.oldpassword ? 'is-danger' : ''" :message="formErrors.oldpassword">
-          <b-input v-model="oldpassword" @keydown.native="formErrors.oldpassword = ''" password-reveal required></b-input>
+          <b-input v-model="oldpassword" password-reveal required @keydown.native="formErrors.oldpassword = ''" />
         </b-field>
 
         <b-field :label="lang('New password')" :type="formErrors.newpassword ? 'is-danger' : ''" :message="formErrors.newpassword">
-          <b-input v-model="newpassword" @keydown.native="formErrors.newpassword = ''" password-reveal required></b-input>
+          <b-input v-model="newpassword" password-reveal required @keydown.native="formErrors.newpassword = ''" />
         </b-field>
       </form>
     </section>
     <footer class="modal-card-foot">
-      <button class="button" type="button" @click="$parent.close()">{{ lang('Close') }}</button>
-      <button class="button is-primary" type="button" @click="save">{{ lang('Save') }}</button>
+      <button class="button" type="button" @click="$parent.close()">
+        {{ lang('Close') }}
+      </button>
+      <button class="button is-primary" type="button" @click="save">
+        {{ lang('Save') }}
+      </button>
     </footer>
   </div>
 </template>
diff --git a/frontend/views/partials/Tree.vue b/frontend/views/partials/Tree.vue
index 2ab8407..9c0a1bf 100644
--- a/frontend/views/partials/Tree.vue
+++ b/frontend/views/partials/Tree.vue
@@ -1,17 +1,21 @@
 <template>
   <div class="modal-card">
     <header class="modal-card-head">
-      <p class="modal-card-title">{{ lang('Select Folder') }}</p>
+      <p class="modal-card-title">
+        {{ lang('Select Folder') }}
+      </p>
     </header>
     <section class="modal-card-body">
       <div class="tree">
         <ul class="tree-list">
-          <TreeNode @selected="$emit('selected', $event) && $parent.close()" :node="$store.state.tree"></TreeNode>
+          <TreeNode :node="$store.state.tree" @selected="$emit('selected', $event) && $parent.close()" />
         </ul>
       </div>
     </section>
     <footer class="modal-card-foot">
-      <button class="button" type="button" @click="$parent.close()">{{ lang('Close') }}</button>
+      <button class="button" type="button" @click="$parent.close()">
+        {{ lang('Close') }}
+      </button>
     </footer>
   </div>
 </template>
diff --git a/frontend/views/partials/TreeNode.vue b/frontend/views/partials/TreeNode.vue
index 1ce9950..1c5b925 100644
--- a/frontend/views/partials/TreeNode.vue
+++ b/frontend/views/partials/TreeNode.vue
@@ -6,7 +6,7 @@
       &nbsp; <a @click="$emit('selected', node)">{{ node.name }}</a>
 
     <ul v-if="node.children && node.children.length">
-      <TreeNode v-for="(child, index) in node.children" :node="child" :key="index" @selected="$emit('selected', $event)"></TreeNode>
+      <TreeNode v-for="(child, index) in node.children" :key="index" :node="child" @selected="$emit('selected', $event)" />
     </ul>
   </li>
 </template>
@@ -26,12 +26,6 @@ export default {
       button_type: 'is-primary'
     }
   },
-  mounted() {
-    if (this.node.path == '/') {
-      this.$store.commit('resetTree')
-      this.toggleButton(this.node)
-    }
-  },
   computed: {
     icon() {
       return {
@@ -42,6 +36,12 @@ export default {
       }
     },
   },
+  mounted() {
+    if (this.node.path == '/') {
+      this.$store.commit('resetTree')
+      this.toggleButton(this.node)
+    }
+  },
   methods: {
     toggleButton(node) {
       if (! this.active) {
diff --git a/frontend/views/partials/Upload.vue b/frontend/views/partials/Upload.vue
index c4a2896..3216fcd 100644
--- a/frontend/views/partials/Upload.vue
+++ b/frontend/views/partials/Upload.vue
@@ -6,7 +6,7 @@
           <div class="is-flex is-justify-between">
             <div class="is-flex">
               <a @click="toggleWindow">
-                <b-icon :icon="progressVisible ? 'angle-down' : 'angle-up'"></b-icon>
+                <b-icon :icon="progressVisible ? 'angle-down' : 'angle-up'" />
               </a>
               <span v-if="activeUploads">
                 {{ lang('Uploading files', Math.round(resumable.progress()*100), formatBytes(resumable.getSize())) }}
@@ -20,10 +20,10 @@
             </div>
             <div class="is-flex">
               <a v-if="activeUploads" @click="togglePause()">
-                <b-icon :icon="paused ? 'play-circle' : 'pause-circle'"></b-icon>
+                <b-icon :icon="paused ? 'play-circle' : 'pause-circle'" />
               </a>
-              <a @click="closeWindow()" class="progress-icon">
-                <b-icon icon="times"></b-icon>
+              <a class="progress-icon" @click="closeWindow()">
+                <b-icon icon="times" />
               </a>
             </div>
           </div>
@@ -34,12 +34,12 @@
             <div>
               <div>{{ file.relativePath != '/' ? file.relativePath : '' }}/{{ file.fileName }}</div>
               <div class="is-flex is-justify-between">
-                <progress :class="[file.file.uploadingError ? 'is-danger' : 'is-primary', 'progress is-large']" :value="file.progress()*100" max="100"></progress>
-                <a v-if="! file.isUploading() && file.file.uploadingError" @click="file.retry()" class="progress-icon">
-                  <b-icon icon="redo" type="is-danger"></b-icon>
+                <progress :class="[file.file.uploadingError ? 'is-danger' : 'is-primary', 'progress is-large']" :value="file.progress()*100" max="100" />
+                <a v-if="! file.isUploading() && file.file.uploadingError" class="progress-icon" @click="file.retry()">
+                  <b-icon icon="redo" type="is-danger" />
                 </a>
-                <a v-else @click="file.cancel()" class="progress-icon">
-                  <b-icon :icon="file.isComplete() ? 'check' : 'times'"></b-icon>
+                <a v-else class="progress-icon" @click="file.cancel()">
+                  <b-icon :icon="file.isComplete() ? 'check' : 'times'" />
                 </a>
               </div>
             </div>
@@ -69,6 +69,11 @@ export default {
       progress: 0,
     }
   },
+  computed: {
+    activeUploads() {
+      return this.resumable.files.length && this.resumable.progress() < 1
+    },
+  },
   watch: {
     'files' (files) {
       this.visible = true
@@ -132,11 +137,6 @@ export default {
       file.file.uploadingError = true
     })
   },
-  computed: {
-    activeUploads() {
-      return this.resumable.files.length && this.resumable.progress() < 1
-    },
-  },
   methods: {
     closeWindow() {
       if (this.activeUploads) {
diff --git a/frontend/views/partials/UserEdit.vue b/frontend/views/partials/UserEdit.vue
index 5765bd8..4c9eab3 100644
--- a/frontend/views/partials/UserEdit.vue
+++ b/frontend/views/partials/UserEdit.vue
@@ -1,36 +1,39 @@
 <template>
   <div class="modal-card">
     <header class="modal-card-head">
-      <p class="modal-card-title">{{ user.name }}</p>
+      <p class="modal-card-title">
+        {{ user.name }}
+      </p>
     </header>
     <section class="modal-card-body">
       <form @submit.prevent="save">
-
         <div v-if="user.role == 'user' || user.role == 'admin'" class="field">
-
           <b-field :label="lang('Role')">
             <b-select v-model="formFields.role" :placeholder="lang('Role')" expanded required>
-              <option value="user" key="user">{{ lang('User') }}</option>
-              <option value="admin" key="admin">{{ lang('Admin') }}</option>
+              <option key="user" value="user">
+                {{ lang('User') }}
+              </option>
+              <option key="admin" value="admin">
+                {{ lang('Admin') }}
+              </option>
             </b-select>
           </b-field>
 
           <b-field :label="lang('Username')" :type="formErrors.username ? 'is-danger' : ''" :message="formErrors.username">
-            <b-input v-model="formFields.username" @keydown.native="formErrors.username = ''"></b-input>
+            <b-input v-model="formFields.username" @keydown.native="formErrors.username = ''" />
           </b-field>
 
           <b-field :label="lang('Name')" :type="formErrors.name ? 'is-danger' : ''" :message="formErrors.name">
-            <b-input v-model="formFields.name" @keydown.native="formErrors.name = ''"></b-input>
+            <b-input v-model="formFields.name" @keydown.native="formErrors.name = ''" />
           </b-field>
 
           <b-field :label="lang('Password')" :type="formErrors.password ? 'is-danger' : ''" :message="formErrors.password">
-            <b-input v-model="formFields.password" @keydown.native="formErrors.password = ''" :placeholder="action == 'edit' ? lang('Leave blank for no change') : ''" password-reveal></b-input>
+            <b-input v-model="formFields.password" :placeholder="action == 'edit' ? lang('Leave blank for no change') : ''" password-reveal @keydown.native="formErrors.password = ''" />
           </b-field>
-
         </div>
 
         <b-field :label="lang('Homedir')" :type="formErrors.homedir ? 'is-danger' : ''" :message="formErrors.homedir">
-          <b-input v-model="formFields.homedir" @focus="selectDir"></b-input>
+          <b-input v-model="formFields.homedir" @focus="selectDir" />
         </b-field>
 
         <b-field :label="lang('Permissions')">
@@ -55,12 +58,15 @@
             </b-checkbox>
           </div>
         </b-field>
-
       </form>
     </section>
     <footer class="modal-card-foot">
-      <button class="button" type="button" @click="$parent.close()">{{ lang('Close') }}</button>
-      <button class="button is-primary" type="button" @click="confirmSave">{{ lang('Save') }}</button>
+      <button class="button" type="button" @click="$parent.close()">
+        {{ lang('Close') }}
+      </button>
+      <button class="button is-primary" type="button" @click="confirmSave">
+        {{ lang('Save') }}
+      </button>
     </footer>
   </div>
 </template>
@@ -73,8 +79,6 @@ import _ from 'lodash'
 export default {
   name: 'UserEdit',
   props: [ 'user', 'action' ],
-  computed: {
-  },
   data() {
     return {
       formFields: {
@@ -95,6 +99,8 @@ export default {
       }
     }
   },
+  computed: {
+  },
   watch: {
     'permissions.read' (val) {
       if (!val) {