From d2a1c4ac52667e24967aa55977667fb1631f8fd4 Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Mon, 30 Jan 2023 01:12:35 +0900
Subject: [PATCH] [refactor] Remove list timeline store

---
 .../TimelineSpace/Contents/Bookmarks.vue      |   9 +-
 .../TimelineSpace/Contents/Lists/Edit.vue     |  54 ++++---
 .../TimelineSpace/Contents/Lists/Index.vue    |  76 ++++++----
 .../TimelineSpace/Contents/Lists/Show.vue     | 143 +++++++++---------
 .../TimelineSpace/Modals/AddListMember.vue    |   3 -
 src/renderer/store/TimelineSpace/Contents.ts  |   5 +-
 .../store/TimelineSpace/Contents/Lists.ts     |  27 ----
 .../TimelineSpace/Contents/Lists/Edit.ts      |  57 -------
 .../TimelineSpace/Contents/Lists/Index.ts     |  69 ---------
 .../TimelineSpace/Contents/Lists/Show.ts      | 122 ---------------
 10 files changed, 160 insertions(+), 405 deletions(-)
 delete mode 100644 src/renderer/store/TimelineSpace/Contents/Lists.ts
 delete mode 100644 src/renderer/store/TimelineSpace/Contents/Lists/Edit.ts
 delete mode 100644 src/renderer/store/TimelineSpace/Contents/Lists/Index.ts
 delete mode 100644 src/renderer/store/TimelineSpace/Contents/Lists/Show.ts

diff --git a/src/renderer/components/TimelineSpace/Contents/Bookmarks.vue b/src/renderer/components/TimelineSpace/Contents/Bookmarks.vue
index 5f66f3c1..f71e31dc 100644
--- a/src/renderer/components/TimelineSpace/Contents/Bookmarks.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Bookmarks.vue
@@ -1,7 +1,7 @@
 <template>
   <div id="bookmarks">
-    <div></div>
-    <DynamicScroller :items="bookmarks" :min-item-size="60" id="scroller" class="scroller" ref="scroller">
+    <div style="width: 100%; height: 120px" v-loading="loading" :element-loading-background="backgroundColor" v-if="loading" />
+    <DynamicScroller :items="bookmarks" :min-item-size="60" id="scroller" class="scroller" ref="scroller" v-else>
       <template #default="{ item, index, active }">
         <DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
           <toot
@@ -70,6 +70,7 @@ export default defineComponent({
     const currentFocusedIndex = computed(() => bookmarks.value.findIndex(toot => focusedId.value === toot.uri))
     const shortcutEnabled = computed(() => !modalOpened.value)
     const userAgent = computed(() => store.state.App.userAgent)
+    const backgroundColor = computed(() => store.state.App.theme.background_color)
 
     onMounted(async () => {
       const [a, s]: [LocalAccount, LocalServer] = await win.ipcRenderer.invoke('get-local-account', id.value)
@@ -222,7 +223,9 @@ export default defineComponent({
       deleteToot,
       focusToot,
       heading,
-      account
+      account,
+      loading,
+      backgroundColor
     }
   }
 })
diff --git a/src/renderer/components/TimelineSpace/Contents/Lists/Edit.vue b/src/renderer/components/TimelineSpace/Contents/Lists/Edit.vue
index 9cb44ea8..35cf127d 100644
--- a/src/renderer/components/TimelineSpace/Contents/Lists/Edit.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Lists/Edit.vue
@@ -12,18 +12,20 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, onMounted, toRefs } from 'vue'
+import { computed, defineComponent, onMounted, toRefs, ref, reactive } from 'vue'
 import { ElMessage } from 'element-plus'
 import { useI18next } from 'vue3-i18next'
-import { Entity } from 'megalodon'
+import generator, { Entity, MegalodonInterface } from 'megalodon'
 import { useStore } from '@/store'
 import User from '@/components/molecules/User.vue'
-import { MUTATION_TYPES as CONTENTS_MUTATION } from '@/store/TimelineSpace/Contents'
-import { ACTION_TYPES } from '@/store/TimelineSpace/Contents/Lists/Edit'
 import {
   MUTATION_TYPES as ADD_LIST_MEMBER_MUTATION,
   ACTION_TYPES as ADD_LIST_MEMBER_ACTION
 } from '@/store/TimelineSpace/Modals/AddListMember'
+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: 'edit-list',
@@ -31,43 +33,55 @@ export default defineComponent({
   components: { User },
   setup(props) {
     const { list_id } = toRefs(props)
-    const space = 'TimelineSpace/Contents/Lists/Edit'
     const store = useStore()
+    const route = useRoute()
     const i18n = useI18next()
 
-    const members = computed(() => store.state.TimelineSpace.Contents.Lists.Edit.members)
+    const win = (window as any) as MyWindow
+    const id = computed(() => parseInt(route.params.id as string))
+
+    const account = reactive<{ account: LocalAccount | null; server: LocalServer | null }>({
+      account: null,
+      server: null
+    })
+    const client = ref<MegalodonInterface | null>(null)
+
+    const members = ref<Array<Entity.Account>>([])
+    const userAgent = computed(() => store.state.App.userAgent)
 
     onMounted(async () => {
-      await init()
+      const [a, s]: [LocalAccount, LocalServer] = await win.ipcRenderer.invoke('get-local-account', id.value)
+      account.account = a
+      account.server = s
+
+      client.value = generator(s.sns, s.baseURL, a.accessToken, userAgent.value)
+      await load()
     })
-    const init = async () => {
-      store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, true)
+
+    const load = async () => {
+      if (!client.value) return
       try {
-        await store.dispatch(`${space}/${ACTION_TYPES.FETCH_MEMBERS}`, list_id.value)
+        const res = await client.value.getAccountsInList(list_id.value, { limit: 0 })
+        members.value = res.data
       } catch (err) {
+        console.error(err)
         ElMessage({
           message: i18n.t('message.members_fetch_error'),
           type: 'error'
         })
-      } finally {
-        store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, false)
       }
     }
+
     const removeAccount = async (account: Entity.Account) => {
-      store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, true)
+      if (!client.value) return
       try {
-        await store.dispatch(`${space}/${ACTION_TYPES.REMOVE_ACCOUNT}`, {
-          account: account,
-          listId: list_id.value
-        })
-        await store.dispatch(`${space}/${ACTION_TYPES.FETCH_MEMBERS}`, list_id.value)
+        await client.value.deleteAccountsFromList(list_id.value, [account.id])
+        await load()
       } catch (err) {
         ElMessage({
           message: i18n.t('message.remove_user_error'),
           type: 'error'
         })
-      } finally {
-        store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, false)
       }
     }
     const addAccount = () => {
diff --git a/src/renderer/components/TimelineSpace/Contents/Lists/Index.vue b/src/renderer/components/TimelineSpace/Contents/Lists/Index.vue
index 7d1dad29..b1a9a680 100644
--- a/src/renderer/components/TimelineSpace/Contents/Lists/Index.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Lists/Index.vue
@@ -1,6 +1,7 @@
 <template>
   <div id="lists">
-    <div class="new-list" v-loading="creating" :element-loading-background="loadingBackground">
+    <div style="width: 100%; height: 120px" v-loading="loading" :element-loading-background="backgroundColor" v-if="loading" />
+    <div class="new-list" v-else>
       <el-form :inline="true">
         <input v-model="title" :placeholder="$t('lists.index.new_list')" class="list-title" />
         <el-button link class="create" @click="createList">
@@ -25,61 +26,78 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, onMounted, ref } from 'vue'
+import { computed, defineComponent, onMounted, ref, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import { Entity } from 'megalodon'
+import generator, { Entity, MegalodonInterface } from 'megalodon'
 import { useI18next } from 'vue3-i18next'
 import { useRoute, useRouter } from 'vue-router'
 import { useStore } from '@/store'
-import { MUTATION_TYPES as TIMELINE_MUTATION } from '@/store/TimelineSpace'
-import { ACTION_TYPES } from '@/store/TimelineSpace/Contents/Lists/Index'
-import { ACTION_TYPES as SIDE_MENU_ACTION } from '@/store/TimelineSpace/SideMenu'
+import { LocalAccount } from '~/src/types/localAccount'
+import { LocalServer } from '~/src/types/localServer'
+import { MyWindow } from '~/src/types/global'
 
 export default defineComponent({
   name: 'lists',
   setup() {
-    const space = 'TimelineSpace/Contents/Lists/Index'
     const store = useStore()
     const route = useRoute()
     const router = useRouter()
     const i18n = useI18next()
 
     const title = ref<string>('')
-    const creating = ref<boolean>(false)
+    const loading = ref<boolean>(false)
 
-    const lists = computed(() => store.state.TimelineSpace.Contents.Lists.Index.lists)
-    const loadingBackground = computed(() => store.state.App.theme.wrapper_mask_color)
+    const lists = ref<Array<Entity.List>>([])
+    const backgroundColor = computed(() => store.state.App.theme.background_color)
+    const userAgent = computed(() => store.state.App.userAgent)
+
+    const win = (window as any) as MyWindow
     const id = computed(() => route.params.id)
+    const account = reactive<{ account: LocalAccount | null; server: LocalServer | null }>({
+      account: null,
+      server: null
+    })
+    const client = ref<MegalodonInterface | null>(null)
 
-    onMounted(() => {
-      store.commit(`TimelineSpace/${TIMELINE_MUTATION.CHANGE_LOADING}`, true)
-      fetch().finally(() => {
-        store.commit(`TimelineSpace/${TIMELINE_MUTATION.CHANGE_LOADING}`, false)
-      })
+    onMounted(async () => {
+      const [a, s]: [LocalAccount, LocalServer] = await win.ipcRenderer.invoke('get-local-account', id.value)
+      account.account = a
+      account.server = s
+
+      client.value = generator(s.sns, s.baseURL, a.accessToken, userAgent.value)
+      loading.value = true
+      await load().finally(() => (loading.value = false))
     })
 
-    const fetch = async () => {
-      return store.dispatch(`${space}/${ACTION_TYPES.FETCH_LISTS}`).catch(() => {
+    const load = async () => {
+      if (!client.value) return
+      try {
+        const res = await client.value.getLists()
+        lists.value = res.data
+      } catch (err) {
+        console.error(err)
         ElMessage({
           message: i18n.t('message.lists_fetch_error'),
           type: 'error'
         })
-      })
+      }
     }
+
     const createList = async () => {
-      creating.value = true
+      if (!client.value) return
+      loading.value = true
       try {
-        await store.dispatch(`${space}/${ACTION_TYPES.CREATE_LIST}`, title.value)
-        await store.dispatch(`${space}/${ACTION_TYPES.FETCH_LISTS}`)
+        await client.value.createList(title.value)
+        await load()
       } catch (err) {
+        console.error(err)
         ElMessage({
           message: i18n.t('message.list_create_error'),
           type: 'error'
         })
       } finally {
-        creating.value = false
+        loading.value = false
       }
-      await store.dispatch(`TimelineSpace/SideMenu/${SIDE_MENU_ACTION.FETCH_LISTS}`)
     }
     const edit = (list: Entity.List) => {
       return router.push(`/${id.value}/lists/${list.id}/edit`)
@@ -89,19 +107,19 @@ export default defineComponent({
         confirmButtonText: i18n.t('lists.index.delete.confirm.ok'),
         cancelButtonText: i18n.t('lists.index.delete.confirm.cancel'),
         type: 'warning'
+      }).then(async () => {
+        if (!client.value) return
+        await client.value.deleteList(list.id)
+        await load()
       })
-        .then(() => {
-          store.dispatch(`${space}/${ACTION_TYPES.DELETE_LIST}`, list)
-        })
-        .catch(() => {})
     }
 
     return {
       id,
-      creating,
+      loading,
       title,
       lists,
-      loadingBackground,
+      backgroundColor,
       createList,
       edit,
       del
diff --git a/src/renderer/components/TimelineSpace/Contents/Lists/Show.vue b/src/renderer/components/TimelineSpace/Contents/Lists/Show.vue
index aa53186b..e2cfcbdf 100644
--- a/src/renderer/components/TimelineSpace/Contents/Lists/Show.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Lists/Show.vue
@@ -1,6 +1,7 @@
 <template>
   <div name="list" class="list-timeline">
-    <DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
+    <div style="width: 100%; height: 120px" v-loading="loading" :element-loading-background="backgroundColor" v-if="loading" />
+    <DynamicScroller :items="statuses" :min-item-size="86" id="scroller" class="scroller" ref="scroller" v-else>
       <template #default="{ item, index, active }">
         <DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
           <toot
@@ -23,18 +24,15 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, toRefs, ref, computed, onMounted, watch, onBeforeUnmount, onUnmounted, reactive } from 'vue'
+import { defineComponent, toRefs, ref, computed, onMounted, watch, onUnmounted, reactive } from 'vue'
 import { logicAnd } from '@vueuse/math'
 import { useMagicKeys, whenever } from '@vueuse/core'
 import { ElMessage } from 'element-plus'
 import { useI18next } from 'vue3-i18next'
-import { Entity } from 'megalodon'
+import generator, { Entity, MegalodonInterface } from 'megalodon'
 import { useStore } from '@/store'
 import Toot from '@/components/organisms/Toot.vue'
-import { MUTATION_TYPES as CONTENTS_MUTATION } from '@/store/TimelineSpace/Contents'
 import { MUTATION_TYPES as HEADER_MUTATION } from '@/store/TimelineSpace/HeaderMenu'
-import { ACTION_TYPES, MUTATION_TYPES } from '@/store/TimelineSpace/Contents/Lists/Show'
-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'
@@ -45,7 +43,6 @@ export default defineComponent({
   props: ['list_id'],
   components: { Toot },
   setup(props) {
-    const space = 'TimelineSpace/Contents/Lists/Show'
     const store = useStore()
     const route = useRoute()
     const i18n = useI18next()
@@ -58,17 +55,21 @@ export default defineComponent({
     const focusedId = ref<string | null>(null)
     const scroller = ref<any>(null)
     const lazyLoading = ref<boolean>(false)
+    const loading = ref(false)
     const heading = ref<boolean>(true)
     const account = reactive<{ account: LocalAccount | null; server: LocalServer | null }>({
       account: null,
       server: null
     })
+    const client = ref<MegalodonInterface | null>(null)
 
-    const timeline = computed(() => store.state.TimelineSpace.Contents.Lists.Show.timeline)
+    const statuses = ref<Array<Entity.Status>>([])
     const startReload = computed(() => store.state.TimelineSpace.HeaderMenu.reload)
     const modalOpened = computed<boolean>(() => store.getters[`TimelineSpace/Modals/modalOpened`])
-    const currentFocusedIndex = computed(() => timeline.value.findIndex(toot => focusedId.value === toot.uri + toot.id))
+    const currentFocusedIndex = computed(() => statuses.value.findIndex(toot => focusedId.value === toot.uri + toot.id))
     const shortcutEnabled = computed(() => !modalOpened.value)
+    const userAgent = computed(() => store.state.App.userAgent)
+    const backgroundColor = computed(() => store.state.App.theme.background_color)
 
     onMounted(async () => {
       const [a, s]: [LocalAccount, LocalServer] = await win.ipcRenderer.invoke('get-local-account', id.value)
@@ -76,15 +77,18 @@ export default defineComponent({
       account.server = s
 
       document.getElementById('scroller')?.addEventListener('scroll', onScroll)
-      store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, true)
-      load().finally(() => {
-        store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, false)
-      })
+      client.value = generator(s.sns, s.baseURL, a.accessToken, userAgent.value)
+      loading.value = true
+      try {
+        await load(list_id.value)
+      } finally {
+        loading.value = false
+      }
     })
-    watch(list_id, () => {
-      store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, true)
-      load().finally(() => {
-        store.commit(`TimelineSpace/Contents/${CONTENTS_MUTATION.CHANGE_LOADING}`, false)
+    watch(list_id, id => {
+      loading.value = true
+      load(id).finally(() => {
+        loading.value = false
       })
     })
     watch(startReload, (newVal, oldVal) => {
@@ -103,7 +107,7 @@ export default defineComponent({
     })
     whenever(logicAnd(j, shortcutEnabled), () => {
       if (focusedId.value === null) {
-        focusedId.value = timeline.value[0].uri + timeline.value[0].id
+        focusedId.value = statuses.value[0].uri + statuses.value[0].id
       } else {
         focusNext()
       }
@@ -115,9 +119,6 @@ export default defineComponent({
       reload()
     })
 
-    onBeforeUnmount(() => {
-      store.dispatch(`${space}/${ACTION_TYPES.STOP_STREAMING}`)
-    })
     onUnmounted(() => {
       heading.value = true
       const el = document.getElementById('scroller')
@@ -127,42 +128,42 @@ export default defineComponent({
       }
     })
 
-    const load = async () => {
-      await store.dispatch(`${space}/${ACTION_TYPES.STOP_STREAMING}`)
+    const load = async (id: string) => {
+      if (!client.value) return
       try {
-        await store.dispatch(`${space}/${ACTION_TYPES.FETCH_TIMELINE}`, {
-          listID: list_id.value,
-          account: account.account,
-          server: account.server
-        })
+        const res = await client.value.getListTimeline(id, { limit: 20 })
+        statuses.value = res.data
       } catch (err) {
+        console.error(err)
         ElMessage({
           message: i18n.t('message.timeline_fetch_error'),
           type: 'error'
         })
       }
-      store.dispatch(`${space}/${ACTION_TYPES.START_STREAMING}`, { listID: list_id.value, account: account.account }).catch(() => {
-        ElMessage({
-          message: i18n.t('message.start_streaming_error'),
-          type: 'error'
-        })
+      if (!account.account) return
+      win.ipcRenderer.on(`update-list-streamings-${account.account.id}`, (_, update: Entity.Status) => {
+        statuses.value = [update, ...statuses.value]
+      })
+      win.ipcRenderer.on(`delete-list-streamings-${account.account.id}`, (_, id: string) => {
+        deleteToot(id)
+      })
+
+      win.ipcRenderer.send('start-list-streaming', {
+        listId: id,
+        accountId: account.account.id
       })
-      return 'started'
     }
+
     const onScroll = (event: Event) => {
       if (
         (event.target as HTMLElement)!.clientHeight + (event.target as HTMLElement)!.scrollTop >=
           document.getElementById('scroller')!.scrollHeight - 10 &&
-        !lazyLoading
+        !lazyLoading.value
       ) {
+        const lastStatus = statuses.value[statuses.value.length - 1]
         lazyLoading.value = true
-        store
-          .dispatch(`${space}/${ACTION_TYPES.LAZY_FETCH_TIMELINE}`, {
-            list_id: list_id.value,
-            status: timeline.value[timeline.value.length - 1],
-            account: account.account,
-            server: account.server
-          })
+        client.value
+          ?.getListTimeline(list_id.value, { max_id: lastStatus.id, limit: 20 })
           .catch(() => {
             ElMessage({
               message: i18n.t('message.timeline_fetch_error'),
@@ -181,47 +182,46 @@ export default defineComponent({
       }
     }
     const reload = async () => {
-      store.commit(`TimelineSpace/${TIMELINE_MUTATION.CHANGE_LOADING}`, true)
+      loading.value = true
       try {
-        await store.dispatch(`${space}/${ACTION_TYPES.STOP_STREAMING}`)
-        await store.dispatch(`${space}/${ACTION_TYPES.FETCH_TIMELINE}`, list_id.value).catch(() => {
-          ElMessage({
-            message: i18n.t('message.timeline_fetch_error'),
-            type: 'error'
-          })
-        })
-        store.dispatch(`${space}/${ACTION_TYPES.START_STREAMING}`, list_id.value).catch(() => {
-          ElMessage({
-            message: i18n.t('message.start_streaming_error'),
-            type: 'error'
-          })
-        })
+        await load(list_id.value)
       } finally {
-        store.commit(`TimelineSpace/${TIMELINE_MUTATION.CHANGE_LOADING}`, false)
+        loading.value = false
       }
     }
     const updateToot = (message: Entity.Status) => {
-      store.commit(`${space}/${MUTATION_TYPES.UPDATE_TOOT}`, message)
+      statuses.value = statuses.value.map(status => {
+        if (status.id === message.id) {
+          return message
+        } else if (status.reblog && status.reblog.id === message.id) {
+          return Object.assign(status, {
+            reblog: message
+          })
+        }
+        return status
+      })
     }
-    const deleteToot = (message: Entity.Status) => {
-      store.commit(`${space}/${MUTATION_TYPES.DELETE_TOOT}`, message.id)
-    }
-    const upper = () => {
-      scroller.value.scrollToItem(0)
-      focusedId.value = null
+    const deleteToot = (id: string) => {
+      statuses.value = statuses.value.filter(status => {
+        if (status.reblog !== null && status.reblog.id === id) {
+          return false
+        } else {
+          return status.id !== id
+        }
+      })
     }
     const focusNext = () => {
       if (currentFocusedIndex.value === -1) {
-        focusedId.value = timeline.value[0].uri + timeline.value[0].id
-      } else if (currentFocusedIndex.value < timeline.value.length) {
-        focusedId.value = timeline.value[currentFocusedIndex.value + 1].uri + timeline.value[currentFocusedIndex.value + 1].id
+        focusedId.value = statuses.value[0].uri + statuses.value[0].id
+      } else if (currentFocusedIndex.value < statuses.value.length) {
+        focusedId.value = statuses.value[currentFocusedIndex.value + 1].uri + statuses.value[currentFocusedIndex.value + 1].id
       }
     }
     const focusPrev = () => {
       if (currentFocusedIndex.value === 0) {
         focusedId.value = null
       } else if (currentFocusedIndex.value > 0) {
-        focusedId.value = timeline.value[currentFocusedIndex.value - 1].uri + timeline.value[currentFocusedIndex.value - 1].id
+        focusedId.value = statuses.value[currentFocusedIndex.value - 1].uri + statuses.value[currentFocusedIndex.value - 1].id
       }
     }
     const focusToot = (message: Entity.Status) => {
@@ -230,15 +230,16 @@ export default defineComponent({
 
     return {
       scroller,
-      timeline,
+      statuses,
       focusedId,
       modalOpened,
       updateToot,
       deleteToot,
       focusToot,
       heading,
-      upper,
-      account
+      account,
+      loading,
+      backgroundColor
     }
   }
 })
diff --git a/src/renderer/components/TimelineSpace/Modals/AddListMember.vue b/src/renderer/components/TimelineSpace/Modals/AddListMember.vue
index 842f7d8e..96f36954 100644
--- a/src/renderer/components/TimelineSpace/Modals/AddListMember.vue
+++ b/src/renderer/components/TimelineSpace/Modals/AddListMember.vue
@@ -41,7 +41,6 @@ import { useI18next } from 'vue3-i18next'
 import { useMagicKeys, whenever } from '@vueuse/core'
 import { useStore } from '@/store'
 import { ACTION_TYPES } from '@/store/TimelineSpace/Modals/AddListMember'
-import { ACTION_TYPES as LIST_ACTION_TYPES } from '@/store/TimelineSpace/Contents/Lists/Edit'
 
 export default defineComponent({
   name: 'add-list-member',
@@ -55,7 +54,6 @@ export default defineComponent({
 
     const loadingBackground = computed(() => store.state.App.theme.wrapper_mask_color)
     const accounts = computed(() => store.state.TimelineSpace.Modals.AddListMember.accounts)
-    const listId = computed(() => store.state.TimelineSpace.Modals.AddListMember.targetListId)
     const addListMemberModal = computed({
       get: () => store.state.TimelineSpace.Modals.AddListMember.modalOpen,
       set: (value: boolean) => store.dispatch(`${space}/${ACTION_TYPES.CHANGE_MODAL}`, value)
@@ -80,7 +78,6 @@ export default defineComponent({
         .dispatch(`${space}/${ACTION_TYPES.ADD}`, account)
         .then(() => {
           store.dispatch(`${space}/${ACTION_TYPES.CHANGE_MODAL}`, false)
-          store.dispatch(`TimelineSpace/Contents/Lists/Edit/${LIST_ACTION_TYPES.FETCH_MEMBERS}`, listId.value)
         })
         .catch(() => {
           ElMessage({
diff --git a/src/renderer/store/TimelineSpace/Contents.ts b/src/renderer/store/TimelineSpace/Contents.ts
index 4bf87ba9..087ec4d7 100644
--- a/src/renderer/store/TimelineSpace/Contents.ts
+++ b/src/renderer/store/TimelineSpace/Contents.ts
@@ -2,7 +2,6 @@ import Home, { HomeState } from './Contents/Home'
 import Notifications, { NotificationsState } from './Contents/Notifications'
 import Local, { LocalState } from './Contents/Local'
 import Search, { SearchModuleState } from './Contents/Search'
-import Lists, { ListsModuleState } from './Contents/Lists'
 import DirectMessages, { DirectMessagesState } from './Contents/DirectMessages'
 import { Module, MutationTree, ActionTree } from 'vuex'
 import { RootState } from '@/store'
@@ -17,7 +16,6 @@ type ContentsModule = {
   DirectMessages: DirectMessagesState
   Local: LocalState
   Search: SearchModuleState
-  Lists: ListsModuleState
 }
 
 export type ContentsModuleState = ContentsModule & ContentsState
@@ -54,8 +52,7 @@ const Contents: Module<ContentsState, RootState> = {
     Notifications,
     Local,
     DirectMessages,
-    Search,
-    Lists
+    Search
   },
   mutations: mutations,
   actions: actions
diff --git a/src/renderer/store/TimelineSpace/Contents/Lists.ts b/src/renderer/store/TimelineSpace/Contents/Lists.ts
deleted file mode 100644
index 83afc4d4..00000000
--- a/src/renderer/store/TimelineSpace/Contents/Lists.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import Index, { IndexState } from './Lists/Index'
-import Show, { ShowState } from './Lists/Show'
-import Edit, { EditState } from './Lists/Edit'
-import { Module } from 'vuex'
-import { RootState } from '@/store'
-
-export type ListsState = {}
-
-type ListModule = {
-  Index: IndexState
-  Show: ShowState
-  Edit: EditState
-}
-
-export type ListsModuleState = ListModule & ListsState
-
-const state = (): ListsState => ({})
-
-export default {
-  namespaced: true,
-  state: state,
-  modules: {
-    Index,
-    Show,
-    Edit
-  }
-} as Module<ListsState, RootState>
diff --git a/src/renderer/store/TimelineSpace/Contents/Lists/Edit.ts b/src/renderer/store/TimelineSpace/Contents/Lists/Edit.ts
deleted file mode 100644
index 62e8b50e..00000000
--- a/src/renderer/store/TimelineSpace/Contents/Lists/Edit.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-import generator, { Entity } from 'megalodon'
-import { Module, MutationTree, ActionTree } from 'vuex'
-import { RootState } from '@/store'
-import { RemoveAccountFromList } from '@/types/removeAccountFromList'
-
-export type EditState = {
-  members: Array<Entity.Account>
-}
-
-const state = (): EditState => ({
-  members: []
-})
-
-export const MUTATION_TYPES = {
-  CHANGE_MEMBERS: 'changeMembers'
-}
-
-const mutations: MutationTree<EditState> = {
-  [MUTATION_TYPES.CHANGE_MEMBERS]: (state, members: Array<Entity.Account>) => {
-    state.members = members
-  }
-}
-
-export const ACTION_TYPES = {
-  FETCH_MEMBERS: 'fetchMembers',
-  REMOVE_ACCOUNT: 'removeAccount'
-}
-
-const actions: ActionTree<EditState, RootState> = {
-  [ACTION_TYPES.FETCH_MEMBERS]: async ({ commit, rootState }, listId: string): Promise<Array<Entity.Account>> => {
-    const client = generator(
-      rootState.TimelineSpace.server!.sns,
-      rootState.TimelineSpace.server!.baseURL,
-      rootState.TimelineSpace.account!.accessToken,
-      rootState.App.userAgent
-    )
-    const res = await client.getAccountsInList(listId, { limit: 0 })
-    commit(MUTATION_TYPES.CHANGE_MEMBERS, res.data)
-    return res.data
-  },
-  [ACTION_TYPES.REMOVE_ACCOUNT]: async ({ rootState }, remove: RemoveAccountFromList): Promise<{}> => {
-    const client = generator(
-      rootState.TimelineSpace.server!.sns,
-      rootState.TimelineSpace.server!.baseURL,
-      rootState.TimelineSpace.account!.accessToken,
-      rootState.App.userAgent
-    )
-    return client.deleteAccountsFromList(remove.listId, [remove.account.id])
-  }
-}
-
-export default {
-  namespaced: true,
-  state: state,
-  mutations: mutations,
-  actions: actions
-} as Module<EditState, RootState>
diff --git a/src/renderer/store/TimelineSpace/Contents/Lists/Index.ts b/src/renderer/store/TimelineSpace/Contents/Lists/Index.ts
deleted file mode 100644
index 5b9b930a..00000000
--- a/src/renderer/store/TimelineSpace/Contents/Lists/Index.ts
+++ /dev/null
@@ -1,69 +0,0 @@
-import generator, { Entity } from 'megalodon'
-import { Module, MutationTree, ActionTree } from 'vuex'
-import { RootState } from '@/store'
-
-export type IndexState = {
-  lists: Array<Entity.List>
-}
-
-const state = (): IndexState => ({
-  lists: []
-})
-
-export const MUTATION_TYPES = {
-  CHANGE_LISTS: 'changeLists'
-}
-
-const mutations: MutationTree<IndexState> = {
-  [MUTATION_TYPES.CHANGE_LISTS]: (state, lists: Array<Entity.List>) => {
-    state.lists = lists
-  }
-}
-
-export const ACTION_TYPES = {
-  FETCH_LISTS: 'fetchLists',
-  CREATE_LIST: 'createList',
-  DELETE_LIST: 'deleteList'
-}
-
-const actions: ActionTree<IndexState, RootState> = {
-  [ACTION_TYPES.FETCH_LISTS]: async ({ commit, rootState }): Promise<Array<Entity.List>> => {
-    const client = generator(
-      rootState.TimelineSpace.server!.sns,
-      rootState.TimelineSpace.server!.baseURL,
-      rootState.TimelineSpace.account!.accessToken,
-      rootState.App.userAgent
-    )
-    const res = await client.getLists()
-    commit(MUTATION_TYPES.CHANGE_LISTS, res.data)
-    return res.data
-  },
-  [ACTION_TYPES.CREATE_LIST]: async ({ rootState }, title: string): Promise<Entity.List> => {
-    const client = generator(
-      rootState.TimelineSpace.server!.sns,
-      rootState.TimelineSpace.server!.baseURL,
-      rootState.TimelineSpace.account!.accessToken,
-      rootState.App.userAgent
-    )
-    const res = await client.createList(title)
-    return res.data
-  },
-  [ACTION_TYPES.DELETE_LIST]: async ({ dispatch, rootState }, list: Entity.List) => {
-    const client = generator(
-      rootState.TimelineSpace.server!.sns,
-      rootState.TimelineSpace.server!.baseURL,
-      rootState.TimelineSpace.account!.accessToken,
-      rootState.App.userAgent
-    )
-    const res = await client.deleteList(list.id)
-    dispatch(ACTION_TYPES.FETCH_LISTS)
-    return res.data
-  }
-}
-
-export default {
-  namespaced: true,
-  state: state,
-  mutations: mutations,
-  actions: actions
-} as Module<IndexState, RootState>
diff --git a/src/renderer/store/TimelineSpace/Contents/Lists/Show.ts b/src/renderer/store/TimelineSpace/Contents/Lists/Show.ts
deleted file mode 100644
index f965cb11..00000000
--- a/src/renderer/store/TimelineSpace/Contents/Lists/Show.ts
+++ /dev/null
@@ -1,122 +0,0 @@
-import generator, { Entity } from 'megalodon'
-import { Module, MutationTree, ActionTree } from 'vuex'
-import { RootState } from '@/store'
-import { MyWindow } from '~/src/types/global'
-import { LocalAccount } from '~/src/types/localAccount'
-import { LocalServer } from '~/src/types/localServer'
-
-const win = (window as any) as MyWindow
-
-export type ShowState = {
-  timeline: Array<Entity.Status>
-}
-
-const state = (): ShowState => ({
-  timeline: []
-})
-
-export const MUTATION_TYPES = {
-  APPEND_TIMELINE: 'appendTimeline',
-  REPLACE_TIMELINE: 'replaceTimeline',
-  INSERT_TIMELINE: 'insertTimeline',
-  UPDATE_TOOT: 'updateToot',
-  DELETE_TOOT: 'deleteToot'
-}
-
-const mutations: MutationTree<ShowState> = {
-  [MUTATION_TYPES.APPEND_TIMELINE]: (state, update: Entity.Status) => {
-    state.timeline = [update].concat(state.timeline)
-  },
-  [MUTATION_TYPES.REPLACE_TIMELINE]: (state, timeline: Array<Entity.Status>) => {
-    state.timeline = timeline
-  },
-  [MUTATION_TYPES.INSERT_TIMELINE]: (state, messages: Array<Entity.Status>) => {
-    state.timeline = state.timeline.concat(messages)
-  },
-  [MUTATION_TYPES.UPDATE_TOOT]: (state, message: Entity.Status) => {
-    state.timeline = state.timeline.map(toot => {
-      if (toot.id === message.id) {
-        return message
-      } else if (toot.reblog !== null && toot.reblog.id === message.id) {
-        // When user reblog/favourite a reblogged toot, target message is a original toot.
-        // So, a message which is received now is original toot.
-        const reblog = {
-          reblog: message
-        }
-        return Object.assign(toot, reblog)
-      } else {
-        return toot
-      }
-    })
-  },
-  [MUTATION_TYPES.DELETE_TOOT]: (state, id: string) => {
-    state.timeline = state.timeline.filter(toot => {
-      if (toot.reblog !== null && toot.reblog.id === id) {
-        return false
-      } else {
-        return toot.id !== id
-      }
-    })
-  }
-}
-
-export const ACTION_TYPES = {
-  FETCH_TIMELINE: 'fetchTimeline',
-  START_STREAMING: 'startStreaming',
-  STOP_STREAMING: 'stopStreaming',
-  LAZY_FETCH_TIMELINE: 'lazyFetchTimeline'
-}
-
-const actions: ActionTree<ShowState, RootState> = {
-  [ACTION_TYPES.FETCH_TIMELINE]: async (
-    { commit, rootState },
-    req: { listID: string; account: LocalAccount; server: LocalServer }
-  ): Promise<Array<Entity.Status>> => {
-    const client = generator(req.server.sns, req.server.baseURL, req.account.accessToken, rootState.App.userAgent)
-    const res = await client.getListTimeline(req.listID, { limit: 20 })
-    commit(MUTATION_TYPES.REPLACE_TIMELINE, res.data)
-    return res.data
-  },
-  [ACTION_TYPES.START_STREAMING]: ({ commit }, req: { listID: string; account: LocalAccount }) => {
-    win.ipcRenderer.on(`update-list-streamings-${req.account.id}`, (_, update: Entity.Status) => {
-      commit(MUTATION_TYPES.APPEND_TIMELINE, update)
-    })
-    win.ipcRenderer.on(`delete-list-streamings-${req.account.id}`, (_, id: string) => {
-      commit(MUTATION_TYPES.DELETE_TOOT, id)
-    })
-    // @ts-ignore
-    return new Promise((resolve, reject) => {
-      // eslint-disable-line no-unused-vars
-      win.ipcRenderer.send('start-list-streaming', {
-        listId: req.listID,
-        accountId: req.account.id
-      })
-    })
-  },
-  [ACTION_TYPES.STOP_STREAMING]: ({ rootState }) => {
-    return new Promise(resolve => {
-      if (rootState.TimelineSpace.account) {
-        win.ipcRenderer.removeAllListeners(`update-list-streamings-${rootState.TimelineSpace.account.id}`)
-        win.ipcRenderer.removeAllListeners(`delete-list-streamings-${rootState.TimelineSpace.account.id}`)
-      }
-      resolve(null)
-    })
-  },
-  [ACTION_TYPES.LAZY_FETCH_TIMELINE]: async (
-    { commit, rootState },
-    req: { list_id: string; status: Entity.Status; account: LocalAccount; server: LocalServer }
-  ): Promise<Array<Entity.Status> | null> => {
-    const client = generator(req.server.sns, req.server.baseURL, req.account.accessToken, rootState.App.userAgent)
-    return client.getListTimeline(req.list_id, { max_id: req.status.id, limit: 20 }).then(res => {
-      commit(MUTATION_TYPES.INSERT_TIMELINE, res.data)
-      return res.data
-    })
-  }
-}
-
-export default {
-  namespaced: true,
-  state: state,
-  mutations: mutations,
-  actions: actions
-} as Module<ShowState, RootState>