refs #850 Replace Mentions with typescript
This commit is contained in:
parent
7623ef757f
commit
10236e1192
|
@ -169,13 +169,6 @@ describe('Mentions', () => {
|
|||
})
|
||||
|
||||
describe('lazyFetchMentions', () => {
|
||||
describe('last is null', () => {
|
||||
it('should not be updated', async () => {
|
||||
const result = await store.dispatch('Mentions/lazyFetchMentions', null)
|
||||
expect(result).toEqual(null)
|
||||
})
|
||||
})
|
||||
|
||||
describe('loading', () => {
|
||||
beforeAll(() => {
|
||||
state = () => {
|
||||
|
|
|
@ -1,8 +1,100 @@
|
|||
import Mentions from '@/store/TimelineSpace/Contents/Mentions'
|
||||
import { Account, Notification, Status, Application } from 'megalodon'
|
||||
import Mentions, { MentionsState, MUTATION_TYPES } from '@/store/TimelineSpace/Contents/Mentions'
|
||||
|
||||
const account1: Account = {
|
||||
id: 1,
|
||||
username: 'h3poteto',
|
||||
acct: 'h3poteto@pleroma.io',
|
||||
display_name: 'h3poteto',
|
||||
locked: false,
|
||||
created_at: '2019-03-26T21:30:32',
|
||||
followers_count: 10,
|
||||
following_count: 10,
|
||||
statuses_count: 100,
|
||||
note: 'engineer',
|
||||
url: 'https://pleroma.io',
|
||||
avatar: '',
|
||||
avatar_static: '',
|
||||
header: '',
|
||||
header_static: '',
|
||||
emojis: [],
|
||||
moved: null,
|
||||
fields: null,
|
||||
bot: false
|
||||
}
|
||||
|
||||
const account2: Account = {
|
||||
id: 2,
|
||||
username: 'h3poteto',
|
||||
acct: 'h3poteto@mstdn.io',
|
||||
display_name: 'h3poteto',
|
||||
locked: false,
|
||||
created_at: '2019-03-26T21:30:32',
|
||||
followers_count: 10,
|
||||
following_count: 10,
|
||||
statuses_count: 100,
|
||||
note: 'engineer',
|
||||
url: 'https://mstdn.io',
|
||||
avatar: '',
|
||||
avatar_static: '',
|
||||
header: '',
|
||||
header_static: '',
|
||||
emojis: [],
|
||||
moved: null,
|
||||
fields: null,
|
||||
bot: false
|
||||
}
|
||||
|
||||
const status: Status = {
|
||||
id: 1,
|
||||
uri: 'http://example.com',
|
||||
url: 'http://example.com',
|
||||
account: account1,
|
||||
in_reply_to_id: null,
|
||||
in_reply_to_account_id: null,
|
||||
reblog: null,
|
||||
content: 'hoge',
|
||||
created_at: '2019-03-26T21:40:32',
|
||||
emojis: [],
|
||||
replies_count: 0,
|
||||
reblogs_count: 0,
|
||||
favourites_count: 0,
|
||||
reblogged: null,
|
||||
favourited: null,
|
||||
muted: null,
|
||||
sensitive: false,
|
||||
spoiler_text: '',
|
||||
visibility: 'public',
|
||||
media_attachments: [],
|
||||
mentions: [],
|
||||
tags: [],
|
||||
card: null,
|
||||
application: {
|
||||
name: 'Web'
|
||||
} as Application,
|
||||
language: null,
|
||||
pinned: null
|
||||
}
|
||||
|
||||
const notification1: Notification = {
|
||||
id: 1,
|
||||
account: account2,
|
||||
status: status,
|
||||
type: 'favourite',
|
||||
created_at: '2019-04-01T17:01:32'
|
||||
}
|
||||
|
||||
const notification2: Notification = {
|
||||
id: 2,
|
||||
account: account2,
|
||||
status: status,
|
||||
type: 'reblog',
|
||||
created_at: '2019-04-01T17:01:32'
|
||||
}
|
||||
|
||||
describe('TimelineSpace/Contents/Mentions', () => {
|
||||
describe('mutations', () => {
|
||||
let state
|
||||
let state: MentionsState
|
||||
beforeEach(() => {
|
||||
state = {
|
||||
lazyLoading: false,
|
||||
|
@ -19,14 +111,14 @@ describe('TimelineSpace/Contents/Mentions', () => {
|
|||
state = {
|
||||
lazyLoading: false,
|
||||
heading: true,
|
||||
mentions: [5, 4, 3, 2, 1],
|
||||
mentions: [notification1],
|
||||
unreadMentions: [],
|
||||
filter: ''
|
||||
}
|
||||
})
|
||||
it('should update mentions', () => {
|
||||
Mentions.mutations.appendMentions(state, 6)
|
||||
expect(state.mentions).toEqual([6, 5, 4, 3, 2, 1])
|
||||
Mentions.mutations![MUTATION_TYPES.APPEND_MENTIONS](state, notification2)
|
||||
expect(state.mentions).toEqual([notification2, notification1])
|
||||
expect(state.unreadMentions).toEqual([])
|
||||
})
|
||||
})
|
||||
|
@ -35,15 +127,15 @@ describe('TimelineSpace/Contents/Mentions', () => {
|
|||
state = {
|
||||
lazyLoading: false,
|
||||
heading: false,
|
||||
mentions: [5, 4, 3, 2, 1],
|
||||
mentions: [notification1],
|
||||
unreadMentions: [],
|
||||
filter: ''
|
||||
}
|
||||
})
|
||||
it('should update mentions', () => {
|
||||
Mentions.mutations.appendMentions(state, 6)
|
||||
expect(state.mentions).toEqual([5, 4, 3, 2, 1])
|
||||
expect(state.unreadMentions).toEqual([6])
|
||||
Mentions.mutations![MUTATION_TYPES.APPEND_MENTIONS](state, notification2)
|
||||
expect(state.mentions).toEqual([notification1])
|
||||
expect(state.unreadMentions).toEqual([notification2])
|
||||
})
|
||||
})
|
||||
})
|
||||
|
@ -53,14 +145,14 @@ describe('TimelineSpace/Contents/Mentions', () => {
|
|||
state = {
|
||||
lazyLoading: false,
|
||||
heading: false,
|
||||
mentions: [5, 4, 3, 2, 1],
|
||||
unreadMentions: [8, 7, 6],
|
||||
mentions: [notification1],
|
||||
unreadMentions: [notification2],
|
||||
filter: ''
|
||||
}
|
||||
})
|
||||
it('should be merged', () => {
|
||||
Mentions.mutations.mergeMentions(state)
|
||||
expect(state.mentions).toEqual([8, 7, 6, 5, 4, 3, 2, 1])
|
||||
Mentions.mutations![MUTATION_TYPES.MERGE_MENTIONS](state, null)
|
||||
expect(state.mentions).toEqual([notification2, notification1])
|
||||
expect(state.unreadMentions).toEqual([])
|
||||
})
|
||||
})
|
||||
|
@ -70,14 +162,14 @@ describe('TimelineSpace/Contents/Mentions', () => {
|
|||
state = {
|
||||
lazyLoading: false,
|
||||
heading: false,
|
||||
mentions: [5, 4, 3, 2, 1],
|
||||
mentions: [notification2],
|
||||
unreadMentions: [],
|
||||
filter: ''
|
||||
}
|
||||
})
|
||||
it('should be inserted', () => {
|
||||
Mentions.mutations.insertMentions(state, [-1, -2, -3, -4])
|
||||
expect(state.mentions).toEqual([5, 4, 3, 2, 1, -1, -2, -3, -4])
|
||||
Mentions.mutations![MUTATION_TYPES.INSERT_MENTIONS](state, [notification1])
|
||||
expect(state.mentions).toEqual([notification2, notification1])
|
||||
})
|
||||
})
|
||||
|
||||
|
@ -86,28 +178,18 @@ describe('TimelineSpace/Contents/Mentions', () => {
|
|||
state = {
|
||||
lazyLoading: false,
|
||||
heading: false,
|
||||
mentions: [
|
||||
{ type: 'mention', status: { id: 20, favourited: false } },
|
||||
{ type: 'favourite', status: { id: 19, favourited: false } },
|
||||
{ type: 'reblog', status: { id: 18, favourited: false } },
|
||||
{ type: 'follow', status: { id: 17, favourited: false } },
|
||||
{ type: 'mention', status: { id: 16, favourited: false } }
|
||||
],
|
||||
mentions: [notification2, notification1],
|
||||
unreadMentions: [],
|
||||
filter: ''
|
||||
}
|
||||
})
|
||||
it('should be updated', () => {
|
||||
Mentions.mutations.updateToot(state, { id: 20, favourited: true })
|
||||
expect(state.mentions).toEqual(
|
||||
[
|
||||
{ type: 'mention', status: { id: 20, favourited: true } },
|
||||
{ type: 'favourite', status: { id: 19, favourited: false } },
|
||||
{ type: 'reblog', status: { id: 18, favourited: false } },
|
||||
{ type: 'follow', status: { id: 17, favourited: false } },
|
||||
{ type: 'mention', status: { id: 16, favourited: false } }
|
||||
]
|
||||
)
|
||||
const favourited: Status = Object.assign(status, {
|
||||
favourited: true
|
||||
})
|
||||
Mentions.mutations![MUTATION_TYPES.UPDATE_TOOT](state, favourited)
|
||||
expect(state.mentions[0].status!.favourited).toEqual(true)
|
||||
expect(state.mentions[1].status!.favourited).toEqual(true)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
|
@ -8,7 +8,7 @@ import Search from './Contents/Search'
|
|||
import Lists from './Contents/Lists'
|
||||
import Hashtag from './Contents/Hashtag'
|
||||
import DirectMessages from './Contents/DirectMessages'
|
||||
import Mentions from './Contents/Mentions'
|
||||
import Mentions, { MentionsState } from './Contents/Mentions'
|
||||
import { Module } from 'vuex'
|
||||
import { RootState } from '@/store'
|
||||
|
||||
|
@ -18,6 +18,7 @@ export interface ContentsModuleState extends ContentsState {
|
|||
SideBar: SideBarModuleState,
|
||||
Home: HomeState,
|
||||
Notifications: NotificationsState,
|
||||
Mentions: MentionsState,
|
||||
Local: LocalState,
|
||||
Public: PublicState
|
||||
}
|
||||
|
|
|
@ -1,100 +0,0 @@
|
|||
import Mastodon from 'megalodon'
|
||||
|
||||
const Mentions = {
|
||||
namespaced: true,
|
||||
state: {
|
||||
lazyLoading: false,
|
||||
heading: true,
|
||||
mentions: [],
|
||||
unreadMentions: [],
|
||||
filter: ''
|
||||
},
|
||||
mutations: {
|
||||
changeLazyLoading (state, value) {
|
||||
state.lazyLoading = value
|
||||
},
|
||||
changeHeading (state, value) {
|
||||
state.heading = value
|
||||
},
|
||||
appendMentions (state, update) {
|
||||
if (state.heading) {
|
||||
state.mentions = [update].concat(state.mentions)
|
||||
} else {
|
||||
state.unreadMentions = [update].concat(state.unreadMentions)
|
||||
}
|
||||
},
|
||||
updateMentions (state, messages) {
|
||||
state.mentions = messages
|
||||
},
|
||||
mergeMentions (state) {
|
||||
state.mentions = state.unreadMentions.slice(0, 80).concat(state.mentions)
|
||||
state.unreadMentions = []
|
||||
},
|
||||
insertMentions (state, messages) {
|
||||
state.mentions = state.mentions.concat(messages)
|
||||
},
|
||||
archiveMentions (state) {
|
||||
state.mentions = state.mentions.slice(0, 40)
|
||||
},
|
||||
clearMentions (state) {
|
||||
state.mentions = []
|
||||
state.unreadMentions = []
|
||||
},
|
||||
updateToot (state, message) {
|
||||
state.mentions = state.mentions.map((mention) => {
|
||||
if (mention.type === 'mention' && mention.status.id === message.id) {
|
||||
const status = {
|
||||
status: message
|
||||
}
|
||||
return Object.assign(mention, status)
|
||||
} else {
|
||||
return mention
|
||||
}
|
||||
})
|
||||
},
|
||||
changeFilter (state, filter) {
|
||||
state.filter = filter
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
fetchMentions ({ commit, rootState }) {
|
||||
const client = new Mastodon(
|
||||
rootState.TimelineSpace.account.accessToken,
|
||||
rootState.TimelineSpace.account.baseURL + '/api/v1'
|
||||
)
|
||||
return client.get('/notifications', { limit: 30, exclude_types: ['follow', 'favourite', 'reblog'] })
|
||||
.then(res => {
|
||||
commit('updateMentions', res.data)
|
||||
return res.data
|
||||
})
|
||||
},
|
||||
lazyFetchMentions ({ state, commit, rootState }, last) {
|
||||
if (last === undefined || last === null) {
|
||||
return Promise.resolve(null)
|
||||
}
|
||||
if (state.lazyLoading) {
|
||||
return Promise.resolve(null)
|
||||
}
|
||||
commit('changeLazyLoading', true)
|
||||
const client = new Mastodon(
|
||||
rootState.TimelineSpace.account.accessToken,
|
||||
rootState.TimelineSpace.account.baseURL + '/api/v1'
|
||||
)
|
||||
return client.get('/notifications', { max_id: last.id, limit: 30, exclude_types: ['follow', 'favourite', 'reblog'] })
|
||||
.then(res => {
|
||||
commit('insertMentions', res.data)
|
||||
return res.data
|
||||
})
|
||||
.finally(() => {
|
||||
commit('changeLazyLoading', false)
|
||||
})
|
||||
}
|
||||
},
|
||||
getters: {
|
||||
mentions (state) {
|
||||
return state.mentions.filter(mention => mention.type === 'mention')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default Mentions
|
|
@ -0,0 +1,126 @@
|
|||
import Mastodon, { Notification, Response } from 'megalodon'
|
||||
import { Module, MutationTree, ActionTree, GetterTree } from 'vuex'
|
||||
import { RootState } from '@/store'
|
||||
|
||||
export interface MentionsState {
|
||||
lazyLoading: boolean,
|
||||
heading: boolean,
|
||||
mentions: Array<Notification>,
|
||||
unreadMentions: Array<Notification>,
|
||||
filter: string
|
||||
}
|
||||
|
||||
const state = (): MentionsState => ({
|
||||
lazyLoading: false,
|
||||
heading: true,
|
||||
mentions: [],
|
||||
unreadMentions: [],
|
||||
filter: ''
|
||||
})
|
||||
|
||||
export const MUTATION_TYPES = {
|
||||
CHANGE_LAZY_LOADING: 'changeLazyLoading',
|
||||
CHANGE_HEADING: 'changeHeading',
|
||||
APPEND_MENTIONS: 'appendMentions',
|
||||
UPDATE_MENTIONS: 'updateMentions',
|
||||
MERGE_MENTIONS: 'mergeMentions',
|
||||
INSERT_MENTIONS: 'insertMentions',
|
||||
ARCHIVE_MENTIONS: 'archiveMentions',
|
||||
CLEAR_MENTIONS: 'clearMentions',
|
||||
UPDATE_TOOT: 'updateToot',
|
||||
CHANGE_FILTER: 'changeFilter'
|
||||
}
|
||||
|
||||
const mutations: MutationTree<MentionsState> = {
|
||||
[MUTATION_TYPES.CHANGE_LAZY_LOADING]: (state, value: boolean) => {
|
||||
state.lazyLoading = value
|
||||
},
|
||||
[MUTATION_TYPES.CHANGE_HEADING]: (state, value: boolean) => {
|
||||
state.heading = value
|
||||
},
|
||||
[MUTATION_TYPES.APPEND_MENTIONS]: (state, update: Notification) => {
|
||||
if (state.heading) {
|
||||
state.mentions = [update].concat(state.mentions)
|
||||
} else {
|
||||
state.unreadMentions = [update].concat(state.unreadMentions)
|
||||
}
|
||||
},
|
||||
[MUTATION_TYPES.UPDATE_MENTIONS]: (state, messages: Array<Notification>) => {
|
||||
state.mentions = messages
|
||||
},
|
||||
[MUTATION_TYPES.MERGE_MENTIONS]: (state) => {
|
||||
state.mentions = state.unreadMentions.slice(0, 80).concat(state.mentions)
|
||||
state.unreadMentions = []
|
||||
},
|
||||
[MUTATION_TYPES.INSERT_MENTIONS]: (state, messages: Array<Notification>) => {
|
||||
state.mentions = state.mentions.concat(messages)
|
||||
},
|
||||
[MUTATION_TYPES.ARCHIVE_MENTIONS]: (state) => {
|
||||
state.mentions = state.mentions.slice(0, 40)
|
||||
},
|
||||
[MUTATION_TYPES.CLEAR_MENTIONS]: (state) => {
|
||||
state.mentions = []
|
||||
state.unreadMentions = []
|
||||
},
|
||||
[MUTATION_TYPES.UPDATE_TOOT]: (state, message: Notification) => {
|
||||
state.mentions = state.mentions.map((mention) => {
|
||||
if (mention.status !== null && mention.status.id === message.id) {
|
||||
const status = {
|
||||
status: message
|
||||
}
|
||||
return Object.assign(mention, status)
|
||||
} else {
|
||||
return mention
|
||||
}
|
||||
})
|
||||
},
|
||||
[MUTATION_TYPES.CHANGE_FILTER]: (state, filter: string) => {
|
||||
state.filter = filter
|
||||
}
|
||||
}
|
||||
|
||||
const actions: ActionTree<MentionsState, RootState> = {
|
||||
fetchMentions: async ({ commit, rootState }): Promise<Array<Notification>> => {
|
||||
const client = new Mastodon(
|
||||
rootState.TimelineSpace.account.accessToken!,
|
||||
rootState.TimelineSpace.account.baseURL + '/api/v1'
|
||||
)
|
||||
const res: Response<Array<Notification>> = await client.get<Array<Notification>>('/notifications', { limit: 30, exclude_types: ['follow', 'favourite', 'reblog'] })
|
||||
commit(MUTATION_TYPES.UPDATE_MENTIONS, res.data)
|
||||
return res.data
|
||||
},
|
||||
lazyFetchMentions: async ({ state, commit, rootState }, lastMention: Notification): Promise<Array<Notification> | null> => {
|
||||
if (state.lazyLoading) {
|
||||
return Promise.resolve(null)
|
||||
}
|
||||
commit(MUTATION_TYPES.CHANGE_LAZY_LOADING, true)
|
||||
const client = new Mastodon(
|
||||
rootState.TimelineSpace.account.accessToken!,
|
||||
rootState.TimelineSpace.account.baseURL + '/api/v1'
|
||||
)
|
||||
return client.get<Array<Notification>>('/notifications', { max_id: lastMention.id, limit: 30, exclude_types: ['follow', 'favourite', 'reblog'] })
|
||||
.then(res => {
|
||||
commit(MUTATION_TYPES.INSERT_MENTIONS, res.data)
|
||||
return res.data
|
||||
})
|
||||
.finally(() => {
|
||||
commit(MUTATION_TYPES.CHANGE_LAZY_LOADING, false)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const getters: GetterTree<MentionsState, RootState> = {
|
||||
mentions: (state) => {
|
||||
return state.mentions.filter(mention => mention.type === 'mention')
|
||||
}
|
||||
}
|
||||
|
||||
const Mentions: Module<MentionsState, RootState> = {
|
||||
namespaced: true,
|
||||
state: state,
|
||||
mutations: mutations,
|
||||
actions: actions,
|
||||
getters: getters
|
||||
}
|
||||
|
||||
export default Mentions
|
Loading…
Reference in New Issue