Streamline menus

accounts/ui/app.js

@@ -27,7 +27,8 @@ const navItems = [
     route: {
       name: 'accounts',
       path: `/${appInfo.id}/`
-    }
+    },
+    menu: 'user'
   }
 ]
 

accounts/ui/components/App.vue

@@ -16,6 +16,12 @@
           </div>
         </oc-grid>
       </template>
+      <template v-else-if="hasFailed">
+        <oc-alert variation="warning" no-close class="oc-m">
+          <oc-icon name="warning" variation="warning" class="uk-float-left oc-mr-s" />
+          <translate>You don't have permissions to manage accounts.</translate>
+        </oc-alert>
+      </template>
       <oc-loader v-else />
     </div>
   </div>
@@ -31,7 +37,7 @@ export default {
   name: 'App',
   components: { AccountsBatchActions, AccountsList, AccountsCreate },
   computed: {
-    ...mapGetters('Accounts', ['isInitialized', 'getAccountsSorted', 'isAnyAccountSelected']),
+    ...mapGetters('Accounts', ['isInitialized', 'hasFailed', 'getAccountsSorted', 'isAnyAccountSelected']),
     ...mapState('Accounts', ['selectedAccounts']),
 
     accounts () {

accounts/ui/components/accounts/AccountsList.vue

@@ -5,11 +5,11 @@
         <oc-table-row class="fix-table-header">
           <oc-table-cell shrink type="head" class="uk-text-center">
             <oc-checkbox
-                class="oc-ml-s"
-                :value="areAllAccountsSelected"
-                @input="toggleSelectionAll"
-                :label="$gettext('Select all users')"
-                hide-label
+              class="oc-ml-s"
+              :value="areAllAccountsSelected"
+              @input="toggleSelectionAll"
+              :label="$gettext('Select all users')"
+              hide-label
             />
           </oc-table-cell>
           <oc-table-cell shrink type="head" />

accounts/ui/store/index.js

@@ -12,6 +12,7 @@ import { injectAuthToken } from '../helpers/auth'
 const state = {
   config: null,
   initialized: false,
+  failed: false,
   accounts: {},
   roles: null,
   selectedAccounts: []
@@ -20,6 +21,7 @@ const state = {
 const getters = {
   config: state => state.config,
   isInitialized: state => state.initialized,
+  hasFailed: state => state.failed,
   getAccountsSorted: state => {
     return Object.values(state.accounts).sort((a1, a2) => {
       if (a1.onPremisesSamAccountName === a2.onPremisesSamAccountName) {
@@ -39,6 +41,9 @@ const mutations = {
   SET_INITIALIZED (state, value) {
     state.initialized = value
   },
+  SET_FAILED (state, value) {
+    state.failed = value
+  },
   SET_ACCOUNTS (state, accounts) {
     state.accounts = accounts
   },
@@ -47,7 +52,6 @@ const mutations = {
   },
   TOGGLE_SELECTION_ACCOUNT (state, account) {
     const accountIndex = state.selectedAccounts.indexOf(account)
-
     accountIndex > -1 ? state.selectedAccounts.splice(accountIndex, 1) : state.selectedAccounts.push(account)
   },
   SET_SELECTED_ACCOUNTS (state, accounts) {
@@ -80,49 +84,48 @@ const actions = {
     commit('LOAD_CONFIG', config)
   },
 
-  async initialize ({ commit, dispatch }) {
-    await dispatch('fetchAccounts')
-    await dispatch('fetchRoles')
-    commit('SET_INITIALIZED', true)
+  async initialize ({ commit, dispatch, getters }) {
+    await Promise.all([
+      dispatch('fetchAccounts'),
+      dispatch('fetchRoles')
+    ])
+    if (!getters.hasFailed) {
+      commit('SET_INITIALIZED', true)
+    }
   },
 
-  async fetchAccounts ({ commit, dispatch, rootGetters }) {
+  async fetchAccounts ({ commit, rootGetters }) {
     injectAuthToken(rootGetters.user.token)
-    const response = await AccountsService_ListAccounts({
-      $domain: rootGetters.configuration.server,
-      body: {}
-    })
-    if (response.status === 201) {
-      const accounts = response.data.accounts
-      commit('SET_ACCOUNTS', accounts || [])
-    } else {
-      dispatch('showMessage', {
-        title: 'Failed to fetch accounts.',
-        desc: response.statusText,
-        status: 'danger'
-      }, { root: true })
+    try {
+      const response = await AccountsService_ListAccounts({
+        $domain: rootGetters.configuration.server,
+        body: {}
+      })
+      if (response.status === 201) {
+        const accounts = response.data.accounts
+        commit('SET_ACCOUNTS', accounts || [])
+        return
+      }
+    } catch (e) {
     }
+    commit('SET_FAILED', true)
   },
 
-  async fetchRoles ({ commit, dispatch, rootGetters }) {
+  async fetchRoles ({ commit, rootGetters }) {
     injectAuthToken(rootGetters.user.token)
-
-    const response = await RoleService_ListRoles({
-      $domain: rootGetters.configuration.server,
-      body: {}
-    })
-
-    if (response.status === 201) {
-      const roles = response.data.bundles
-
-      commit('SET_ROLES', roles || [])
-    } else {
-      dispatch('showMessage', {
-        title: 'Failed to fetch roles.',
-        desc: response.statusText,
-        status: 'danger'
-      }, { root: true })
+    try {
+      const response = await RoleService_ListRoles({
+        $domain: rootGetters.configuration.server,
+        body: {}
+      })
+      if (response.status === 201) {
+        const roles = response.data.bundles
+        commit('SET_ROLES', roles || [])
+        return
+      }
+    } catch (e) {
     }
+    commit('SET_FAILED', true)
   },
 
   toggleSelectionAll ({ commit, getters, state }) {

changelog/unreleased/account-permissions-error.md

@@ -0,0 +1,5 @@
+Change: Accounts UI shows message when no permissions
+
+We improved the UX of the accounts UI by showing a message information the user about missing permissions when the accounts or roles fail to load. This was showing an indeterminate progress bar before.
+
+https://github.com/owncloud/ocis/pull/656

changelog/unreleased/user-menu.md

@@ -0,0 +1,5 @@
+Change: Settings and accounts appear in the user menu
+
+We moved settings and accounts to the user menu.
+
+https://github.com/owncloud/ocis/pull/656

ocis-phoenix/Makefile

@@ -3,7 +3,7 @@ NAME := ocis-phoenix
 IMPORT := github.com/owncloud/ocis/$(NAME)
 BIN := bin
 DIST := dist
-PHOENIX_ASSETS_VERSION = v0.18.0
+PHOENIX_ASSETS_VERSION = v0.19.0
 
 ifeq ($(OS), Windows_NT)
 	EXECUTABLE := $(NAME).exe

ocis-phoenix/pkg/service/v0/service.go

@@ -70,14 +70,14 @@ func (p Phoenix) getPayload() (payload []byte, err error) {
 
 		if p.config.Phoenix.Config.ExternalApps == nil {
 			p.config.Phoenix.Config.ExternalApps = []config.ExternalApp{
-				{
-					ID:   "accounts",
-					Path: "/accounts.js",
-				},
 				{
 					ID:   "settings",
 					Path: "/settings.js",
 				},
+				{
+					ID:   "accounts",
+					Path: "/accounts.js",
+				},
 			}
 		}
 

settings/ui/app.js

@@ -32,7 +32,8 @@ const navItems = [
     route: {
       name: 'settings',
       path: `/${appInfo.id}/`
-    }
+    },
+    menu: 'user'
   }
 ]