Merge pull request #3157 from owncloud/update-web-5.0.0

[full-ci] Update web to v5.0.0
owncloud · Feb 15, 2022 · 9152a71 · 9152a71
2 parents 13a9b8e + ab82aee
commit 9152a71
Show file tree

Hide file tree

Showing 23 changed files with 190 additions and 133 deletions.
diff --git a/.drone.env b/.drone.env
@@ -3,5 +3,5 @@ CORE_COMMITID=cb9a31fd45721406ee150682d86e29e1b2e8b0d8
 CORE_BRANCH=master
 
 # The test runner source for UI tests
-WEB_COMMITID=262398e513253d3296792434ecc4a96fa1c19a73
-WEB_BRANCH=testSharesFolderAlwaysVisible
+WEB_COMMITID=905b4e342db0202cdbaa8c21096bf87f179b25f6
+WEB_BRANCH=master
diff --git a/.drone.star b/.drone.star
@@ -7,7 +7,7 @@ OC_CI_GOLANG = "owncloudci/golang:1.17"
 OC_CI_NODEJS = "owncloudci/nodejs:14"
 OC_CI_PHP = "owncloudci/php:7.4"
 OC_CI_WAIT_FOR = "owncloudci/wait-for:latest"
-OC_TESTING_MIDDLEWARE = "owncloud/owncloud-test-middleware:1.3.0"
+OC_TESTING_MIDDLEWARE = "owncloud/owncloud-test-middleware:1.3.1"
 MINIO_MC = "minio/mc:RELEASE.2021-10-07T04-19-58Z"
 REDIS = "redis:6-alpine"
 
@@ -635,16 +635,10 @@ def uiTestPipeline(ctx, filterTags, early_fail, runPart = 1, numberOfParts = 1,
                     "git clone -b $WEB_BRANCH --single-branch --no-tags https://github.com/owncloud/web.git /srv/app/web",
                     "cd /srv/app/web",
                     "git checkout $WEB_COMMITID",
-                    "cp -r tests/acceptance/filesForUpload/* /uploads",
                     "cd tests/acceptance/",
                     "yarn install --immutable",
                     "./run.sh",
                 ],
-                "volumes": [stepVolumeOC10Tests] +
-                           [{
-                               "name": "uploads",
-                               "path": "/uploads",
-                           }],
             },
         ] + failEarly(ctx, early_fail),
         "services": selenium() + middlewareService(),

diff --git a/accounts/package.json b/accounts/package.json
@@ -80,7 +80,7 @@
     "xml-js": "^1.6.11"
   },
   "peerDependencies": {
-    "owncloud-design-system": "^11.0.0"
+    "owncloud-design-system": "^12.1.0"
   },
   "packageManager": "yarn@3.1.0"
 }
