upstream/nextcloud
1
0
Fork 0
mirror of https://github.com/nextcloud/server.git synced 2026-06-08 16:26:59 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 12

feat(files): Update caption for screen readers when uploading is not possible

Browse source 
Signed-off-by: Christopher Ng <chrng8@gmail.com>
This commit is contained in:
Christopher Ng 2024-11-08 11:38:21 -08:00
parent 967e1a894a
commit 5f3bd3e30d
2 changed files with 19 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
apps/files/src/components/FilesListVirtual.vue
View file

@ -62,7 +62,7 @@ import type { Node as NcNode } from '@nextcloud/files'
import type { ComponentPublicInstance, PropType } from 'vue'
import type { UserConfig } from '../types'
import { getFileListHeaders, Folder, View, getFileActions, FileType } from '@nextcloud/files'
import { getFileListHeaders, Folder, Permission, View, getFileActions, FileType } from '@nextcloud/files'
import { showError } from '@nextcloud/dialogs'
import { translate as t } from '@nextcloud/l10n'
import { subscribe, unsubscribe } from '@nextcloud/event-bus'
@ -170,12 +170,28 @@ export default defineComponent({
return [...this.headers].sort((a, b) => a.order - b.order)
},
cantUpload() {
return this.currentFolder && (this.currentFolder.permissions & Permission.CREATE) === 0
},
isQuotaExceeded() {
return this.currentFolder?.attributes?.['quota-available-bytes'] === 0
},
caption() {
const defaultCaption = t('files', 'List of files and folders.')
const viewCaption = this.currentView.caption || defaultCaption
const cantUploadCaption = this.cantUpload ? t('files', 'You don’t have permission to upload or create files here.') : null
const quotaExceededCaption = this.isQuotaExceeded ? t('files', 'You have used your space quota and cannot upload files anymore.') : null
const sortableCaption = t('files', 'Column headers with buttons are sortable.')
const virtualListNote = t('files', 'This list is not fully rendered for performance reasons. The files will be rendered as you navigate through the list.')
return `${viewCaption}\n${sortableCaption}\n${virtualListNote}`
return [
viewCaption,
cantUploadCaption,
quotaExceededCaption,
sortableCaption,
virtualListNote,
].filter(Boolean).join('\n')
},
selectedNodes() {

21
apps/files/src/views/FilesList.vue
View file

@ -22,21 +22,8 @@
</template>
</NcButton>
<!-- Disabled upload button -->
<NcButton v-if="!canUpload || isQuotaExceeded"
:aria-label="cantUploadLabel"
:title="cantUploadLabel"
class="files-list__header-upload-button--disabled"
:disabled="true"
type="secondary">
<template #icon>
<PlusIcon :size="20" />
</template>
{{ t('files', 'New') }}
</NcButton>
<!-- Uploader -->
<UploadPicker v-else-if="currentFolder"
<UploadPicker v-if="canUpload && !isQuotaExceeded && currentFolder"
allow-folders
class="files-list__header-upload-button"
:content="getContent"
@ -430,12 +417,6 @@ export default defineComponent({
isQuotaExceeded() {
return this.currentFolder?.attributes?.['quota-available-bytes'] === 0
},
cantUploadLabel() {
if (this.isQuotaExceeded) {
return t('files', 'Your have used your space quota and cannot upload files anymore')
}
return t('files', 'You don’t have permission to upload or create files here')
},
/**
* Check if current folder has share permissions