diff --git a/src/resources/sass/app.scss b/src/resources/sass/app.scss
index e1a10e92..0b1bfe77 100644
--- a/src/resources/sass/app.scss
+++ b/src/resources/sass/app.scss
@@ -1,218 +1,217 @@
 // Fonts
 
 // Variables
 @import 'variables';
 
 // Bootstrap
 @import '~bootstrap/scss/bootstrap';
 
 // Toastr
 @import '~@deveodk/vue-toastr/dist/@deveodk/vue-toastr.css';
 
 // Fixes Toastr incompatibility with Bootstrap
 .toast-container > .toast {
     opacity: 1;
 }
 
 @import 'menu';
 
 nav + .container {
     margin-top: 120px;
 }
 
 #app {
     margin-bottom: 2rem;
 }
 
 #error-page {
     position: absolute;
     top: 0;
     height: 100%;
     width: 100%;
     align-items: center;
     display: flex;
     justify-content: center;
     color: #636b6f;
     z-index: 10;
     background: white;
 
     .code {
         text-align: right;
         border-right: 2px solid;
         font-size: 26px;
         padding: 0 15px;
     }
 
     .message {
         font-size: 18px;
         padding: 0 15px;
     }
 }
 
 .app-loader {
     background-color: $body-bg;
     height: 100%;
     width: 100%;
     position: absolute;
     top: 0;
     left: 0;
     display: flex;
     align-items: center;
     justify-content: center;
 
     .spinner-border {
         width: 120px;
         height: 120px;
         border-width: 15px;
         color: #b2aa99;
     }
 }
 
 pre {
     margin: 1rem 0;
     padding: 1rem;
     background-color: $menu-bg-color;
 }
 
 .card-title {
     font-size: 1.2rem;
     font-weight: bold;
 }
 
 .list-input {
     & > div {
         &:not(:last-child) {
             margin-bottom: -1px;
 
             input,
             a.btn {
                 border-bottom-right-radius: 0;
                 border-bottom-left-radius: 0;
             }
         }
 
         &:not(:first-child) {
             input,
             a.btn {
                 border-top-right-radius: 0;
                 border-top-left-radius: 0;
             }
         }
     }
 
     input.is-invalid {
         z-index: 2;
     }
 }
 
 .range-input {
     display: flex;
 
     label {
         margin-right: 0.5em;
     }
 }
 
 tfoot.table-fake-body {
     background-color: #f8f8f8;
     color: grey;
     text-align: center;
     height: 8em;
 
     td {
         vertical-align: middle;
     }
 
     tbody:not(:empty) + & {
         display: none;
     }
 }
 
 table {
     td.buttons,
     td.price,
     td.selection {
         width: 1%;
     }
 
     td.price {
         text-align: right;
     }
 
     &.form-list {
         td {
             border: 0;
 
             &:first-child {
                 padding-left: 0;
             }
 
             &:last-child {
                 padding-right: 0;
             }
         }
     }
 }
 
 ul.status-list {
     list-style: none;
     padding: 0;
     margin: 0;
 
     svg {
         width: 1.25rem !important;
         height: 1.25rem;
     }
 
     span {
         vertical-align: top;
     }
 }
 
 #dashboard-nav {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     margin-top: 1rem;
 
     & > a {
         padding: 1rem;
         text-align: center;
         white-space: nowrap;
         margin: 0 0.5rem 0.5rem 0;
         text-decoration: none;
         min-width: 8rem;
 
         &.disabled {
             pointer-events: none;
             opacity: 0.6;
         }
 
         .badge {
             position: absolute;
             top: 0.5rem;
             right: 0.5rem;
         }
     }
 
     svg {
         width: 6rem;
         height: 6rem;
     }
 }
 
 .plan-selector {
     .plan-ico {
-        width: 100px;
         font-size: 4em;
         color: #f1a539;
         border: 3px solid #f1a539;
         width: 100px;
         margin-bottom: 1rem;
         border-radius: 50%;
     }
 
     ul:last-child {
         margin-bottom: 0;
     }
 }
diff --git a/src/resources/vue/Signup.vue b/src/resources/vue/Signup.vue
index a55a10fd..ce261748 100644
--- a/src/resources/vue/Signup.vue
+++ b/src/resources/vue/Signup.vue
@@ -1,256 +1,256 @@
 <template>
     <div class="container">
         <div id="step0">
             <div class="plan-selector d-flex justify-content-around align-items-stretch mb-3">
-                <div v-for="plan in plans" :key="plan.id" :class="'p-3 m-1 text-center bg-light flex-fill plan-box d-flex flex-column align-items-center plan-' + plan.title">
+                <div v-for="item in plans" :key="item.id" :class="'p-3 m-1 text-center bg-light flex-fill plan-box d-flex flex-column align-items-center plan-' + item.title">
                     <div class="plan-ico">
-                        <svg-icon :icon="plan_icons[plan.title]"></svg-icon>
+                        <svg-icon :icon="plan_icons[item.title]"></svg-icon>
                     </div>
