diff --git a/src/resources/vue/File/Info.vue b/src/resources/vue/File/Info.vue
index 09e7e0aa..00c7cb25 100644
--- a/src/resources/vue/File/Info.vue
+++ b/src/resources/vue/File/Info.vue
@@ -1,163 +1,163 @@
 <template>
     <div class="container">
         <div class="card" id="file-info">
             <div class="card-body">
                 <div class="card-title">
                     {{ file.name }}
                     <btn v-if="file.canDelete" class="btn-outline-danger button-delete float-end" @click="fileDelete" icon="trash-alt">{{ $t('file.delete') }}</btn>
                 </div>
                 <div class="card-text">
                     <ul class="nav nav-tabs mt-3" role="tablist">
                         <li class="nav-item">
                             <a class="nav-link active" id="tab-general" href="#general" role="tab" aria-controls="general" aria-selected="true" @click="$root.tab">
                                 {{ $t('form.general') }}
                             </a>
                         </li>
                         <li class="nav-item" v-if="file.isOwner">
                             <a class="nav-link" id="tab-sharing" href="#sharing" role="tab" aria-controls="sharing" aria-selected="false" @click="$root.tab">
                                 {{ $t('file.sharing') }}
                             </a>
                         </li>
                     </ul>
                     <div class="tab-content">
                         <form class="tab-pane show active card-body read-only short" id="general" role="tabpanel" aria-labelledby="tab-general">
                             <div class="row plaintext">
                                 <label for="mimetype" class="col-sm-4 col-form-label">{{ $t('file.mimetype') }}</label>
                                 <div class="col-sm-8">
                                     <span class="form-control-plaintext" id="mimetype">{{ file.mimetype }}</span>
                                 </div>
                             </div>
                             <div class="row plaintext">
                                 <label for="size" class="col-sm-4 col-form-label">{{ $t('form.size') }}</label>
                                 <div class="col-sm-8">
                                     <span class="form-control-plaintext" id="size">{{ api.sizeText(file.size) }}</span>
                                 </div>
                             </div>
                             <div class="row plaintext mb-3">
                                 <label for="mtime" class="col-sm-4 col-form-label">{{ $t('file.mtime') }}</label>
                                 <div class="col-sm-8">
                                     <span class="form-control-plaintext" id="mtime">{{ file.mtime }}</span>
                                 </div>
                             </div>
                             <btn class="btn-primary" icon="download" @click="fileDownload">{{ $t('btn.download') }}</btn>
                         </form>
                         <div v-if="file.isOwner" class="tab-pane card-body" id="sharing" role="tabpanel" aria-labelledby="tab-sharing">
                             <div id="share-form" class="mb-3">
                                 <div class="row">
                                     <small id="share-links-hint" class="text-muted mb-2">
                                         {{ $t('file.sharing-links-text') }}
                                     </small>
                                     <div class="input-group">
                                         <input type="text" class="form-control" id="user" :placeholder="$t('form.email')">
                                         <a href="#" class="btn btn-outline-secondary" @click.prevent="shareAdd">
                                             <svg-icon icon="plus"></svg-icon><span class="visually-hidden">{{ $t('btn.add') }}</span>
                                         </a>
                                     </div>
                                 </div>
                             </div>
                             <div id="share-links" class="row m-0" v-if="shares.length">
                                 <div class="list-group p-0">
-                                    <div v-for="(item, index) in shares" :key="item.id" class="list-group-item">
+                                    <div v-for="item in shares" :key="item.id" class="list-group-item">
                                         <div class="d-flex w-100 justify-content-between">
                                             <span class="user lh-lg">
                                                 <svg-icon icon="user"></svg-icon> {{ item.user }}
                                             </span>
                                             <span class="d-inline-block">
                                                 <btn class="btn-link p-1" :icon="['far', 'clipboard']" :title="$t('btn.copy')" @click="copyLink(item.link)"></btn>
                                                 <btn class="btn-link text-danger p-1" icon="trash-alt" :title="$t('btn.delete')" @click="shareDelete(item.id)"></btn>
                                             </span>
                                         </div>
                                         <code>{{ item.link }}</code>
                                     </div>
                                 </div>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </div>
 </template>
 
 <script>
     import FileAPI from '../../js/files.js'
 
     import { library } from '@fortawesome/fontawesome-svg-core'
     import { faDownload } from '@fortawesome/free-solid-svg-icons'
 
     library.add(faDownload)
 
     export default {
         data() {
             return {
                 file: {},
                 fileId: null,
                 shares: []
             }
         },
         created() {
             this.api = new FileAPI({})
 
             this.fileId = this.$route.params.file
 
             this.$root.startLoading()
 
             axios.get('/api/v4/files/' + this.fileId)
                 .then(response => {
                     this.$root.stopLoading()
                     this.file = response.data
 
                     if (this.file.isOwner) {
                         axios.get('api/v4/files/' + this.fileId + '/permissions')
                             .then(response => {
                                 if (response.data.list) {
                                     this.shares = response.data.list
                                 }
                             })
                     }
                 })
                 .catch(this.$root.errorHandler)
         },
         methods: {
             copyLink(link) {
                 navigator.clipboard.writeText(link);
             },
             fileDelete() {
                 axios.delete('api/v4/files/' + this.fileId)
                     .then(response => {
                         if (response.data.status == 'success') {
                             this.$toast.success(response.data.message)
                             this.$router.push({ name: 'files' })
                         }
                     })
             },
             fileDownload() {
                 this.api.fileDownload(this.fileId)
             },
             shareAdd() {
                 let post = { permissions: 'read-only', user: $('#user').val() }
 
                 if (!post.user) {
                     return
                 }
 
                 axios.post('api/v4/files/' + this.fileId + '/permissions', post)
                     .then(response => {
                         if (response.data.status == 'success') {
                             this.$toast.success(response.data.message)
                             this.shares.push(response.data)
                         }
                     })
             },
             shareDelete(id) {
                 axios.delete('api/v4/files/' + this.fileId + '/permissions/' + id)
                     .then(response => {
                         if (response.data.status == 'success') {
                             this.$toast.success(response.data.message)
                             this.$delete(this.shares, this.shares.findIndex(element => element.id == id))
                         }
                     })
             }
         }
     }
 </script>
