[Vue Rewrite] Fetch Item Bugfix + other cleanup

src/components/FeedItemDisplay.vue → src/components/feed-display/FeedItemDisplay.vue

@@ -101,9 +101,9 @@ import CloseIcon from 'vue-material-design-icons/Close.vue'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 
-import { Feed } from '../types/Feed'
-import { FeedItem } from '../types/FeedItem'
-import { ACTIONS, MUTATIONS } from '../store'
+import { Feed } from '../../types/Feed'
+import { FeedItem } from '../../types/FeedItem'
+import { ACTIONS, MUTATIONS } from '../../store'
 
 export default Vue.extend({
 	name: 'FeedItemDisplay',

src/components/FeedItemDisplayList.vue → src/components/feed-display/FeedItemDisplayList.vue

@@ -60,7 +60,7 @@ import VirtualScroll from './VirtualScroll.vue'
 import FeedItemRow from './FeedItemRow.vue'
 import FeedItemDisplay from './FeedItemDisplay.vue'
 
-import { FeedItem } from '../types/FeedItem'
+import { FeedItem } from '../../types/FeedItem'
 
 const DEFAULT_DISPLAY_LIST_CONFIG = {
 	starFilter: true,

src/components/FeedItemRow.vue → src/components/feed-display/FeedItemRow.vue

@@ -60,9 +60,9 @@ import ShareVariant from 'vue-material-design-icons/ShareVariant.vue'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 
-import { Feed } from '../types/Feed'
-import { FeedItem } from '../types/FeedItem'
-import { ACTIONS, MUTATIONS } from '../store'
+import { Feed } from '../../types/Feed'
+import { FeedItem } from '../../types/FeedItem'
+import { ACTIONS, MUTATIONS } from '../../store'
 
 export default Vue.extend({
 	name: 'FeedItemRow',

src/components/routes/Feed.vue

@@ -17,7 +17,7 @@ import { mapState } from 'vuex'
 
 import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble.js'
 
-import FeedItemDisplayList from '../FeedItemDisplayList.vue'
+import FeedItemDisplayList from '../feed-display/FeedItemDisplayList.vue'
 
 import { FeedItem } from '../../types/FeedItem'
 import { ACTIONS, MUTATIONS } from '../../store'
@@ -56,7 +56,7 @@ export default Vue.extend({
 	methods: {
 		async fetchMore() {
 			if (!this.$store.state.items.fetchingItems['feed-' + this.feedId]) {
-			  this.$store.dispatch(ACTIONS.FETCH_FEED_ITEMS, { feedId: this.id, start: this.items && this.items.length > 0 ? this.items[this.items.length - 1].id : 0 })
+			  this.$store.dispatch(ACTIONS.FETCH_FEED_ITEMS, { feedId: this.id })
 			}
 		},
 	},

src/components/routes/Starred.vue

@@ -20,7 +20,7 @@ import { mapState } from 'vuex'
 
 import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble.js'
 
-import FeedItemDisplayList from '../FeedItemDisplayList.vue'
+import FeedItemDisplayList from '../feed-display/FeedItemDisplayList.vue'
 
 import { FeedItem } from '../../types/FeedItem'
 import { ACTIONS, MUTATIONS } from '../../store'
@@ -43,7 +43,7 @@ export default Vue.extend({
 	methods: {
 		async fetchMore() {
 			if (!this.$store.state.items.fetchingItems.starred) {
-			  this.$store.dispatch(ACTIONS.FETCH_STARRED, { start: this.$store.getters.starred[this.$store.getters.starred?.length - 1]?.id })
+			  this.$store.dispatch(ACTIONS.FETCH_STARRED)
 			}
 		},
 	},

src/components/routes/Unread.vue

@@ -21,7 +21,7 @@ import { mapState } from 'vuex'
 
 import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble.js'
 
-import FeedItemDisplayList from '../FeedItemDisplayList.vue'
+import FeedItemDisplayList from '../feed-display/FeedItemDisplayList.vue'
 
 import { FeedItem } from '../../types/FeedItem'
 import { ACTIONS, MUTATIONS } from '../../store'
@@ -68,7 +68,7 @@ export default Vue.extend({
 		},
 		async fetchMore() {
 			if (this.unreadCache && !this.$store.state.items.fetchingItems.unread) {
-			  this.$store.dispatch(ACTIONS.FETCH_UNREAD, { start: this.unreadCache[this.unreadCache?.length - 1]?.id })
+			  this.$store.dispatch(ACTIONS.FETCH_UNREAD)
 			}
 		},
 	},

src/dataservices/feed.service.ts

@@ -0,0 +1,39 @@
+import { AxiosResponse } from 'axios'
+import axios from '@nextcloud/axios'
+
+import { API_ROUTES } from '../types/ApiRoutes'
+
+export class FeedService {
+
+	/**
+	 * Retrieves all Feed info from the Nextcloud News backend
+	 *
+	 * @return {AxiosResponse} Feed info stored in array property data.feeds
+	 */
+	static fetchAllFeeds(): Promise<AxiosResponse> {
+		return axios.get(API_ROUTES.FEED)
+	}
+
+	/**
+	 * Attempts to add a feed to the Nextcloud News backend
+	 * NOTE: this can fail if feed URL is not resolvable
+	 *
+	 * @param param0
+	 * @param param0.url {String} url of the feed to add
+	 * @param param0.folderId {number} id number of folder to add feed to
+	 * @param param0.user {String} http auth username required for accessing feed
+	 * @param param0.password {String} http auth password required for accessing feed
+	 * @return {AxiosResponse} Feed info stored in data.feeds[0] property
+	 */
+	static addFeed({ url, folderId, user, password }: { url: string; folderId: number; user?: string; password?: string }): Promise<AxiosResponse> {
+		return axios.post(API_ROUTES.FEED, {
+			url,
+			parentFolderId: folderId,
+			title: null, // TODO: let user define feed title on create?
+			user: user || null,
+			password: password || null,
+			fullDiscover: undefined, // TODO: autodiscover?
+		})
+	}
+
+}

src/dataservices/folder.service.ts

@@ -0,0 +1,39 @@
+import { AxiosResponse } from 'axios'
+import axios from '@nextcloud/axios'
+
+import { API_ROUTES } from '../types/ApiRoutes'
+
+export class FolderService {
+
+	/**
+	 * Retrieves all of the folders from the Nextcloud News backend
+	 *
+	 * @return {AxiosResponse} Folders contained in data.folders property
+	 */
+	static fetchAllFolders(): Promise<AxiosResponse> {
+		return axios.get(API_ROUTES.FOLDER)
+	}
+
+	/**
+	 * Creates a new Folder in the Nextcloud News backend
+	 *
+	 * @param param0
+	 * @param param0.name {String} New Folder Name
+	 * @return {AxiosResponse} Folder info from backend in data.folders[0] property
+	 */
+	static createFolder({ name }: { name: string }): Promise<AxiosResponse> {
+		return axios.post(API_ROUTES.FOLDER, { folderName: name })
+	}
+
+	/**
+	 * Deletes a folder in the Nextcloud News backend (by id number)
+	 *
+	 * @param param0
+	 * @param param0.id {number} id of folder to delete
+	 * @return {AxiosResponse}
+	 */
+	static deleteFolder({ id }: { id: number }): Promise<AxiosResponse> {
+		return axios.delete(API_ROUTES.FOLDER + '/' + id)
+	}
+
+}

src/store/feed.ts

@@ -1,9 +1,8 @@
-import axios from '@nextcloud/axios'
-
 import { ActionParams, AppState } from '../store'
 import { Feed } from '../types/Feed'
-import { API_ROUTES } from '../types/ApiRoutes'
 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'
 
 export const FEED_ACTION_TYPES = {
 	ADD_FEED: 'ADD_FEED',
@@ -22,7 +21,7 @@ const getters = {
 
 export const actions = {
 	async [FEED_ACTION_TYPES.FETCH_FEEDS]({ commit }: ActionParams) {
-		const feeds = await axios.get(API_ROUTES.FEED)
+		const feeds = await FeedService.fetchAllFeeds()
 
 		commit(FEED_MUTATION_TYPES.SET_FEEDS, feeds.data.feeds)
 		commit(FEED_ITEM_MUTATION_TYPES.SET_UNREAD_COUNT, (feeds.data.feeds.reduce((total: number, feed: Feed) => {
@@ -47,30 +46,20 @@ export const actions = {
 
 		let folderId
 		if (feedReq.folder?.id === undefined && feedReq.folder?.name && feedReq.folder?.name !== '') {
-			const response = await axios.post(API_ROUTES.FOLDER, { folderName: feedReq.folder?.name })
+			const response = await FolderService.createFolder({ name: feedReq.folder.name })
 			folderId = response.data.folders[0].id
 			commit(FOLDER_MUTATION_TYPES.SET_FOLDERS, response.data.folders)
 		} else {
 			folderId = feedReq.folder?.id || 0
 		}
 
-		const feed: Feed = {
-			url,
-			folderId,
-			title: undefined, // TODO: let user define feed title on create?
-			unreadCount: 0,
-			autoDiscover: undefined, // TODO: autodiscover?
-		}
-
 		// Check that url is resolvable
 		try {
-			const response = await axios.post(API_ROUTES.FEED, {
-				url: feed.url,
-				parentFolderId: feed.folderId,
-				title: null,
-				user: feedReq.user ? feedReq.user : null,
-				password: feedReq.password ? feedReq.password : null,
-				fullDiscover: feed.autoDiscover,
+			const response = await FeedService.addFeed({
+				url,
+				folderId,
+				user: feedReq.user,
+				password: feedReq.password,
 			})
 
 			commit(FEED_MUTATION_TYPES.ADD_FEED, response.data.feeds[0])

src/store/folder.ts

@@ -1,10 +1,8 @@
-import axios from '@nextcloud/axios'
-
 import { AppState, ActionParams } from '../store'
 import { Folder } from '../types/Folder'
 import { Feed } from '../types/Feed'
 import { FOLDER_MUTATION_TYPES, FEED_MUTATION_TYPES } from '../types/MutationTypes'
-import { API_ROUTES } from '../types/ApiRoutes'
+import { FolderService } from '../dataservices/folder.service'
 
 export const FOLDER_ACTION_TYPES = {
 	FETCH_FOLDERS: 'FETCH_FOLDERS',
@@ -24,12 +22,12 @@ const getters = {
 
 export const actions = {
 	async [FOLDER_ACTION_TYPES.FETCH_FOLDERS]({ commit }: ActionParams) {
-		const folders = await axios.get(API_ROUTES.FOLDER)
+		const folders = await FolderService.fetchAllFolders()
 
 		commit(FOLDER_MUTATION_TYPES.SET_FOLDERS, folders.data.folders)
 	},
 	async [FOLDER_ACTION_TYPES.ADD_FOLDERS]({ commit }: ActionParams, { folder }: { folder: Folder}) {
-		const response = await axios.post(API_ROUTES.FOLDER, { folderName: folder.name })
+		const response = await FolderService.createFolder({ name: folder.name })
 		commit(FOLDER_MUTATION_TYPES.SET_FOLDERS, response.data.folders)
 	},
 	async [FOLDER_ACTION_TYPES.DELETE_FOLDER]({ commit }: ActionParams, { folder }: { folder: Folder}) {
@@ -39,7 +37,7 @@ export const actions = {
           promises.push(self.reversiblyDelete(feed.id, false, true));
       });
 		 */
-		await axios.delete(API_ROUTES.FOLDER + '/' + folder.id)
+		await FolderService.deleteFolder({ id: folder.id })
 		commit(FOLDER_MUTATION_TYPES.DELETE_FOLDER, folder)
 	},
 }