perf/frontend

src/CollectivesApp.vue

@@ -87,7 +87,7 @@ export default {
 				this.rootStore.pageParam = val.params.page
 				this.rootStore.pageId = val.params.pageId ? parseInt(val.params.pageId) : null
 				this.rootStore.shareTokenParam = val.params.token
-				this.rootStore.fileIdQuery = val.query.fileId
+				this.rootStore.fileIdQuery = val.query.fileId ? parseInt(val.query.fileId) : ''
 			},
 
 			immediate: true,

src/components/CollectiveContainer.vue

@@ -90,11 +90,10 @@ export default {
 		]),
 
 		...mapState(usePagesStore, [
-			'currentFileIdPage',
 			'currentPage',
+			'currentPageId',
 			'currentPagePath',
 			'isLandingPage',
-			'pagePath',
 			'pagesLoaded',
 		]),
 
@@ -120,17 +119,11 @@ export default {
 			}
 		},
 
-		'currentPage.id': function() {
+		currentPageId: function() {
 			this.selectVersion(null)
 			this.slugUrl()
 		},
 
-		notFound: function(current) {
-			if (current && this.currentFileIdPage) {
-				this.$router.replace(this.pagePath(this.currentFileIdPage) + document.location.hash)
-			}
-		},
-
 		networkOnline: function(val) {
 			if (val && this.loadPending) {
 				this.getShares()

src/components/CollectivePrint.vue

@@ -119,15 +119,15 @@ export default {
 	},
 
 	async mounted() {
-		await this.getPages()
+		await this.getCurrentPages()
 			.catch(displayError('Could not fetch pages'))
 		this.loadPages.total = this.pagesTreeWalk().length
 	},
 
 	methods: {
 		t,
 
-		...mapActions(usePagesStore, ['getPages']),
+		...mapActions(usePagesStore, ['getCurrentPages']),
 
 		ready(pageId) {
 			if (this.waitingFor.indexOf(pageId) >= 0) {

src/components/Page/LandingPageWidgets.vue

@@ -36,10 +36,10 @@ export default {
 
 	computed: {
 		...mapState(useRootStore, ['isPublic']),
-		...mapState(usePagesStore, ['pages']),
+		...mapState(usePagesStore, ['currentPages']),
 
 		showRecentPages() {
-			return this.pages.length > 3
+			return this.currentPages.length > 3
 		},
 	},
 }

src/components/Page/PageActionMenu.vue

@@ -47,7 +47,7 @@
 				</NcActionCheckbox>
 				<NcActionButton
 					closeAfterClick
-					@click="toggleOutline(currentPage.id)">
+					@click="toggleOutline(currentPageId)">
 					<template #icon>
 						<FormatListBulletedIcon :size="20" />
 					</template>
@@ -118,9 +118,9 @@
 
 			<!-- Download action: always displayed -->
 			<NcActionLink
-				:href="pageDavUrl(pageById(pageId))"
+				:href="davUrl"
 				:class="{ 'action-link--disabled': !networkOnline }"
-				:download="pageById(pageId).fileName"
+				:download="fileName"
 				closeAfterClick>
 				<template #icon>
 					<DownloadIcon :size="20" />
@@ -231,6 +231,16 @@ export default {
 			required: true,
 		},
 
+		fileName: {
+			type: String,
+			required: true,
+		},
+
+		davUrl: {
+			type: String,
+			required: true,
+		},
+
 		lastUserDisplayName: {
 			type: String,
 			default: null,
@@ -282,8 +292,6 @@ export default {
 		...mapState(usePagesStore, [
 			'hasOutline',
 			'hasSubpages',
-			'pageById',
-			'pageDavUrl',
 		]),
 
 		displaySidebarAction() {
@@ -301,7 +309,7 @@ export default {
 		},
 
 		toggleOutlineString() {
-			return this.hasOutline(this.currentPage.id)
+			return this.hasOutline(this.currentPageId)
 				? t('collectives', 'Hide outline')
 				: t('collectives', 'Show outline')
 		},
@@ -342,15 +350,15 @@ export default {
 		]),
 
 		onCheckFullWidthView() {
-			this.setFullWidthView({ pageId: this.currentPage.id, fullWidthView: true })
+			this.setFullWidthView({ pageId: this.currentPageId, fullWidthView: true })
 		},
 
 		onUncheckFullWidthView() {
-			this.setFullWidthView({ pageId: this.currentPage.id, fullWidthView: false })
+			this.setFullWidthView({ pageId: this.currentPageId, fullWidthView: false })
 		},
 
 		async openShareTab() {
-			if (this.pageUrl && (this.currentPage.id !== this.pageId)) {
+			if (this.pageUrl && (this.currentPageId !== this.pageId)) {
 				await this.$router.push(this.pageUrl)
 			}
 			this.show('details')
@@ -359,7 +367,7 @@ export default {
 		},
 
 		async gotoPageEmojiPicker() {
-			if (this.pageUrl && (this.currentPage.id !== this.pageId)) {
+			if (this.pageUrl && (this.currentPageId !== this.pageId)) {
 				await this.$router.push(this.pageUrl)
 			}
 			this.show('details')

src/components/Page/PagePicker.vue

@@ -218,11 +218,10 @@ export default {
 		...mapState(usePagesStore, [
 			'rootPage',
 			'pageById',
+			'currentPageParents',
 			'pageParents',
-			'pageParentsForCollective',
-			'pagesForCollective',
-			'sortedSubpagesForCollective',
-			'visibleSubpages',
+			'pages',
+			'sortedSubpagesByParentId',
 		]),
 
 		isActionButtonsDisabled() {
@@ -240,7 +239,7 @@ export default {
 
 			return this.isCurrentCollective
 				? this.rootPage
-				: this.pagesForCollective(this.selectedCollective).find((p) => (p.parentId === 0))
+				: this.pages(this.selectedCollective).find((p) => (p.parentId === 0))
 		},
 
 		subpages() {
@@ -251,9 +250,9 @@ export default {
 
 			let pages
 			if (this.isCurrentCollective) {
-				pages = this.visibleSubpages(this.selectedPageId)
+				pages = this.currentSortedSubpagesByParentId.get(this.selectedPageId) || []
 			} else {
-				pages = this.sortedSubpagesForCollective(this.selectedCollective, this.selectedPageId)
+				pages = this.sortedSubpagesByParentId(this.selectedCollective).get(this.selectedPageId)
 			}
 
 			// Add current page to top of subpages if not part of it yet
@@ -266,8 +265,8 @@ export default {
 
 		pageCrumbs() {
 			return this.isCurrentCollective
-				? this.pageParents(this.selectedPageId)
-				: this.pageParentsForCollective(this.selectedCollective, this.selectedPageId)
+				? this.currentPageParents(this.selectedPageId)
+				: this.pageParents(this.selectedCollective, this.selectedPageId)
 		},
 
 		collectivesCrumbString() {
@@ -330,7 +329,7 @@ export default {
 	methods: {
 		t,
 
-		...mapActions(usePagesStore, ['getPagesForCollective']),
+		...mapActions(usePagesStore, ['getPages']),
 
 		scrollToPage() {
 			// Scroll current page into view (important when listing parent page)
@@ -377,7 +376,7 @@ export default {
 		async onClickCollective(collective) {
 			this.selectedCollective = collective
 			if (!this.isCurrentCollective) {
-				await this.getPagesForCollective(this.selectedCollective)
+				await this.getPages(this.selectedCollective)
 			}
 			this.selectedPageId = this.selectedRootPage.id
 			// Reset reordered pages when changing collective

src/components/Page/PageTitleBar.vue

@@ -96,6 +96,8 @@
 				:pageId="currentPage.id"
 				:parentId="currentPage.parentId"
 				:timestamp="currentPage.timestamp"
+				:fileName="currentPage.fileName"
+				:davUrl="pageDavUrl(currentPage)"
 				:lastUserId="currentPage.lastUserId"
 				:lastUserDisplayName="currentPage.lastUserDisplayName"
 				:isLandingPage
@@ -176,10 +178,12 @@ export default {
 
 		...mapState(usePagesStore, [
 			'currentPage',
+			'currentPageId',
 			'currentPagePath',
 			'isIndexPage',
 			'isLandingPage',
 			'isTextEdit',
+			'pageDavUrl',
 		]),
 
 		titleChanged() {
@@ -204,7 +208,7 @@ export default {
 		},
 
 		emojiButtonIsLoading() {
-			return this.loading(`pageEmoji-${this.currentPage.id}`)
+			return this.loading(`pageEmoji-${this.currentPageId}`)
 		},
 
 		pageTitleIconSize() {
@@ -217,7 +221,7 @@ export default {
 			document.title = this.documentTitle
 		},
 
-		'currentPage.id': function() {
+		currentPageId: function() {
 			this.initTitleEntry()
 		},
 	},
@@ -239,7 +243,7 @@ export default {
 		...mapActions(useRootStore, ['done']),
 
 		...mapActions(usePagesStore, [
-			'getPages',
+			'getCurrentPages',
 			'renamePage',
 		]),
 
@@ -259,7 +263,7 @@ export default {
 		},
 
 		async onSelectEmoji(emoji) {
-			await this.setEmoji(this.currentPage.id, emoji)
+			await this.setEmoji(this.currentPageId, emoji)
 		},
 
 		onUnselectEmoji() {
@@ -281,7 +285,7 @@ export default {
 				await this.renamePage(this.newTitle)
 				// The resulting title may be different due to sanitizing
 				this.newTitle = this.currentPage.title
-				this.getPages(false)
+				this.getCurrentPages(false)
 				await this.$router.replace(this.currentPagePath)
 			} catch (e) {
 				console.error(e)

src/components/Page/TagsModal.vue

@@ -192,11 +192,11 @@ export default {
 
 	computed: {
 		...mapState(useRootStore, ['loading']),
-		...mapState(usePagesStore, ['pages']),
+		...mapState(usePagesStore, ['currentPages', 'pageById']),
 		...mapState(useTagsStore, ['sortedTags']),
 
 		page() {
-			return this.pages.find((p) => p.id === this.pageId)
+			return this.pageById(this.pageId)
 		},
 
 		decoratedTags() {
@@ -214,7 +214,7 @@ export default {
 		},
 
 		countTagPages() {
-			return (tagId) => this.pages.filter((p) => p.tags.includes(tagId)).length
+			return (tagId) => this.currentPages.filter((p) => p.tags.includes(tagId)).length
 		},
 
 		showCreateTag() {

src/components/PageContainer.vue

@@ -12,7 +12,7 @@
 		<PageTags v-if="tagsLoaded" :isFullWidth />
 		<div class="page-scroll-container">
 			<LandingPageWidgets v-if="isLandingPage" :isFullWidth />
-			<TextEditor :key="`text-editor-${currentPage.id}`" ref="texteditor" :isFullWidth />
+			<TextEditor :key="`text-editor-${currentPageId}`" ref="texteditor" :isFullWidth />
 		</div>
 		<SearchDialog :show="shouldShowSearchDialog" />
 	</div>
@@ -65,6 +65,7 @@ export default {
 		...mapState(useTagsStore, ['tagsLoaded']),
 		...mapState(usePagesStore, [
 			'currentPage',
+			'currentPageId',
 			'isLandingPage',
 		]),
 
@@ -78,7 +79,7 @@ export default {
 	},
 
 	watch: {
-		'currentPage.id': function() {
+		currentPageId: function() {
 			this.setAttachmentsError(false)
 			this.setAttachmentsLoaded(false)
 			this.getAttachmentsForPage(true)

src/components/PageList.vue

@@ -118,6 +118,8 @@
 				:parentId="0"
 				:title="currentCollectiveIsPageShare ? rootPage.title : currentCollective.name"
 				:timestamp="rootPage.timestamp"
+				:fileName="rootPage.fileName"
+				:davUrl="pageDavUrl(rootPage)"
 				:lastUserId="rootPage.lastUserId"
 				:lastUserDisplayName="rootPage.lastUserDisplayName"
 				:emoji="currentCollectiveIsPageShare ? rootPage.emoji : currentCollective.emoji"
@@ -313,22 +315,17 @@ export default {
 		...mapState(useTagsStore, ['sortedTags', 'filterTags']),
 		...mapState(usePagesStore, [
 			'rootPage',
-			'currentPage',
+			'currentPageId',
 			'newPageParentId',
 			'hasFavoritePages',
-			'visibleSubpages',
 			'sortByOrder',
-			'allPagesSorted',
+			'allCurrentSortedPages',
+			'currentSortedSubpagesByParentId',
+			'pageDavUrl',
 		]),
 
-		allPagesSortedCached() {
-			return this.rootPage
-				? this.allPagesSorted(this.rootPage.id)
-				: []
-		},
-
 		filteredPages() {
-			return this.allPagesSortedCached
+			return this.allCurrentSortedPages
 				// Filter by page title search string
 				.filter((p) => p.title.toLowerCase().includes(this.filterString.toLowerCase()))
 				// Filter by page tags
@@ -363,7 +360,7 @@ export default {
 
 		subpages() {
 			if (this.rootPage) {
-				return this.visibleSubpages(this.rootPage.id)
+				return this.currentSortedSubpagesByParentId.get(this.rootPage.id)
 			} else {
 				return []
 			}
@@ -496,7 +493,7 @@ export default {
 					})
 			}
 			this.$nextTick(() => {
-				scrollToPage(this.currentPage.id)
+				scrollToPage(this.currentPageId)
 			})
 		},