start hooking up actions to backend

Signed-off-by: Devlin Junker <devlin.junker@gmail.com>

8 files changed, 227 insertions, 15 deletions

diff --git a/src/App.vue b/src/App.vue
index 930c8b048..79a14d71e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -22,8 +22,11 @@ export default Vue.extend({
 		NcAppContent,
 	},
 	async created() {
+		// fetch folders and feeds to build side bar
 		await this.$store.dispatch(ACTIONS.FETCH_FOLDERS)
 		await this.$store.dispatch(ACTIONS.FETCH_FEEDS)
+		// fetch starred to get starred count
+		await this.$store.dispatch(ACTIONS.FETCH_STARRED)
 	},
 })
 </script>
diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue
index 4c04195fc..411b92cb0 100644
--- a/src/components/Sidebar.vue
+++ b/src/components/Sidebar.vue
@@ -4,7 +4,7 @@
 		<NcAppNavigationNew :text="t('news', 'Subscribe')"
 			button-id="new-feed-button"
 			button-class="icon-add"
-			:icon="true"
+			:icon="''"
 			@click="showShowAddFeed()">
 			<template #icon>
 				<PlusIcon />
@@ -12,7 +12,7 @@
 		</NcAppNavigationNew>
 		<template #list>
 			<NcAppNavigationNewItem :title="t('news', 'New folder')"
-				:icon="true"
+				:icon="''"
 				@new-item="newFolder">
 				<template #icon>
 					<FolderPlusIcon />
@@ -51,14 +51,14 @@
 			<NcAppNavigationItem v-for="topLevelItem in topLevelNav"
 				:key="topLevelItem.name || topLevelItem.title"
 				:title="topLevelItem.name || topLevelItem.title"
-				:icon="true"
+				:icon="''"
 				:to="isFolder(topLevelItem) ? { name: ROUTES.FOLDER, params: { folderId: topLevelItem.id.toString() }} : { name: ROUTES.FEED, params: { feedId: topLevelItem.id.toString() } }"
 				:allow-collapse="true">
 				<template #default>
 					<NcAppNavigationItem v-for="feed in topLevelItem.feeds"
 						:key="feed.name"
 						:title="feed.title"
-						:icon="true"
+						:icon="''"
 						:to="{ name: ROUTES.FEED, params: { feedId: feed.id } }">
 						<template #icon>
 							<RssIcon v-if="!feed.faviconLink" />
@@ -131,7 +131,9 @@
 					</NcCounterBubble>
 				</template>
 				<template #actions>
-					<NcActionButton icon="icon-checkmark" @click="alert('TODO: Mark read')">
+					<SidebarFeedLinkActions v-if="topLevelItem.name === undefined" :feed="topLevelItem" />
+
+					<NcActionButton v-if="topLevelItem.name !== undefined" icon="icon-checkmark" @click="alert('TODO: Mark read')">
 						{{ t("news", "Mark read") }}
 					</NcActionButton>
 					<NcActionButton icon="icon-rename" @click="alert('TODO: Rename')">
