paginator refactoring and implementation into the routes

This commit is contained in:
Čarodej
2022-05-24 18:19:34 +02:00
parent 31218240ae
commit b9975de700
61 changed files with 1215 additions and 829 deletions

View File

@@ -18,19 +18,16 @@ const defaultState = {
const actions = {
getFolder: ({ commit, getters },{page, id}) => {
return new Promise ((resolve, reject) => {
if(! page)
commit('LOADING_STATE', { loading: true, data: [] })
if(page === 1)
commit('START_LOADING_VIEW')
axios
.get(`${getters.api}/browse/folders/${id || 'all'}${getters.sorting.URI}&page=${currentPage}`)
.get(`${getters.api}/browse/folders/${id || 'all'}${getters.sorting.URI}&page=${page}`)
.then((response) => {
commit('SET_PAGINATE', response.data.meta.paginate)
commit('LOADING_STATE', {
loading: false,
data: response.data.data,
})
commit('SET_CURRENT_FOLDER', response.data.meta.root)
commit('SET_PAGINATOR', response.data.meta.paginate)
commit('STOP_LOADING_VIEW')
commit('ADD_NEW_ITEMS', response.data.data)
events.$emit('scrollTop')
@@ -48,62 +45,74 @@ const actions = {
message: i18n.t('popup_error.message'),
})
}
reject(error);
})
})
},
getRecentUploads: ({ commit, getters }) => {
commit('LOADING_STATE', { loading: true, data: [] })
getRecentUploads: ({commit, getters}, page) => {
return new Promise((resolve, reject) => {
if (page === 1)
commit('START_LOADING_VIEW')
axios
.get(getters.api + '/browse/latest')
.then((response) => {
commit('LOADING_STATE', {
loading: false,
data: response.data.files.data,
axios
.get(`${getters.api}/browse/latest?page=${page}`)
.then((response) => {
commit('SET_PAGINATOR', response.data.meta.paginate)
commit('SET_CURRENT_FOLDER', undefined)
commit('STOP_LOADING_VIEW')
commit('ADD_NEW_ITEMS', response.data.data)
events.$emit('scrollTop')
resolve(response)
})
commit('SET_CURRENT_FOLDER', undefined)
events.$emit('scrollTop')
})
.catch(() => Vue.prototype.$isSomethingWrong())
.catch(() => Vue.prototype.$isSomethingWrong())
})
},
getMySharedItems: ({ commit, getters }) => {
commit('LOADING_STATE', { loading: true, data: [] })
getMySharedItems: ({ commit, getters }, page) => {
return new Promise((resolve, reject) => {
if (page === 1)
commit('START_LOADING_VIEW')
axios
.get(getters.api + '/browse/share' + getters.sorting.URI)
.then((response) => {
let folders = response.data.folders.data
let files = response.data.files.data
axios
.get(`${getters.api}/browse/share${getters.sorting.URI}&page=${page}`)
.then((response) => {
commit('SET_PAGINATOR', response.data.meta.paginate)
commit('SET_CURRENT_FOLDER', undefined)
commit('STOP_LOADING_VIEW')
commit('ADD_NEW_ITEMS', response.data.data)
commit('LOADING_STATE', {
loading: false,
data: folders.concat(files),
events.$emit('scrollTop')
resolve(response)
})
commit('SET_CURRENT_FOLDER', undefined)
events.$emit('scrollTop')
})
.catch(() => Vue.prototype.$isSomethingWrong())
.catch(() => Vue.prototype.$isSomethingWrong())
})
},
getTrash: ({ commit, getters }, id) => {
commit('LOADING_STATE', { loading: true, data: [] })
getTrash: ({ commit, getters }, {page, id}) => {
return new Promise((resolve, reject) => {
if (page === 1)
commit('START_LOADING_VIEW')
axios
.get(`${getters.api}/browse/trash/${id || 'all'}${getters.sorting.URI}`)
.then((response) => {
let folders = response.data.folders.data
let files = response.data.files.data
axios
.get(`${getters.api}/browse/trash/${id || 'all'}${getters.sorting.URI}&page=${page}`)
.then((response) => {
commit('SET_PAGINATOR', response.data.meta.paginate)
commit('SET_CURRENT_FOLDER', response.data.meta.root)
commit('STOP_LOADING_VIEW')
commit('ADD_NEW_ITEMS', response.data.data)
commit('LOADING_STATE', {
loading: false,
data: folders.concat(files),
events.$emit('scrollTop')
resolve(response)
})
commit('SET_CURRENT_FOLDER', response.data.root)
.catch((error) => {
Vue.prototype.$isSomethingWrong()
events.$emit('scrollTop')
})
.catch(() => Vue.prototype.$isSomethingWrong())
reject(error);
})
})
},
getFolderTree: ({ commit, getters }) => {
return new Promise((resolve, reject) => {
@@ -130,16 +139,15 @@ const actions = {
}
const mutations = {
SET_PAGINATE(state, payload) {
SET_PAGINATOR(state, payload) {
state.paginate = payload
},
LOADING_STATE(state, payload) {
if(payload.data.length === 0) {
state.entries = []
} else {
state.entries.push(...payload.data)
}
state.isLoading = payload.loading
START_LOADING_VIEW(state) {
state.entries = []
state.isLoading = true
},
STOP_LOADING_VIEW(state) {
state.isLoading = false
},
SET_CURRENT_FOLDER(state, folder) {
state.currentFolder = folder

View File

@@ -342,14 +342,14 @@ const actions = {
},
emptyTrash: ({ commit, getters }) => {
// Clear file browser
commit('LOADING_STATE', { loading: true, data: [] })
commit('START_LOADING_VIEW')
axios
.post(getters.api + '/trash/dump', {
_method: 'delete',
})
.then(() => {
commit('LOADING_STATE', { loading: false, data: [] })
commit('STOP_LOADING_VIEW')
events.$emit('scrollTop')
commit('CLIPBOARD_CLEAR')
@@ -363,7 +363,7 @@ const actions = {
})
.then(() => {
if (router.currentRoute.name === 'Trash') {
commit('LOADING_STATE', { loading: false, data: [] })
commit('STOP_LOADING_VIEW')
}
events.$emit('toaster', {

View File

@@ -20,21 +20,19 @@ const defaultState = {
sharedFile: undefined,
}
const actions = {
getSharedFolder: ({ commit, getters }, id) => {
commit('LOADING_STATE', { loading: true, data: [] })
getSharedFolder: ({ commit, getters }, {page, id}) => {
return new Promise((resolve, reject) => {
axios
.get(`/api/sharing/folders/${id}/${router.currentRoute.params.token}${getters.sorting.URI}`)
.then((response) => {
let folders = response.data.folders.data
let files = response.data.files.data
commit('LOADING_STATE', {
loading: false,
data: folders.concat(files),
})
commit('SET_CURRENT_FOLDER', response.data.root)
if(page === 1)
commit('START_LOADING_VIEW')
axios
.get(`/api/sharing/folders/${id}/${router.currentRoute.params.token}${getters.sorting.URI}&page=${page}`)
.then((response) => {
commit('SET_CURRENT_FOLDER', response.data.meta.root)
commit('SET_PAGINATOR', response.data.meta.paginate)
commit('STOP_LOADING_VIEW')
commit('ADD_NEW_ITEMS', response.data.data)
events.$emit('scrollTop')

View File

@@ -1,129 +1,134 @@
import router from '../../router'
import { events } from '../../bus'
import {events} from '../../bus'
import i18n from '../../i18n'
import axios from 'axios'
import Vue from 'vue'
const defaultState = {
currentTeamFolder: undefined,
currentTeamFolder: undefined,
}
const actions = {
getTeamFolder: ({ commit, getters }, id) => {
commit('LOADING_STATE', { loading: true, data: [] })
getTeamFolder: ({commit, getters}, {page, id}) => {
return new Promise((resolve, reject) => {
if (page === 1)
commit('START_LOADING_VIEW')
if (typeof id === 'undefined') {
commit('SET_CURRENT_TEAM_FOLDER', null)
}
if (typeof id === 'undefined')
commit('SET_CURRENT_TEAM_FOLDER', null)
axios
.get(`${getters.api}/teams/folders/${id || 'all'}${getters.sorting.URI}`)
.then((response) => {
let folders = response.data.folders.data
let files = response.data.files.data
axios
.get(`${getters.api}/teams/folders/${id || 'all'}${getters.sorting.URI}&page=${page}`)
.then((response) => {
commit('SET_CURRENT_FOLDER', response.data.meta.root)
commit('SET_PAGINATOR', response.data.meta.paginate)
commit('STOP_LOADING_VIEW')
commit('ADD_NEW_ITEMS', response.data.data)
commit('LOADING_STATE', {
loading: false,
data: folders.concat(files),
})
commit('SET_CURRENT_FOLDER', response.data.root)
if (
!getters.currentTeamFolder ||
getters.currentTeamFolder.data.id !== response.data.meta.teamFolder.data.id
) {
commit('SET_CURRENT_TEAM_FOLDER', response.data.meta.teamFolder)
}
if (
!getters.currentTeamFolder ||
getters.currentTeamFolder.data.id !== response.data.teamFolder.data.id
) {
commit('SET_CURRENT_TEAM_FOLDER', response.data.teamFolder)
}
events.$emit('scrollTop')
events.$emit('scrollTop')
})
.catch((error) => {
// Redirect if unauthenticated
if ([401, 403].includes(error.response.status)) {
commit('SET_AUTHORIZED', false)
router.push({ name: 'SignIn' })
} else {
// Show error message
events.$emit('alert:open', {
title: i18n.t('popup_error.title'),
message: i18n.t('popup_error.message'),
})
}
})
},
getSharedWithMeFolder: ({ commit, getters }, id) => {
commit('LOADING_STATE', { loading: true, data: [] })
resolve(response)
})
.catch((error) => {
// Redirect if unauthenticated
if ([401, 403].includes(error.response.status)) {
commit('SET_AUTHORIZED', false)
router.push({name: 'SignIn'})
} else {
// Show error message
events.$emit('alert:open', {
title: i18n.t('popup_error.title'),
message: i18n.t('popup_error.message'),
})
}
if (typeof id === 'undefined') {
commit('SET_CURRENT_TEAM_FOLDER', null)
}
reject(error)
})
})
},
getSharedWithMeFolder: ({commit, getters}, {page, id}) => {
return new Promise((resolve, reject) => {
if (page === 1)
commit('START_LOADING_VIEW')
axios
.get(`${getters.api}/teams/shared-with-me/${id || 'all'}${getters.sorting.URI}`)
.then((response) => {
let folders = response.data.folders.data
let files = response.data.files.data
if (typeof id === 'undefined') {
commit('SET_CURRENT_TEAM_FOLDER', null)
}
commit('LOADING_STATE', {
loading: false,
data: folders.concat(files),
})
commit('SET_CURRENT_FOLDER', response.data.root)
axios
.get(`${getters.api}/teams/shared-with-me/${id || 'all'}${getters.sorting.URI}&page=${page}`)
.then((response) => {
commit('SET_CURRENT_FOLDER', response.data.meta.root)
commit('SET_PAGINATOR', response.data.meta.paginate)
commit('STOP_LOADING_VIEW')
commit('ADD_NEW_ITEMS', response.data.data)
if (
!getters.currentTeamFolder ||
getters.currentTeamFolder.data.id !== response.data.teamFolder.data.id
) {
commit('SET_CURRENT_TEAM_FOLDER', response.data.teamFolder)
}
if (
!getters.currentTeamFolder ||
getters.currentTeamFolder.data.id !== response.data.meta.teamFolder.data.id
) {
commit('SET_CURRENT_TEAM_FOLDER', response.data.meta.teamFolder)
}
events.$emit('scrollTop')
})
.catch((error) => {
// Redirect if unauthenticated
if ([401, 403].includes(error.response.status)) {
commit('SET_AUTHORIZED', false)
router.push({ name: 'SignIn' })
} else {
// Show error message
events.$emit('alert:open', {
title: i18n.t('popup_error.title'),
message: i18n.t('popup_error.message'),
})
}
})
},
getTeamFolderTree: ({ commit, getters }) => {
return new Promise((resolve, reject) => {
axios
.get(`/api/teams/folders/${getters.currentTeamFolder.data.id}/tree${getters.sorting.URI}`)
.then((response) => {
resolve(response)
events.$emit('scrollTop')
commit('UPDATE_FOLDER_TREE', response.data)
})
.catch((error) => {
reject(error)
resolve(response)
})
.catch((error) => {
// Redirect if unauthenticated
if ([401, 403].includes(error.response.status)) {
commit('SET_AUTHORIZED', false)
router.push({name: 'SignIn'})
} else {
// Show error message
events.$emit('alert:open', {
title: i18n.t('popup_error.title'),
message: i18n.t('popup_error.message'),
})
}
Vue.prototype.$isSomethingWrong()
})
})
},
reject(error)
})
})
},
getTeamFolderTree: ({commit, getters}) => {
return new Promise((resolve, reject) => {
axios
.get(`/api/teams/folders/${getters.currentTeamFolder.data.id}/tree${getters.sorting.URI}`)
.then((response) => {
resolve(response)
commit('UPDATE_FOLDER_TREE', response.data)
})
.catch((error) => {
reject(error)
Vue.prototype.$isSomethingWrong()
})
})
},
}
const mutations = {
SET_CURRENT_TEAM_FOLDER(state, payload) {
state.currentTeamFolder = payload
},
SET_CURRENT_TEAM_FOLDER(state, payload) {
state.currentTeamFolder = payload
},
}
const getters = {
currentTeamFolder: (state) => state.currentTeamFolder,
currentTeamFolder: (state) => state.currentTeamFolder,
}
export default {
state: defaultState,
getters,
actions,
mutations,
state: defaultState,
getters,
actions,
mutations,
}

View File

@@ -9,20 +9,16 @@ const defaultState = {
const actions = {
getUploadRequestFolder: ({ commit, getters }, id) => {
commit('LOADING_STATE', { loading: true, data: [] })
commit('START_LOADING_VIEW')
return new Promise((resolve, reject) => {
axios
.get(`/api/file-request/${router.currentRoute.params.token}/browse/${id || 'all'}${getters.sorting.URI}`)
.then((response) => {
let folders = response.data.folders
let files = response.data.files
commit('LOADING_STATE', {
loading: false,
data: folders.concat(files),
})
commit('SET_CURRENT_FOLDER', response.data.root)
commit('SET_CURRENT_FOLDER', response.data.meta.root)
commit('SET_PAGINATOR', response.data.meta.paginate)
commit('STOP_LOADING_VIEW')
commit('ADD_NEW_ITEMS', response.data.data)
events.$emit('scrollTop')
@@ -43,7 +39,7 @@ const actions = {
// Stop loading spinner
if (['active', 'filled', 'expired'].includes(response.data.data.attributes.status) )
commit('LOADING_STATE', { loading: false, data: [] })
commit('STOP_LOADING_VIEW')
commit('SET_UPLOAD_REQUEST', response.data)
@@ -63,7 +59,8 @@ const actions = {
axios
.delete(`/api/file-request/${router.currentRoute.params.token}`)
.then((response) => {
commit('LOADING_STATE', { loading: false, data: [] })
commit('START_LOADING_VIEW')
commit('STOP_LOADING_VIEW')
commit('SET_UPLOAD_REQUEST_AS_FILLED')
})
.catch(() => this.$isSomethingWrong())

View File

@@ -80,7 +80,7 @@ const actions = {
let itemsToFavourites = items.map((item) => {
if (item.data.type === 'folder') {
if (context.getters.user.data.relationships.favourites.data.find((folder) => folder.id === item.data.id))
if (context.getters.user.data.relationships.favourites.find((folder) => folder.id === item.data.id))
return
return item.data.id;
@@ -89,7 +89,7 @@ const actions = {
// Check is favorites already don't include some of pushed folders
let favouritesWidget = items.map((item) => {
if (!context.getters.user.data.relationships.favourites.data.find((folder) => folder.data.id === item.id)) {
if (!context.getters.user.data.relationships.favourites.find((folder) => folder.data.id === item.id)) {
return item
}
})
@@ -149,7 +149,7 @@ const mutations = {
},
ADD_TO_FAVOURITES(state, folder) {
folder.forEach((item) => {
state.user.data.relationships.favourites.data.push(item)
state.user.data.relationships.favourites.push(item)
})
},
UPDATE_FIRST_NAME(state, name) {
@@ -166,12 +166,12 @@ const mutations = {
}
},
REMOVE_ITEM_FROM_FAVOURITES(state, item) {
state.user.data.relationships.favourites.data = state.user.data.relationships.favourites.data.filter(
state.user.data.relationships.favourites.data = state.user.data.relationships.favourites.filter(
(folder) => folder.data.id !== item.data.id
)
},
UPDATE_NAME_IN_FAVOURITES(state, data) {
state.user.data.relationships.favourites.data.find((folder) => {
state.user.data.relationships.favourites.find((folder) => {
if (folder.id === data.id) {
folder.name = data.name
}