Init vue comments tab

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

3 files changed, 21 insertions, 3 deletions

diff --git a/apps/files/src/components/SidebarTab.vue b/apps/files/src/components/SidebarTab.vue
index 1fc93486bc0..bead5cad1ef 100644
--- a/apps/files/src/components/SidebarTab.vue
+++ b/apps/files/src/components/SidebarTab.vue
@@ -25,7 +25,8 @@
 		:id="id"
 		ref="tab"
 		:name="name"
-		:icon="icon">
+		:icon="icon"
+		@bottomReached="onScrollBottomReached">
 		<!-- Fallback loading -->
 		<EmptyContent v-if="loading" icon="icon-loading" />
 
@@ -83,6 +84,10 @@ export default {
 			type: Function,
 			required: true,
 		},
+		onScrollBottomReached: {
+			type: Function,
+			default: () => {},
+		},
 	},
 
 	data() {
@@ -120,6 +125,5 @@ export default {
 		// unmount the tab
 		await this.onDestroy()
 	},
-
 }
 </script>
diff --git a/apps/files/src/models/Tab.js b/apps/files/src/models/Tab.js
index 2c587e5f70a..670c72e3a3a 100644
--- a/apps/files/src/models/Tab.js
+++ b/apps/files/src/models/Tab.js
@@ -29,6 +29,7 @@ export default class Tab {
 	#update
 	#destroy
 	#enabled
+	#scrollBottomReached
 
 	/**
 	 * Create a new tab instance
@@ -41,11 +42,15 @@ export default class 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, mount, update, destroy, enabled } = {}) {
+	constructor({ id, name, icon, mount, update, destroy, enabled, scrollBottomReached } = {}) {
 		if (enabled === undefined) {
 			enabled = () => true
 		}
+		if (scrollBottomReached === undefined) {
+			scrollBottomReached = () => {}
+		}
 
 		// Sanity checks
 		if (typeof id !== 'string' || id.trim() === '') {
@@ -69,6 +74,9 @@ export default class Tab {
 		if (typeof enabled !== 'function') {
 			throw new Error('The enabled argument should be a function')
 		}
+		if (typeof scrollBottomReached !== 'function') {
+			throw new Error('The scrollBottomReached argument should be a function')
+		}
 
 		this.#id = id
 		this.#name = name
@@ -77,6 +85,7 @@ export default class Tab {
 		this.#update = update
 		this.#destroy = destroy
 		this.#enabled = enabled
+		this.#scrollBottomReached = scrollBottomReached
 
 	}
 
@@ -108,4 +117,8 @@ export default class Tab {
 		return this.#enabled
 	}
 
+	get scrollBottomReached() {
+		return this.#scrollBottomReached
+	}
+
 }
diff --git a/apps/files/src/views/Sidebar.vue b/apps/files/src/views/Sidebar.vue
index 664bc6f4075..0b3f2bb1741 100644
--- a/apps/files/src/views/Sidebar.vue
+++ b/apps/files/src/views/Sidebar.vue
@@ -69,6 +69,7 @@
 				:on-mount="tab.mount"
 				:on-update="tab.update"
 				:on-destroy="tab.destroy"
+				:on-scroll-bottom-reached="tab.scrollBottomReached"
 				:file-info="fileInfo" />
 		</template>
 	</AppSidebar>