fix: Adapt sidebar tab to new fileinfo structure

Signed-off-by: Louis Chemineau <louis@chmn.me>

cypress/e2e/places.cy.ts

@@ -26,9 +26,6 @@ describe('Manage places', () => {
 	beforeEach(() => {
 		cy.login(alice)
 		cy.visit('/apps/photos')
-	})
-
-	beforeEach(() => {
 		navigateToCollections('places')
 	})
 

cypress/e2e/sidebar.cy.ts

@@ -0,0 +1,59 @@
+/**
+ * SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+import type { User } from '@nextcloud/cypress'
+import { setupPhotosTests } from './photosUtils.ts'
+
+const resizeObserverLoopErrRe = /^[^(ResizeObserver loop limit exceeded)]/
+Cypress.on('uncaught:exception', (err) => {
+	/* returning false here prevents Cypress from failing the test */
+	if (resizeObserverLoopErrRe.test(err.message)) {
+		return false
+	}
+})
+
+let alice: User
+
+describe('Sidebar tab', () => {
+	before(() => {
+		setupPhotosTests()
+		.then((setupInfo) => {
+			alice = setupInfo.alice
+		})
+	})
+
+	beforeEach(() => {
+		cy.login(alice)
+		cy.visit('/apps/photos')
+	})
+
+	it('Should display EXIF data in the sidebar', () => {
+		cy.get('[data-test="media"]').eq(3).click()
+		cy.get('.viewer .modal-header .action-item__menutoggle').click()
+		cy.contains('Open sidebar').click()
+		cy.get('#tab-button-photos').click()
+
+		cy.get('.photo-detail__file').contains('Taken on Oct 27, 2019 at') // Ignoring exact time as it it timeszone dependent.
+		cy.get('.photo-detail__file').contains('242 KB ⸱ 16 MP ⸱ 4608 x 3456')
+		cy.get('.photo-detail__gps__title').contains('Annot')
+		cy.get('.photo-detail__camera').contains('OnePlus ONEPLUS A5000')
+		cy.get('.photo-detail__camera').contains('ƒ/1.7 ⸱ 1/2461 ⸱ 4.103mm ⸱ ISO160')
+	})
+
+	it('Should update EXIF data when changing photos', () => {
+		cy.get('[data-test="media"]').eq(3).click()
+		cy.get('.viewer .modal-header .action-item__menutoggle').click()
+		cy.contains('Open sidebar').click()
+		cy.get('#tab-button-photos').click()
+		cy.get('[aria-label="Next"]').click()
+
+		cy.get('.photo-detail__file').contains('Taken on Oct 24, 2019 at') // Ignoring exact time as it it timeszone dependent.
+		cy.get('.photo-detail__file').contains('178 KB ⸱ 16 MP ⸱ 4608 x 3456')
+		cy.get('.photo-detail__gps__title').contains('Lauris')
+		cy.get('.photo-detail__camera').contains('OnePlus ONEPLUS A5000')
+		cy.get('.photo-detail__camera').contains('ƒ/1.7 ⸱ 1/269 ⸱ 4.103mm ⸱ ISO250')
+	})
+})
+
+

js/photos-sidebar.mjs

