add paginated request when reach end of list

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>

src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue

@@ -481,12 +481,20 @@ export default {
 			const fileInfo = this.generateViewerObject(this)
 
 			if (this.isSharedItemsTab && this.sharedItemsType === SHARED_ITEM.TYPES.MEDIA) {
-				// Get available media files from store and put them to the list to navigate through slides
-				const mediaFiles = this.$store.getters.sharedItems(this.$store.getters.getToken())?.media
-				const list = Object.values(mediaFiles).reverse()
+				const token = this.$store.getters.getToken()
+				const getRevertedList = (items) => Object.values(items).reverse()
 					.map(item => this.generateViewerObject(item.messageParameters.file))
 
-				this.openViewer(this.internalAbsolutePath, list, fileInfo)
+				// Get available media files from store and put them to the list to navigate through slides
+				const mediaFiles = this.$store.getters.sharedItems(token).media
+				const list = getRevertedList(mediaFiles)
+				const loadMore = async () => {
+					const { messages } = await this.$store.dispatch('getSharedItems',
+						{ token, type: SHARED_ITEM.TYPES.MEDIA })
+					return getRevertedList(messages)
+				}
+
+				this.openViewer(this.internalAbsolutePath, list, fileInfo, loadMore)
 			} else {
 				this.openViewer(this.internalAbsolutePath, [fileInfo], fileInfo)
 

src/components/RightSidebar/SharedItems/SharedItemsBrowser/SharedItemsBrowser.vue

@@ -120,9 +120,9 @@ export default {
 			}
 		},
 
-		fetchItems(type) {
+		async fetchItems(type) {
 			this.isRequestingMoreItems[this.activeTab] = true
-			const hasMoreItems = this.$store.dispatch('getSharedItems', {
+			const { hasMoreItems } = await this.$store.dispatch('getSharedItems', {
 				token: this.token,
 				type,
 			})

src/composables/useViewer.js

@@ -30,6 +30,7 @@ import { useStore } from './useStore.js'
  * @param {string} path - The path to the file to be open
  * @param {Array<object>} list - The list of the files to be opened
  * @param {object} [fileInfo] - The known file info
+ * @param {Function} [loadMore] - The callback to load additional content
  */
 
 /**
@@ -130,7 +131,7 @@ export function useViewer() {
 	/**
 	 * @type {OpenViewer}
 	 */
-	const openViewer = async (path, list, fileInfo) => {
+	const openViewer = async (path, list, fileInfo, loadMore) => {
 		if (!OCA.Viewer) {
 			return false
 		}
@@ -152,6 +153,8 @@ export function useViewer() {
 				isViewerOpen.value = false
 				store.dispatch('setCallViewMode', { isViewerOverlay: false })
 			},
+			loadMore,
+			canLoop: false,
 		})
 
 		// Wait Viewer to be mounted

src/store/sharedItemsStore.js

@@ -125,15 +125,15 @@ const actions = {
 		if (!state.sharedItemsByConversationAndType[token]
 			|| !state.sharedItemsByConversationAndType[token][type]) {
 			console.error('Missing overview for shared items in ', token)
-			return false
+			return { hasMoreItems: false, messages: [] }
 		}
 
 		const limit = 20
 		const lastKnownMessageId = Math.min.apply(Math, Object.keys(state.sharedItemsByConversationAndType[token][type]))
 		try {
 			const response = await getSharedItems(token, type, lastKnownMessageId, limit)
 			const messages = response.data.ocs.data
-			const hasMore = messages.length >= limit
+			const hasMoreItems = messages.length >= limit
 			// loop over the response elements and add them to the store
 			for (const message in messages) {
 
@@ -143,10 +143,10 @@ const actions = {
 					message: messages[message],
 				})
 			}
-			return hasMore
+			return { hasMoreItems, messages }
 		} catch (error) {
 			console.error(error)
-			return false
+			return { hasMoreItems: false, messages: [] }
 		}
 	},