From 47cde4cf23f6261fc7fb755ea449e399a4caf98a Mon Sep 17 00:00:00 2001 From: skjnldsv Date: Thu, 20 Feb 2025 16:30:49 +0100 Subject: [PATCH] fix(files_external): inline storage check improvements Signed-off-by: skjnldsv --- .../src/actions/inlineStorageCheckAction.ts | 72 ++++++++++--------- .../src/actions/openInFilesAction.ts | 3 +- .../src/css/fileEntryStatus.scss | 5 +- 3 files changed, 45 insertions(+), 35 deletions(-) diff --git a/apps/files_external/src/actions/inlineStorageCheckAction.ts b/apps/files_external/src/actions/inlineStorageCheckAction.ts index a213c196b50..c2a220a1699 100644 --- a/apps/files_external/src/actions/inlineStorageCheckAction.ts +++ b/apps/files_external/src/actions/inlineStorageCheckAction.ts @@ -6,6 +6,7 @@ import type { AxiosError } from '@nextcloud/axios' import type { Node } from '@nextcloud/files' +import { FileAction } from '@nextcloud/files' import { showWarning } from '@nextcloud/dialogs' import { translate as t } from '@nextcloud/l10n' import AlertSvg from '@mdi/svg/svg/alert-circle.svg?raw' @@ -15,7 +16,6 @@ import '../css/fileEntryStatus.scss' import { getStatus, type StorageConfig } from '../services/externalStorage' import { isMissingAuthConfig, STORAGE_STATUS } from '../utils/credentialsUtils' import { isNodeExternalStorage } from '../utils/externalStorageUtils' -import { FileAction } from '@nextcloud/files' export const action = new FileAction({ id: 'check-external-storage', @@ -33,45 +33,51 @@ export const action = new FileAction({ * @param node */ async renderInline(node: Node) { + const span = document.createElement('span') + span.className = 'files-list__row-status' + span.innerHTML = t('files_external', 'Checking storage...') + let config = null as unknown as StorageConfig - try { - const response = await getStatus(node.attributes.id, node.attributes.scope === 'system') - config = response.data - Vue.set(node.attributes, 'config', config) + getStatus(node.attributes.id, node.attributes.scope === 'system') + .then(response => { - if (config.status !== STORAGE_STATUS.SUCCESS) { - throw new Error(config?.statusMessage || t('files_external', 'There was an error with this external storage.')) - } + config = response.data + Vue.set(node.attributes, 'config', config) - return null - } catch (error) { - // If axios failed or if something else prevented - // us from getting the config - if ((error as AxiosError).response && !config) { - showWarning(t('files_external', 'We were unable to check the external storage {basename}', { - basename: node.basename, - })) - return null - } + if (config.status !== STORAGE_STATUS.SUCCESS) { + throw new Error(config?.statusMessage || t('files_external', 'There was an error with this external storage.')) + } - // Checking if we really have an error - const isWarning = isMissingAuthConfig(config) - const overlay = document.createElement('span') - overlay.classList.add(`files-list__row-status--${isWarning ? 'warning' : 'error'}`) + span.remove() + }) + .catch(error => { + // If axios failed or if something else prevented + // us from getting the config + if ((error as AxiosError).response && !config) { + showWarning(t('files_external', 'We were unable to check the external storage {basename}', { + basename: node.basename, + })) + } - const span = document.createElement('span') - span.className = 'files-list__row-status' + // Reset inline status + span.innerHTML = '' - // Only show an icon for errors, warning like missing credentials - // have a dedicated inline action button - if (!isWarning) { - span.innerHTML = AlertSvg - span.title = (error as Error).message - } + // Checking if we really have an error + const isWarning = !config ? false : isMissingAuthConfig(config) + const overlay = document.createElement('span') + overlay.classList.add(`files-list__row-status--${isWarning ? 'warning' : 'error'}`) - span.prepend(overlay) - return span - } + // Only show an icon for errors, warning like missing credentials + // have a dedicated inline action button + if (!isWarning) { + span.innerHTML = AlertSvg + span.title = (error as Error).message + } + + span.prepend(overlay) + }) + + return span }, order: 10, diff --git a/apps/files_external/src/actions/openInFilesAction.ts b/apps/files_external/src/actions/openInFilesAction.ts index 62fdd394bb2..e5f065e4871 100644 --- a/apps/files_external/src/actions/openInFilesAction.ts +++ b/apps/files_external/src/actions/openInFilesAction.ts @@ -10,6 +10,7 @@ import { translate as t } from '@nextcloud/l10n' import { FileAction, DefaultType } from '@nextcloud/files' import { STORAGE_STATUS } from '../utils/credentialsUtils' +import { getCurrentUser } from '@nextcloud/auth' export const action = new FileAction({ id: 'open-in-files-external-storage', @@ -32,7 +33,7 @@ export const action = new FileAction({ t('files_external', 'External mount error'), (redirect) => { if (redirect === true) { - const scope = node.attributes.scope === 'personal' ? 'user' : 'admin' + const scope = getCurrentUser()?.isAdmin ? 'admin' : 'user' window.location.href = generateUrl(`/settings/${scope}/externalstorages`) } }, diff --git a/apps/files_external/src/css/fileEntryStatus.scss b/apps/files_external/src/css/fileEntryStatus.scss index 3ffd2d61ac1..42f45154ce0 100644 --- a/apps/files_external/src/css/fileEntryStatus.scss +++ b/apps/files_external/src/css/fileEntryStatus.scss @@ -4,10 +4,13 @@ */ .files-list__row-status { display: flex; - width: 44px; + min-width: 44px; justify-content: center; align-items: center; height: 100%; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; svg { width: 24px;