Mastodon
/
Whalebird-desktop-client-mac-linux-windows
mirror of https://github.com/h3poteto/whalebird-desktop
1
0
Fork 0
Code Issues Releases Wiki Activity

refs #3301 Rewrite Settings/Timeline with composition API

This commit is contained in:
AkiraFukushima 2022-05-12 22:50:37 +09:00
parent 8553757657
commit 13b6f3611f
No known key found for this signature in database
GPG Key ID: B6E51BAC4DE1A957
2 changed files with 65 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

113
src/renderer/components/Settings/Timeline.vue
View File

@ -8,13 +8,13 @@
</p>
<el-form-item for="direct" :label="$t('settings.timeline.unread_notification.direct')">
<el-switch v-model="direct" id="direct" />
<el-switch v-model="directNotify" id="direct" />
</el-form-item>
<el-form-item for="local" :label="$t('settings.timeline.unread_notification.local')">
<el-switch v-model="local" id="local" />
<el-switch v-model="localNotify" id="local" />
</el-form-item>
<el-form-item for="public" :label="$t('settings.timeline.unread_notification.public')">
<el-switch v-model="public" id="public" />
<el-switch v-model="publicNotify" id="public" />
</el-form-item>
</el-form>
@ -33,75 +33,74 @@
</div>
</template>
<script>
export default {
<script lang="ts">
import { defineComponent, computed, onMounted } from 'vue'
import { useStore } from '@/store'
import { ACTION_TYPES } from '@/store/Settings/Timeline'
export default defineComponent({
name: 'Timeline',
computed: {
direct: {
get() {
return this.$store.state.Settings.Timeline.setting.unreadNotification.direct
},
set(value) {
this.$store.dispatch('Settings/Timeline/changeUnreadNotification', {
setup() {
const space = 'Settings/Timeline'
const store = useStore()
const directNotify = computed({
get: () => store.state.Settings.Timeline.setting.unreadNotification.direct,
set: value =>
store.dispatch(`${space}/${ACTION_TYPES.CHANGE_UNREAD_NOTIFICATION}`, {
direct: value
})
}
},
local: {
get() {
return this.$store.state.Settings.Timeline.setting.unreadNotification.local
},
set(value) {
this.$store.dispatch('Settings/Timeline/changeUnreadNotification', {
})
const localNotify = computed({
get: () => store.state.Settings.Timeline.setting.unreadNotification.local,
set: value =>
store.dispatch(`${space}/${ACTION_TYPES.CHANGE_UNREAD_NOTIFICATION}`, {
local: value
})
}
},
public: {
get() {
return this.$store.state.Settings.Timeline.setting.unreadNotification.public
},
set(value) {
this.$store.dispatch('Settings/Timeline/changeUnreadNotification', {
})
const publicNotify = computed({
get: () => store.state.Settings.Timeline.setting.unreadNotification.public,
set: value =>
store.dispatch(`${space}/${ACTION_TYPES.CHANGE_UNREAD_NOTIFICATION}`, {
public: value
})
}
},
marker_home: {
get() {
return this.$store.state.Settings.Timeline.setting.useMarker.home
},
set(value) {
this.$store.dispatch('Settings/Timeline/changeUseMarker', {
})
const marker_home = computed({
get: () => store.state.Settings.Timeline.setting.useMarker.home,
set: value =>
store.dispatch(`${space}/${ACTION_TYPES.CHANGE_USER_MARKER}`, {
home: value
})
}
},
marker_notifications: {
get() {
return this.$store.state.Settings.Timeline.setting.useMarker.notifications
},
set(value) {
this.$store.dispatch('Settings/Timeline/changeUseMarker', {
})
const marker_notifications = computed({
get: () => store.state.Settings.Timeline.setting.useMarker.notifications,
set: value =>
store.dispatch(`${space}/${ACTION_TYPES.CHANGE_USER_MARKER}`, {
notifications: value
})
}
},
marker_mentions: {
get() {
return this.$store.state.Settings.Timeline.setting.useMarker.mentions
},
set(value) {
this.$store.dispatch('Settings/Timeline/changeUseMarker', {
})
const marker_mentions = computed({
get: () => store.state.Settings.Timeline.setting.useMarker.mentions,
set: value =>
store.dispatch(`${space}/${ACTION_TYPES.CHANGE_USER_MARKER}`, {
mentions: value
})
}
})
onMounted(() => {
store.dispatch(`${space}/${ACTION_TYPES.LOAD_TIMELINE_SETTING}`)
})
return {
directNotify,
localNotify,
publicNotify,
marker_home,
marker_notifications,
marker_mentions
}
},
async created() {
await this.$store.dispatch('Settings/Timeline/loadTimelineSetting')
}
}
})
</script>
<style lang="scss" scoped>

12
src/renderer/store/Settings/Timeline.ts
View File

@ -25,13 +25,19 @@ const mutations: MutationTree<TimelineState> = {
}
}
export const ACTION_TYPES = {
LOAD_TIMELINE_SETTING: 'loadTimelineSetting',
CHANGE_UNREAD_NOTIFICATION: 'changeUnreadNotification',
CHANGE_USER_MARKER: 'changeUserMarker'
}
const actions: ActionTree<TimelineState, RootState> = {
loadTimelineSetting: async ({ commit, rootState }): Promise<boolean> => {
[ACTION_TYPES.LOAD_TIMELINE_SETTING]: async ({ commit, rootState }): Promise<boolean> => {
const setting: Setting = await win.ipcRenderer.invoke('get-account-setting', rootState.Settings.accountID)
commit(MUTATION_TYPES.UPDATE_TIMELINE_SETTING, setting.timeline)
return true
},
changeUnreadNotification: async ({ dispatch, state, rootState }, timeline: { key: boolean }): Promise<boolean> => {
[ACTION_TYPES.CHANGE_UNREAD_NOTIFICATION]: async ({ dispatch, state, rootState }, timeline: { key: boolean }): Promise<boolean> => {
const unread: UnreadNotification = Object.assign({}, state.setting.unreadNotification, timeline)
const tl: TimelineSetting = Object.assign({}, toRaw(state.setting), {
unreadNotification: unread
@ -44,7 +50,7 @@ const actions: ActionTree<TimelineState, RootState> = {
dispatch('loadTimelineSetting')
return true
},
changeUseMarker: async ({ dispatch, state, rootState }, timeline: { key: boolean }) => {
[ACTION_TYPES.CHANGE_USER_MARKER]: async ({ dispatch, state, rootState }, timeline: { key: boolean }) => {
const marker: UseMarker = Object.assign({}, state.setting.useMarker, timeline)
const tl: TimelineSetting = Object.assign({}, toRaw(state.setting), {
useMarker: marker