mirror of
https://github.com/nextcloud/server.git
synced 2026-06-09 08:44:07 -04:00
fix(files_sharing): ensure share status action works also in grid view
Remove some hacks from files app about the *files_sharing* status action, in general not sure why this hack was there instead of being in the correct app - but it broke the grid view. So now the sharing information is also available in grid view. Moreover the icon is fixed in size to not overflow the actions menu. Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
This commit is contained in:
Ferdinand Thiessen
Andy Scherzinger
parent
a532737e89
commit
be82a4e502
3 changed files with 91 additions and 53 deletions
|
|
@ -25,12 +25,14 @@
|
|||
:open.sync="openedMenu"
|
||||
@close="openedSubmenu = null">
|
||||
<!-- Default actions list-->
|
||||
<NcActionButton v-for="action in enabledMenuActions"
|
||||
<NcActionButton v-for="action, index in enabledMenuActions"
|
||||
:key="action.id"
|
||||
:ref="`action-${action.id}`"
|
||||
class="files-list__row-action"
|
||||
:class="{
|
||||
[`files-list__row-action-${action.id}`]: true,
|
||||
[`files-list__row-action--menu`]: isMenu(action.id)
|
||||
'files-list__row-action--inline': index < enabledInlineActions.length,
|
||||
'files-list__row-action--menu': isMenu(action.id)
|
||||
}"
|
||||
:close-after-click="!isMenu(action.id)"
|
||||
:data-cy-files-list-row-action="action.id"
|
||||
|
|
@ -40,9 +42,11 @@
|
|||
@click="onActionClick(action)">
|
||||
<template #icon>
|
||||
<NcLoadingIcon v-if="loading === action.id" :size="18" />
|
||||
<NcIconSvgWrapper v-else :svg="action.iconSvgInline([source], currentView)" />
|
||||
<NcIconSvgWrapper v-else
|
||||
class="files-list__row-action-icon"
|
||||
:svg="action.iconSvgInline([source], currentView)" />
|
||||
</template>
|
||||
{{ mountType === 'shared' && action.id === 'sharing-status' ? '' : actionDisplayName(action) }}
|
||||
{{ actionDisplayName(action) }}
|
||||
</NcActionButton>
|
||||
|
||||
<!-- Submenu actions list-->
|
||||
|
|
@ -235,10 +239,6 @@ export default defineComponent({
|
|||
getBoundariesElement() {
|
||||
return document.querySelector('.app-content > .files-list')
|
||||
},
|
||||
|
||||
mountType() {
|
||||
return this.source.attributes['mount-type']
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
|
|
@ -358,13 +358,19 @@ main.app-content[style*="mouse-pos-x"] .v-popper__popper {
|
|||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
:deep(.button-vue--icon-and-text, .files-list__row-action-sharing-status) {
|
||||
.button-vue__text {
|
||||
color: var(--color-primary-element);
|
||||
<style scoped lang="scss">
|
||||
.files-list__row-action {
|
||||
--max-icon-size: calc(var(--default-clickable-area) - 2 * var(--default-grid-baseline));
|
||||
|
||||
// inline icons can have clickable area size so they still fit into the row
|
||||
&.files-list__row-action--inline {
|
||||
--max-icon-size: var(--default-clickable-area);
|
||||
}
|
||||
.button-vue__icon {
|
||||
color: var(--color-primary-element);
|
||||
|
||||
// Some icons exceed the default size so we need to enforce a max width and height
|
||||
.files-list__row-action-icon :deep(svg) {
|
||||
max-height: var(--max-icon-size) !important;
|
||||
max-width: var(--max-icon-size) !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -18,3 +18,12 @@ svg.sharing-status__avatar {
|
|||
border-radius: 32px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.files-list__row-action-sharing-status {
|
||||
.button-vue__text {
|
||||
color: var(--color-primary-element);
|
||||
}
|
||||
.button-vue__icon {
|
||||
color: var(--color-primary-element);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,13 +4,13 @@
|
|||
*/
|
||||
import type { User } from '@nextcloud/cypress'
|
||||
import { createShare } from './FilesSharingUtils.ts'
|
||||
import { closeSidebar, getRowForFile } from '../files/FilesUtils.ts'
|
||||
import { closeSidebar, enableGridMode, getActionButtonForFile, getRowForFile } from '../files/FilesUtils.ts'
|
||||
|
||||
describe('files_sharing: Files inline status action', { testIsolation: true }, () => {
|
||||
describe('files_sharing: Sharing status action', { testIsolation: true }, () => {
|
||||
/**
|
||||
* Regression test of https://github.com/nextcloud/server/issues/45723
|
||||
*/
|
||||
it('No "shared" tag when user ID is purely numerical', () => {
|
||||
it('No "shared" tag when user ID is purely numerical but there are no shares', () => {
|
||||
const user = {
|
||||
language: 'en',
|
||||
password: 'test1234',
|
||||
|
|
@ -29,51 +29,54 @@ describe('files_sharing: Files inline status action', { testIsolation: true }, (
|
|||
.should('not.exist')
|
||||
})
|
||||
|
||||
it('Render quick option for sharing', () => {
|
||||
cy.createRandomUser().then((user) => {
|
||||
cy.mkdir(user, '/folder')
|
||||
cy.login(user)
|
||||
|
||||
cy.visit('/apps/files')
|
||||
})
|
||||
|
||||
getRowForFile('folder')
|
||||
.should('be.visible')
|
||||
.find('[data-cy-files-list-row-actions]')
|
||||
.findByRole('button', { name: /Show sharing options/ })
|
||||
.should('be.visible')
|
||||
.click()
|
||||
|
||||
// check the click opened the sidebar
|
||||
cy.get('[data-cy-sidebar]')
|
||||
.should('be.visible')
|
||||
// and ensure the sharing tab is selected
|
||||
.findByRole('tab', { name: 'Sharing', selected: true })
|
||||
.should('exist')
|
||||
})
|
||||
|
||||
describe('Sharing inline status action handling', () => {
|
||||
let user: User
|
||||
let sharee: User
|
||||
|
||||
beforeEach(() => {
|
||||
cy.createRandomUser().then(($user) => {
|
||||
user = $user
|
||||
})
|
||||
before(() => {
|
||||
cy.createRandomUser().then(($user) => {
|
||||
sharee = $user
|
||||
})
|
||||
})
|
||||
cy.createRandomUser().then(($user) => {
|
||||
user = $user
|
||||
cy.mkdir(user, '/folder')
|
||||
cy.login(user)
|
||||
|
||||
it('Render quick option for sharing', () => {
|
||||
cy.mkdir(user, '/folder')
|
||||
cy.login(user)
|
||||
cy.visit('/apps/files')
|
||||
getRowForFile('folder').should('be.visible')
|
||||
|
||||
cy.visit('/apps/files')
|
||||
getRowForFile('folder')
|
||||
.should('be.visible')
|
||||
|
||||
getRowForFile('folder')
|
||||
.should('be.visible')
|
||||
.find('[data-cy-files-list-row-actions]')
|
||||
.findByRole('button', { name: /Show sharing options/ })
|
||||
.should('be.visible')
|
||||
.click()
|
||||
|
||||
// check the click opened the sidebar
|
||||
cy.get('[data-cy-sidebar]')
|
||||
.should('be.visible')
|
||||
// and ensure the sharing tab is selected
|
||||
.findByRole('tab', { name: 'Sharing', selected: true })
|
||||
.should('exist')
|
||||
createShare('folder', sharee.userId)
|
||||
closeSidebar()
|
||||
})
|
||||
cy.logout()
|
||||
})
|
||||
|
||||
it('Render inline status action for sharer', () => {
|
||||
cy.mkdir(user, '/folder')
|
||||
cy.login(user)
|
||||
|
||||
cy.visit('/apps/files')
|
||||
getRowForFile('folder')
|
||||
.should('be.visible')
|
||||
createShare('folder', sharee.userId)
|
||||
closeSidebar()
|
||||
|
||||
getRowForFile('folder')
|
||||
.should('be.visible')
|
||||
|
|
@ -82,16 +85,21 @@ describe('files_sharing: Files inline status action', { testIsolation: true }, (
|
|||
.should('be.visible')
|
||||
})
|
||||
|
||||
it('Render inline status action for sharee', () => {
|
||||
cy.mkdir(user, '/folder')
|
||||
it('Render status action in gridview for sharer', () => {
|
||||
cy.login(user)
|
||||
|
||||
cy.visit('/apps/files')
|
||||
enableGridMode()
|
||||
|
||||
getRowForFile('folder')
|
||||
.should('be.visible')
|
||||
createShare('folder', sharee.userId)
|
||||
closeSidebar()
|
||||
getActionButtonForFile('folder')
|
||||
.click()
|
||||
cy.findByRole('menu')
|
||||
.findByRole('menuitem', { name: /shared with/i })
|
||||
.should('be.visible')
|
||||
})
|
||||
|
||||
it('Render inline status action for sharee', () => {
|
||||
cy.login(sharee)
|
||||
cy.visit('/apps/files')
|
||||
|
||||
|
|
@ -101,5 +109,20 @@ describe('files_sharing: Files inline status action', { testIsolation: true }, (
|
|||
.findByRole('button', { name: `Shared by ${user.userId}` })
|
||||
.should('be.visible')
|
||||
})
|
||||
|
||||
it('Render status action in grid view for sharee', () => {
|
||||
cy.login(sharee)
|
||||
cy.visit('/apps/files')
|
||||
|
||||
enableGridMode()
|
||||
|
||||
getRowForFile('folder')
|
||||
.should('be.visible')
|
||||
getActionButtonForFile('folder')
|
||||
.click()
|
||||
cy.findByRole('menu')
|
||||
.findByRole('menuitem', { name: `Shared by ${user.userId}` })
|
||||
.should('be.visible')
|
||||
})
|
||||
})
|
||||
})
|
||||
Loading…
Reference in a new issue