fix: add keepUnread as property to FeedItem during the session so that other components can also use it

Signed-off-by: Wolfgang <github@linux-dude.de>

6 files changed, 16 insertions, 15 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3c929cf6d..456ef245d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@ You can also check [on GitHub](https://github.com/nextcloud/news/releases), the
 
 ### Fixed
 - Feed without Title returned by DB causes exception (#2872)
+- Keep Unread is now respected during mark read on scroll and is kept during feed/folder changes
 
 # Releases
 ## [25.0.0-alpha14] - 2024-11-10
diff --git a/src/components/feed-display/FeedItemDisplay.vue b/src/components/feed-display/FeedItemDisplay.vue
index bc5fd4ad2..3ab2b4bcc 100644
--- a/src/components/feed-display/FeedItemDisplay.vue
+++ b/src/components/feed-display/FeedItemDisplay.vue
@@ -180,7 +180,7 @@ export default Vue.extend({
 		},
 
 		toggleRead(item: FeedItem): void {
-			if (item.unread) {
+			if (!item.keepUnread && item.unread) {
 				this.$store.dispatch(ACTIONS.MARK_READ, { item })
 			} else {
 				this.$store.dispatch(ACTIONS.MARK_UNREAD, { item })
diff --git a/src/components/feed-display/FeedItemRow.vue b/src/components/feed-display/FeedItemRow.vue
index 0979ed936..45c980f8b 100644
--- a/src/components/feed-display/FeedItemRow.vue
+++ b/src/components/feed-display/FeedItemRow.vue
@@ -38,9 +38,9 @@
 
 		<div class="button-container" @click="$event.stopPropagation()">
 			<StarIcon :class="{'starred': item.starred }" @click="toggleStarred(item)" />
-			<EyeIcon v-if="item.unread && !keepUnread" @click="toggleKeepUnread(item)" />
-			<EyeCheckIcon v-if="!item.unread && !keepUnread" @click="toggleKeepUnread(item)" />
-			<EyeLockIcon v-if="keepUnread" class="keep-unread" @click="toggleKeepUnread(item)" />
+			<EyeIcon v-if="item.unread && !item.keepUnread" @click="toggleKeepUnread(item)" />
+			<EyeCheckIcon v-if="!item.unread && !item.keepUnread" @click="toggleKeepUnread(item)" />
+			<EyeLockIcon v-if="item.keepUnread" class="keep-unread" @click="toggleKeepUnread(item)" />
 			<NcActions>
 				<NcActionButton :title="t('news', 'Share within Instance')" @click="shareItem = item.id; showShareMenu = true">
 					{{ t('news', 'Share') }}
@@ -94,7 +94,6 @@ export default Vue.extend({
 	},
 	data: () => {
 		return {
-			keepUnread: false,
 			showShareMenu: false,
 			shareItem: undefined,
 		}
@@ -142,12 +141,12 @@ export default Vue.extend({
 			return this.$store.getters.feeds.find((feed: Feed) => feed.id === id) || {}
 		},
 		markRead(item: FeedItem): void {
-			if (!this.keepUnread && item.unread) {
+			if (!item.keepUnread && item.unread) {
 				this.$store.dispatch(ACTIONS.MARK_READ, { item })
 			}
 		},
 		toggleKeepUnread(item: FeedItem): void {
-			this.keepUnread = !this.keepUnread
+			this.$set(item, 'keepUnread', !item.keepUnread)
 			this.$store.dispatch(ACTIONS.MARK_UNREAD, { item })
 		},
 		toggleStarred(item: FeedItem): void {
diff --git a/src/components/feed-display/VirtualScroll.vue b/src/components/feed-display/VirtualScroll.vue
index f90e8602d..0b7b0c515 100644
--- a/src/components/feed-display/VirtualScroll.vue
+++ b/src/components/feed-display/VirtualScroll.vue
@@ -83,7 +83,7 @@ export default Vue.extend({
 			for (const [key, value] of this.seenItems) {
 				if (this.scrollTop > value.offset) {
 					const item = value.item
-					if (item.unread) {
+					if (!item.keepUnread && item.unread) {
 						this.$store.dispatch(ACTIONS.MARK_READ, { item })
 					}
 					this.seenItems.delete(key)
diff --git a/src/types/FeedItem.ts b/src/types/FeedItem.ts
index 979f4bfcb..605ed6d5d 100644
--- a/src/types/FeedItem.ts
+++ b/src/types/FeedItem.ts
@@ -7,4 +7,5 @@ export type FeedItem = {
   guidHash: string;
   pubDate: number;
   url: string;
+  keepUnread: boolean;
 };
diff --git a/tests/javascript/unit/components/feed-display/FeedItemRow.spec.ts b/tests/javascript/unit/components/feed-display/FeedItemRow.spec.ts
index 62cc63835..93e03681a 100644
--- a/tests/javascript/unit/components/feed-display/FeedItemRow.spec.ts
+++ b/tests/javascript/unit/components/feed-display/FeedItemRow.spec.ts
@@ -46,7 +46,7 @@ describe('FeedItemRow.vue', () => {
 	})
 
 	it('should initialize without expanded and without keepUnread', () => {
-		expect(wrapper.vm.$data.keepUnread).toBeFalsy()
+		expect(wrapper.vm.$props.item.keepUnread).toBeFalsy()
 	})
 
 	it('should format date to match locale', () => {
@@ -86,7 +86,7 @@ describe('FeedItemRow.vue', () => {
 
 	describe('markRead', () => {
 		it('should mark item as read when keepUnread is false', () => {
-			wrapper.vm.$data.keepUnread = false;
+			wrapper.vm.$props.item.keepUnread = false;
 			(wrapper.vm as any).markRead(wrapper.vm.$props.item)
 
 			expect(dispatchStub).toHaveBeenCalledWith(ACTIONS.MARK_READ, {
@@ -95,17 +95,17 @@ describe('FeedItemRow.vue', () => {
 		})
 
 		it('should not mark item as read when keepUnread is true', () => {
-			wrapper.vm.$data.keepUnread = true;
-			(wrapper.vm as any).markRead(wrapper.vm.$data.item)
+			wrapper.vm.$props.item.keepUnread = true;
+			(wrapper.vm as any).markRead(wrapper.vm.$props.item)
 
 			expect(dispatchStub).not.toHaveBeenCalled()
 		})
 	})
 
 	it('toggles keepUnread state', () => {
-		const initialKeepUnread = wrapper.vm.$data.keepUnread;
-		(wrapper.vm as any).toggleKeepUnread(wrapper.vm.$data.item)
-		const updatedKeepUnread = wrapper.vm.$data.keepUnread
+		const initialKeepUnread = wrapper.vm.$props.item.keepUnread;
+		(wrapper.vm as any).toggleKeepUnread(wrapper.vm.$props.item)
+		const updatedKeepUnread = wrapper.vm.$props.item.keepUnread
 
 		expect(updatedKeepUnread).toBe(!initialKeepUnread)
 	})