diff --git a/src/components/SidebarFeedLinkActions.vue b/src/components/SidebarFeedLinkActions.vue
new file mode 100644
index 000000000..759e0655a
--- /dev/null
+++ b/src/components/SidebarFeedLinkActions.vue
@@ -0,0 +1,116 @@
+<template>
+	<span>
+		<NcActionButton icon="icon-checkmark"
+			@click="markRead">
+			{{ t("news", "Mark read") }}
+		</NcActionButton>
+		<NcActionButton v-if="feed.pinned"
+			icon="icon-pinned"
+			@click="alert('TODO: Unpin from top')">
+			{{ t("news", "Unpin from top") }}
+		</NcActionButton>
+		<NcActionButton v-if="!feed.pinned"
+			icon="icon-pinned"
+			@click="alert('TODO: Pin to top')">
+			{{ t("news", "Pin to top") }}
+		</NcActionButton>
+		<NcActionButton v-if="feed.ordering === FEED_ORDER.NEWEST"
+			icon="icon-caret-dark"
+			@click="alert('TODO: Newest First')">
+			{{ t("news", "Newest first") }}
+		</NcActionButton>
+		<NcActionButton v-if="feed.ordering === FEED_ORDER.OLDEST"
+			icon="icon-caret-dark"
+			@click="alert('TODO: Oldest first')">
+			{{ t("news", "Oldest first") }}
+		</NcActionButton>
+		<NcActionButton v-if="feed.ordering === FEED_ORDER.DEFAULT"
+			icon="icon-caret-dark"
+			@click="alert('TODO: Default Order')">
+			{{ t("news", "Default order") }}
+		</NcActionButton>
+		<NcActionButton v-if="!feed.enableFullText"
+			icon="icon-full-text-disabled"
+			@click="alert('TODO: Enable Full Text')">
+			{{ t("news", "Enable full text") }}
+		</NcActionButton>
+		<NcActionButton v-if="feed.enableFullText"
+			icon="icon-full-text-enabled"
+			@click="alert('TODO: DIsable Full Text')">
+			{{ t("news", "Disable full text") }}
+		</NcActionButton>
+		<NcActionButton v-if="feed.updateMode === FEED_UPDATE_MODE.UNRAD"
+			icon="icon-updatemode-default"
+			@click="alert('TODO: Unread Updated')">
+			{{ t("news", "Unread updated") }}
+		</NcActionButton>
+		<NcActionButton v-if="feed.updateMode === FEED_UPDATE_MODE.IGNORE"
+			icon="icon-updatemode-unread"
+			@click="alert('TOODO: Ignore UPdated')">
+			{{ t("news", "Ignore updated") }}
+		</NcActionButton>
+		<NcActionButton icon="icon-rss"
+			@click="alert('TODO: Open Feed URL')">
+			{{ t("news", "Open feed URL") }}
+		</NcActionButton>
+		<NcActionButton icon="icon-icon-rename"
+			@click="alert('TODO: Rename')">
+			{{ t("news", "Rename") }}
+		</NcActionButton>
+		<NcActionButton icon="icon-delete"
+			@click="alert('TODO: Delete Feed')">
+			{{ t("news", "Delete") }}
+		</NcActionButton>
+	</span>
+</template>
+
+<script lang="ts">
+
+import { mapState } from 'vuex'
+import Vue from 'vue'
+
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+
+import { FEED_ORDER, FEED_UPDATE_MODE } from '../dataservices/feed.service'
+
+import { ACTIONS } from '../store'
+
+// import { Feed } from '../types/Feed'
+
+// TODO?
+const SidebarFeedLinkState = { }
+
+export default Vue.extend({
+	components: {
+		NcActionButton,
+	},
+	props: {
+		feed: {
+			type: Object,
+			required: true,
+		},
+	},
+	data: () => {
+		return {
+			FEED_ORDER,
+			FEED_UPDATE_MODE,
+		}
+	},
+
+	computed: {
+		...mapState(SidebarFeedLinkState),
+	},
+	created() {
+		// TODO: init?
+	},
+	methods: {
+		alert(msg: string) {
+			window.alert(msg)
+		},
+		markRead() {
+			this.$store.dispatch(ACTIONS.FEED_MARK_READ, { feed: this.feed })
+		},
+	},
+})
+
+</script>
diff --git a/src/dataservices/feed.service.ts b/src/dataservices/feed.service.ts
index f5ac032b5..aa8dc215c 100644
--- a/src/dataservices/feed.service.ts
+++ b/src/dataservices/feed.service.ts
@@ -3,6 +3,17 @@ import axios from '@nextcloud/axios'
 
 import { API_ROUTES } from '../types/ApiRoutes'
 
+export const FEED_ORDER = {
+	OLDEST: 1,
+	NEWEST: 0,
+	DEFAULT: 2,
+}
+
+export const FEED_UPDATE_MODE = {
+	IGNORE: 1,
+	UNREAD: 0,
+}
+
 export class FeedService {
 
 	/**
@@ -36,4 +47,18 @@ export class FeedService {
 		})
 	}
 
+	/**
+	 * Marks all items in feed, started with highestReadId
+	 *
+	 * @param param0
+	 * @param param0.feedId {Number} ID number of feed to mark items as read
+	 * @param param0.highestItemId {Number} ID number of the (most recent?) feed item to mark as read (all older items will be marked as read)
+	 * @return {AxiosResponse} Updated feed info (unreadCount = 0) stored in data.feeds[0] property
+	 */
+	static markRead({ feedId, highestItemId }: { feedId: number, highestItemId: number }): Promise<AxiosResponse> {
+		return axios.post(API_ROUTES.FEED + `/${feedId}/read`, {
+			highestItemId,
+		})
+	}
+
 }
