Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(settings): Split group lists #43804

Merged
merged 3 commits into from
Mar 6, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
63 changes: 34 additions & 29 deletions apps/settings/src/views/Users.vue
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
</template>
</NcAppNavigationNew>

<template #list>
<NcAppNavigationList>
<NcAppNavigationItem id="everyone"
:exact="true"
:name="t('settings', 'Active accounts')"
Expand Down Expand Up @@ -79,41 +79,44 @@
</NcCounterBubble>
</template>
</NcAppNavigationItem>
</NcAppNavigationList>

<NcAppNavigationCaption :name="t('settings', 'Groups')"
:disabled="loadingAddGroup"
:aria-label="loadingAddGroup ? t('settings', 'Creating group …') : t('settings', 'Create group')"
force-menu
is-heading
:open.sync="isAddGroupOpen">
<template #actionsTriggerIcon>
<NcLoadingIcon v-if="loadingAddGroup" />
<Plus v-else :size="20" />
</template>
<template #actions>
<NcActionText>
<template #icon>
<AccountGroup :size="20" />
</template>
{{ t('settings', 'Create group') }}
</NcActionText>
<NcActionInput :label="t('settings', 'Group name')"
data-cy-settings-new-group-name
:label-outside="false"
:disabled="loadingAddGroup"
:value.sync="newGroupName"
:error="hasAddGroupError"
:helper-text="hasAddGroupError ? t('settings', 'Please enter a valid group name') : ''"
@submit="createGroup" />
</template>
</NcAppNavigationCaption>

<NcAppNavigationCaption :name="t('settings', 'Groups')"
:disabled="loadingAddGroup"
:aria-label="loadingAddGroup ? t('settings', 'Creating group …') : t('settings', 'Create group')"
force-menu
:open.sync="isAddGroupOpen">
<template #actionsTriggerIcon>
<NcLoadingIcon v-if="loadingAddGroup" />
<Plus v-else :size="20" />
</template>
<template #actions>
<NcActionText>
<template #icon>
<AccountGroup :size="20" />
</template>
{{ t('settings', 'Create group') }}
</NcActionText>
<NcActionInput :label="t('settings', 'Group name')"
data-cy-settings-new-group-name
:label-outside="false"
:disabled="loadingAddGroup"
:value.sync="newGroupName"
:error="hasAddGroupError"
:helper-text="hasAddGroupError ? t('settings', 'Please enter a valid group name') : ''"
@submit="createGroup" />
</template>
</NcAppNavigationCaption>

<NcAppNavigationList>
<GroupListItem v-for="group in groupList"
:id="group.id"
:key="group.id"
:active="selectedGroupDecoded === group.id"
:name="group.title"
:count="group.count" />
</template>
</NcAppNavigationList>

<template #footer>
<ul class="app-navigation-entry__settings">
Expand Down Expand Up @@ -150,6 +153,7 @@ import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation.js'
import NcAppNavigationCaption from '@nextcloud/vue/dist/Components/NcAppNavigationCaption.js'
import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem.js'
import NcAppNavigationList from '@nextcloud/vue/dist/Components/NcAppNavigationList.js'
import NcAppNavigationNew from '@nextcloud/vue/dist/Components/NcAppNavigationNew.js'
import NcContent from '@nextcloud/vue/dist/Components/NcContent.js'
import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble.js'
Expand Down Expand Up @@ -182,6 +186,7 @@ export default {
NcAppNavigation,
NcAppNavigationCaption,
NcAppNavigationItem,
NcAppNavigationList,
NcAppNavigationNew,
NcContent,
NcCounterBubble,
Expand Down
18 changes: 9 additions & 9 deletions cypress/e2e/settings/users_groups.cy.ts
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ describe('Settings: Create groups', () => {
handlePasswordConfirmation(admin.password)

// see that the created group is in the list
cy.get('ul.app-navigation__list').within(() => {
cy.get('ul.app-navigation-list').within(() => {
// see that the list of groups contains the group foo
cy.contains(groupName).should('exist')
})
Expand All @@ -76,8 +76,8 @@ describe('Settings: Assign user to a group', { testIsolation: false }, () => {
})

it('see that the group is in the list', () => {
cy.get('ul.app-navigation__list').contains('li', groupName).should('exist')
cy.get('ul.app-navigation__list').contains('li', groupName).within(() => {
cy.get('ul.app-navigation-list').contains('li', groupName).should('exist')
cy.get('ul.app-navigation-list').contains('li', groupName).within(() => {
cy.get('.counter-bubble__counter')
.should('not.exist') // is hidden when 0
})
Expand Down Expand Up @@ -118,7 +118,7 @@ describe('Settings: Assign user to a group', { testIsolation: false }, () => {

it('see the group was successfully assigned', () => {
// see a new memeber
cy.get('ul.app-navigation__list')
cy.get('ul.app-navigation-list')
.contains('li', groupName)
.find('.counter-bubble__counter')
.should('contain', '1')
Expand All @@ -142,7 +142,7 @@ describe('Settings: Delete an empty group', { testIsolation: false }, () => {
})

it('see that the group is in the list', () => {
cy.get('ul.app-navigation__list').within(() => {
cy.get('ul.app-navigation-list').within(() => {
// see that the list of groups contains the group foo
cy.contains(groupName).should('exist').scrollIntoView()
// open the actions menu for the group
Expand All @@ -163,7 +163,7 @@ describe('Settings: Delete an empty group', { testIsolation: false }, () => {
})

it('deleted group is not shown anymore', () => {
cy.get('ul.app-navigation__list').within(() => {
cy.get('ul.app-navigation-list').within(() => {
// see that the list of groups does not contain the group
cy.contains(groupName).should('not.exist')
})
Expand Down Expand Up @@ -192,12 +192,12 @@ describe('Settings: Delete a non empty group', () => {

it('see that the group is in the list', () => {
// see that the list of groups contains the group
cy.get('ul.app-navigation__list').contains('li', groupName).should('exist').scrollIntoView()
cy.get('ul.app-navigation-list').contains('li', groupName).should('exist').scrollIntoView()
})

it('can delete the group', () => {
// open the menu
cy.get('ul.app-navigation__list')
cy.get('ul.app-navigation-list')
.contains('li', groupName)
.find('button.action-item__menutoggle')
.click({ force: true })
Expand All @@ -212,7 +212,7 @@ describe('Settings: Delete a non empty group', () => {
})

it('deleted group is not shown anymore', () => {
cy.get('ul.app-navigation__list').within(() => {
cy.get('ul.app-navigation-list').within(() => {
// see that the list of groups does not contain the group foo
cy.contains(groupName).should('not.exist')
})
Expand Down
4 changes: 2 additions & 2 deletions dist/settings-users-3239.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/settings-users-3239.js.map

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions dist/settings-vue-settings-apps-users-management.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/settings-vue-settings-apps-users-management.js.map

Large diffs are not rendered by default.

Loading