diff --git a/changelog/unreleased/enhancement-add-loading-spinner-to-admin-settings-spaces-and-groups b/changelog/unreleased/enhancement-add-loading-spinner-to-admin-settings-spaces-and-groups
new file mode 100644
index 00000000000..50a813e64dc
--- /dev/null
+++ b/changelog/unreleased/enhancement-add-loading-spinner-to-admin-settings-spaces-and-groups
@@ -0,0 +1,7 @@
+Enhancement: Add loading spinner to admin settings spaces and groups
+
+We've added a loading spinner to the spaces and groups view in the admin settings to indicate loading task,
+when the server needs time to respond.
+
+https://github.com/owncloud/web/pull/10929
+https://github.com/owncloud/web/issues/10922
diff --git a/packages/web-app-admin-settings/src/views/Groups.vue b/packages/web-app-admin-settings/src/views/Groups.vue
index cd4c9e77bfd..e6e0e9c8072 100644
--- a/packages/web-app-admin-settings/src/views/Groups.vue
+++ b/packages/web-app-admin-settings/src/views/Groups.vue
@@ -28,23 +28,26 @@
-
-
- No groups in here
-
-
-
-
-
-
+
+
+
+
+ No groups in here
-
-
+
+
+
+
+
+
+
+
+
@@ -60,6 +63,7 @@ import MembersPanel from '../components/Groups/SideBar/MembersPanel.vue'
import { useGroupSettingsStore } from '../composables'
import { useGroupActionsCreateGroup, useGroupActionsDelete } from '../composables/actions/groups'
import {
+ AppLoadingSpinner,
NoContentMessage,
SideBarPanel,
SideBarPanelContext,
@@ -75,6 +79,7 @@ import { storeToRefs } from 'pinia'
export default defineComponent({
components: {
+ AppLoadingSpinner,
AppTemplate,
GroupsList,
NoContentMessage,
@@ -109,6 +114,10 @@ export default defineComponent({
)
})
+ const isLoading = computed(() => {
+ return loadResourcesTask.isRunning || !loadResourcesTask.last
+ })
+
const sideBarPanelContext = computed>(() => {
return {
parent: null,
@@ -168,7 +177,8 @@ export default defineComponent({
sideBarAvailablePanels,
sideBarPanelContext,
createGroupAction,
- groupSettingsStore
+ groupSettingsStore,
+ isLoading
}
},
computed: {
diff --git a/packages/web-app-admin-settings/src/views/Spaces.vue b/packages/web-app-admin-settings/src/views/Spaces.vue
index 684954bea32..d790dec4676 100644
--- a/packages/web-app-admin-settings/src/views/Spaces.vue
+++ b/packages/web-app-admin-settings/src/views/Spaces.vue
@@ -21,23 +21,26 @@
/>
-
-
- No spaces in here
-
-
-
-
-
-
+
+
+
+
+ No spaces in here
-
-
+
+
+
+
+
+
+
+
+
@@ -67,7 +70,8 @@ import {
useSpaceActionsDisable,
useSpaceActionsRestore,
useSpaceActionsEditQuota,
- useConfigStore
+ useConfigStore,
+ AppLoadingSpinner
} from '@ownclouders/web-pkg'
import { buildSpace, call, SpaceResource } from '@ownclouders/web-client'
import { computed, defineComponent, onBeforeUnmount, onMounted, ref, unref } from 'vue'
@@ -81,6 +85,7 @@ import { Quota } from '@ownclouders/web-client/graph/generated'
export default defineComponent({
name: 'SpacesView',
components: {
+ AppLoadingSpinner,
SpacesList,
AppTemplate,
NoContentMessage,
@@ -126,6 +131,10 @@ export default defineComponent({
spaceSettingsStore.setSpaces(drives)
})
+ const isLoading = computed(() => {
+ return loadResourcesTask.isRunning || !loadResourcesTask.last
+ })
+
const breadcrumbs = computed(() => [
{ text: $gettext('Administration Settings'), to: { path: '/admin-settings' } },
{
@@ -254,6 +263,7 @@ export default defineComponent({
selectedSpaces,
sideBarAvailablePanels,
sideBarPanelContext,
+ isLoading,
template
}
}