Move some interactions to the backendInteractor

The idea is that all interactions should move there, so components
don't have to pass around credentials all the time.
This commit is contained in:
Roger Braun 2016-11-26 18:57:08 +01:00
parent b1f9f6395c
commit 215e51f764
6 changed files with 50 additions and 9 deletions

View file

@ -1,6 +1,5 @@
import { find, filter, sortBy, toInteger } from 'lodash' import { find, filter, sortBy, toInteger } from 'lodash'
import Status from '../status/status.vue' import Status from '../status/status.vue'
import apiService from '../../services/api/api.service.js'
const conversation = { const conversation = {
computed: { computed: {
@ -32,12 +31,12 @@ const conversation = {
fetchConversation () { fetchConversation () {
if (this.status) { if (this.status) {
const conversationId = this.status.statusnet_conversation_id const conversationId = this.status.statusnet_conversation_id
apiService.fetchConversation({id: conversationId}) this.$store.state.api.backendInteractor.fetchConversation({id: conversationId})
.then((statuses) => this.$store.dispatch('addNewStatuses', { statuses })) .then((statuses) => this.$store.dispatch('addNewStatuses', { statuses }))
.then(() => this.$store.commit('updateTimestamps')) .then(() => this.$store.commit('updateTimestamps'))
} else { } else {
const id = this.$route.params.id const id = this.$route.params.id
apiService.fetchStatus({id}) this.$store.state.api.backendInteractor.fetchStatus({id})
.then((status) => this.$store.dispatch('addNewStatuses', { statuses: [status] })) .then((status) => this.$store.dispatch('addNewStatuses', { statuses: [status] }))
.then(() => this.fetchConversation()) .then(() => this.fetchConversation())
} }

View file

@ -9,6 +9,7 @@ import Conversation from './components/conversation/conversation.vue'
import statusesModule from './modules/statuses.js' import statusesModule from './modules/statuses.js'
import usersModule from './modules/users.js' import usersModule from './modules/users.js'
import apiModule from './modules/api.js'
Vue.use(Vuex) Vue.use(Vuex)
Vue.use(VueRouter) Vue.use(VueRouter)
@ -16,7 +17,8 @@ Vue.use(VueRouter)
const store = new Vuex.Store({ const store = new Vuex.Store({
modules: { modules: {
statuses: statusesModule, statuses: statusesModule,
users: usersModule users: usersModule,
api: apiModule
} }
}) })

14
src/modules/api.js Normal file
View file

@ -0,0 +1,14 @@
import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
const api = {
state: {
backendInteractor: backendInteractorService()
},
mutations: {
setBackendInteractor (state, backendInteractor) {
state.backendInteractor = backendInteractor
}
}
}
export default api

View file

@ -1,5 +1,6 @@
import apiService from '../services/api/api.service.js' import apiService from '../services/api/api.service.js'
import timelineFetcher from '../services/timeline_fetcher/timeline_fetcher.service.js' import timelineFetcher from '../services/timeline_fetcher/timeline_fetcher.service.js'
import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
const users = { const users = {
state: { state: {
@ -29,7 +30,10 @@ const users = {
user.credentials = userCredentials user.credentials = userCredentials
commit('setCurrentUser', user) commit('setCurrentUser', user)
}) })
// Start getting fresh tweets.
.then(() => timelineFetcher.startFetching({store, credentials: userCredentials})) .then(() => timelineFetcher.startFetching({store, credentials: userCredentials}))
// Set our new backend interactor
.then(() => commit('setBackendInteractor', backendInteractorService(userCredentials)))
} }
commit('endLogin') commit('endLogin')
}) })

View file

@ -20,21 +20,23 @@ let fetch = (url, options) => {
} }
const authHeaders = (user) => { const authHeaders = (user) => {
if (user) { if (user && user.username && user.password) {
return { 'Authorization': `Basic ${btoa(`${user.username}:${user.password}`)}` } return { 'Authorization': `Basic ${btoa(`${user.username}:${user.password}`)}` }
} else { } else {
return { } return { }
} }
} }
const fetchConversation = ({id}) => { const fetchConversation = ({id, credentials}) => {
let url = `${CONVERSATION_URL}/${id}.json?count=100` let url = `${CONVERSATION_URL}/${id}.json?count=100`
return fetch(url).then((data) => data.json()) return fetch(url, { headers: authHeaders(credentials) })
.then((data) => data.json())
} }
const fetchStatus = ({id}) => { const fetchStatus = ({id, credentials}) => {
let url = `${STATUS_URL}/${id}.json` let url = `${STATUS_URL}/${id}.json`
return fetch(url).then((data) => data.json()) return fetch(url, { headers: authHeaders(credentials) })
.then((data) => data.json())
} }
const fetchTimeline = ({timeline, credentials, since = false, until = false}) => { const fetchTimeline = ({timeline, credentials, since = false, until = false}) => {

View file

@ -0,0 +1,20 @@
import apiService from '../api/api.service.js'
const backendInteractorService = (credentials) => {
const fetchStatus = ({id}) => {
return apiService.fetchStatus({id, credentials})
}
const fetchConversation = ({id}) => {
return apiService.fetchConversation({id, credentials})
}
const backendInteractorServiceInstance = {
fetchStatus,
fetchConversation
}
return backendInteractorServiceInstance
}
export default backendInteractorService