feat(files): refresh preview on etag change

Signed-off-by: skjnldsv <skjnldsv@protonmail.com>
nextcloud · May 22, 2024 · ed8c1bd · ed8c1bd
1 parent 5a6e48e
commit ed8c1bd
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 4 deletions.
diff --git a/apps/files/src/components/FileEntry/FileEntryPreview.vue b/apps/files/src/components/FileEntry/FileEntryPreview.vue
@@ -76,10 +76,11 @@ import NetworkIcon from 'vue-material-design-icons/Network.vue'
 import TagIcon from 'vue-material-design-icons/Tag.vue'
 import PlayCircleIcon from 'vue-material-design-icons/PlayCircle.vue'
 
-import { useUserConfigStore } from '../../store/userconfig.ts'
 import CollectivesIcon from './CollectivesIcon.vue'
 import FavoriteIcon from './FavoriteIcon.vue'
+
 import { isLivePhoto } from '../../services/LivePhotos'
+import { useUserConfigStore } from '../../store/userconfig.ts'
 
 export default Vue.extend({
 	name: 'FileEntryPreview',
@@ -162,6 +163,10 @@ export default Vue.extend({
 				url.searchParams.set('y', this.gridMode ? '128' : '32')
 				url.searchParams.set('mimeFallback', 'true')
 
+				// Etag to force refresh preview on change
+				const etag = this.source?.attributes?.etag || ''
+				url.searchParams.set('v', etag.slice(0, 6))
+
 				// Handle cropping
 				url.searchParams.set('a', this.cropPreviews === true ? '0' : '1')
 				return url.href

diff --git a/apps/files/src/views/Sidebar.vue b/apps/files/src/views/Sidebar.vue
@@ -335,7 +335,8 @@ export default {
 
 		getPreviewIfAny(fileInfo) {
 			if (fileInfo?.hasPreview && !this.isFullScreen) {
-				return generateUrl(`/core/preview?fileId=${fileInfo.id}&x=${screen.width}&y=${screen.height}&a=true`)
+				const etag = fileInfo?.etag || ''
+				return generateUrl(`/core/preview?fileId=${fileInfo.id}&x=${screen.width}&y=${screen.height}&a=true&v=${etag.slice(0, 6)}`)
 			}
 			return this.getIconUrl(fileInfo)
 		},

diff --git a/apps/files_external/lib/Controller/ApiController.php b/apps/files_external/lib/Controller/ApiController.php
@@ -135,7 +135,7 @@ public function getUserMounts(): DataResponse {
 	public function askNativeAuth(): DataResponse {
 		if (!isset($_SERVER['PHP_AUTH_USER']) || !isset($_SERVER['PHP_AUTH_PW'])) {
 			$response = new DataResponse([], Http::STATUS_UNAUTHORIZED);
-			$response->addHeader('WWW-Authenticate', 'Basic realm="Storage authentification needed"');
+			$response->addHeader('WWsW-Authenticate', 'Basic realm="Storage authentification needed"');
 			return $response;
 		}
 

diff --git a/apps/files_external/src/actions/enterCredentialsAction.ts b/apps/files_external/src/actions/enterCredentialsAction.ts
@@ -77,7 +77,10 @@ export const action = new FileAction({
 		// always resolve auth request, we'll process the data afterwards
 		// Using fetch as axios have integrated auth handling and X-Requested-With header
 		const response = await fetch(generateOcsUrl('/apps/files_external/api/v1/auth'), {
-			headers: new Headers({ Accept: 'application/json' }),
+			headers: new Headers({
+				Accept: 'application/json',
+				'X-Requested-With': 'null',
+			}),
 			credentials: 'include',
 		})