Start fetching user timelines.

src/components/user_profile/user_profile.js

@@ -1,12 +1,18 @@
 import UserCardContent from '../user_card_content/user_card_content.vue'
-import { find } from 'lodash'
 
 const UserProfile = {
+  created () {
+    this.$store.dispatch('startFetching', ['user', this.userId])
+  },
+  destroyed () {
+    this.$store.dispatch('stopFetching', ['user', this.userId])
+  },
   computed: {
+    userId () {
+      return this.$route.params.id
+    },
     user () {
-      const id = this.$route.params.id
-      const user = find(this.$store.state.users.users, {id})
-      return user
+      return this.$store.state.users.usersObject[this.userId]
     }
   },
   components: {

src/components/user_profile/user_profile.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="user-profile panel panel-default base00-background">
+  <div v-if="user" class="user-profile panel panel-default base00-background">
     <user-card-content :user="user"></user-card-content>
   </div>
 </template>

src/modules/api.js

@@ -1,4 +1,5 @@
 import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
+import {isArray} from 'lodash'
 
 const api = {
   state: {
@@ -18,9 +19,17 @@ const api = {
   },
   actions: {
     startFetching (store, timeline) {
+      let userId = false
+
+      // This is for user timelines
+      if (isArray(timeline)) {
+        userId = timeline[1]
+        timeline = timeline[0]
+      }
+
       // Don't start fetching if we already are.
       if (!store.state.fetchers[timeline]) {
-        const fetcher = store.state.backendInteractor.startFetching({timeline, store})
+        const fetcher = store.state.backendInteractor.startFetching({timeline, store, userId})
         store.commit('addFetcher', {timeline, fetcher})
       }
     },

src/modules/statuses.js

@@ -32,6 +32,17 @@ export const defaultState = {
       minVisibleId: 0,
       loading: false
     },
+    user: {
+      statuses: [],
+      statusesObject: {},
+      faves: [],
+      visibleStatuses: [],
+      visibleStatusesObject: {},
+      newStatusCount: 0,
+      maxId: 0,
+      minVisibleId: 0,
+      loading: false
+    },
     publicAndExternal: {
       statuses: [],
       statusesObject: {},

src/services/api/api.service.js

@@ -18,6 +18,7 @@ const FOLLOWING_URL = '/api/friendships/create.json'
 const UNFOLLOWING_URL = '/api/friendships/destroy.json'
 const QVITTER_USER_PREF_URL = '/api/qvitter/set_profile_pref.json'
 const EXTERNAL_PROFILE_URL = '/api/externalprofile/show.json'
+const QVITTER_USER_TIMELINE_URL = '/api/qvitter/statuses/user_timeline.json'
 // const USER_URL = '/api/users/show.json'
 
 const oldfetch = window.fetch
@@ -98,24 +99,34 @@ const setUserMute = ({id, credentials, muted = true}) => {
   })
 }
 
-const fetchTimeline = ({timeline, credentials, since = false, until = false}) => {
+const fetchTimeline = ({timeline, credentials, since = false, until = false, userId = false}) => {
   const timelineUrls = {
     public: PUBLIC_TIMELINE_URL,
     friends: FRIENDS_TIMELINE_URL,
     mentions: MENTIONS_URL,
-    'publicAndExternal': PUBLIC_AND_EXTERNAL_TIMELINE_URL
+    'publicAndExternal': PUBLIC_AND_EXTERNAL_TIMELINE_URL,
+    user: QVITTER_USER_TIMELINE_URL
   }
 
   let url = timelineUrls[timeline]
 
+  let params = []
+
   if (since) {
-    url += `?since_id=${since}`
+    params.push('since_id', since)
   }
 
   if (until) {
-    url += `?max_id=${until}`
+    params.push('max_id', until)
   }
 
+  if (userId) {
+    params.push(['user_id', userId])
+  }
+
+  const queryString = new URLSearchParams(params).toString()
+  url += `?${queryString}`
+
   return fetch(url, { headers: authHeaders(credentials) }).then((data) => data.json())
 }
 

src/services/backend_interactor_service/backend_interactor_service.js

@@ -26,8 +26,8 @@ const backendInteractorService = (credentials) => {
     return apiService.unfollowUser({credentials, id})
   }
 
-  const startFetching = ({timeline, store}) => {
-    return timelineFetcherService.startFetching({timeline, store, credentials})
+  const startFetching = ({timeline, store, userId = false}) => {
+    return timelineFetcherService.startFetching({timeline, store, credentials, userId})
   }
 
   const setUserMute = ({id, muted = true}) => {

src/services/timeline_fetcher/timeline_fetcher.service.js

@@ -14,7 +14,7 @@ const update = ({store, statuses, timeline, showImmediately}) => {
   })
 }
 
-const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false, showImmediately = false}) => {
+const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false, showImmediately = false, userId = false}) => {
   const args = { timeline, credentials }
   const rootState = store.rootState || store.state
   const timelineData = rootState.statuses.timelines[camelCase(timeline)]
@@ -25,14 +25,16 @@ const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false
     args['since'] = timelineData.maxId
   }
 
+  args['userId'] = userId
+
   return apiService.fetchTimeline(args)
     .then((statuses) => update({store, statuses, timeline, showImmediately}),
       () => store.dispatch('setError', { value: true }))
 }
 
-const startFetching = ({ timeline = 'friends', credentials, store }) => {
-  fetchAndUpdate({timeline, credentials, store, showImmediately: true})
-  const boundFetchAndUpdate = () => fetchAndUpdate({ timeline, credentials, store })
+const startFetching = ({timeline = 'friends', credentials, store, userId = false}) => {
+  fetchAndUpdate({timeline, credentials, store, showImmediately: true, userId})
+  const boundFetchAndUpdate = () => fetchAndUpdate({ timeline, credentials, store, userId })
   return setInterval(boundFetchAndUpdate, 10000)
 }
 const timelineFetcher = {