-                    <button class="btn btn-primary" :data-title="plan.title" @click="selectPlan(plan.title)" v-html="plan.button"></button>
-                    <div class="plan-description text-left mt-3" v-html="plan.description"></div>
+                    <button class="btn btn-primary" :data-title="item.title" @click="selectPlan(item.title)" v-html="item.button"></button>
+                    <div class="plan-description text-left mt-3" v-html="item.description"></div>
                 </div>
             </div>
             <h3>FAQs</h3>
             <ul>
                 <li><a href="https://kolabnow.com/tos">What are your terms of service?</a></li>
                 <li><a href="https://kb.kolabnow.com/faq/can-i-upgrade-an-individual-account-to-a-group-account">Can I upgrade an individual account to a group account?</a></li>
                 <li><a href="https://kb.kolabnow.com/faq/how-much-storage-comes-with-my-account">How much storage comes with my account?</a></li>
             </ul>
         </div>
 
         <div class="card d-none" id="step1">
             <div class="card-body">
                 <h4 class="card-title">Sign Up - Step 1/3</h4>
                 <p class="card-text">
                     Sign up to start your free month.
                 </p>
                 <form @submit.prevent="submitStep1" data-validation-prefix="signup_">
                     <div class="form-group">
                         <label for="signup_name" class="sr-only">Your Name</label>
                         <input type="text" class="form-control" id="signup_name" placeholder="Your Name" required autofocus v-model="name">
                     </div>
                     <div class="form-group">
                         <label for="signup_email" class="sr-only">Existing Email Address</label>
                         <input type="text" class="form-control" id="signup_email" placeholder="Existing Email Address" required v-model="email">
                     </div>
                     <button class="btn btn-secondary" type="button" @click="stepBack">Back</button>
                     <button class="btn btn-primary" type="submit"><svg-icon icon="check"></svg-icon> Continue</button>
                 </form>
             </div>
         </div>
 
         <div class="card d-none" id="step2">
             <div class="card-body">
                 <h4 class="card-title">Sign Up - Step 2/3</h4>
                 <p class="card-text">
                     We sent out a confirmation code to your email address.
                     Enter the code we sent you, or click the link in the message.
                 </p>
                 <form @submit.prevent="submitStep2" data-validation-prefix="signup_">
                     <div class="form-group">
                         <label for="signup_short_code" class="sr-only">Confirmation Code</label>
                         <input type="text" class="form-control" id="signup_short_code" placeholder="Confirmation Code" required v-model="short_code">
                     </div>
                     <button class="btn btn-secondary" type="button" @click="stepBack">Back</button>
                     <button class="btn btn-primary" type="submit"><svg-icon icon="check"></svg-icon> Continue</button>
                     <input type="hidden" id="signup_code" v-model="code" />
                 </form>
             </div>
         </div>
 
         <div class="card d-none" id="step3">
             <div class="card-body">
                 <h4 class="card-title">Sign Up - Step 3/3</h4>
                 <p class="card-text">
                     Create your Kolab identity (you can choose additional addresses later).
                 </p>
                 <form @submit.prevent="submitStep3" data-validation-prefix="signup_">
                     <div class="form-group">
                         <label for="signup_login" class="sr-only"></label>
                         <div class="input-group">
                             <input type="text" class="form-control" id="signup_login" required v-model="login" placeholder="Login">
                             <span class="input-group-append">
                                 <span class="input-group-text">@</span>
                             </span>
                             <input v-if="is_domain" type="text" class="form-control rounded-right" id="signup_domain" required v-model="domain" placeholder="Domain">
                             <select v-else class="custom-select rounded-right" id="signup_domain" required v-model="domain"></select>
                         </div>
                     </div>
                     <div class="form-group">
                         <label for="signup_password" class="sr-only">Password</label>
                         <input type="password" class="form-control" id="signup_password" placeholder="Password" required v-model="password">
                     </div>
                     <div class="form-group">
                         <label for="signup_confirm" class="sr-only">Confirm Password</label>
                         <input type="password" class="form-control" id="signup_confirm" placeholder="Confirm Password" required v-model="password_confirmation">
                     </div>
                     <div class="form-group pt-2 pb-2">
                         <label for="signup_voucher" class="sr-only">Voucher code</label>
                         <input type="text" class="form-control" id="signup_voucher" placeholder="Voucher code" v-model="voucher">
                     </div>
                     <button class="btn btn-secondary" type="button" @click="stepBack">Back</button>
                     <button class="btn btn-primary" type="submit"><svg-icon icon="check"></svg-icon> Submit</button>
                 </form>
             </div>
         </div>
     </div>
 </template>
 
 <script>
     export default {
         data() {
             return {
                 email: '',
                 name: '',
                 code: '',
                 short_code: '',
                 login: '',
                 password: '',
                 password_confirmation: '',
                 domain: '',
                 plan: null,
                 is_domain: false,
                 plan_icons: {
                     individual: 'user',
                     group: 'users'
                 },
                 plans: [],
                 voucher: ''
             }
         },
         mounted() {
             let param = this.$route.params.param;
 
             if (param) {
                 if (this.$route.path.indexOf('/signup/voucher/') === 0) {
                     // Voucher (discount) code
                     this.voucher = param
                     this.displayForm(0)
                 } else if (/^([A-Z0-9]+)-([a-zA-Z0-9]+)$/.test(param)) {
                     // Verification code provided, auto-submit Step 2
                     this.short_code = RegExp.$1
                     this.code = RegExp.$2
                     this.submitStep2(true)
                 } else if (/^([a-zA-Z_]+)$/.test(param)) {
                     // Plan title provided, save it and display Step 1
                     this.plan = param
                     this.displayForm(1, true)
                 } else {
                     this.$root.errorPage(404)
                 }
             } else {
                 this.displayForm(0)
             }
         },
         methods: {
             selectPlan(plan) {
                 this.$router.push({path: '/signup/' + plan})
                 this.plan = plan
                 this.displayForm(1, true)
             },
             // Composes plan selection page
             step0() {
                 if (!this.plans.length) {
                     axios.get('/api/auth/signup/plans', {}).then(response => {
                         this.plans = response.data.plans
                     })
                 }
             },
             // Submits data to the API, validates and gets verification code
             submitStep1() {
                 this.$root.clearFormValidation($('#step1 form'))
 
                 axios.post('/api/auth/signup/init', {
                     email: this.email,
                     name: this.name,
                     plan: this.plan,
                     voucher: this.voucher
                 }).then(response => {
                     this.displayForm(2, true)
                     this.code = response.data.code
                 })
             },
             // Submits the code to the API for verification
             submitStep2(bylink) {
                 if (bylink === true) {
                     this.displayForm(2, false)
                 }
 
                 this.$root.clearFormValidation($('#step2 form'))
 
                 axios.post('/api/auth/signup/verify', {
                     code: this.code,
                     short_code: this.short_code
                 }).then(response => {
                     this.displayForm(3, true)
                     // Reset user name/email/plan, we don't have them if user used a verification link
                     this.name = response.data.name
                     this.email = response.data.email
                     this.is_domain = response.data.is_domain
                     this.voucher = response.data.voucher
 
                     // Fill the domain selector with available domains
                     if (!this.is_domain) {
                         let options = []
                         $('select#signup_domain').html('')
                         $.each(response.data.domains, (i, v) => {
                             options.push($('<option>').text(v).attr('value', v))
                         })
                         $('select#signup_domain').append(options)
                         this.domain = window.config['app.domain']
                     }
                 }).catch(error => {
                     if (bylink === true) {
                         // FIXME: display step 1, user can do nothing about it anyway
                         //        Maybe we should display 404 error page?
                         this.displayForm(1, true)
                     }
                 })
             },
             // Submits the data to the API to create the user account
             submitStep3() {
                 this.$root.clearFormValidation($('#step3 form'))
 
                 axios.post('/api/auth/signup', {
                     code: this.code,
                     short_code: this.short_code,
                     login: this.login,
                     domain: this.domain,
                     password: this.password,
                     password_confirmation: this.password_confirmation,
                     voucher: this.voucher
                 }).then(response => {
                     // auto-login and goto dashboard
                     this.$root.loginUser(response.data.access_token)
                 })
             },
             // Moves the user a step back in registration form
             stepBack(e) {
                 var card = $(e.target).closest('.card')
 
                 card.prev().removeClass('d-none').find('input').first().focus()
                 card.addClass('d-none').find('form')[0].reset()
 
                 if (card.attr('id') == 'step1') {
                     this.step0()
                     this.$router.replace({path: '/signup'})
                 }
             },
             displayForm(step, focus) {
                 [0, 1, 2, 3].filter(value => value != step).forEach(value => {
                     $('#step' + value).addClass('d-none')
                 })
 
                 if (!step) {
                     return this.step0()
                 }
 
                 $('#step' + step).removeClass('d-none')
 
                 if (focus) {
                     $('#step' + step).find('input').first().focus()
                 }
             }
         }
     }
 </script>