diff --git a/src/resources/vue/File/List.vue b/src/resources/vue/File/List.vue
index 5e8fe53b..3b1d81eb 100644
--- a/src/resources/vue/File/List.vue
+++ b/src/resources/vue/File/List.vue
@@ -1,133 +1,132 @@
 <template>
     <div class="container">
         <div class="card" id="files">
             <div class="card-body">
                 <div class="card-title">
                     {{ $t('dashboard.files') }}
                     <small><sup class="badge bg-primary">{{ $t('dashboard.beta') }}</sup></small>
                     <div id="drop-area" class="file-drop-area float-end">
                         <svg-icon icon="upload"></svg-icon> Click or drop file(s) here
                     </div>
                 </div>
                 <div class="card-text pt-4">
                     <div class="mb-2 d-flex w-100">
                         <list-search :placeholder="$t('file.search')" :on-search="searchFiles"></list-search>
                     </div>
                     <table class="table table-sm table-hover files">
                         <thead>
                             <tr>
                                 <th scope="col" class="name">{{ $t('form.name') }}</th>
                                 <th scope="col" class="buttons"></th>
                             </tr>
                         </thead>
                         <tbody>
                             <tr v-for="file in files" :key="file.id" @click="$root.clickRecord">
                                 <td class="name">
                                     <svg-icon icon="file"></svg-icon>
                                     <router-link :to="{ path: 'file/' + file.id }">{{ file.name }}</router-link>
                                 </td>
                                 <td class="buttons">
                                     <btn class="button-download p-0 ms-1" @click="fileDownload(file)" icon="download" :title="$t('btn.download')"></btn>
                                     <btn class="button-delete text-danger p-0 ms-1" @click="fileDelete(file)" icon="trash-alt" :title="$t('btn.delete')"></btn>
                                 </td>
                             </tr>
                         </tbody>
                         <list-foot :colspan="2" :text="$t('file.list-empty')"></list-foot>
                     </table>
                     <list-more v-if="hasMore" :on-click="loadFiles"></list-more>
                 </div>
             </div>
         </div>
     </div>
 </template>
 
 <script>
     import FileAPI from '../../js/files.js'
     import ListTools from '../Widgets/ListTools'
 
     import { library } from '@fortawesome/fontawesome-svg-core'
     import { faFile, faDownload, faUpload } from '@fortawesome/free-solid-svg-icons'
 
     library.add(faFile, faDownload, faUpload)
 
     export default {
         mixins: [ ListTools ],
         data() {
             return {
                 api: {},
-                file: null,
                 files: []
             }
         },
         mounted() {
             this.uploads = {}
 
             this.api = new FileAPI({
                     dropArea: '#drop-area',
                     eventHandler: this.eventHandler
             })
 
             this.loadFiles({ init: true })
         },
         methods: {
             eventHandler(name, params) {
                 const camelCase = name.toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g, (m, chr) => chr.toUpperCase())
                 const method = camelCase + 'Handler'
 
                 if (method in this) {
                     this[method](params)
                 }
             },
             fileDelete(file) {
                 axios.delete('api/v4/files/' + file.id)
                     .then(response => {
                         if (response.data.status == 'success') {
                             this.$toast.success(response.data.message)
                             // Refresh the list
                             this.loadFiles({ reset: true })
                         }
                     })
             },
             fileDownload(file) {
                 // This is not an appropriate method for big files, we can consider
                 // using it still for very small files.
                 // this.$root.downloadFile('api/v4/files/' + file.id + '?download=1', file.name)
 
                 // This method first makes a request to the API to get the download URL (which does not
                 // require authentication) and then use it to download the file.
                 this.api.fileDownload(file.id)
             },
             loadFiles(params) {
                 this.listSearch('files', 'api/v4/files', params)
             },
             searchFiles(search) {
                 this.loadFiles({ reset: true, search })
             },
             uploadProgressHandler(params) {
                 // Note: There might be more than one event with completed=0
                 // e.g. if you upload multiple files at once
                 if (params.completed == 0 && !(params.id in this.uploads)) {
                     // Create the toast message with progress bar
                     this.uploads[params.id] = this.$toast.message({
                         icon: 'upload',
                         timeout: 24 * 60 * 60 * 60 * 1000,
                         title: this.$t('msg.uploading'),
                         msg: `${params.name} (${this.api.sizeText(params.total)})`,
                         progress: 0
                     })
                 } else if (params.id in this.uploads) {
                     if (params.completed == 100) {
                         this.uploads[params.id].delete() // close the toast message
                         delete this.uploads[params.id]
 
                         // TODO: Reloading the list is probably not the best solution
                         this.loadFiles({ reset: true })
                     } else {
                         // update progress bar
                         this.uploads[params.id].updateProgress(params.completed)
                     }
                 }
             }
         }
     }
 </script>
