mirror of
https://github.com/nextcloud/server.git
synced 2024-08-30 05:55:15 +02:00
Do not load preview if version tab is not active
Signed-off-by: Louis Chemineau <louis@chmn.me>
This commit is contained in:
parent
36c3846475
commit
6eb93c652a
@ -28,6 +28,7 @@ export default class Tab {
|
||||
_icon
|
||||
_iconSvgSanitized
|
||||
_mount
|
||||
_setIsActive
|
||||
_update
|
||||
_destroy
|
||||
_enabled
|
||||
@ -42,12 +43,13 @@ export default class Tab {
|
||||
* @param {?string} options.icon the icon css class
|
||||
* @param {?string} options.iconSvg the icon in svg format
|
||||
* @param {Function} options.mount function to mount the tab
|
||||
* @param {Function} [options.setIsActive] function to forward the active state of the tab
|
||||
* @param {Function} options.update function to update the tab
|
||||
* @param {Function} options.destroy function to destroy the tab
|
||||
* @param {Function} [options.enabled] define conditions whether this tab is active. Must returns a boolean
|
||||
* @param {Function} [options.scrollBottomReached] executed when the tab is scrolled to the bottom
|
||||
*/
|
||||
constructor({ id, name, icon, iconSvg, mount, update, destroy, enabled, scrollBottomReached } = {}) {
|
||||
constructor({ id, name, icon, iconSvg, mount, setIsActive, update, destroy, enabled, scrollBottomReached } = {}) {
|
||||
if (enabled === undefined) {
|
||||
enabled = () => true
|
||||
}
|
||||
@ -68,6 +70,9 @@ export default class Tab {
|
||||
if (typeof mount !== 'function') {
|
||||
throw new Error('The mount argument should be a function')
|
||||
}
|
||||
if (setIsActive !== undefined && typeof setIsActive !== 'function') {
|
||||
throw new Error('The setIsActive argument should be a function')
|
||||
}
|
||||
if (typeof update !== 'function') {
|
||||
throw new Error('The update argument should be a function')
|
||||
}
|
||||
@ -85,6 +90,7 @@ export default class Tab {
|
||||
this._name = name
|
||||
this._icon = icon
|
||||
this._mount = mount
|
||||
this._setIsActive = setIsActive
|
||||
this._update = update
|
||||
this._destroy = destroy
|
||||
this._enabled = enabled
|
||||
@ -119,6 +125,10 @@ export default class Tab {
|
||||
return this._mount
|
||||
}
|
||||
|
||||
get setIsActive() {
|
||||
return this._setIsActive || (() => undefined)
|
||||
}
|
||||
|
||||
get update() {
|
||||
return this._update
|
||||
}
|
||||
|
@ -366,6 +366,7 @@ export default {
|
||||
*/
|
||||
setActiveTab(id) {
|
||||
OCA.Files.Sidebar.setActiveTab(id)
|
||||
this.tabs.forEach(tab => tab.setIsActive(id === tab.id))
|
||||
},
|
||||
|
||||
/**
|
||||
@ -453,6 +454,7 @@ export default {
|
||||
if (this.$refs.tabs) {
|
||||
this.$refs.tabs.updateTabs()
|
||||
}
|
||||
this.setActiveTab(this.Sidebar.activeTab || this.tabs[0].id)
|
||||
})
|
||||
} catch (error) {
|
||||
this.error = t('files', 'Error while loading the file data')
|
||||
|
@ -23,14 +23,15 @@
|
||||
:force-display-actions="true"
|
||||
data-files-versions-version>
|
||||
<template #icon>
|
||||
<img v-if="(isCurrent || version.hasPreview) && !previewError"
|
||||
<div v-if="!(loadPreview || previewLoaded)" class="version__image" />
|
||||
<img v-else-if="isCurrent || version.hasPreview"
|
||||
:src="previewURL"
|
||||
alt=""
|
||||
decoding="async"
|
||||
fetchpriority="low"
|
||||
loading="lazy"
|
||||
class="version__image"
|
||||
@error="previewError = true">
|
||||
@load="previewLoaded = true">
|
||||
<div v-else
|
||||
class="version__image">
|
||||
<ImageOffOutline :size="20" />
|
||||
@ -185,13 +186,17 @@ export default {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
loadPreview: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
previewLoaded: false,
|
||||
showVersionLabelForm: false,
|
||||
formVersionLabelValue: this.version.label,
|
||||
capabilities: loadState('core', 'capabilities', { files: { version_labeling: false, version_deletion: false } }),
|
||||
previewError: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
@ -59,6 +59,9 @@ window.addEventListener('DOMContentLoaded', function() {
|
||||
update(fileInfo) {
|
||||
TabInstance.update(fileInfo)
|
||||
},
|
||||
setIsActive(isActive) {
|
||||
TabInstance.setIsActive(isActive)
|
||||
},
|
||||
destroy() {
|
||||
TabInstance.$destroy()
|
||||
TabInstance = null
|
||||
|
@ -19,6 +19,7 @@
|
||||
<ul data-files-versions-versions-list>
|
||||
<Version v-for="version in orderedVersions"
|
||||
:key="version.mtime"
|
||||
:load-preview="isActive"
|
||||
:version="version"
|
||||
:file-info="fileInfo"
|
||||
:is-current="version.mtime === fileInfo.mtime"
|
||||
@ -42,6 +43,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
fileInfo: null,
|
||||
isActive: false,
|
||||
/** @type {import('../utils/versions.js').Version[]} */
|
||||
versions: [],
|
||||
loading: false,
|
||||
@ -89,6 +91,13 @@ export default {
|
||||
this.fetchVersions()
|
||||
},
|
||||
|
||||
/**
|
||||
* @param {boolean} isActive whether the tab is active
|
||||
*/
|
||||
async setIsActive(isActive) {
|
||||
this.isActive = isActive
|
||||
},
|
||||
|
||||
/**
|
||||
* Get the existing versions infos
|
||||
*/
|
||||
|
Loading…
Reference in New Issue
Block a user