started on fetching starred items from backend and displaying with for loop

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

6 files changed, 86 insertions, 11 deletions

diff --git a/src/components/Starred.vue b/src/components/Starred.vue
index d1117d137..d0f51ab45 100644
--- a/src/components/Starred.vue
+++ b/src/components/Starred.vue
@@ -1,20 +1,30 @@
 <template>
-	<div id="starred">
-		Starred Items Here
+	<div>
+		Starred Items:
+		<div v-for="item in items.starredItems" :key="item.id">
+			{{ item.title }}
+		</div>
 	</div>
 </template>
 
-<script>
-// import axios from "@nextcloud/axios";
-// import { generateUrl } from "@nextcloud/router";
+<script lang="ts">
+import { FEED_ITEM_ACTION_TYPES } from '../store/item'
+import { mapState } from 'vuex'
+
 export default {
 	components: {
 	},
 	props: {
 
 	},
-	created() {
-		// this.fetchStarred();
+	computed: {
+		...mapState(['items']),
+		// starred(): any[] {
+		// return this.$store.state.items.starredItems
+		// },
+	},
+	async created() {
+		await this.$store.dispatch(FEED_ITEM_ACTION_TYPES.FETCH_STARRED)
 	},
 	methods: {
 		async fetchStarred() {
diff --git a/src/store/folder.ts b/src/store/folder.ts
index b1ae2e59d..bf8bc0922 100644
--- a/src/store/folder.ts
+++ b/src/store/folder.ts
@@ -58,7 +58,7 @@ export const mutations = {
 	},
 	[FEED_MUTATION_TYPES.SET_FEEDS](state: AppState, feeds: Feed[]) {
 		feeds.forEach(it => {
-			const folder = state.folders.find(folder => folder.id === it.folderId)
+			const folder = state.folders.find((folder: Folder) => { return folder.id === it.folderId })
 			if (folder) {
 				folder.feeds.push(it)
 				folder.feedCount += it.unreadCount
@@ -66,7 +66,7 @@ export const mutations = {
 		})
 	},
 	[FEED_MUTATION_TYPES.ADD_FEED](state: AppState, feed: Feed) {
-		const folder = state.folders.find(folder => folder.id === feed.folderId)
+		const folder = state.folders.find((folder: Folder) => { return folder.id === feed.folderId })
 		if (folder) {
 			folder.feeds.push(feed)
 			folder.feedCount += feed.unreadCount
diff --git a/src/store/index.ts b/src/store/index.ts
index 539a1b2de..489cceac4 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -2,16 +2,19 @@ import { Folder } from '../types/Folder'
 import { Feed } from '../types/Feed'
 import feeds, { FEED_ACTION_TYPES } from './feed'
 import folders, { FOLDER_ACTION_TYPES } from './folder'
-import { FOLDER_MUTATION_TYPES, FEED_MUTATION_TYPES } from '../types/MutationTypes'
+import { FOLDER_MUTATION_TYPES, FEED_MUTATION_TYPES, FEED_ITEM_MUTATION_TYPES } from '../types/MutationTypes'
+import items, { FEED_ITEM_ACTION_TYPES, ItemState } from './item'
 
 export const MUTATIONS = {
 	...FEED_MUTATION_TYPES,
 	...FOLDER_MUTATION_TYPES,
+	...FEED_ITEM_MUTATION_TYPES,
 }
 
 export const ACTIONS = {
 	...FEED_ACTION_TYPES,
 	...FOLDER_ACTION_TYPES,
+	...FEED_ITEM_ACTION_TYPES,
 }
 
 type Func = (name: string, value: unknown) => void;
@@ -20,11 +23,12 @@ export type ActionParams = { commit: Func };
 export type AppState = {
   feeds: Feed[];
   folders: Folder[];
-}
+} & ItemState;
 
 export default {
 	modules: {
 		feeds,
 		folders,
+		items,
 	},
 }
diff --git a/src/store/item.ts b/src/store/item.ts
new file mode 100644
index 000000000..09a6b6f96
--- /dev/null
+++ b/src/store/item.ts
@@ -0,0 +1,56 @@
+import axios from '@nextcloud/axios'
+
+import { ActionParams } from '../store'
+import { FEED_ITEM_MUTATION_TYPES } from '../types/MutationTypes'
+import { API_ROUTES } from '../types/ApiRoutes'
+
+export const FEED_ITEM_ACTION_TYPES = {
+	FETCH_STARRED: 'FETCH_STARRED',
+}
+
+export type ItemState = {
+	allItems: any[];
+	starredItems: any[];
+}
+
+const state: ItemState = {
+	allItems: [],
+	starredItems: [],
+}
+
+const getters = {
+	starred(state: ItemState) {
+		return state.starredItems
+	},
+}
+
+export const actions = {
+	async [FEED_ITEM_ACTION_TYPES.FETCH_STARRED]({ commit }: ActionParams) {
+		const response = await axios.get(API_ROUTES.ITEMS, {
+			params: {
+				limit: 40,
+				oldestFirst: false,
+				search: '',
+				showAll: false,
+				type: 2,
+			},
+		})
+
+		commit(FEED_ITEM_MUTATION_TYPES.SET_STARRED, response.data.items)
+	},
+}
+
+export const mutations = {
+	[FEED_ITEM_MUTATION_TYPES.SET_STARRED](state: ItemState, items: any[]) {
+		items.forEach(it => {
+			state.starredItems.push(it)
+		})
+	},
+}
+
+export default {
+	state,
+	getters,
+	actions,
+	mutations,
+}
diff --git a/src/types/ApiRoutes.ts b/src/types/ApiRoutes.ts
index c05a5f716..fbaaa6dd1 100644
--- a/src/types/ApiRoutes.ts
+++ b/src/types/ApiRoutes.ts
@@ -3,4 +3,5 @@ import { generateUrl } from '@nextcloud/router'
 export const API_ROUTES = {
 	FOLDER: generateUrl('/apps/news/folders'),
 	FEED: generateUrl('/apps/news/feeds'),
+	ITEMS: generateUrl('/apps/news/items'),
 }
diff --git a/src/types/MutationTypes.ts b/src/types/MutationTypes.ts
index 294deaffd..9149da059 100644
--- a/src/types/MutationTypes.ts
+++ b/src/types/MutationTypes.ts
@@ -7,3 +7,7 @@ export const FOLDER_MUTATION_TYPES = {
 	SET_FOLDERS: 'SET_FOLDERS',
 	DELETE_FOLDER: 'DELETE_FOLDER',
 }
+
+export const FEED_ITEM_MUTATION_TYPES = {
+	SET_STARRED: 'SET_STARRED',
+}