Skip to content
Permalink
Browse files

add store actions, update templates

  • Loading branch information...
galvez committed Oct 20, 2019
1 parent 59ea67b commit 545f1e8bfe58527e8121b66beac37113039178b4
Showing with 73 additions and 94 deletions.
  1. +10 −11 pages/_feed/_page.vue
  2. +3 −3 pages/item/_id.vue
  3. +3 −3 pages/user/_id.vue
  4. +57 −0 store/actions.js
  5. +0 −77 store/index.js
@@ -50,10 +50,10 @@ export default {
return feeds[this.feed].pages
},
pageData() {
return this.$store.state.feeds[this.feed][this.page]
return this.$state.feeds[this.feed][this.page]
},
displayedItems() {
return this.pageData.map(id => this.$store.state.items[id])
return this.pageData.map(id => this.$state.items[id])
},
loading() {
return this.displayedItems.length === 0
@@ -64,9 +64,10 @@ export default {
page: 'pageChanged'
},
fetch({ store, params: { feed, page = 1 } }) {
fetch({ $actions, params: { feed, page = 1 } }) {
page = Number(page) || 1
return store.dispatch('FETCH_FEED', { feed, page })
console.log('{ feed, page }', { feed, page })
return $actions.fetchFeed({ feed, page })
},
head() {
@@ -87,13 +88,11 @@ export default {
}
// Prefetch next page
this.$store
.dispatch('FETCH_FEED', {
feed: this.feed,
page: this.page + 1,
prefetch: true
})
.catch(() => {})
this.$actions.fetchFeed({
feed: this.feed,
page: this.page + 1,
prefetch: true
})
this.transition =
from === -1 ? null : to > from ? 'slide-left' : 'slide-right'
@@ -48,12 +48,12 @@ export default {
return this.$route.params.id
},
item() {
return this.$store.state.items[this.id]
return this.$state.items[this.id]
}
},
fetch({ store, params: { id } }) {
return store.dispatch('FETCH_ITEM', { id })
fetch({ $actions, params: { id } }) {
return $actions.fetchItem({ id })
},
methods: {
@@ -34,7 +34,7 @@ export default {
computed: {
user() {
return this.$store.state.users[this.$route.params.id]
return this.$state.users[this.$route.params.id]
}
},
@@ -44,8 +44,8 @@ export default {
}
},
fetch({ store, route: { params: { id } } }) {
return store.dispatch('FETCH_USER', { id })
fetch({ $actions, route: { params: { id } } }) {
return $actions.fetchUser({ id })
}
}
</script>
@@ -0,0 +1,57 @@
import { $set } from 'vue-stator'
import { CancelToken } from 'axios'
import { lazy } from '~/common/utils'

// =================================================
// Actions
// =================================================
export function fetchFeed({ $axios }, state, { feed, page, prefetch }) {
// Don't priorotize already fetched feeds
if (state.feeds[feed][page] && state.feeds[feed][page].length) {
prefetch = true
}
if (!prefetch) {
if (this.feedCancelSource) {
this.feedCancelSource.cancel(
'priorotize feed: ' + feed + ' page: ' + page
)
}
this.feedCancelSource = CancelToken.source()
}
return lazy(
(items) => {
const ids = items.map(item => item.id)
$set(state.feeds[feed], page, ids)
for (const item of items) {
if (item) {
$set(state.items, item.id, item)
}
}
},
() =>
$axios.$get(`/${feed}?page=${page}`, {
cancelToken: this.feedCancelSource && this.feedCancelSource.token
}),
(state.feeds[feed][page] || []).map(id => state.items[id])
)
}

export function fetchItem({ $axios }, state, { id }) {
return lazy(
(item) => {
if (item) {
$set(state.items, item.id, item)
}
},
() => $axios.$get(`/item/${id}`),
Object.assign({ id, loading: true, comments: [] }, state.items[id])
)
}

export function fetchUser({ $axios }, state, { id }) {
return lazy(
user => $set(state.users, id, user || false), /* false means user not found */
() => $axios.$get(`/user/${id}`),
Object.assign({ id, loading: true }, state.users[id])
)
}

This file was deleted.

0 comments on commit 545f1e8

Please sign in to comment.
You can’t perform that action at this time.