diff --git a/src/dataservices/item.service.ts b/src/dataservices/item.service.ts
index 98b9d9eb3..6763b07ea 100644
--- a/src/dataservices/item.service.ts
+++ b/src/dataservices/item.service.ts
@@ -85,7 +85,7 @@ export class ItemService {
 	 * @param start (id of last unread item loaded)
 	 * @return {AxiosResponse} response object containing backend request response
 	 */
-	static async fetchFeedItems(feedId: number, start: number): Promise<AxiosResponse> {
+	static async fetchFeedItems(feedId: number, start?: number): Promise<AxiosResponse> {
 		return await axios.get(API_ROUTES.ITEMS, {
 			params: {
 				limit: 40,
diff --git a/src/store/feed.ts b/src/store/feed.ts
index b66fff376..08f834cf2 100644
--- a/src/store/feed.ts
+++ b/src/store/feed.ts
@@ -1,12 +1,16 @@
+import _ from 'lodash'
+
 import { ActionParams, AppState } from '../store'
 import { Feed } from '../types/Feed'
 import { FOLDER_MUTATION_TYPES, FEED_MUTATION_TYPES, FEED_ITEM_MUTATION_TYPES } from '../types/MutationTypes'
 import { FolderService } from '../dataservices/folder.service'
 import { FeedService } from '../dataservices/feed.service'
+import { ItemService } from '../dataservices/item.service'
 
 export const FEED_ACTION_TYPES = {
 	ADD_FEED: 'ADD_FEED',
 	FETCH_FEEDS: 'FETCH_FEEDS',
+	FEED_MARK_READ: 'FEED_MARK_READ',
 }
 
 const state = {
@@ -69,6 +73,12 @@ export const actions = {
 
 		}
 	},
+	async [FEED_ACTION_TYPES.FEED_MARK_READ]({ commit }: ActionParams, { feed }: { feed: Feed }) {
+		const response = await ItemService.fetchFeedItems(feed.id as number)
+		await FeedService.markRead({ feedId: feed.id as number, highestItemId: response.data.items[0].id })
+
+		commit(FEED_MUTATION_TYPES.SET_FEED_ALL_READ, feed.id)
+	},
 }
 
 export const mutations = {
@@ -80,6 +90,38 @@ export const mutations = {
 	[FEED_MUTATION_TYPES.ADD_FEED](state: AppState, feed: Feed) {
 		state.feeds.push(feed)
 	},
+	[FEED_MUTATION_TYPES.UPDATE_FEED](state: AppState, newFeed: Feed) {
+		const feed = state.feeds.find((feed: Feed) => {
+			return feed.id === newFeed.id
+		})
+		_.assign(feed, newFeed)
+	},
+	[FEED_MUTATION_TYPES.SET_FEED_ALL_READ](state: AppState, feedId: number) {
+		const priorFeed = state.feeds.find((stateFeed: Feed) => {
+			return stateFeed.id === feedId
+		})
+		if (priorFeed) {
+			const priorUnread = priorFeed?.unreadCount
+			_.assign(priorFeed, { unreadCount: 0 })
+			state.unreadCount -= priorUnread
+		}
+	},
+	[FEED_MUTATION_TYPES.INCREASE_FEED_UNREAD_COUNT](state: AppState, feedId: number) {
+		const feed = state.feeds.find((feed: Feed) => {
+			return feed.id === feedId
+		})
+		if (feed) {
+			_.assign(feed, { unreadCount: feed.unreadCount + 1 })
+		}
+	},
+	[FEED_MUTATION_TYPES.DECREASE_FEED_UNREAD_COUNT](state: AppState, feedId: number) {
+		const feed = state.feeds.find((feed: Feed) => {
+			return feed.id === feedId
+		})
+		if (feed) {
+			_.assign(feed, { unreadCount: feed.unreadCount - 1 })
+		}
+	},
 }
 
 export default {
diff --git a/src/store/item.ts b/src/store/item.ts
index 4f73bff55..6c91b0755 100644
--- a/src/store/item.ts
+++ b/src/store/item.ts
@@ -1,5 +1,5 @@
 import { ActionParams } from '../store'
-import { FEED_ITEM_MUTATION_TYPES } from '../types/MutationTypes'
+import { FEED_ITEM_MUTATION_TYPES, FEED_MUTATION_TYPES } from '../types/MutationTypes'
 
 import { FeedItem } from '../types/FeedItem'
 import { ItemService } from '../dataservices/item.service'
@@ -100,8 +100,10 @@ export const actions = {
 			commit(FEED_ITEM_MUTATION_TYPES.SET_ALL_LOADED, { key: 'all', loaded: true })
 		}
 
-		const lastItem = response?.data.items[response?.data.items.length - 1].id
-		commit(FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED, { key: 'all', lastItem })
+		if (response?.data.items.length > 0) {
+			const lastItem = response?.data.items[response?.data.items.length - 1].id
+			commit(FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED, { key: 'all', lastItem })
+		}
 		commit(FEED_ITEM_MUTATION_TYPES.SET_FETCHING, { key: 'all', fetching: false })
 	},
 
@@ -125,8 +127,10 @@ export const actions = {
 		if (response?.data.items.length < 40) {
 			commit(FEED_ITEM_MUTATION_TYPES.SET_ALL_LOADED, { key: 'starred', loaded: true })
 		}
-		const lastItem = response?.data.items[response?.data.items.length - 1].id
-		commit(FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED, { key: 'starred', lastItem })
+		if (response?.data.items.length > 0) {
+			const lastItem = response?.data.items[response?.data.items.length - 1].id
+			commit(FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED, { key: 'starred', lastItem })
+		}
 		commit(FEED_ITEM_MUTATION_TYPES.SET_FETCHING, { key: 'starred', fetching: false })
 	},
 
@@ -147,8 +151,10 @@ export const actions = {
 		if (response?.data.items.length < 40) {
 			commit(FEED_ITEM_MUTATION_TYPES.SET_ALL_LOADED, { key: 'feed-' + feedId, loaded: true })
 		}
-		const lastItem = response?.data.items[response?.data.items.length - 1].id
-		commit(FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED, { key: 'feed-' + feedId, lastItem })
+		if (response?.data.items.length > 0) {
+			const lastItem = response?.data.items[response?.data.items.length - 1].id
+			commit(FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED, { key: 'feed-' + feedId, lastItem })
+		}
 		commit(FEED_ITEM_MUTATION_TYPES.SET_FETCHING, { key: 'feed-' + feedId, fetching: false })
 	},
 
@@ -169,8 +175,10 @@ export const actions = {
 		if (response?.data.items.length < 40) {
 			commit(FEED_ITEM_MUTATION_TYPES.SET_ALL_LOADED, { key: 'folder-' + folderId, loaded: true })
 		}
-		const lastItem = response?.data.items[response?.data.items.length - 1].id
-		commit(FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED, { key: 'folder-' + folderId, lastItem })
+		if (response?.data.items.length > 0) {
+			const lastItem = response?.data.items[response?.data.items.length - 1].id
+			commit(FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED, { key: 'folder-' + folderId, lastItem })
+		}
 		commit(FEED_ITEM_MUTATION_TYPES.SET_FETCHING, { key: 'folder-' + folderId, fetching: false })
 	},
 
@@ -187,6 +195,8 @@ export const actions = {
 
 		if (item.unread) {
 			commit(FEED_ITEM_MUTATION_TYPES.SET_UNREAD_COUNT, state.unreadCount - 1)
+
+			commit(FEED_MUTATION_TYPES.DECREASE_FEED_UNREAD_COUNT, item.feedId)
 		}
 		item.unread = false
 		commit(FEED_ITEM_MUTATION_TYPES.UPDATE_ITEM, { item })
@@ -205,6 +215,8 @@ export const actions = {
 
 		if (!item.unread) {
 			commit(FEED_ITEM_MUTATION_TYPES.SET_UNREAD_COUNT, state.unreadCount + 1)
+
+			commit(FEED_MUTATION_TYPES.INCREASE_FEED_UNREAD_COUNT, item.feedId)
 		}
 		item.unread = true
 		commit(FEED_ITEM_MUTATION_TYPES.UPDATE_ITEM, { item })
@@ -275,6 +287,13 @@ export const mutations = {
 	[FEED_ITEM_MUTATION_TYPES.SET_LAST_ITEM_LOADED](state: ItemState, { lastItem, key }: { lastItem: number; key: string; }) {
 		state.lastItemLoaded[key] = lastItem
 	},
+	[FEED_MUTATION_TYPES.SET_FEED_ALL_READ](state: ItemState, feedId: number) {
+		state.allItems.forEach((item: FeedItem) => {
+			if (item.feedId === feedId) {
+				item.unread = false
+			}
+		})
+	},
 }
 
 export default {
diff --git a/src/types/MutationTypes.ts b/src/types/MutationTypes.ts
index 859c47f04..9947b7d11 100644
--- a/src/types/MutationTypes.ts
+++ b/src/types/MutationTypes.ts
@@ -1,6 +1,11 @@
 export const FEED_MUTATION_TYPES = {
 	ADD_FEED: 'ADD_FEED',
 	SET_FEEDS: 'SET_FEEDS',
+	UPDATE_FEED: 'UPDATE_FEED',
+
+	SET_FEED_ALL_READ: 'SET_FEED_ALL_READ',
+	INCREASE_FEED_UNREAD_COUNT: 'INCREASE_FEED_UNREAD_COUNT',
+	DECREASE_FEED_UNREAD_COUNT: 'DECREASE_FEED_UNREAD_COUNT',
 }
 
 export const FOLDER_MUTATION_TYPES = {