-
-
- {{ $t('objects.users') }}
-
-
-
+
+
+
-
-
- {{ $t('general.role') }}
-
-
-
{{ $t('title.dateJoined') }}
diff --git a/packages/nc-gui/components/workspace/CollaboratorsList.vue b/packages/nc-gui/components/workspace/CollaboratorsList.vue
index 7d1848b159..8be248a175 100644
--- a/packages/nc-gui/components/workspace/CollaboratorsList.vue
+++ b/packages/nc-gui/components/workspace/CollaboratorsList.vue
@@ -18,7 +18,7 @@ const currentWorkspace = computed(() => {
return props.workspaceId ? workspaces.value.get(props.workspaceId) : _activeWorkspace.value
})
-const { sorts, sortDirection, loadSorts, saveOrUpdate, handleGetSortedData } = useUserSorts('Workspace')
+const { sorts, loadSorts, handleGetSortedData, toggleSort } = useUserSorts('Workspace')
const userSearchText = ref('')
@@ -117,18 +117,22 @@ onMounted(async () => {
-
-
- {{ $t('objects.users') }}
-
-
-
-
-
- {{ $t('general.access') }}
-
-
-
+
+
+
+
{{ $t('title.dateJoined') }}
{{ $t('labels.actions') }}
diff --git a/packages/nc-gui/composables/useUserSorts.ts b/packages/nc-gui/composables/useUserSorts.ts
index 1692d51952..3e5122407b 100644
--- a/packages/nc-gui/composables/useUserSorts.ts
+++ b/packages/nc-gui/composables/useUserSorts.ts
@@ -131,20 +131,14 @@ export function useUserSorts(roleType: 'Workspace' | 'Org' | 'Project' | 'Organi
return userRoleOrder.indexOf(roleB) - userRoleOrder.indexOf(roleA)
}
}
- case 'email': {
+ case 'email':
+ case 'title': {
if (sortsConfig.direction === 'asc') {
return a[sortsConfig.field]?.localeCompare(b[sortsConfig.field])
} else {
return b[sortsConfig.field]?.localeCompare(a[sortsConfig.field])
}
}
- case 'title': {
- if (sortsConfig.direction === 'asc') {
- return a[sortsConfig.field] - b[sortsConfig.field]
- } else {
- return b[sortsConfig.field] - a[sortsConfig.field]
- }
- }
}
return 0
@@ -182,5 +176,19 @@ export function useUserSorts(roleType: 'Workspace' | 'Org' | 'Project' | 'Organi
return true
}
- return { sorts, sortDirection, loadSorts, saveOrUpdate, handleGetSortedData }
+ const toggleSort = (field: 'email' | 'roles' | 'title' | 'id') => {
+ if (sorts.value.field === field) {
+ saveOrUpdate({
+ field,
+ ...(sortDirection.value[field] === 'asc' ? { direction: 'desc' } : {}),
+ })
+ } else {
+ saveOrUpdate({
+ field,
+ direction: 'asc',
+ })
+ }
+ }
+
+ return { sorts, sortDirection, loadSorts, saveOrUpdate, handleGetSortedData, toggleSort }
}
diff --git a/packages/nc-gui/utils/iconUtils.ts b/packages/nc-gui/utils/iconUtils.ts
index 96ebd44266..3f108a04bd 100644
--- a/packages/nc-gui/utils/iconUtils.ts
+++ b/packages/nc-gui/utils/iconUtils.ts
@@ -61,6 +61,8 @@ import Down from '~icons/material-symbols/keyboard-arrow-down-rounded'
import PhTriangleFill from '~icons/ph/triangle-fill'
import LcSend from '~icons/lucide/send'
import MdiPuzzle from '~icons/mdi/puzzle'
+import MaterialSymbolsArrowDropUp from '~icons/material-symbols/arrow-drop-up'
+import MaterialSymbolsArrowDropDown from '~icons/material-symbols/arrow-drop-down'
import HasManyIcon from '~icons/nc-icons/hasmany'
import ManytoManyIcon from '~icons/nc-icons/manytomany'
@@ -597,6 +599,8 @@ export const iconMap = {
ncSettings: NcSettings,
ncHelp: NcHelp,
puzzle: MdiPuzzle,
+ arrowDropUp: MaterialSymbolsArrowDropUp,
+ arrowDropDown: MaterialSymbolsArrowDropDown,
}
export const getMdiIcon = (type: string): any => {