fix: comments

Signed-off-by: Luka Trovic <luka@nextcloud.com>

src/components/ImageView/ShowImageModal.vue

@@ -2,10 +2,10 @@
 	<NcModal v-if="show"
 		size="large"
 		:title="currentImage.basename"
-		:outTransition="true"
-		:hasNext="true"
-		:hasPrevious="true"
-		closeButtonContained="false"
+		:out-transition="true"
+		:has-next="true"
+		:has-previous="true"
+		:close-button-contained="false"
 		dark="true"
 		@next="showNextImage"
 		@previous="showPreviousImage"
@@ -17,7 +17,7 @@
 </template>
 
 <script>
-import NcModal from '@nextcloud/vue/dist/Components/NcModal'
+import NcModal from '@nextcloud/vue/dist/Components/NcModal.js'
 
 export default {
 	name: 'ShowImageModal',
@@ -74,3 +74,17 @@ export default {
 	},
 }
 </script>
+
+<style scoped lang="scss">
+.modal__content {
+	height: 100%;
+	padding: 0 50px;
+	display: flex;
+	justify-content: center;
+	img {
+		height: 100%;
+		width: 100%;
+		object-fit: contain;
+	}
+}
+</style>

src/nodes/ImageView.vue

@@ -96,7 +96,7 @@
 				</transition>
 				<div class="image__modal">
 					<ShowImageModal :images="embeddedImagesList"
-						:start-index="startImageIndex"
+						:start-index="imageIndex"
 						:show="showImageModal"
 						@close="showImageModal=false" />
 				</div>
@@ -196,7 +196,7 @@ export default {
 			attachmentMetadata: {},
 			showImageModal: false,
 			embeddedImagesList: [],
-			startImageIndex: null,
+			imageIndex: null,
 		}
 	},
 	computed: {
@@ -339,11 +339,10 @@ export default {
 			this.loaded = true
 		},
 		handleImageClick(src) {
-			const imageViews = Array.from(document.querySelectorAll('div[data-component="image-view"].image-view'))
-			let basename, 
-				relativePath
+			const imageViews = Array.from(document.querySelectorAll('figure[data-component="image-view"].image-view'))
+			let basename, relativePath
 
-			imageViews.map(imgv => {
+			imageViews.forEach(imgv => {
 				relativePath = imgv.getAttribute('data-src')
 				basename = relativePath.split('/').slice(-1).join()
 				const { url: source } = this.$attachmentResolver.resolve(relativePath, true).shift()
@@ -353,7 +352,7 @@ export default {
 					relativePath,
 				})
 			})
-			this.startImageIndex = this.embeddedImagesList.findIndex(image => image.relativePath === src)
+			this.imageIndex = this.embeddedImagesList.findIndex(image => image.relativePath === src)
 			this.showImageModal = true
 		},
 	},