[refactor] Remove list timeline store

This commit is contained in:
AkiraFukushima 2023-01-30 01:12:35 +09:00
parent 3a6d5fe687
commit d2a1c4ac52
No known key found for this signature in database
GPG Key ID: B6E51BAC4DE1A957
10 changed files with 160 additions and 405 deletions

View File

@ -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
}
}
})

View File

@ -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 = () => {

View File

@ -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

View File

@ -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
}
}
})

View File

@ -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({

View File

@ -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

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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>