refactor: refactor grid to use vuex for every action

1 files changed, 67 insertions, 2 deletions

diff --git a/src/site/store/images.js b/src/site/store/images.js
index d02219f..3019d85 100644
--- a/src/site/store/images.js
+++ b/src/site/store/images.js
@@ -1,4 +1,6 @@
-export const state = () => ({
+import Vue from 'vue';
+
+export const getDefaultState = () => ({
 	files: [],
 	isLoading: false,
 	pagination: {
@@ -8,8 +10,11 @@ export const state = () => ({
 	},
 	name: null,
 	downloadEnabled: false,
+	filesAlbums: {},
 });
 
+export const state = getDefaultState;
+
 export const getters = {
 	getTotalFiles: ({ pagination }) => pagination.totalFiles,
 	getFetchedCount: ({ files }) => files.length,
@@ -28,11 +33,15 @@ export const actions = {
 			const response = await this.$axios.$get('files', { params: { limit: state.pagination.limit, page } });
 
 			commit('setFilesAndMeta', { ...response, page });
+
+			return response;
 		} catch (e) {
 			dispatch('alert/set', { text: e.message, error: true }, { root: true });
 		}
+
+		return null;
 	},
-	async fetchByAlbumId({ commit, dispatch, state }, { id, page }) {
+	async fetchByAlbumId({ commit, state }, { id, page }) {
 		commit('setIsLoading');
 
 		page = page || 1;
@@ -42,6 +51,36 @@ export const actions = {
 		});
 
 		commit('setFilesAndMeta', { ...response, page });
+
+		return response;
+	},
+	async getFileAlbums({ commit }, fileId) {
+		const response = await this.$axios.$get(`file/${fileId}/albums`);
+
+		commit('setFileAlbums', { ...response, fileId });
+
+		return response;
+	},
+	async addToAlbum({ commit }, { fileId, albumId }) {
+		const response = await this.$axios.$post('file/album/add', { fileId, albumId });
+
+		commit('addAlbumToFile', { fileId, albumId, ...response.data });
+
+		return response;
+	},
+	async removeFromAlbum({ commit }, { fileId, albumId }) {
+		const response = await this.$axios.$post('file/album/del', { fileId, albumId });
+
+		commit('removeAlbumFromFile', { fileId, albumId });
+
+		return response;
+	},
+	async deleteFile({ commit }, fileId) {
+		const response = await this.$axios.$delete(`file/${fileId}`);
+
+		commit('removeFile', fileId);
+
+		return response;
 	},
 };
 
@@ -58,4 +97,30 @@ export const mutations = {
 		state.pagination.page = page || 1;
 		state.pagination.totalFiles = count || 0;
 	},
+	removeFile(state, fileId) {
+		const foundIndex = state.files.findIndex(({ id }) => id === fileId);
+		if (foundIndex > -1) {
+			state.files.splice(foundIndex, 1);
+			state.pagination.totalFiles -= 1;
+		}
+	},
+	setFileAlbums(state, { fileId, albums }) {
+		Vue.set(state.filesAlbums, fileId, albums);
+	},
+	addAlbumToFile(state, { fileId, album }) {
+		if (!state.filesAlbums[fileId]) return;
+
+		state.filesAlbums[fileId].push(album);
+	},
+	removeAlbumFromFile(state, { fileId, albumId }) {
+		if (!state.filesAlbums[fileId]) return;
+
+		const foundIndex = state.filesAlbums[fileId].findIndex(({ id }) => id === albumId);
+		if (foundIndex > -1) {
+			state.filesAlbums[fileId].splice(foundIndex, 1);
+		}
+	},
+	resetState(state) {
+		Object.assign(state, getDefaultState());
+	},
 };