diff --git a/src/resources/vue/Settings.vue b/src/resources/vue/Settings.vue
index 3725369f..b9f97287 100644
--- a/src/resources/vue/Settings.vue
+++ b/src/resources/vue/Settings.vue
@@ -1,101 +1,101 @@
 <template>
     <div class="container">
         <div class="card" id="settings">
             <div class="card-body">
                 <div class="card-title">
                     {{ $t('dashboard.settings') }}
                 </div>
                 <div class="card-text">
                     <form @submit.prevent="submit">
                         <div class="row mb-3">
                             <label class="col-sm-4 col-form-label">{{ $t('user.passwordpolicy') }}</label>
                             <div class="col-sm-8">
                                 <ul id="password_policy" class="list-group ms-1 mt-1">
                                     <li v-for="rule in passwordPolicy" :key="rule.label" class="list-group-item border-0 form-check pt-1 pb-1">
                                         <input type="checkbox" class="form-check-input"
                                                :id="'policy-' + rule.label"
                                                :name="rule.label"
                                                :checked="rule.enabled || isRequired(rule)"
                                                :disabled="isRequired(rule)"
                                         >
                                         <span v-if="rule.label == 'last'" v-html="ruleLastHTML(rule)"></span>
-                                        <label v-else :for="'policy-' + rule.label" class="form-check-label pe-2" style="opacity:1">{{ rule.name.split(':')[0] }}</label>
+                                        <label v-else :for="'policy-' + rule.label" class="form-check-label pe-2" style="opacity: 1;">{{ rule.name.split(':')[0] }}</label>
                                         <input type="text" class="form-control form-control-sm w-auto d-inline" v-if="['min', 'max'].includes(rule.label)" :value="rule.param" size="3">
                                     </li>
                                 </ul>
                             </div>
                         </div>
                         <btn class="btn-primary" type="submit" icon="check">{{ $t('btn.submit') }}</btn>
                     </form>
                 </div>
             </div>
         </div>
     </div>
 </template>
 
 <script>
     export default {
         data() {
             return {
                 passwordPolicy: []
             }
         },
         created() {
             this.wallet = this.$store.state.authInfo.wallet
         },
         mounted() {
             this.$root.startLoading()
 
             axios.get('/api/v4/password-policy')
                 .then(response => {
                     this.$root.stopLoading()
 
                     if (response.data.list) {
                         this.passwordPolicy = response.data.list
                     }
                 })
                 .catch(this.$root.errorHandler)
         },
         methods: {
             isRequired(rule) {
                 return rule.label == 'min' || rule.label == 'max'
             },
             ruleLastHTML(rule) {
                 let parts = rule.name.split(/[0-9]+/)
                 let options = [1, 2, 3, 4, 5, 6]
 
                 options = options.map(num => {
                     let selected = num == rule.param ? ' selected' : ''
                     return `<option value="${num}"${selected}>${num}</option>`
                 })
 
                 return `<label for="policy-last" class="form-check-label pe-2">
                     ${parts[0]} <select class="form-select form-select-sm d-inline w-auto">${options.join('')}</select> ${parts[1]}
                     </label>`
             },
             submit() {
                 this.$root.clearFormValidation($('#settings form'))
 
                 let password_policy = [];
 
                 $('#password_policy > li > input:checked').each((i, element) => {
                     let entry = element.name
                     let param = $(element.parentNode).find('select,input[type=text]').val()
 
                     if (param) {
                         entry += ':' + param
                     }
 
                     password_policy.push(entry)
                 })
 
                 let post = { password_policy: password_policy.join(',') }
 
                 axios.post('/api/v4/users/' + this.wallet.user_id + '/config', post)
                     .then(response => {
                         this.$toast.success(response.data.message)
                     })
             },
         }
     }
 </script>