diff --git a/accounts/ui/app.js b/accounts/ui/app.js
@@ -11,25 +11,22 @@ function $gettext (msg) {
 const appInfo = {
   name: $gettext('Accounts'),
   id: 'accounts',
-  icon: 'text-vcard',
-  isFileEditor: false,
-  extensions: []
+  icon: 'team',
+  isFileEditor: false
 }
 
 const routes = [
   {
     name: 'accounts',
     path: '/',
-    components: {
-      app: App
-    }
+    component: App
   }
 ]
 
 const navItems = [
   {
     name: $gettext('Accounts'),
-    iconMaterial: appInfo.icon,
+    icon: appInfo.icon,
     route: {
       name: 'accounts',
       path: `/${appInfo.id}/`

diff --git a/accounts/ui/components/App.vue b/accounts/ui/components/App.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <main class="uk-flex uk-flex-column uk-height-1-1" 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="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 () {

diff --git a/accounts/ui/components/accounts/AccountsBatchActions.vue b/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>

diff --git a/accounts/ui/components/accounts/AccountsCreate.vue b/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>
@@ -65,7 +69,7 @@
           gap-size="small"
           @click="setFormInProgress(true)"
         >
-          <oc-icon name="add" />
+          <oc-icon name="user-add" />
           <translate>Create new account</translate>
         </oc-button>
       </div>

diff --git a/accounts/ui/components/accounts/AccountsList.vue b/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>

diff --git a/accounts/ui/components/accounts/AccountsListRow.vue b/accounts/ui/components/accounts/AccountsListRow.vue
@@ -12,16 +12,24 @@
       />
     </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-icon name="expand_more" aria-hidden="true" />
+      <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>
       <oc-drop
@@ -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"
@@ -48,15 +56,15 @@
       <oc-icon
         v-if="account.accountEnabled"
         key="account-icon-enabled"
-        name="ready"
+        name="user-follow"
         variation="success"
         :aria-label="$gettext('Account is activated')"
         class="accounts-status-indicator-enabled"
       />
       <oc-icon
         v-else
-        name="deprecated"
         key="account-icon-disabled"
+        name="user-unfollow"
         variation="danger"
         :aria-label="$gettext('Account is blocked')"
         class="accounts-status-indicator-disabled"

diff --git a/accounts/yarn.lock b/accounts/yarn.lock
@@ -8347,7 +8347,7 @@ __metadata:
     vuex: ^3.5.1
     xml-js: ^1.6.11
   peerDependencies:
-    owncloud-design-system: ^11.0.0
+    owncloud-design-system: ^12.1.0
   languageName: unknown
   linkType: soft
 

diff --git a/changelog/unreleased/update-web-4.8.0.md b/changelog/unreleased/update-web-4.8.0.md
diff --git a/changelog/unreleased/update-web-5.0.0.md b/changelog/unreleased/update-web-5.0.0.md
@@ -0,0 +1,10 @@
+Enhancement: Update ownCloud Web to v5.0.0
+
+Tags: web
+
+We updated ownCloud Web to v5.0.0. Please refer to the changelog (linked) for details on the web release.
+
+https://github.com/owncloud/ocis/pull/2895
+https://github.com/owncloud/ocis/pull/3157
+https://github.com/owncloud/web/releases/tag/v4.8.0
+https://github.com/owncloud/web/releases/tag/v5.0.0
diff --git a/settings/package.json b/settings/package.json
@@ -80,6 +80,6 @@
     "xml-js": "^1.6.11"
   },
   "peerDependencies": {
-    "owncloud-design-system": "^11.0.0"
+    "owncloud-design-system": "^12.1.0"
   }
 }
diff --git a/settings/ui/app.js b/settings/ui/app.js
@@ -4,32 +4,29 @@ import store from './store'
 import translations from './../l10n/translations.json'
 
 // just a dummy function to trick gettext tools
-function $gettext (msg) {
+function $gettext(msg) {
   return msg
 }
 
 const appInfo = {
   name: $gettext('Settings'),
   id: 'settings',
-  icon: 'application',
-  isFileEditor: false,
-  extensions: []
+  icon: 'settings-4',
+  isFileEditor: false
 }
 
 const routes = [
   {
     name: 'settings',
     path: '/:extension?',
-    components: {
-      app: SettingsApp
-    }
+    component: SettingsApp
   }
 ]
 
 const navItems = [
   {
     name: $gettext('Settings'),
-    iconMaterial: appInfo.icon,
+    icon: appInfo.icon,
     route: {
       name: 'settings',
       path: `/${appInfo.id}/`

diff --git a/settings/ui/components/SettingsApp.vue b/settings/ui/components/SettingsApp.vue
@@ -1,16 +1,16 @@
 <template>
   <div class="oc-p">
-    <main class="uk-flex uk-flex-column" id="settings-app">
+    <main class="oc-flex oc-flex-column" id="settings-app">
       <template v-if="initialized">
         <oc-alert v-if="extensions.length === 0" variation="primary" no-close>
-          <p class="uk-flex uk-flex-middle">
-            <oc-icon name="info" class="oc-mr-s" />
+          <p class="oc-flex oc-flex-middle">
+            <oc-icon name="information" class="oc-mr-s" />
             <translate>No settings available</translate>
           </p>
         </oc-alert>
         <template v-else>
           <template v-if="selectedExtensionName">
-            <div class="uk-flex uk-flex-between uk-flex-middle">
+            <div class="oc-flex oc-flex-between oc-flex-middle">
               <h1 class="oc-page-title">
                 {{ selectedExtensionName }}
               </h1>
@@ -96,7 +96,7 @@ export default {
          */
         const navItem = {
           name: this.getExtensionName(extension),
-          iconMaterial: this.getExtensionIcon(extension),
+          icon: this.getExtensionIcon(extension),
           route: {
             name: 'settings',
             path: `/settings/${extension}`
@@ -126,7 +126,7 @@ export default {
       extension = extension || ''
       switch (extension) {
         case 'ocis-accounts':
-          return 'account_circle'
+          return 'team'
         case 'ocis-hello':
           return 'tag_faces'
         default: