[refactor] Favourites store

src/renderer/components/TimelineSpace/Contents/Favourites.vue

@@ -5,10 +5,13 @@
       <template v-slot="{ item, index, active }">
         <DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
           <toot
+            v-if="account.account && account.server"
             :message="item"
             :focused="item.uri === focusedId"
             :overlaid="modalOpened"
             :filters="[]"
+            :account="account.account"
+            :server="account.server"
             v-on:update="updateToot"
             v-on:delete="deleteToot"
             @focusRight="focusSidebar"
@@ -27,7 +30,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, computed, ref, onMounted, onUnmounted, watch } from 'vue'
+import { defineComponent, computed, ref, onMounted, onUnmounted, watch, reactive } from 'vue'
 import { logicAnd } from '@vueuse/math'
 import { useMagicKeys, whenever } from '@vueuse/core'
 import { useStore } from '@/store'
@@ -40,6 +43,10 @@ import { ACTION_TYPES, MUTATION_TYPES } from '@/store/TimelineSpace/Contents/Fav
 import { MUTATION_TYPES as CONTENTS_MUTATION } from '@/store/TimelineSpace/Contents'
 import { MUTATION_TYPES as HEADER_MUTATION } from '@/store/TimelineSpace/HeaderMenu'
 import { MUTATION_TYPES as TIMELINE_MUTATION } from '@/store/TimelineSpace'
+import { LocalAccount } from '~/src/types/localAccount'
+import { LocalServer } from '~/src/types/localServer'
+import { MyWindow } from '~/src/types/global'
+import { useRoute } from 'vue-router'
 
 export default defineComponent({
   name: 'favourites',
@@ -47,6 +54,7 @@ export default defineComponent({
   setup() {
     const space = 'TimelineSpace/Contents/Favourites'
     const store = useStore()
+    const route = useRoute()
     const i18n = useI18next()
 
     const heading = ref<boolean>(false)
@@ -54,20 +62,32 @@ export default defineComponent({
     const scroller = ref<any>()
     const { j, k, Ctrl_r } = useMagicKeys()
 
+    const win = (window as any) as MyWindow
+    const id = computed(() => parseInt(route.params.id as string))
+
+    const lazyLoading = ref(false)
+    const account = reactive<{ account: LocalAccount | null; server: LocalServer | null }>({
+      account: null,
+      server: null
+    })
+
     const openSideBar = computed(() => store.state.TimelineSpace.Contents.SideBar.openSideBar)
     const startReload = computed(() => store.state.TimelineSpace.HeaderMenu.reload)
     const favourites = computed(() => store.state.TimelineSpace.Contents.Favourites.favourites)
-    const lazyLoading = computed(() => store.state.TimelineSpace.Contents.Favourites.lazyLoading)
     const modalOpened = computed<boolean>(() => store.getters[`TimelineSpace/Modals/modalOpened`])
     const currentFocusedIndex = computed(() => favourites.value.findIndex(status => focusedId.value === status.uri))
     const shortcutEnabled = computed(() => !modalOpened.value)
 
-    onMounted(() => {
+    onMounted(async () => {
+      const [a, s]: [LocalAccount, LocalServer] = await win.ipcRenderer.invoke('get-local-account', id.value)
+      account.account = a
+      account.server = s
+
       document.getElementById('scroller')?.addEventListener('scroll', onScroll)
 
       store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, true)
       store
-        .dispatch(`${space}/${ACTION_TYPES.FETCH_FAVOURITES}`)
+        .dispatch(`${space}/${ACTION_TYPES.FETCH_FAVOURITES}`, account)
         .catch(() => {
           ElMessage({
             message: i18n.t('message.favourite_fetch_error'),
@@ -115,12 +135,18 @@ export default defineComponent({
           document.getElementById('scroller')!.scrollHeight - 10 &&
         !lazyLoading.value
       ) {
-        store.dispatch(`${space}/${ACTION_TYPES.LAZY_FETCH_FAVOURITES}`, favourites.value[favourites.value.length - 1]).catch(() => {
+        lazyLoading.value = true
-          ElMessage({
+        store
-            message: i18n.t('message.favourite_fetch_error'),
+          .dispatch(`${space}/${ACTION_TYPES.LAZY_FETCH_FAVOURITES}`, account)
-            type: 'error'
+          .catch(() => {
+            ElMessage({
+              message: i18n.t('message.favourite_fetch_error'),
+              type: 'error'
+            })
+          })
+          .finally(() => {
+            lazyLoading.value = false
           })
-        })
       }
       // for upper
       if ((event.target as HTMLElement)!.scrollTop > 10 && heading.value) {
@@ -138,7 +164,7 @@ export default defineComponent({
     const reload = async () => {
       store.commit(`TimelineSpace/${TIMELINE_MUTATION.CHANGE_LOADING}`, true)
       try {
-        await store.dispatch(`${space}/${ACTION_TYPES.FETCH_FAVOURITES}`).catch(() => {
+        await store.dispatch(`${space}/${ACTION_TYPES.FETCH_FAVOURITES}`, account).catch(() => {
           ElMessage({
             message: i18n.t('message.favourite_fetch_error'),
             type: 'error'
@@ -184,7 +210,8 @@ export default defineComponent({
       focusToot,
       openSideBar,
       heading,
-      upper
+      upper,
+      account
     }
   }
 })

src/renderer/store/TimelineSpace/Contents/Bookmarks.ts

@@ -100,7 +100,7 @@ const actions: ActionTree<BookmarksState, RootState> = {
     // Parse link header
     try {
       const link = parse(res.headers.link)
-      if (link !== null) {
+      if (link !== null && link.next) {
         commit(MUTATION_TYPES.CHANGE_MAX_ID, link.next.max_id)
       } else {
         commit(MUTATION_TYPES.CHANGE_MAX_ID, null)

src/renderer/store/TimelineSpace/Contents/Favourites.ts

@@ -2,16 +2,16 @@ import generator, { Entity } from 'megalodon'
 import parse from 'parse-link-header'
 import { Module, MutationTree, ActionTree } from 'vuex'
 import { RootState } from '@/store'
+import { LocalAccount } from '~/src/types/localAccount'
+import { LocalServer } from '~/src/types/localServer'
 
 export type FavouritesState = {
   favourites: Array<Entity.Status>
-  lazyLoading: boolean
   maxId: string | null
 }
 
 const state = (): FavouritesState => ({
   favourites: [],
-  lazyLoading: false,
   maxId: null
 })
 
@@ -20,7 +20,6 @@ export const MUTATION_TYPES = {
   INSERT_FAVOURITES: 'insertFavourites',
   UPDATE_TOOT: 'updateToot',
   DELETE_TOOT: 'deleteToot',
-  CHANGE_LAZY_LOADING: 'changeLazyLoading',
   CHANGE_MAX_ID: 'changeMaxId'
 }
 
@@ -56,9 +55,6 @@ const mutations: MutationTree<FavouritesState> = {
       }
     })
   },
-  [MUTATION_TYPES.CHANGE_LAZY_LOADING]: (state, value: boolean) => {
-    state.lazyLoading = value
-  },
   [MUTATION_TYPES.CHANGE_MAX_ID]: (state, id: string | null) => {
     state.maxId = id
   }
@@ -70,19 +66,17 @@ export const ACTION_TYPES = {
 }
 
 const actions: ActionTree<FavouritesState, RootState> = {
-  [ACTION_TYPES.FETCH_FAVOURITES]: async ({ commit, rootState }): Promise<Array<Entity.Status>> => {
+  [ACTION_TYPES.FETCH_FAVOURITES]: async (
-    const client = generator(
+    { commit, rootState },
-      rootState.TimelineSpace.server!.sns,
+    req: { account: LocalAccount; server: LocalServer }
-      rootState.TimelineSpace.server!.baseURL,
+  ): Promise<Array<Entity.Status>> => {
-      rootState.TimelineSpace.account!.accessToken,
+    const client = generator(req.server.sns, req.server.baseURL, req.account.accessToken, rootState.App.userAgent)
-      rootState.App.userAgent
-    )
     const res = await client.getFavourites({ limit: 20 })
     commit(MUTATION_TYPES.UPDATE_FAVOURITES, res.data)
     // Parse link header
     try {
       const link = parse(res.headers.link)
-      if (link !== null) {
+      if (link !== null && link.next) {
         commit(MUTATION_TYPES.CHANGE_MAX_ID, link.next.max_id)
       } else {
         commit(MUTATION_TYPES.CHANGE_MAX_ID, null)
@@ -93,28 +87,20 @@ const actions: ActionTree<FavouritesState, RootState> = {
     }
     return res.data
   },
-  lazyFetchFavourites: async ({ state, commit, rootState }): Promise<Array<Entity.Status> | null> => {
+  lazyFetchFavourites: async (
-    if (state.lazyLoading) {
+    { state, commit, rootState },
-      return Promise.resolve(null)
+    req: { account: LocalAccount; server: LocalServer }
-    }
+  ): Promise<Array<Entity.Status> | null> => {
     if (!state.maxId) {
       return Promise.resolve(null)
     }
-    commit(MUTATION_TYPES.CHANGE_LAZY_LOADING, true)
+    const client = generator(req.server.sns, req.server.baseURL, req.account.accessToken, rootState.App.userAgent)
-    const client = generator(
+    const res = await client.getFavourites({ max_id: state.maxId, limit: 20 })
-      rootState.TimelineSpace.server!.sns,
-      rootState.TimelineSpace.server!.baseURL,
-      rootState.TimelineSpace.account!.accessToken,
-      rootState.App.userAgent
-    )
-    const res = await client.getFavourites({ max_id: state.maxId, limit: 20 }).finally(() => {
-      commit(MUTATION_TYPES.CHANGE_LAZY_LOADING, false)
-    })
     commit(MUTATION_TYPES.INSERT_FAVOURITES, res.data)
     // Parse link header
     try {
       const link = parse(res.headers.link)
-      if (link !== null) {
+      if (link !== null && link.next) {
         commit(MUTATION_TYPES.CHANGE_MAX_ID, link.next.max_id)
       } else {
         commit(MUTATION_TYPES.CHANGE_MAX_ID, null)