Handle UiKit & iconMaterial removal

Bump web-test-middleware in CI

Remove fileUpload volumes in CI, bump web to official v5.0.0

Rename web changelog & fix settings acceptance test

Add 'Spaces' to settings navBar tests

Add new profile link & quota to settings userMenu tests

Update expected failures from web v5.0.0 release

Bump web commit ID

Bump web commit ID

accounts/ui/app.js

@@ -12,8 +12,7 @@ const appInfo = {
   name: $gettext('Accounts'),
   id: 'accounts',
   icon: 'team',
-  isFileEditor: false,
-  extensions: []
+  isFileEditor: false
 }
 
 const routes = [
@@ -27,7 +26,7 @@ const routes = [
 const navItems = [
   {
     name: $gettext('Accounts'),
-    iconMaterial: appInfo.icon,
+    icon: appInfo.icon,
     route: {
       name: 'accounts',
       path: `/${appInfo.id}/`

accounts/ui/components/App.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <main class="uk-flex uk-flex-column uk-height-1-1 oc-px-s" id="accounts-app">
+    <main class="oc-flex oc-flex-column oc-height-1-1 oc-p-m" id="accounts-app">
       <template v-if="isInitialized">
         <h1 class="oc-invisible-sr">
           <translate>Accounts</translate>
@@ -13,15 +13,24 @@
           />
           <accounts-create v-else />
         </div>
-        <oc-grid class="uk-flex-1 uk-overflow-auto">
-          <div class="uk-width-expand">
+        <oc-grid class="oc-flex-1 oc-overflow-auto">
+          <div class="oc-width-expand">
             <accounts-list :accounts="accounts" />
           </div>
         </oc-grid>
       </template>
       <template v-else-if="hasFailed">
-        <oc-alert variation="warning" no-close class="oc-m" id="accounts-list-loading-failed">
-          <oc-icon name="error-warning" variation="warning" class="uk-float-left oc-mr-s" />
+        <oc-alert
+          variation="warning"
+          no-close
+          class="oc-m"
+          id="accounts-list-loading-failed"
+        >
+          <oc-icon
+            name="error-warning"
+            variation="warning"
+            class="oc-float-left oc-mr-s"
+          />
           <translate>You don't have permissions to manage accounts.</translate>
         </oc-alert>
       </template>
@@ -40,7 +49,12 @@ export default {
   name: 'App',
   components: { AccountsBatchActions, AccountsList, AccountsCreate },
   computed: {
-    ...mapGetters('Accounts', ['isInitialized', 'hasFailed', 'getAccountsSorted', 'isAnyAccountSelected']),
+    ...mapGetters('Accounts', [
+      'isInitialized',
+      'hasFailed',
+      'getAccountsSorted',
+      'isAnyAccountSelected'
+    ]),
     ...mapState('Accounts', ['selectedAccounts']),
 
     accounts () {

accounts/ui/components/accounts/AccountsBatchActions.vue

@@ -1,22 +1,45 @@
 <template>
-  <oc-grid key="selected-accounts-info" gutter="small" class="uk-flex-middle">
+  <oc-grid key="selected-accounts-info" gutter="small" class="oc-flex-middle">
     <span v-text="selectionInfoText" />
     <span>|</span>
     <div>
-      <oc-button v-text="$gettext('Clear selection')" appearance="raw" @click="RESET_ACCOUNTS_SELECTION" />
+      <oc-button
+        v-text="$gettext('Clear selection')"
+        appearance="raw"
+        @click="RESET_ACCOUNTS_SELECTION"
+      />
     </div>
     <oc-grid gutter="small" id="accounts-batch-actions">
       <div v-for="action in actions" :key="action.label">
-        <div v-if="isConfirmationInProgress[action.id]" :variation="action.confirmation.variation || 'primary'" noClose class="uk-flex uk-flex-middle tmp-alert-fixes">
+        <div
+          v-if="isConfirmationInProgress[action.id]"
+          :variation="action.confirmation.variation || 'primary'"
+          noClose
+          class="oc-flex oc-flex-middle tmp-alert-fixes"
+        >
           <span>{{ action.confirmation.message }}</span>
-          <oc-button :id="action.confirmation.cancel.id" @click="action.confirmation.cancel.handler" :variation="action.confirmation.cancel.variation || 'passive'">
+          <oc-button
+            :id="action.confirmation.cancel.id"
+            @click="action.confirmation.cancel.handler"
+            :variation="action.confirmation.cancel.variation || 'passive'"
+          >
             {{ action.confirmation.cancel.label }}
           </oc-button>
-          <oc-button :id="action.confirmation.confirm.id" @click="action.confirmation.confirm.handler" :variation="action.confirmation.confirm.variation || 'primary'">
+          <oc-button
+            :id="action.confirmation.confirm.id"
+            @click="action.confirmation.confirm.handler"
+            :variation="action.confirmation.confirm.variation || 'primary'"
+          >
             {{ action.confirmation.confirm.label }}
           </oc-button>
         </div>
-        <oc-button v-else :id="action.id" @click="action.handler" :variation="action.variation || 'primary'" :icon="action.icon">
+        <oc-button
+          v-else
+          :id="action.id"
+          @click="action.handler"
+          :variation="action.variation || 'primary'"
+          :icon="action.icon"
+        >
           {{ action.label }}
         </oc-button>
       </div>

accounts/ui/components/accounts/AccountsCreate.vue

@@ -28,7 +28,7 @@
         :disabled="isRequestInProgress"
         @keydown.enter="createAccount"
       />
-      <div class="uk-flex">
+      <div class="oc-flex">
         <oc-button
           class="oc-mr-s oc-mb-s"
           v-text="$gettext('Cancel')"
@@ -51,7 +51,11 @@
             size="small"
             aria-hidden="true"
           />
-          <span v-text="isRequestInProgress ? $gettext('Creating') : $gettext('Create')" />
+          <span
+            v-text="
+              isRequestInProgress ? $gettext('Creating') : $gettext('Create')
+            "
+          />
         </oc-button>
       </div>
     </oc-grid>

accounts/ui/components/accounts/AccountsList.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <oc-table-simple id="accounts-user-list">
+    <oc-table-simple id="accounts-user-list" class="oc-mt-l">
       <oc-thead>
         <oc-tr>
           <oc-th shrink type="head" align-h="center">
@@ -17,7 +17,12 @@
           <oc-th type="head" v-text="$gettext('Display name')" />
           <oc-th type="head" v-text="$gettext('Email')" />
           <oc-th type="head" v-text="$gettext('Role')" />
-          <oc-th shrink type="head" v-text="$gettext('Activated')" align-h="center"/>
+          <oc-th
+            shrink
+            type="head"
+            v-text="$gettext('Activated')"
+            align-h="center"
+          />
         </oc-tr>
       </oc-thead>
       <oc-tbody>

accounts/ui/components/accounts/AccountsListRow.vue

@@ -12,15 +12,23 @@
       />
     </oc-td>
     <oc-td>
-      <avatar :user-name="account.displayName || account.onPremisesSamAccountName" :userid="account.id" :width="35" />
+      <avatar
+        :user-name="account.displayName || account.onPremisesSamAccountName"
+        :userid="account.id"
+        :width="35"
+      />
     </oc-td>
     <oc-td v-text="account.onPremisesSamAccountName" />
     <oc-td v-text="account.displayName || '-'" />
     <oc-td v-text="account.mail" />
     <oc-td>
-      <oc-button :id="`accounts-roles-select-trigger-${account.id}`" class="accounts-roles-select-trigger" appearance="outline">
-        <span class="uk-flex uk-flex-middle accounts-roles-current-role">
-          {{ currentRole ? currentRole.displayName : $gettext('Select role') }}
+      <oc-button
+        :id="`accounts-roles-select-trigger-${account.id}`"
+        class="accounts-roles-select-trigger"
+        appearance="outline"
+      >
+        <span class="oc-flex oc-flex-middle accounts-roles-current-role">
+          {{ currentRole ? currentRole.displayName : $gettext("Select role") }}
           <oc-icon name="arrow-down-s" aria-hidden="true" />
         </span>
       </oc-button>
@@ -31,7 +39,7 @@
         close-on-click
         :options="{ delayHide: 0 }"
       >
-        <ul class="uk-list">
+        <ul class="oc-list">
           <li v-for="role in roles" :key="role.id">
             <oc-radio
               class="accounts-roles-dropdown-role"