diff --git a/src/resources/vue/User/Info.vue b/src/resources/vue/User/Info.vue
index f45b4331..fe807cf9 100644
--- a/src/resources/vue/User/Info.vue
+++ b/src/resources/vue/User/Info.vue
@@ -1,360 +1,360 @@
 <template>
     <div class="container">
         <div class="card" id="user-info">
             <div class="card-body">
                 <div class="card-title" v-if="user_id !== 'new'">User account</div>
                 <div class="card-title" v-if="user_id === 'new'">New user account</div>
                 <div class="card-text">
                     <form @submit.prevent="submit">
                         <div v-if="user_id !== 'new'" class="form-group row">
                             <label for="first_name" class="col-sm-4 col-form-label">Status</label>
                             <div class="col-sm-8">
                                 <span :class="$root.userStatusClass(user) + ' form-control-plaintext'" id="status">{{ $root.userStatusText(user) }}</span>
                             </div>
                         </div>
                         <div class="form-group row">
                             <label for="first_name" class="col-sm-4 col-form-label">First name</label>
                             <div class="col-sm-8">
                                 <input type="text" class="form-control" id="first_name" v-model="user.first_name">
                             </div>
                         </div>
                         <div class="form-group row">
                             <label for="last_name" class="col-sm-4 col-form-label">Last name</label>
                             <div class="col-sm-8">
                                 <input type="text" class="form-control" id="last_name" v-model="user.last_name">
                             </div>
                         </div>
                         <div class="form-group row">
                             <label for="email" class="col-sm-4 col-form-label">Email</label>
                             <div class="col-sm-8">
                                 <input type="text" class="form-control" id="email" :disabled="user_id !== 'new'" required v-model="user.email">
                             </div>
                         </div>
                         <div class="form-group row">
                             <label for="aliases-input" class="col-sm-4 col-form-label">Email aliases</label>
                             <div class="col-sm-8">