@@ -1,3 +1,3 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=[window.OC.filePath('photos', '', 'js/PhotosTab-NB0-4PRj.chunk.mjs'),window.OC.filePath('photos', '', 'js/icons-DIHlkdtB.chunk.mjs'),window.OC.filePath('photos', '', 'js/vue.runtime.esm-CWuAmtQL.chunk.mjs'),window.OC.filePath('photos', '', 'js/index-C-mleKoq.chunk.mjs'),window.OC.filePath('photos', '', 'css/PhotosTab-CPJ9694M.chunk.css')])))=>i.map(i=>d[i]);
-import{_ as r}from"./preload-helper-Dh9HmuEY.chunk.mjs";import{t as d,V as p,a as m,r as s}from"./vue.runtime.esm-CWuAmtQL.chunk.mjs";const u='<svg xmlns="http://www.w3.org/2000/svg" id="mdi-information-outline" viewBox="0 0 24 24"><path d="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z" /></svg>';p.prototype.t=d,p.prototype.n=m,s("nc:metadata-photos-exif"),s("nc:metadata-photos-ifd0"),s("nc:metadata-photos-gps"),s("nc:metadata-photos-place");let o=null,e=null;const C=new OCA.Files.Sidebar.Tab({id:"photos",name:d("photos","Details"),iconSvg:u,async mount(a,t,i){if(o===null){const{default:n}=await r(async()=>{const{default:l}=await import("./PhotosTab-NB0-4PRj.chunk.mjs");return{default:l}},__vite__mapDeps([0,1,2,3,4]),import.meta.url);o=o??p.extend(n)}e&&e.$destroy(),e=new o({parent:i}),e.update(t),e.$mount(a)},update(a){e.update(a)},destroy(){e.$destroy(),e=null}});window.addEventListener("DOMContentLoaded",async function(){if(OCA.Files&&OCA.Files.Sidebar){window.OCA.Files.Sidebar.registerTab(C);const{default:t}=await r(async()=>{const{default:i}=await import("./PhotosTab-NB0-4PRj.chunk.mjs");return{default:i}},__vite__mapDeps([0,1,2,3,4]),import.meta.url);o=o??p.extend(t)}function a(t){return t?.reduce((i,n)=>({...i,[n.nodeName]:n.textContent}),{})}OC.Files.getClient().addFileInfoParser(function(t){return{"metadata-photos-original_date_time":t.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-original_date_time`],"metadata-photos-exif":a(t.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-exif`]),"metadata-photos-ifd0":a(t.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-ifd0`]),"metadata-photos-gps":a(t.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-gps`]),"metadata-photos-place":t.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-place`]}})});
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=[window.OC.filePath('photos', '', 'js/PhotosTab-BucHKn3s.chunk.mjs'),window.OC.filePath('photos', '', 'js/icons-DIHlkdtB.chunk.mjs'),window.OC.filePath('photos', '', 'js/vue.runtime.esm-CWuAmtQL.chunk.mjs'),window.OC.filePath('photos', '', 'js/index-C-mleKoq.chunk.mjs'),window.OC.filePath('photos', '', 'css/PhotosTab-anrurgrD.chunk.css')])))=>i.map(i=>d[i]);
+import{_ as i}from"./preload-helper-Dh9HmuEY.chunk.mjs";import{t as d,V as n,a as u,r as o}from"./vue.runtime.esm-CWuAmtQL.chunk.mjs";const m='<svg xmlns="http://www.w3.org/2000/svg" id="mdi-information-outline" viewBox="0 0 24 24"><path d="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z" /></svg>';n.prototype.t=d,n.prototype.n=u,o("nc:metadata-photos-exif"),o("nc:metadata-photos-ifd0"),o("nc:metadata-photos-gps"),o("nc:metadata-photos-place");let a=null,t=null;const c=new OCA.Files.Sidebar.Tab({id:"photos",name:d("photos","Details"),iconSvg:m,async mount(e,s,r){if(a===null){const{default:l}=await i(async()=>{const{default:p}=await import("./PhotosTab-BucHKn3s.chunk.mjs");return{default:p}},__vite__mapDeps([0,1,2,3,4]),import.meta.url);a=a??n.extend(l)}t&&t.$destroy(),t=new a({parent:r}),t.update(s),t.$mount(e)},update(e){t.update(e)},destroy(){t.$destroy(),t=null}});window.addEventListener("DOMContentLoaded",async function(){if(OCA.Files&&OCA.Files.Sidebar){window.OCA.Files.Sidebar.registerTab(c);const{default:e}=await i(async()=>{const{default:s}=await import("./PhotosTab-BucHKn3s.chunk.mjs");return{default:s}},__vite__mapDeps([0,1,2,3,4]),import.meta.url);a=a??n.extend(e)}});
 //# sourceMappingURL=photos-sidebar.mjs.map

src/sidebar.ts

@@ -57,22 +57,4 @@ window.addEventListener('DOMContentLoaded', async function() {
 		const { default: PhotosTab } = await import(/* webpackPreload: true */ './views/PhotosTab.vue')
 		PhotosTabView = PhotosTabView ?? Vue.extend(PhotosTab)
 	}
-
-	/**
-	 *
-	 * @param metadataArray
-	 */
-	function parseMetadataArray(metadataArray) {
-		return metadataArray?.reduce((parsedArray, metadata) => ({ ...parsedArray, [metadata.nodeName]: metadata.textContent }), {})
-	}
-
-	OC.Files.getClient().addFileInfoParser(function(response) {
-		return {
-			'metadata-photos-original_date_time': response.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-original_date_time`],
-			'metadata-photos-exif': parseMetadataArray(response.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-exif`]),
-			'metadata-photos-ifd0': parseMetadataArray(response.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-ifd0`]),
-			'metadata-photos-gps': parseMetadataArray(response.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-gps`]),
-			'metadata-photos-place': response.propStat[0].properties[`{${OC.Files.Client.NS_NEXTCLOUD}}metadata-photos-place`],
-		}
-	})
 })