-                                <list-input id="aliases" v-bind:list="user.aliases"></list-input>
+                                <list-input id="aliases" :list="user.aliases"></list-input>
                             </div>
                         </div>
                         <div class="form-group row">
                             <label for="password" class="col-sm-4 col-form-label">Password</label>
                             <div class="col-sm-8">
                                 <input type="password" class="form-control" id="password" v-model="user.password" :required="user_id === 'new'">
                             </div>
                         </div>
                         <div class="form-group row">
                             <label for="password_confirmaton" class="col-sm-4 col-form-label">Confirm password</label>
                             <div class="col-sm-8">
                                 <input type="password" class="form-control" id="password_confirmation" v-model="user.password_confirmation" :required="user_id === 'new'">
                             </div>
                         </div>
                         <div v-if="user_id === 'new'" id="user-packages" class="form-group row">
                             <label class="col-sm-4 col-form-label">Package</label>
                             <div class="col-sm-8">
                                 <table class="table form-list">
                                     <thead class="thead-light sr-only">
                                         <tr>
                                             <th scope="col"></th>
                                             <th scope="col">Package</th>
                                             <th scope="col">Price</th>
                                             <th scope="col"></th>
                                         </tr>
                                     </thead>
                                     <tbody>
                                         <tr v-for="pkg in packages" :id="'p' + pkg.id" :key="pkg.id">
                                             <td class="selection">
                                                 <input type="checkbox" :value="pkg.id" @click="selectPackage" :checked="pkg.id == package_id">
                                             </td>
                                             <td class="name">
                                                 {{ pkg.name }}
                                             </td>
                                             <td class="price text-nowrap">
                                                 {{ price(pkg.cost) }}
                                             </td>
                                             <td class="buttons">
                                                 <button v-if="pkg.description" type="button" class="btn btn-link btn-lg p-0" v-tooltip.click="pkg.description">
                                                     <svg-icon icon="info-circle"></svg-icon>
                                                     <span class="sr-only">More information</span>
                                                 </button>
                                             </td>
                                         </tr>
                                     </tbody>
                                 </table>
                                 <small v-if="discount > 0" class="hint">
                                     <hr class="m-0">
                                     &sup1; applied discount: {{ discount }}% - {{ discount_description }}
                                 </small>
                             </div>
                         </div>
                         <div v-if="user_id !== 'new'" id="user-skus" class="form-group row">
                             <label class="col-sm-4 col-form-label">Subscriptions</label>
                             <div class="col-sm-8">
                                 <table class="table form-list">
                                     <thead class="thead-light sr-only">
                                         <tr>
                                             <th scope="col"></th>
                                             <th scope="col">Subscription</th>
                                             <th scope="col">Price</th>
                                             <th scope="col"></th>
                                         </tr>
                                     </thead>
                                     <tbody>
                                         <tr v-for="sku in skus" :id="'s' + sku.id" :key="sku.id">
                                             <td class="selection">
                                                 <input type="checkbox" @input="onInputSku"
                                                        :value="sku.id"
                                                        :disabled="sku.readonly"
                                                        :checked="sku.enabled"
                                                        :dusk="'sku-input-' + sku.title"
                                                 >
                                             </td>
                                             <td class="name">
                                                 <span class="name">{{ sku.name }}</span>
                                                 <div v-if="sku.range" class="range-input">
                                                     <label class="text-nowrap">{{ sku.range.min }} {{ sku.range.unit }}</label>
                                                     <input
                                                         type="range" class="custom-range" @input="rangeUpdate"
                                                         :value="sku.value || sku.range.min"
                                                         :min="sku.range.min"
                                                         :max="sku.range.max"
                                                     >
                                                 </div>
                                             </td>
                                             <td class="price text-nowrap">
                                                 {{ price(sku.cost) }}
                                             </td>
                                             <td class="buttons">
                                                 <button v-if="sku.description" type="button" class="btn btn-link btn-lg p-0" v-tooltip.click="sku.description">
                                                     <svg-icon icon="info-circle"></svg-icon>
                                                     <span class="sr-only">More information</span>
                                                 </button>
                                             </td>
                                         </tr>
                                     </tbody>
                                 </table>
                                 <small v-if="discount > 0" class="hint">
                                     <hr class="m-0">
                                     &sup1; applied discount: {{ discount }}% - {{ discount_description }}
                                 </small>
                             </div>
                         </div>
                         <button class="btn btn-primary" type="submit"><svg-icon icon="check"></svg-icon> Submit</button>
                     </form>
                 </div>
             </div>
         </div>
     </div>
 </template>
 
 <script>
     import ListInput from '../Widgets/ListInput'
 
     export default {
         components: {
             ListInput,
         },
         data() {
             return {
                 discount: 0,
                 discount_description: '',
                 user_id: null,
                 user: { aliases: [] },
                 packages: [],
                 package_id: null,
                 skus: []
             }
         },
         created() {
             this.user_id = this.$route.params.user
 
             let wallet = this.$store.state.authInfo.accounts[0]
 
             if (!wallet) {
                 wallet = this.$store.state.authInfo.wallets[0]
             }
 
             if (wallet && wallet.discount) {
                 this.discount = wallet.discount
                 this.discount_description = wallet.discount_description
             }
 
             if (this.user_id === 'new') {
                 // do nothing (for now)
                 axios.get('/api/v4/packages')
                     .then(response => {
                         this.packages = response.data.filter(pkg => !pkg.isDomain)
                         this.package_id = this.packages[0].id
                     })
                     .catch(this.$root.errorHandler)
             }
             else {
                 axios.get('/api/v4/users/' + this.user_id)
                     .then(response => {
                         this.user = response.data
                         this.user.first_name = response.data.settings.first_name
                         this.user.last_name = response.data.settings.last_name
                         this.discount = this.user.wallet.discount
                         this.discount_description = this.user.wallet.discount_description
 
                         axios.get('/api/v4/skus')
                             .then(response => {
                                 // "merge" SKUs with user entitlement-SKUs
                                 this.skus = response.data
                                     .filter(sku => sku.type == 'user')
                                     .map(sku => {
                                         if (sku.id in this.user.skus) {
                                             sku.enabled = true
                                             sku.value = this.user.skus[sku.id].count
                                         } else if (!sku.readonly) {
                                             sku.enabled = false
                                         }
 
                                         return sku
                                     })
 
                                 // Update all range inputs (and price)
                                 this.$nextTick(() => {
                                     $('#user-skus input[type=range]').each((idx, elem) => { this.rangeUpdate(elem) })
                                 })
                             })
                             .catch(this.$root.errorHandler)
                     })
                     .catch(this.$root.errorHandler)
             }
         },
         mounted() {
             $('#first_name').focus()
         },
         methods: {
             submit() {
                 this.$root.clearFormValidation($('#user-info form'))
 
                 let method = 'post'
                 let location = '/api/v4/users'
 
                 if (this.user_id !== 'new') {
                     method = 'put'
                     location += '/' + this.user_id
 
                     let skus = {}
                     $('#user-skus input[type=checkbox]:checked').each((idx, input) => {
                         let id = $(input).val()
                         let range = $(input).parents('tr').first().find('input[type=range]').val()
 
                         skus[id] = range || 1
                     })
                     this.user.skus = skus
                 } else {
                     this.user.package = this.package_id
                 }
 
                 axios[method](location, this.user)
                     .then(response => {
                         if (response.data.status == 'success') {
                             this.$toastr('success', response.data.message)
                         }
 
                         // on new user redirect to users list
                         if (this.user_id === 'new') {
                             this.$router.push({ name: 'users' })
                         }
                     })
             },
             onInputSku(e) {
                 let input = e.target
                 let sku = this.findSku(input.value)
                 let required = []
 
                 // We use 'readonly', not 'disabled', because we might want to handle
                 // input events. For example to display an error when someone clicks
                 // the locked input
                 if (input.readOnly) {
                     input.checked = !input.checked
                     // TODO: Display an alert explaining why it's locked
                     return
                 }
 
                 // TODO: Following code might not work if we change definition of forbidden/required
                 //       or we just need more sophisticated SKU dependency rules
 
                 if (input.checked) {
                     // Check if a required SKU is selected, alert the user if not
                     (sku.required || []).forEach(title => {
                         this.skus.forEach(item => {
                             let checkbox
                             if (item.handler == title && (checkbox = $('#s' + item.id).find('input[type=checkbox]')[0])) {
                                 if (!checkbox.checked) {
                                     required.push(item.name)
                                 }
                             }
                         })
                     })
 
                     if (required.length) {
                         input.checked = false
                         return alert(sku.name + ' requires ' + required.join(', ') + '.')
                     }
                 } else {
                     // Uncheck all dependent SKUs, e.g. when unchecking Groupware we also uncheck Activesync
                     // TODO: Should we display an alert instead?
                     this.skus.forEach(item => {
                         if (item.required && item.required.indexOf(sku.handler) > -1) {
                             $('#s' + item.id).find('input[type=checkbox]').prop('checked', false)
                         }
                     })
                 }
 
                 // Uncheck+lock/unlock conflicting SKUs
                 (sku.forbidden || []).forEach(title => {
                     this.skus.forEach(item => {
                         let checkbox
                         if (item.handler == title && (checkbox = $('#s' + item.id).find('input[type=checkbox]')[0])) {
                             if (input.checked) {
                                 checkbox.checked = false
                                 checkbox.readOnly = true
                             } else {
                                 checkbox.readOnly = false
                             }
                         }
                     })
                 })
             },
             selectPackage(e) {
                 // Make sure there always is only one package selected
                 $('#user-packages input').prop('checked', false)
                 this.package_id = $(e.target).prop('checked', false).val()
             },
             rangeUpdate(e) {
                 let input = $(e.target || e)
                 let value = input.val()
                 let record = input.parents('tr').first()
                 let sku_id = record.find('input[type=checkbox]').val()
                 let sku = this.findSku(sku_id)
                 let cost = sku.cost
 
                 // Update the label
                 input.prev().text(value + ' ' + sku.range.unit)
 
                 // Update the price
                 record.find('.price').text(this.price(cost, value - sku.units_free))
             },
             findSku(id) {
                 for (let i = 0; i < this.skus.length; i++) {
                     if (this.skus[i].id == id) {
                         return this.skus[i];
                     }
                 }
             },
             price(cost, units = 1) {
                 let index = ''
 
                 if (this.discount) {
                     cost = Math.floor(cost * ((100 - this.discount) / 100))
                     index = '\u00B9'
                 }
 
                 return this.$root.price(cost * units) + '/month' + index
             }
         }
     }
 </script>
diff --git a/src/tests/Browser/UsersTest.php b/src/tests/Browser/UsersTest.php
index d4f52439..761b078c 100644
--- a/src/tests/Browser/UsersTest.php
+++ b/src/tests/Browser/UsersTest.php
@@ -1,588 +1,589 @@
 <?php
 
 namespace Tests\Browser;
 
 use App\Discount;
 use App\Entitlement;
 use App\Sku;
 use App\User;
 use App\UserAlias;
 use Tests\Browser;
 use Tests\Browser\Components\Dialog;
 use Tests\Browser\Components\ListInput;
 use Tests\Browser\Components\QuotaInput;
 use Tests\Browser\Components\Toast;
 use Tests\Browser\Pages\Dashboard;
 use Tests\Browser\Pages\Home;
 use Tests\Browser\Pages\UserInfo;
 use Tests\Browser\Pages\UserList;
 use Tests\TestCaseDusk;
 use Illuminate\Foundation\Testing\DatabaseMigrations;
 
 class UsersTest extends TestCaseDusk
 {
     private $profile = [
         'first_name' => 'John',
         'last_name' => 'Doe',
     ];
 
     /**
      * {@inheritDoc}
      */
     public function setUp(): void
     {
         parent::setUp();
 
         $this->deleteTestUser('julia.roberts@kolab.org');
 
         $john = User::where('email', 'john@kolab.org')->first();
         $john->setSettings($this->profile);
         UserAlias::where('user_id', $john->id)
             ->where('alias', 'john.test@kolab.org')->delete();
 
         Entitlement::where('entitleable_id', $john->id)->whereIn('cost', [25, 100])->delete();
 
         $wallet = $john->wallets()->first();
         $wallet->discount()->dissociate();
         $wallet->save();
     }
 
     /**
      * {@inheritDoc}
      */
     public function tearDown(): void
     {
         $this->deleteTestUser('julia.roberts@kolab.org');
 
         $john = User::where('email', 'john@kolab.org')->first();
         $john->setSettings($this->profile);
         UserAlias::where('user_id', $john->id)
             ->where('alias', 'john.test@kolab.org')->delete();
 
         Entitlement::where('entitleable_id', $john->id)->whereIn('cost', [25, 100])->delete();
 
         $wallet = $john->wallets()->first();
         $wallet->discount()->dissociate();
         $wallet->save();
 
         parent::tearDown();
     }
 
     /**
      * Test user info page (unauthenticated)
      */
     public function testInfoUnauth(): void
     {
         // Test that the page requires authentication
         $this->browse(function (Browser $browser) {
             $user = User::where('email', 'john@kolab.org')->first();
 
             $browser->visit('/user/' . $user->id)->on(new Home());
         });
     }
 
     /**
      * Test users list page (unauthenticated)
      */
     public function testListUnauth(): void
     {
         // Test that the page requires authentication
         $this->browse(function (Browser $browser) {
             $browser->visit('/users')->on(new Home());
         });
     }
 
     /**
      * Test users list page
      */
     public function testList(): void
     {
         // Test that the page requires authentication
         $this->browse(function (Browser $browser) {
             $browser->visit(new Home())
                 ->submitLogon('john@kolab.org', 'simple123', true)
                 ->on(new Dashboard())
                 ->assertSeeIn('@links .link-users', 'User accounts')
                 ->click('@links .link-users')
                 ->on(new UserList())
                 ->whenAvailable('@table', function (Browser $browser) {
                     $browser->assertElementsCount('tbody tr', 4)
                         ->assertSeeIn('tbody tr:nth-child(1) a', 'jack@kolab.org')
                         ->assertSeeIn('tbody tr:nth-child(2) a', 'joe@kolab.org')
                         ->assertSeeIn('tbody tr:nth-child(3) a', 'john@kolab.org')
                         ->assertSeeIn('tbody tr:nth-child(4) a', 'ned@kolab.org')
                         ->assertVisible('tbody tr:nth-child(1) button.button-delete')
                         ->assertVisible('tbody tr:nth-child(2) button.button-delete')
                         ->assertVisible('tbody tr:nth-child(3) button.button-delete')
                         ->assertVisible('tbody tr:nth-child(4) button.button-delete');
                 });
         });
     }
 
     /**
      * Test user account editing page (not profile page)
      *
      * @depends testList
      */
     public function testInfo(): void
     {
         $this->browse(function (Browser $browser) {
             $browser->on(new UserList())
                 ->click('@table tr:nth-child(3) a')
                 ->on(new UserInfo())
                 ->assertSeeIn('#user-info .card-title', 'User account')
                 ->with('@form', function (Browser $browser) {
                     // Assert form content
                     $browser->assertSeeIn('div.row:nth-child(1) label', 'Status')
                         ->assertSeeIn('div.row:nth-child(1) #status', 'Active')
                         ->assertFocused('div.row:nth-child(2) input')
                         ->assertSeeIn('div.row:nth-child(2) label', 'First name')
                         ->assertValue('div.row:nth-child(2) input[type=text]', $this->profile['first_name'])
                         ->assertSeeIn('div.row:nth-child(3) label', 'Last name')
                         ->assertValue('div.row:nth-child(3) input[type=text]', $this->profile['last_name'])
                         ->assertSeeIn('div.row:nth-child(4) label', 'Email')
                         ->assertValue('div.row:nth-child(4) input[type=text]', 'john@kolab.org')
                         ->assertDisabled('div.row:nth-child(4) input[type=text]')
                         ->assertSeeIn('div.row:nth-child(5) label', 'Email aliases')
                         ->assertVisible('div.row:nth-child(5) .list-input')
                         ->with(new ListInput('#aliases'), function (Browser $browser) {
                             $browser->assertListInputValue(['john.doe@kolab.org'])
                                 ->assertValue('@input', '');
                         })
                         ->assertSeeIn('div.row:nth-child(6) label', 'Password')
                         ->assertValue('div.row:nth-child(6) input[type=password]', '')
                         ->assertSeeIn('div.row:nth-child(7) label', 'Confirm password')
                         ->assertValue('div.row:nth-child(7) input[type=password]', '')
                         ->assertSeeIn('button[type=submit]', 'Submit');
 
                     // Clear some fields and submit
                     $browser->type('#first_name', '')
                         ->type('#last_name', '')
                         ->click('button[type=submit]');
                 })
                 ->with(new Toast(Toast::TYPE_SUCCESS), function (Browser $browser) {
                     $browser->assertToastTitle('')
                         ->assertToastMessage('User data updated successfully')
                         ->closeToast();
                 });
 
             // Test error handling (password)
             $browser->with('@form', function (Browser $browser) {
                 $browser->type('#password', 'aaaaaa')
                     ->type('#password_confirmation', '')
                     ->click('button[type=submit]')
                     ->waitFor('#password + .invalid-feedback')
                     ->assertSeeIn('#password + .invalid-feedback', 'The password confirmation does not match.')
                     ->assertFocused('#password');
             })
             ->with(new Toast(Toast::TYPE_ERROR), function (Browser $browser) {
                 $browser->assertToastTitle('Error')
                     ->assertToastMessage('Form validation error')
                     ->closeToast();
             });
 
             // TODO: Test password change
 
             // Test form error handling (aliases)
             $browser->with('@form', function (Browser $browser) {
                 // TODO: For some reason, clearing the input value
                 // with ->type('#password', '') does not work, maybe some dusk/vue intricacy
                 // For now we just use the default password
                 $browser->type('#password', 'simple123')
                     ->type('#password_confirmation', 'simple123')
                     ->with(new ListInput('#aliases'), function (Browser $browser) {
                         $browser->addListEntry('invalid address');
                     })
                     ->click('button[type=submit]');
             })
             ->with(new Toast(Toast::TYPE_ERROR), function (Browser $browser) {
                 $browser->assertToastTitle('Error')
                     ->assertToastMessage('Form validation error')
                     ->closeToast();
             })
             ->with('@form', function (Browser $browser) {
                 $browser->with(new ListInput('#aliases'), function (Browser $browser) {
                     $browser->assertFormError(2, 'The specified alias is invalid.', false);
                 });
             });
 
             // Test adding aliases
             $browser->with('@form', function (Browser $browser) {
                 $browser->with(new ListInput('#aliases'), function (Browser $browser) {
                     $browser->removeListEntry(2)
                         ->addListEntry('john.test@kolab.org');
                 })
                     ->click('button[type=submit]');
             })
             ->with(new Toast(Toast::TYPE_SUCCESS), function (Browser $browser) {
                 $browser->assertToastTitle('')
                     ->assertToastMessage('User data updated successfully')
                     ->closeToast();
             });
 
             $john = User::where('email', 'john@kolab.org')->first();
             $alias = UserAlias::where('user_id', $john->id)->where('alias', 'john.test@kolab.org')->first();
             $this->assertTrue(!empty($alias));
 
             // Test subscriptions
             $browser->with('@form', function (Browser $browser) {
                 $browser->assertSeeIn('div.row:nth-child(8) label', 'Subscriptions')
                     ->assertVisible('@skus.row:nth-child(8)')
                     ->with('@skus', function ($browser) {
                         $browser->assertElementsCount('tbody tr', 5)
                             // Mailbox SKU
                             ->assertSeeIn('tbody tr:nth-child(1) td.name', 'User Mailbox')
                             ->assertSeeIn('tbody tr:nth-child(1) td.price', '4,44 CHF/month')
                             ->assertChecked('tbody tr:nth-child(1) td.selection input')
                             ->assertDisabled('tbody tr:nth-child(1) td.selection input')
                             ->assertTip(
                                 'tbody tr:nth-child(1) td.buttons button',
                                 'Just a mailbox'
                             )
                             // Storage SKU
                             ->assertSeeIn('tbody tr:nth-child(2) td.name', 'Storage Quota')
                             ->assertSeeIn('tr:nth-child(2) td.price', '0,00 CHF/month')
                             ->assertChecked('tbody tr:nth-child(2) td.selection input')
                             ->assertDisabled('tbody tr:nth-child(2) td.selection input')
                             ->assertTip(
                                 'tbody tr:nth-child(2) td.buttons button',
                                 'Some wiggle room'
                             )
                             ->with(new QuotaInput('tbody tr:nth-child(2) .range-input'), function ($browser) {
                                 $browser->assertQuotaValue(2)->setQuotaValue(3);
                             })
                             ->assertSeeIn('tr:nth-child(2) td.price', '0,25 CHF/month')
                             // groupware SKU
                             ->assertSeeIn('tbody tr:nth-child(3) td.name', 'Groupware Features')
                             ->assertSeeIn('tbody tr:nth-child(3) td.price', '5,55 CHF/month')
                             ->assertChecked('tbody tr:nth-child(3) td.selection input')
                             ->assertEnabled('tbody tr:nth-child(3) td.selection input')
                             ->assertTip(
                                 'tbody tr:nth-child(3) td.buttons button',
                                 'Groupware functions like Calendar, Tasks, Notes, etc.'
                             )
                             // ActiveSync SKU
                             ->assertSeeIn('tbody tr:nth-child(4) td.name', 'Activesync')
                             ->assertSeeIn('tbody tr:nth-child(4) td.price', '1,00 CHF/month')
                             ->assertNotChecked('tbody tr:nth-child(4) td.selection input')
                             ->assertEnabled('tbody tr:nth-child(4) td.selection input')
                             ->assertTip(
                                 'tbody tr:nth-child(4) td.buttons button',
                                 'Mobile synchronization'
                             )
                             // 2FA SKU
                             ->assertSeeIn('tbody tr:nth-child(5) td.name', '2-Factor Authentication')
                             ->assertSeeIn('tbody tr:nth-child(5) td.price', '0,00 CHF/month')
                             ->assertNotChecked('tbody tr:nth-child(5) td.selection input')
                             ->assertEnabled('tbody tr:nth-child(5) td.selection input')
                             ->assertTip(
                                 'tbody tr:nth-child(5) td.buttons button',
                                 'Two factor authentication for webmail and administration panel'
                             )
                             ->click('tbody tr:nth-child(4) td.selection input');
                     })
                     ->assertMissing('@skus table + .hint')
                     ->click('button[type=submit]');
             })
             ->with(new Toast(Toast::TYPE_SUCCESS), function (Browser $browser) {
                 $browser->assertToastTitle('')
                     ->assertToastMessage('User data updated successfully')
                     ->closeToast();
             });
 
             $expected = ['activesync', 'groupware', 'mailbox', 'storage', 'storage', 'storage'];
             $this->assertUserEntitlements($john, $expected);
 
             // Test subscriptions interaction
             $browser->with('@form', function (Browser $browser) {
                 $browser->with('@skus', function ($browser) {
                     // Uncheck 'groupware', expect activesync unchecked
                     $browser->click('@sku-input-groupware')
                         ->assertNotChecked('@sku-input-groupware')
                         ->assertNotChecked('@sku-input-activesync')
                         ->assertEnabled('@sku-input-activesync')
                         ->assertNotReadonly('@sku-input-activesync')
                         // Check 'activesync', expect an alert
                         ->click('@sku-input-activesync')
                         ->assertDialogOpened('Activesync requires Groupware Features.')
                         ->acceptDialog()
                         ->assertNotChecked('@sku-input-activesync')
                         // Check '2FA', expect 'activesync' unchecked and readonly
                         ->click('@sku-input-2fa')
                         ->assertChecked('@sku-input-2fa')
                         ->assertNotChecked('@sku-input-activesync')
                         ->assertReadonly('@sku-input-activesync')
                         // Uncheck '2FA'
                         ->click('@sku-input-2fa')
                         ->assertNotChecked('@sku-input-2fa')
                         ->assertNotReadonly('@sku-input-activesync');
                 });
             });
         });
     }
 
     /**
      * Test user adding page
      *
      * @depends testList
      */
     public function testNewUser(): void
     {
         $this->browse(function (Browser $browser) {
             $browser->visit(new UserList())
                 ->assertSeeIn('button.create-user', 'Create user')
                 ->click('button.create-user')
                 ->on(new UserInfo())
                 ->assertSeeIn('#user-info .card-title', 'New user account')
                 ->with('@form', function (Browser $browser) {
                     // Assert form content
                     $browser->assertFocused('div.row:nth-child(1) input')
                         ->assertSeeIn('div.row:nth-child(1) label', 'First name')
                         ->assertValue('div.row:nth-child(1) input[type=text]', '')
                         ->assertSeeIn('div.row:nth-child(2) label', 'Last name')
                         ->assertValue('div.row:nth-child(2) input[type=text]', '')
                         ->assertSeeIn('div.row:nth-child(3) label', 'Email')
                         ->assertValue('div.row:nth-child(3) input[type=text]', '')
                         ->assertEnabled('div.row:nth-child(3) input[type=text]')
                         ->assertSeeIn('div.row:nth-child(4) label', 'Email aliases')
                         ->assertVisible('div.row:nth-child(4) .list-input')
                         ->with(new ListInput('#aliases'), function (Browser $browser) {
                             $browser->assertListInputValue([])
                                 ->assertValue('@input', '');
                         })
                         ->assertSeeIn('div.row:nth-child(5) label', 'Password')
                         ->assertValue('div.row:nth-child(5) input[type=password]', '')
                         ->assertSeeIn('div.row:nth-child(6) label', 'Confirm password')
                         ->assertValue('div.row:nth-child(6) input[type=password]', '')
                         ->assertSeeIn('div.row:nth-child(7) label', 'Package')
                         // assert packages list widget, select "Lite Account"
                         ->with('@packages', function ($browser) {
                             $browser->assertElementsCount('tbody tr', 2)
                                 ->assertSeeIn('tbody tr:nth-child(1)', 'Groupware Account')
                                 ->assertSeeIn('tbody tr:nth-child(2)', 'Lite Account')
                                 ->assertSeeIn('tbody tr:nth-child(1) .price', '9,99 CHF/month')
                                 ->assertSeeIn('tbody tr:nth-child(2) .price', '4,44 CHF/month')
                                 ->assertChecked('tbody tr:nth-child(1) input')
                                 ->click('tbody tr:nth-child(2) input')
                                 ->assertNotChecked('tbody tr:nth-child(1) input')
                                 ->assertChecked('tbody tr:nth-child(2) input');
                         })
                         ->assertMissing('@packages table + .hint')
                         ->assertSeeIn('button[type=submit]', 'Submit');
 
                     // Test browser-side required fields and error handling
                     $browser->click('button[type=submit]')
                         ->assertFocused('#email')
                         ->type('#email', 'invalid email')
                         ->click('button[type=submit]')
                         ->assertFocused('#password')
                         ->type('#password', 'simple123')
                         ->click('button[type=submit]')
                         ->assertFocused('#password_confirmation')
                         ->type('#password_confirmation', 'simple')
                         ->click('button[type=submit]');
                 })
                 ->with(new Toast(Toast::TYPE_ERROR), function (Browser $browser) {
                     $browser->assertToastTitle('Error')
                         ->assertToastMessage('Form validation error')
                         ->closeToast();
                 })
                 ->with('@form', function (Browser $browser) {
                     $browser->assertSeeIn('#email + .invalid-feedback', 'The specified email is invalid.')
                         ->assertSeeIn('#password + .invalid-feedback', 'The password confirmation does not match.');
                 });
 
             // Test form error handling (aliases)
             $browser->with('@form', function (Browser $browser) {
                 $browser->type('#email', 'julia.roberts@kolab.org')
                     ->type('#password_confirmation', 'simple123')
                     ->with(new ListInput('#aliases'), function (Browser $browser) {
                         $browser->addListEntry('invalid address');
                     })
                     ->click('button[type=submit]');
             })
             ->with(new Toast(Toast::TYPE_ERROR), function (Browser $browser) {
                 $browser->assertToastTitle('Error')
                     ->assertToastMessage('Form validation error')
                     ->closeToast();
             })
             ->with('@form', function (Browser $browser) {
                 $browser->with(new ListInput('#aliases'), function (Browser $browser) {
                     $browser->assertFormError(1, 'The specified alias is invalid.', false);
                 });
             });
 
             // Successful account creation
             $browser->with('@form', function (Browser $browser) {
                 $browser->with(new ListInput('#aliases'), function (Browser $browser) {
                     $browser->removeListEntry(1)
                         ->addListEntry('julia.roberts2@kolab.org');
                 })
                     ->click('button[type=submit]');
             })
             ->with(new Toast(Toast::TYPE_SUCCESS), function (Browser $browser) {
                 $browser->assertToastTitle('')
                     ->assertToastMessage('User created successfully')
                     ->closeToast();
             })
             // check redirection to users list
             ->waitForLocation('/users')
             ->on(new UserList())
                 ->whenAvailable('@table', function (Browser $browser) {
                     $browser->assertElementsCount('tbody tr', 5)
                         ->assertSeeIn('tbody tr:nth-child(4) a', 'julia.roberts@kolab.org');
                 });
 
             $julia = User::where('email', 'julia.roberts@kolab.org')->first();
             $alias = UserAlias::where('user_id', $julia->id)->where('alias', 'julia.roberts2@kolab.org')->first();
             $this->assertTrue(!empty($alias));
             $this->assertUserEntitlements($julia, ['mailbox', 'storage', 'storage']);
         });
     }
 
     /**
      * Test user delete
      *
      * @depends testNewUser
      */
     public function testDeleteUser(): void
     {
         // First create a new user
         $john = $this->getTestUser('john@kolab.org');
         $julia = $this->getTestUser('julia.roberts@kolab.org');
         $package_kolab = \App\Package::where('title', 'kolab')->first();
         $john->assignPackage($package_kolab, $julia);
 
         // Test deleting non-controller user
         $this->browse(function (Browser $browser) {
             $browser->visit(new UserList())
                 ->whenAvailable('@table', function (Browser $browser) {
                     $browser->assertElementsCount('tbody tr', 5)
                         ->assertSeeIn('tbody tr:nth-child(4) a', 'julia.roberts@kolab.org')
                         ->click('tbody tr:nth-child(4) button.button-delete');
                 })
                 ->with(new Dialog('#delete-warning'), function (Browser $browser) {
                     $browser->assertSeeIn('@title', 'Delete julia.roberts@kolab.org')
                         ->assertFocused('@button-cancel')
                         ->assertSeeIn('@button-cancel', 'Cancel')
                         ->assertSeeIn('@button-action', 'Delete')
                         ->click('@button-cancel');
                 })
                 ->whenAvailable('@table', function (Browser $browser) {
                     $browser->click('tbody tr:nth-child(4) button.button-delete');
                 })
                 ->with(new Dialog('#delete-warning'), function (Browser $browser) {
                     $browser->click('@button-action');
                 })
                 ->with(new Toast(Toast::TYPE_SUCCESS), function (Browser $browser) {
                     $browser->assertToastTitle('')
                         ->assertToastMessage('User deleted successfully')
                         ->closeToast();
                 })
                 ->with('@table', function (Browser $browser) {
                     $browser->assertElementsCount('tbody tr', 4)
                         ->assertSeeIn('tbody tr:nth-child(1) a', 'jack@kolab.org')
                         ->assertSeeIn('tbody tr:nth-child(2) a', 'joe@kolab.org')
                         ->assertSeeIn('tbody tr:nth-child(3) a', 'john@kolab.org')
                         ->assertSeeIn('tbody tr:nth-child(4) a', 'ned@kolab.org');
                 });
 
             $julia = User::where('email', 'julia.roberts@kolab.org')->first();
             $this->assertTrue(empty($julia));
 
             // Test clicking Delete on the controller record redirects to /profile/delete
             $browser
                 ->with('@table', function (Browser $browser) {
                     $browser->click('tbody tr:nth-child(3) button.button-delete');
                 })
                 ->waitForLocation('/profile/delete');
         });
 
         // Test that non-controller user cannot see/delete himself on the users list
         // Note: Access to /profile/delete page is tested in UserProfileTest.php
         $this->browse(function (Browser $browser) {
             $browser->visit('/logout')
                 ->on(new Home())
                 ->submitLogon('jack@kolab.org', 'simple123', true)
                 ->visit(new UserList())
                 ->whenAvailable('@table', function (Browser $browser) {
                     $browser->assertElementsCount('tbody tr', 0);
                 });
         });
 
         // Test that controller user (Ned) can see/delete all the users ???
         $this->browse(function (Browser $browser) {
             $browser->visit('/logout')
                 ->on(new Home())
                 ->submitLogon('ned@kolab.org', 'simple123', true)
                 ->visit(new UserList())
                 ->whenAvailable('@table', function (Browser $browser) {
                     $browser->assertElementsCount('tbody tr', 4)
                         ->assertElementsCount('tbody button.button-delete', 4);
                 });
 
                 // TODO: Test the delete action in details
         });
 
         // TODO: Test what happens with the logged in user session after he's been deleted by another user
     }
 
     /**
      * Test discounted sku/package prices in the UI
      */
     public function testDiscountedPrices(): void
     {
         // Add 10% discount
         $discount = Discount::where('code', 'TEST')->first();
         $john = User::where('email', 'john@kolab.org')->first();
         $wallet = $john->wallet();
         $wallet->discount()->associate($discount);
         $wallet->save();
 
         // SKUs on user edit page
         $this->browse(function (Browser $browser) {
             $browser->visit('/logout')
                 ->on(new Home())
                 ->submitLogon('john@kolab.org', 'simple123', true)
                 ->visit(new UserList())
                 ->click('@table tr:nth-child(2) a')
                 ->on(new UserInfo())
                 ->with('@form', function (Browser $browser) {
                     $browser->whenAvailable('@skus', function (Browser $browser) {
                         $quota_input = new QuotaInput('tbody tr:nth-child(2) .range-input');
-                        $browser->assertElementsCount('tbody tr', 5)
+                        $browser->waitFor('tbody tr')
+                            ->assertElementsCount('tbody tr', 5)
                             // Mailbox SKU
                             ->assertSeeIn('tbody tr:nth-child(1) td.price', '3,99 CHF/month¹')
                             // Storage SKU
                             ->assertSeeIn('tr:nth-child(2) td.price', '0,00 CHF/month¹')
                             ->with($quota_input, function (Browser $browser) {
                                 $browser->setQuotaValue(100);
                             })
                             ->assertSeeIn('tr:nth-child(2) td.price', '21,56 CHF/month¹')
                             // groupware SKU
                             ->assertSeeIn('tbody tr:nth-child(3) td.price', '4,99 CHF/month¹')
                             // ActiveSync SKU
                             ->assertSeeIn('tbody tr:nth-child(4) td.price', '0,90 CHF/month¹')
                             // 2FA SKU
                             ->assertSeeIn('tbody tr:nth-child(5) td.price', '0,00 CHF/month¹');
                     })
                     ->assertSeeIn('@skus table + .hint', '¹ applied discount: 10% - Test voucher');
                 });
         });
 
         // Packages on new user page
         $this->browse(function (Browser $browser) {
             $browser->visit(new UserList())
                 ->click('button.create-user')
                 ->on(new UserInfo())
                 ->with('@form', function (Browser $browser) {
                     $browser->whenAvailable('@packages', function (Browser $browser) {
                         $browser->assertElementsCount('tbody tr', 2)
                             ->assertSeeIn('tbody tr:nth-child(1) .price', '8,99 CHF/month¹') // Groupware
                             ->assertSeeIn('tbody tr:nth-child(2) .price', '3,99 CHF/month¹'); // Lite
                     })
                     ->assertSeeIn('@packages table + .hint', '¹ applied discount: 10% - Test voucher');
                 });
         });
     }
 }