hj/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

MASSIVE refactor, replacing instance module with store, separating emoji stuff into its own store, making sure everything refers to new stores (WIP)

Browse source
This commit is contained in:
Henry Jameson 2026-01-22 17:16:51 +02:00
commit 5bdf341560
95 changed files with 801 additions and 833 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/about/about.js
View file

@ -1,3 +1,5 @@
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import FeaturesPanel from '../features_panel/features_panel.vue'
import InstanceSpecificPanel from '../instance_specific_panel/instance_specific_panel.vue'
import MRFTransparencyPanel from '../mrf_transparency_panel/mrf_transparency_panel.vue'
@ -14,13 +16,13 @@ const About = {
},
computed: {
showFeaturesPanel() {
return this.$store.state.instance.showFeaturesPanel
return useInstanceStore().showFeaturesPanel
},
showInstanceSpecificPanel() {
return (
this.$store.state.instance.showInstanceSpecificPanel &&
!this.$store.getters.mergedConfig.hideISP &&
this.$store.state.instance.instanceSpecificPanelContent
useInstanceStore().showInstanceSpecificPanel &&
!useSyncConfigStore().mergedConfig.hideISP &&
useInstanceStore().instanceSpecificPanelContent
)
},
},

5
src/components/account_actions/account_actions.js
View file

@ -3,6 +3,7 @@ import { mapState } from 'vuex'
import UserListMenu from 'src/components/user_list_menu/user_list_menu.vue'
import UserTimedFilterModal from 'src/components/user_timed_filter_modal/user_timed_filter_modal.vue'
import { useReportsStore } from 'src/stores/reports'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import Popover from '../popover/popover.vue'
import ProgressButton from '../progress_button/progress_button.vue'
@ -87,10 +88,10 @@ const AccountActions = {
},
computed: {
shouldConfirmBlock() {
return this.$store.getters.mergedConfig.modalOnBlock
return useSyncConfigStore().mergedConfig.modalOnBlock
},
shouldConfirmRemoveUserFromFollowers() {
return this.$store.getters.mergedConfig.modalOnRemoveUserFromFollowers
return useSyncConfigStore().mergedConfig.modalOnRemoveUserFromFollowers
},
...mapState({
blockExpirationSupported: (state) => state.instance.blockExpiration,

12
src/components/attachment/attachment.js
View file

@ -1,6 +1,8 @@
import { mapGetters } from 'vuex'
import { useInstanceStore } from 'src/stores/instance.js'
import { useMediaViewerStore } from 'src/stores/media_viewer'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import nsfwImage from '../../assets/nsfw.png'
import fileTypeService from '../../services/file_type/file_type.service.js'
import Flash from '../flash/flash.vue'
@ -53,9 +55,9 @@ const Attachment = {
data() {
return {
localDescription: this.description || this.attachment.description,
nsfwImage: this.$store.state.instance.nsfwCensorImage || nsfwImage,
hideNsfwLocal: this.$store.getters.mergedConfig.hideNsfw,
preloadImage: this.$store.getters.mergedConfig.preloadImage,
nsfwImage: useInstanceStore().nsfwCensorImage || nsfwImage,
hideNsfwLocal: useSyncConfigStore().mergedConfig.hideNsfw,
preloadImage: useSyncConfigStore().mergedConfig.preloadImage,
loading: false,
img:
fileTypeService.fileType(this.attachment.mimetype) === 'image' &&
@ -89,7 +91,7 @@ const Attachment = {
return this.size === 'hide'
},
useContainFit() {
return this.$store.getters.mergedConfig.useContainFit
return useSyncConfigStore().mergedConfig.useContainFit
},
placeholderName() {
if (this.attachment.description === '' || !this.attachment.description) {
@ -104,7 +106,7 @@ const Attachment = {
return 'file'
},
referrerpolicy() {
return this.$store.state.instance.mediaProxyAvailable ? '' : 'no-referrer'
return useInstanceStore().mediaProxyAvailable ? '' : 'no-referrer'
},
type() {
return fileTypeService.fileType(this.attachment.mimetype)

3
src/components/avatar_list/avatar_list.js
View file

@ -1,4 +1,5 @@
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useInstanceStore } from 'src/stores/instance.js'
import UserAvatar from '../user_avatar/user_avatar.vue'
const AvatarList = {
@ -16,7 +17,7 @@ const AvatarList = {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
},

3
src/components/basic_user_card/basic_user_card.js
View file

@ -1,5 +1,6 @@
import RichContent from 'src/components/rich_content/rich_content.jsx'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useInstanceStore } from 'src/stores/instance.js'
import UserAvatar from '../user_avatar/user_avatar.vue'
import UserLink from '../user_link/user_link.vue'
import UserPopover from '../user_popover/user_popover.vue'
@ -17,7 +18,7 @@ const BasicUserCard = {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
},

12
src/components/conversation/conversation.js
View file

@ -2,7 +2,9 @@ import { clone, filter, findIndex, get, reduce } from 'lodash'
import { mapState as mapPiniaState } from 'pinia'
import { mapGetters, mapState } from 'vuex'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { WSConnectionStatus } from '../../services/api/api.service.js'
import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue'
import QuickViewSettings from '../quick_view_settings/quick_view_settings.vue'
@ -80,7 +82,7 @@ const conversation = {
// maxDepthInThread = max number of depths that is *visible*
// since our depth starts with 0 and "showing" means "showing children"
// there is a -2 here
const maxDepth = this.$store.getters.mergedConfig.maxDepthInThread - 2
const maxDepth = useSyncConfigStore().mergedConfig.maxDepthInThread - 2
return maxDepth >= 1 ? maxDepth : 1
},
streamingEnabled() {
@ -90,22 +92,22 @@ const conversation = {
)
},
displayStyle() {
return this.$store.getters.mergedConfig.conversationDisplay
return useSyncConfigStore().mergedConfig.conversationDisplay
},
isTreeView() {
return !this.isLinearView
},
treeViewIsSimple() {
return !this.$store.getters.mergedConfig.conversationTreeAdvanced
return !useSyncConfigStore().mergedConfig.conversationTreeAdvanced
},
isLinearView() {
return this.displayStyle === 'linear'
},
shouldFadeAncestors() {
return this.$store.getters.mergedConfig.conversationTreeFadeAncestors
return useSyncConfigStore().mergedConfig.conversationTreeFadeAncestors
},
otherRepliesButtonPosition() {
return this.$store.getters.mergedConfig.conversationOtherRepliesButton
return useSyncConfigStore().mergedConfig.conversationOtherRepliesButton
},
showOtherRepliesButtonBelowStatus() {
return this.otherRepliesButtonPosition === 'below'

64
src/components/desktop_nav/desktop_nav.js
View file

@ -1,6 +1,9 @@
import SearchBar from 'components/search_bar/search_bar.vue'
import { mapState } from 'pinia'
import { useInterfaceStore } from 'src/stores/interface'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -31,6 +34,14 @@ library.add(
faCog,
faInfoCircle,
)
const supportsMask =
window.CSS &&
window.CSS.supports &&
(window.CSS.supports('mask-size', 'contain') ||
window.CSS.supports('-webkit-mask-size', 'contain') ||
window.CSS.supports('-moz-mask-size', 'contain') ||
window.CSS.supports('-ms-mask-size', 'contain') ||
window.CSS.supports('-o-mask-size', 'contain'))
export default {
components: {
@ -39,68 +50,51 @@ export default {
},
data: () => ({
searchBarHidden: true,
supportsMask:
window.CSS &&
window.CSS.supports &&
(window.CSS.supports('mask-size', 'contain') ||
window.CSS.supports('-webkit-mask-size', 'contain') ||
window.CSS.supports('-moz-mask-size', 'contain') ||
window.CSS.supports('-ms-mask-size', 'contain') ||
window.CSS.supports('-o-mask-size', 'contain')),
showingConfirmLogout: false,
}),
computed: {
enableMask() {
return this.supportsMask && this.$store.state.instance.logoMask
},
logoStyle() {
return {
visibility: this.enableMask ? 'hidden' : 'visible',
visibility: this.logoMask ? 'hidden' : 'visible',
}
},
logoMaskStyle() {
return this.enableMask
return this.logoMask
? {
'mask-image': `url(${this.$store.state.instance.logo})`,
'mask-image': `url(${this.logo})`,
}
: {
'background-color': this.enableMask ? '' : 'transparent',
'background-color': this.logoMask ? '' : 'transparent',
}
},
logoBgStyle() {
return Object.assign(
{
margin: `${this.$store.state.instance.logoMargin} 0`,
margin: `${this.logoMargin} 0`,
opacity: this.searchBarHidden ? 1 : 0,
},
this.enableMask
this.logoMask
? {}
: {
'background-color': this.enableMask ? '' : 'transparent',
'background-color': this.logoMask ? '' : 'transparent',
},
)
},
logo() {
return this.$store.state.instance.logo
},
sitename() {
return this.$store.state.instance.name
},
hideSitename() {
return this.$store.state.instance.hideSitename
},
logoLeft() {
return this.$store.state.instance.logoLeft
},
currentUser() {
return this.$store.state.users.currentUser
},
privateMode() {
return this.$store.state.instance.private
},
shouldConfirmLogout() {
return this.$store.getters.mergedConfig.modalOnLogout
return useSyncConfigStore().mergedConfig.modalOnLogout
},
...mapState(useInstanceStore, {
logo: (state) => state.instanceIdentity.logo,
logoMask: (state) => supportsMask && state.instanceIdentity.logoMask,
logoLeft: (state) => state.instanceIdentity.logoLeft,
logoMargin: (state) => state.instanceIdentity.logoMargin,
sitename: (state) => state.instanceIdentity.name,
privateMode: (state) => state.private,
hideSitename: (state) => state.instanceIdentity.hideSitename,
}),
},
methods: {
scrollToTop() {

4
src/components/dialog_modal/dialog_modal.js
View file

@ -1,3 +1,5 @@
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const DialogModal = {
props: {
darkOverlay: {
@ -13,7 +15,7 @@ const DialogModal = {
},
computed: {
mobileCenter() {
return this.$store.getters.mergedConfig.modalMobileCenter
return useSyncConfigStore().mergedConfig.modalMobileCenter
},
},
}

3
src/components/draft/draft.js
View file

@ -5,6 +5,7 @@ import EditStatusForm from 'src/components/edit_status_form/edit_status_form.vue
import Gallery from 'src/components/gallery/gallery.vue'
import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
import StatusContent from 'src/components/status_content/status_content.vue'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faPollH } from '@fortawesome/free-solid-svg-icons'
@ -57,7 +58,7 @@ const Draft = {
: undefined
},
localCollapseSubjectDefault() {
return this.$store.getters.mergedConfig.collapseMessageWithSubject
return useSyncConfigStore().mergedConfig.collapseMessageWithSubject
},
nsfwClickthrough() {
if (!this.draft.nsfw) {

5
src/components/draft_closer/draft_closer.js
View file

@ -1,4 +1,5 @@
import DialogModal from 'src/components/dialog_modal/dialog_modal.vue'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const DraftCloser = {
data() {
@ -12,10 +13,10 @@ const DraftCloser = {
emits: ['save', 'discard'],
computed: {
action() {
if (this.$store.getters.mergedConfig.autoSaveDraft) {
if (useSyncConfigStore().mergedConfig.autoSaveDraft) {
return 'save'
} else {
return this.$store.getters.mergedConfig.unsavedPostAction
return useSyncConfigStore().mergedConfig.unsavedPostAction
}
},
shouldConfirm() {

10
src/components/emoji_input/emoji_input.js
View file

@ -2,7 +2,8 @@ import { take } from 'lodash'
import Popover from 'src/components/popover/popover.vue'
import ScreenReaderNotice from 'src/components/screen_reader_notice/screen_reader_notice.vue'
import { ensureFinalFallback } from '../../i18n/languages.js'
import { ensureFinalFallback } from 'src/i18n/languages.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import Completion from '../../services/completion/completion.js'
import { findOffset } from '../../services/offset_finder/offset_finder.service.js'
import genRandomSeed from '../../services/random_seed/random_seed.service.js'
@ -131,10 +132,10 @@ const EmojiInput = {
},
computed: {
padEmoji() {
return this.$store.getters.mergedConfig.padEmoji
return useSyncConfigStore().mergedConfig.padEmoji
},
defaultCandidateIndex() {
return this.$store.getters.mergedConfig.autocompleteSelect ? 0 : -1
return useSyncConfigStore().mergedConfig.autocompleteSelect ? 0 : -1
},
preText() {
return this.modelValue.slice(0, this.caret)
@ -163,7 +164,7 @@ const EmojiInput = {
},
languages() {
return ensureFinalFallback(
this.$store.getters.mergedConfig.interfaceLanguage,
useSyncConfigStore().mergedConfig.interfaceLanguage,
)
},
maybeLocalizedEmojiNamesAndKeywords() {
@ -331,7 +332,6 @@ const EmojiInput = {
if (!this.pickerShown) {
this.scrollIntoView()
this.$refs.picker.showPicker()
this.$refs.picker.startEmojiLoad()
} else {
this.$refs.picker.hidePicker()
}

4
src/components/emoji_input/suggestor.js
View file

@ -1,8 +1,10 @@
import { useEmojiStore } from 'src/stores/emoji.js'
/**
* suggest - generates a suggestor function to be used by emoji-input
* data: object providing source information for specific types of suggestions:
* data.emoji - optional, an array of all emoji available i.e.
* (getters.standardEmojiList + state.instance.customEmoji)
* (useEmojiStore().standardEmojiList + state.instance.customEmoji)
* data.users - optional, an array of all known users
* updateUsersList - optional, a function to search and append to users
*

19
src/components/emoji_picker/emoji_picker.js
View file

@ -2,7 +2,10 @@ import { chunk, debounce, trim } from 'lodash'
import { defineAsyncComponent } from 'vue'
import Popover from 'src/components/popover/popover.vue'
import { ensureFinalFallback } from '../../i18n/languages.js'
import { ensureFinalFallback } from 'src/i18n/languages.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useEmojiStore } from 'src/stores/emoji.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import Checkbox from '../checkbox/checkbox.vue'
import StillImage from '../still-image/still-image.vue'
@ -337,7 +340,7 @@ const EmojiPicker = {
this.$nextTick(() => {
this.updateEmojiSize()
})
return this.$store.getters.mergedConfig.fontSize
return useSyncConfigStore().mergedConfig.fontSize
},
emojiHeight() {
return this.emojiSize
@ -349,8 +352,8 @@ const EmojiPicker = {
return this.showingStickers ? '' : this.activeGroup
},
stickersAvailable() {
if (this.$store.state.instance.stickers) {
return this.$store.state.instance.stickers.length > 0
if (useInstanceStore().stickers) {
return useInstanceStore().stickers.length > 0
}
return 0
},
@ -358,7 +361,7 @@ const EmojiPicker = {
if (this.hideCustomEmoji || this.hideCustomEmojiInPicker) {
return {}
}
const emojis = this.$store.getters.groupedCustomEmojis
const emojis = useEmojiStore().groupedCustomEmojis
if (emojis.unpacked) {
emojis.unpacked.text = this.$t('emoji.unpacked')
}
@ -368,7 +371,7 @@ const EmojiPicker = {
return Object.keys(this.allCustomGroups)[0]
},
unicodeEmojiGroups() {
return this.$store.getters.standardEmojiGroupList.map((group) => ({
return useEmojiStore().standardEmojiGroupList.map((group) => ({
id: `standard-${group.id}`,
text: this.$t(`emoji.unicode_groups.${group.id}`),
icon: UNICODE_EMOJI_GROUP_ICON[group.id],
@ -381,7 +384,7 @@ const EmojiPicker = {
.concat(this.unicodeEmojiGroups)
},
stickerPickerEnabled() {
return (this.$store.state.instance.stickers || []).length !== 0
return (useInstanceStore().stickers || []).length !== 0
},
debouncedHandleKeywordChange() {
return debounce(() => {
@ -402,7 +405,7 @@ const EmojiPicker = {
},
languages() {
return ensureFinalFallback(
this.$store.getters.mergedConfig.interfaceLanguage,
useSyncConfigStore().mergedConfig.interfaceLanguage,
)
},
maybeLocalizedEmojiName() {

12
src/components/extra_notifications/extra_notifications.js
View file

@ -1,8 +1,9 @@
import { mapState as mapPiniaState } from 'pinia'
import { mapState } from 'pinia'
import { mapGetters } from 'vuex'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInterfaceStore } from 'src/stores/interface'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -51,10 +52,11 @@ const ExtraNotifications = {
currentUser() {
return this.$store.state.users.currentUser
},
...mapGetters(['unreadChatCount', 'followRequestCount', 'mergedConfig']),
...mapPiniaState(useAnnouncementsStore, {
...mapGetters(['unreadChatCount', 'followRequestCount']),
...mapState(useAnnouncementsStore, {
unreadAnnouncementCount: 'unreadAnnouncementCount',
}),
...mapState(useSyncConfigStore, ['mergedConfig']),
},
methods: {
openNotificationSettings() {

17
src/components/features_panel/features_panel.js
View file

@ -1,31 +1,32 @@
import { useInstanceStore } from 'src/stores/instance.js'
import fileSizeFormatService from '../../services/file_size_format/file_size_format.js'
const FeaturesPanel = {
computed: {
shout: function () {
return this.$store.state.instance.shoutAvailable
return useInstanceStore().shoutAvailable
},
pleromaChatMessages: function () {
return this.$store.state.instance.pleromaChatMessagesAvailable
return useInstanceStore().pleromaChatMessagesAvailable
},
gopher: function () {
return this.$store.state.instance.gopherAvailable
return useInstanceStore().gopherAvailable
},
whoToFollow: function () {
return this.$store.state.instance.suggestionsEnabled
return useInstanceStore().suggestionsEnabled
},
mediaProxy: function () {
return this.$store.state.instance.mediaProxyAvailable
return useInstanceStore().mediaProxyAvailable
},
minimalScopesMode: function () {
return this.$store.state.instance.minimalScopesMode
return useInstanceStore().minimalScopesMode
},
textlimit: function () {
return this.$store.state.instance.textlimit
return useInstanceStore().textlimit
},
uploadlimit: function () {
return fileSizeFormatService.fileSizeFormat(
this.$store.state.instance.uploadlimit,
useInstanceStore().uploadlimit,
)
},
},

3
src/components/follow_button/follow_button.js
View file

@ -1,3 +1,4 @@
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import {
requestFollow,
requestUnfollow,
@ -16,7 +17,7 @@ export default {
},
computed: {
shouldConfirmUnfollow() {
return this.$store.getters.mergedConfig.modalOnUnfollow
return useSyncConfigStore().mergedConfig.modalOnUnfollow
},
isPressed() {
return this.inProgress || this.relationship.following

3
src/components/follow_request_card/follow_request_card.js
View file

@ -1,3 +1,4 @@
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { notificationsFromStore } from '../../services/notification_utils/notification_utils.js'
import BasicUserCard from '../basic_user_card/basic_user_card.vue'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
@ -76,7 +77,7 @@ const FollowRequestCard = {
},
computed: {
mergedConfig() {
return this.$store.getters.mergedConfig
return useSyncConfigStore().mergedConfig
},
shouldConfirmApprove() {
return this.mergedConfig.modalOnApproveFollow

4
src/components/instance_specific_panel/instance_specific_panel.js
View file

@ -1,7 +1,9 @@
import { useInstanceStore } from 'src/stores/instance.js'
const InstanceSpecificPanel = {
computed: {
instanceSpecificPanelContent() {
return this.$store.state.instance.instanceSpecificPanelContent
return useInstanceStore().instanceSpecificPanelContent
},
},
}

7
src/components/media_upload/media_upload.js
View file

@ -1,5 +1,4 @@
/* eslint-env browser */
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import fileSizeFormatService from '../../services/file_size_format/file_size_format.js'
import statusPosterService from '../../services/status_poster/status_poster.service.js'
@ -33,7 +32,7 @@ const mediaUpload = {
}
// Skip if image compression is disabled
if (!this.$store.getters.mergedConfig.imageCompression) {
if (!useSyncConfigStore().mergedConfig.imageCompression) {
return file
}
@ -78,7 +77,7 @@ const mediaUpload = {
// Convert to WebP if supported and alwaysUseJpeg is false, otherwise JPEG
const type =
!this.$store.getters.mergedConfig.alwaysUseJpeg && supportsWebP
!useSyncConfigStore().mergedConfig.alwaysUseJpeg && supportsWebP
? 'image/webp'
: 'image/jpeg'
const extension = type === 'image/webp' ? '.webp' : '.jpg'

29
src/components/mention_link/mention_link.js
View file

@ -1,6 +1,8 @@
import { defineAsyncComponent } from 'vue'
import { mapGetters, mapState } from 'vuex'
import { mapState as mapPiniaState } from 'pinia'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import {
highlightClass,
@ -97,7 +99,7 @@ const MentionLink = {
return this.user && this.user.screen_name_ui
},
highlight() {
return this.user && this.mergedConfig.highlight[this.user.screen_name]
return this.user && useSyncConfigStore().mergedConfig.highlight[this.user.screen_name]
},
highlightType() {
return this.highlight && '-' + this.highlight.type
@ -130,7 +132,7 @@ const MentionLink = {
return this.userName !== this.userNameFull
},
shouldShowFullUserName() {
const conf = this.mergedConfig.mentionLinkDisplay
const conf = useSyncConfigStore().mergedConfig.mentionLinkDisplay
if (conf === 'short') {
return false
} else if (conf === 'full') {
@ -140,25 +142,16 @@ const MentionLink = {
return this.isRemote
}
},
shouldShowTooltip() {
return this.mergedConfig.mentionLinkShowTooltip
},
shouldShowAvatar() {
return this.mergedConfig.mentionLinkShowAvatar
},
shouldShowYous() {
return this.mergedConfig.mentionLinkShowYous
},
shouldBoldenYou() {
return this.mergedConfig.mentionLinkBoldenYou
},
shouldFadeDomain() {
return this.mergedConfig.mentionLinkFadeDomain
},
...mapGetters(['mergedConfig']),
...mapState({
currentUser: (state) => state.users.currentUser,
}),
...mapPiniaState(useSyncConfigStore, {
shouldShowTooltip: (state) => state.mergedConfig.mentionLinkShowTooltip,
shouldShowAvatar: (state) => state.mergedConfig.mentionLinkShowAvatar,
shouldShowYous: (state) => state.mergedConfig.mentionLinkShowYous,
shouldBoldenYou: (state) => state.mergedConfig.mentionLinkBoldenYou,
shouldFadeDomain: (state) => state.mergedConfig.mentionLinkFadeDomain,
}),
},
}

13
src/components/mobile_nav/mobile_nav.js
View file

@ -3,7 +3,8 @@ import { mapGetters } from 'vuex'
import NavigationPins from 'src/components/navigation/navigation_pins.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import GestureService from '../../services/gesture_service/gesture_service'
import {
countExtraNotifications,
@ -64,24 +65,24 @@ const MobileNav = {
return `${this.unseenCount ? this.unseenCount : ''}`
},
hideSitename() {
return this.$store.state.instance.hideSitename
return useInstanceStore().hideSitename
},
sitename() {
return this.$store.state.instance.name
return useInstanceStore().name
},
isChat() {
return this.$route.name === 'chat'
},
...mapState(useAnnouncementsStore, ['unreadAnnouncementCount']),
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems).has('chats'),
}),
shouldConfirmLogout() {
return this.$store.getters.mergedConfig.modalOnLogout
return useSyncConfigStore().mergedConfig.modalOnLogout
},
closingDrawerMarksAsSeen() {
return this.$store.getters.mergedConfig.closingDrawerMarksAsSeen
return useSyncConfigStore().mergedConfig.closingDrawerMarksAsSeen
},
...mapGetters(['unreadChatCount']),
},

5
src/components/mobile_post_status_button/mobile_post_status_button.js
View file

@ -1,6 +1,7 @@
import { debounce } from 'lodash'
import { usePostStatusStore } from 'src/stores/post_status'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faPen } from '@fortawesome/free-solid-svg-icons'
@ -45,10 +46,10 @@ const MobilePostStatusButton = {
)
},
isPersistent() {
return !!this.$store.getters.mergedConfig.alwaysShowNewPostButton
return !!useSyncConfigStore().mergedConfig.alwaysShowNewPostButton
},
autohideFloatingPostButton() {
return !!this.$store.getters.mergedConfig.autohideFloatingPostButton
return !!useSyncConfigStore().mergedConfig.autohideFloatingPostButton
},
},
watch: {

3
src/components/moderation_tools/moderation_tools.js
View file

@ -1,3 +1,4 @@
import { useInstanceStore } from 'src/stores/instance.js'
import DialogModal from '../dialog_modal/dialog_modal.vue'
import Popover from '../popover/popover.vue'
@ -54,7 +55,7 @@ const ModerationTools = {
},
canUseTagPolicy() {
return (
this.$store.state.instance.tagPolicyAvailable &&
useInstanceStore().tagPolicyAvailable &&
this.privileged('users_manage_tags')
)
},

18
src/components/nav_panel/nav_panel.js
View file

@ -10,7 +10,7 @@ import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
import NavigationPins from 'src/components/navigation/navigation_pins.vue'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -82,28 +82,28 @@ const NavPanel = {
this.editMode = !this.editMode
},
toggleCollapse() {
useServerSideStorageStore().setPreference({
useSyncConfigStore().setPreference({
path: 'simple.collapseNav',
value: !this.collapsed,
})
useServerSideStorageStore().pushServerSideStorage()
useSyncConfigStore().pushSyncConfig()
},
isPinned(item) {
return this.pinnedItems.has(item)
},
togglePin(item) {
if (this.isPinned(item)) {
useServerSideStorageStore().removeCollectionPreference({
useSyncConfigStore().removeCollectionPreference({
path: 'collections.pinnedNavItems',
value: item,
})
} else {
useServerSideStorageStore().addCollectionPreference({
useSyncConfigStore().addCollectionPreference({
path: 'collections.pinnedNavItems',
value: item,
})
}
useServerSideStorageStore().pushServerSideStorage()
useSyncConfigStore().pushSyncConfig()
},
},
computed: {
@ -111,7 +111,7 @@ const NavPanel = {
unreadAnnouncementCount: 'unreadAnnouncementCount',
supportsAnnouncements: (store) => store.supportsAnnouncements,
}),
...mapPiniaState(useServerSideStorageStore, {
...mapPiniaState(useSyncConfigStore, {
collapsed: (store) => store.prefsStorage.simple.collapseNav,
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems),
@ -123,12 +123,12 @@ const NavPanel = {
store.featureSet.pleromaChatMessagesAvailable,
bookmarkFolders: (store) =>
store.featureSet.pleromaBookmarkFoldersAvailable,
privateMode: (state) => state.private,
federating: (state) => state.federating,
}),
...mapState({
currentUser: (state) => state.users.currentUser,
followRequestCount: (state) => state.api.followRequests.length,
privateMode: (state) => state.instance.private,
federating: (state) => state.instance.federating,
}),
timelinesItems() {
return filterNavigation(

10
src/components/navigation/navigation_entry.js
View file

@ -4,7 +4,7 @@ import { mapState } from 'vuex'
import { routeTo } from 'src/components/navigation/navigation.js'
import OptionalRouterLink from 'src/components/optional_router_link/optional_router_link.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faThumbtack } from '@fortawesome/free-solid-svg-icons'
@ -22,17 +22,17 @@ const NavigationEntry = {
},
togglePin(value) {
if (this.isPinned(value)) {
useServerSideStorageStore().removeCollectionPreference({
useSyncConfigStore().removeCollectionPreference({
path: 'collections.pinnedNavItems',
value,
})
} else {
useServerSideStorageStore().addCollectionPreference({
useSyncConfigStore().addCollectionPreference({
path: 'collections.pinnedNavItems',
value,
})
}
useServerSideStorageStore().pushServerSideStorage()
useSyncConfigStore().pushSyncConfig()
},
},
computed: {
@ -46,7 +46,7 @@ const NavigationEntry = {
...mapState({
currentUser: (state) => state.users.currentUser,
}),
...mapPiniaState(useServerSideStorageStore, {
...mapPiniaState(useSyncConfigStore, {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems),
}),

12
src/components/navigation/navigation_pins.js
View file

@ -14,9 +14,9 @@ import {
import StillImage from 'src/components/still-image/still-image.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
import { useListsStore } from 'src/stores/lists'
import { useInstanceStore } from 'src/stores/instance'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useListsStore } from 'src/stores/lists'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -68,15 +68,17 @@ const NavPanel = {
...mapPiniaState(useBookmarkFoldersStore, {
bookmarks: getBookmarkFolderEntries,
}),
...mapPiniaState(useServerSideStorageStore, {
...mapPiniaState(useSyncConfigStore, {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems),
}),
...mapPiniaState(useInstanceStore, {
privateMode: (store) => store.featureSet.private,
federating: (store) => store.featureSet.federating,
pleromaChatMessagesAvailable: (store) => store.featureSet.pleromaChatMessagesAvailable,
bubbleTimelinesSupported: (store) => store.featureSet.localBubbleInstances.length > 0,
pleromaChatMessagesAvailable: (store) =>
store.featureSet.pleromaChatMessagesAvailable,
bubbleTimelinesSupported: (store) =>
store.featureSet.localBubbleInstances.length > 0,
}),
...mapState({
currentUser: (state) => state.users.currentUser,

8
src/components/notification/notification.js
View file

@ -2,6 +2,8 @@ import { mapState } from 'vuex'
import RichContent from 'src/components/rich_content/rich_content.jsx'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { isStatusNotification } from '../../services/notification_utils/notification_utils.js'
import {
highlightClass,
@ -107,7 +109,7 @@ const Notification = {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
getUser(notification) {
@ -178,7 +180,7 @@ const Notification = {
return highlightClass(this.notification.from_profile)
},
userStyle() {
const highlight = this.$store.getters.mergedConfig.highlight
const highlight = useSyncConfigStore().mergedConfig.highlight
const user = this.notification.from_profile
return highlightStyle(highlight[user.screen_name])
},
@ -206,7 +208,7 @@ const Notification = {
return isStatusNotification(this.notification.type)
},
mergedConfig() {
return this.$store.getters.mergedConfig
return useSyncConfigStore().mergedConfig
},
shouldConfirmApprove() {
return this.mergedConfig.modalOnApproveFollow

3
src/components/notifications/notification_filters.vue
View file

@ -106,6 +106,7 @@
</template>
<script>
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import Popover from '../popover/popover.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -117,7 +118,7 @@ export default {
components: { Popover },
computed: {
filters() {
return this.$store.getters.mergedConfig.notificationVisibility
return useSyncConfigStore().mergedConfig.notificationVisibility
},
},
methods: {

12
src/components/notifications/notifications.js
View file

@ -2,8 +2,10 @@ import { mapState } from 'pinia'
import { computed } from 'vue'
import { mapGetters } from 'vuex'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInterfaceStore } from 'src/stores/interface'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import FaviconService from '../../services/favicon_service/favicon_service.js'
import {
ACTIONABLE_NOTIFICATION_TYPES,
@ -97,7 +99,7 @@ const Notifications = {
return this.unseenNotifications.length
},
ignoreInactionableSeen() {
return this.$store.getters.mergedConfig.ignoreInactionableSeen
return useSyncConfigStore().mergedConfig.ignoreInactionableSeen
},
extraNotificationsCount() {
return countExtraNotifications(this.$store)
@ -135,10 +137,10 @@ const Notifications = {
)
},
noSticky() {
return this.$store.getters.mergedConfig.disableStickyHeaders
return useSyncConfigStore().mergedConfig.disableStickyHeaders
},
unseenAtTop() {
return this.$store.getters.mergedConfig.unseenAtTop
return useSyncConfigStore().mergedConfig.unseenAtTop
},
showExtraNotifications() {
return !this.noExtra

3
src/components/oauth_callback/oauth_callback.js
View file

@ -1,3 +1,4 @@
import { useInstanceStore } from 'src/stores/instance.js'
import { useOAuthStore } from 'src/stores/oauth.js'
import oauth from '../../services/new_api/oauth.js'
@ -12,7 +13,7 @@ const oac = {
.getToken({
clientId,
clientSecret,
instance: this.$store.state.instance.server,
instance: useInstanceStore().server,
code: this.code,
})
.then((result) => {

3
src/components/poll/poll.js
View file

@ -3,6 +3,7 @@ import RichContent from 'components/rich_content/rich_content.jsx'
import Timeago from 'components/timeago/timeago.vue'
import { usePollsStore } from 'src/stores/polls'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import genRandomSeed from '../../services/random_seed/random_seed.service.js'
export default {
@ -47,7 +48,7 @@ export default {
return (this.poll && this.poll.expired) || false
},
expirationLabel() {
if (this.$store.getters.mergedConfig.useAbsoluteTimeFormat) {
if (useSyncConfigStore().mergedConfig.useAbsoluteTimeFormat) {
return this.expired ? 'polls.expired_at' : 'polls.expires_at'
} else {
return this.expired ? 'polls.expired' : 'polls.expires_in'

3
src/components/poll/poll_form.js
View file

@ -1,5 +1,6 @@
import * as DateUtils from 'src/services/date_utils/date_utils.js'
import { pollFallback } from 'src/services/poll/poll.service.js'
import { useInstanceStore } from 'src/stores/instance.js'
import Select from '../select/select.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -52,7 +53,7 @@ export default {
},
},
pollLimits() {
return this.$store.state.instance.pollLimits
return useInstanceStore().pollLimits
},
maxOptions() {
return this.pollLimits.max_options

56
src/components/post_status_form/post_status_form.js
View file

@ -6,9 +6,11 @@ import DraftCloser from 'src/components/draft_closer/draft_closer.vue'
import Gallery from 'src/components/gallery/gallery.vue'
import Popover from 'src/components/popover/popover.vue'
import { pollFormToMasto } from 'src/services/poll/poll.service.js'
import { useEmojiStore } from 'src/stores/emoji.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMediaViewerStore } from 'src/stores/media_viewer.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { propsToNative } from '../../services/attributes_helper/attributes_helper.service.js'
import fileTypeService from '../../services/file_type/file_type.service.js'
import { findOffset } from '../../services/offset_finder/offset_finder.service.js'
@ -159,8 +161,6 @@ const PostStatusForm = {
const preset = this.$route.query.message
let statusText = preset || ''
const { scopeCopy } = this.$store.getters.mergedConfig
const [statusType, refId] = typeAndRefId({
replyTo: this.replyTo,
profileMention: this.profileMention && this.repliedUser?.id,
@ -183,26 +183,23 @@ const PostStatusForm = {
}
const scope =
(this.copyMessageScope && scopeCopy) ||
(this.copyMessageScope && this.scopeCopy) ||
this.copyMessageScope === 'direct'
? this.copyMessageScope
: this.$store.state.users.currentUser.default_scope
const { postContentType: contentType, sensitiveByDefault } =
this.$store.getters.mergedConfig
statusParams = {
type: statusType,
refId,
spoilerText: this.subject || '',
status: statusText,
nsfw: !!sensitiveByDefault,
nsfw: !!this.sensitiveByDefault,
files: [],
poll: {},
hasPoll: false,
mediaDescriptions: {},
visibility: scope,
contentType,
contentType: this.contentType,
quoting: false,
}
@ -250,17 +247,14 @@ const PostStatusForm = {
userDefaultScope() {
return this.$store.state.users.currentUser.default_scope
},
showAllScopes() {
return !this.mergedConfig.minimalScopesMode
},
hideExtraActions() {
return this.disableDraft || this.hideDraft
},
emojiUserSuggestor() {
return suggestor({
emoji: [
...this.$store.getters.standardEmojiList,
...this.$store.state.instance.customEmoji,
...useEmojiStore().standardEmojiList,
...useEmojiStore().customEmoji,
],
store: this.$store,
})
@ -268,16 +262,16 @@ const PostStatusForm = {
emojiSuggestor() {
return suggestor({
emoji: [
...this.$store.getters.standardEmojiList,
...this.$store.state.instance.customEmoji,
...useEmojiStore().standardEmojiList,
...useEmojiStore().customEmoji,
],
})
},
emoji() {
return this.$store.getters.standardEmojiList || []
return useEmojiStore().standardEmojiList || []
},
customEmoji() {
return this.$store.state.instance.customEmoji || []
return useEmojiStore().customEmoji || []
},
statusLength() {
return this.newStatus.status.length
@ -286,7 +280,7 @@ const PostStatusForm = {
return this.newStatus.spoilerText.length
},
statusLengthLimit() {
return this.$store.state.instance.textlimit
return useInstanceStore().textlimit
},
hasStatusLengthLimit() {
return this.statusLengthLimit > 0
@ -300,21 +294,21 @@ const PostStatusForm = {
return this.hasStatusLengthLimit && this.charactersLeft < 0
},
postFormats() {
return this.$store.state.instance.postFormats || []
return useInstanceStore().postFormats || []
},
safeDMEnabled() {
return this.$store.state.instance.safeDM
return useInstanceStore().safeDM
},
pollsAvailable() {
return (
this.$store.state.instance.pollsAvailable &&
this.$store.state.instance.pollLimits.max_options >= 2 &&
useInstanceStore().pollsAvailable &&
useInstanceStore().pollLimits.max_options >= 2 &&
this.disablePolls !== true
)
},
hideScopeNotice() {
return (
this.disableNotice || this.$store.getters.mergedConfig.hideScopeNotice
this.disableNotice || useSyncConfigStore().mergedConfig.hideScopeNotice
)
},
pollContentError() {
@ -337,7 +331,7 @@ const PostStatusForm = {
return typeof this.statusId !== 'undefined' && this.statusId.trim() !== ''
},
quotable() {
if (!this.$store.state.instance.quotingAvailable) {
if (!useInstanceStore().quotingAvailable) {
return false
}
@ -369,9 +363,6 @@ const PostStatusForm = {
pollFormVisible() {
return this.newStatus.hasPoll
},
shouldAutoSaveDraft() {
return this.$store.getters.mergedConfig.autoSaveDraft
},
autoSaveState() {
if (this.saveable) {
return this.$t('post_status.auto_save_saving')
@ -401,13 +392,16 @@ const PostStatusForm = {
)
)
},
...mapGetters(['mergedConfig']),
...mapState(useInterfaceStore, {
mobileLayout: (store) => store.mobileLayout,
}),
...mapState(useServerSideStorageStore, {
minimalScopesMode: (store) => store.mergedConfig.minimalScopesMode,
...mapState(useSyncConfigStore, {
scopeCopy: (store) => store.mergedConfig.scopeCopy,
shouldAutoSaveDraft: (store) => store.mergedConfig.autoSaveDraft,
showAllScopes: (store) => !store.mergedConfig.minimalScopesMode,
alwaysShowSubject: (store) => store.mergedConfig.alwaysShowSubjectInput,
contentType: (store) => store.mergedConfig.postContentType,
sensitiveByDefaultType: (store) => store.mergedConfig.sensitiveByDefault,
}),
},
watch: {

3
src/components/remove_follower_button/remove_follower_button.js
View file

@ -1,3 +1,4 @@
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
export default {
@ -20,7 +21,7 @@ export default {
}
},
shouldConfirmRemoveUserFromFollowers() {
return this.$store.getters.mergedConfig.modalOnRemoveUserFromFollowers
return useSyncConfigStore().mergedConfig.modalOnRemoveUserFromFollowers
},
},
methods: {

3
src/components/report/report.js
View file

@ -1,5 +1,6 @@
import RichContent from 'src/components/rich_content/rich_content.jsx'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useInstanceStore } from 'src/stores/instance.js'
import { useReportsStore } from 'src/stores/reports'
import Select from '../select/select.vue'
import StatusContent from '../status_content/status_content.vue'
@ -31,7 +32,7 @@ const Report = {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
setReportState(state) {

3
src/components/settings_modal/admin_tabs/emoji_tab.js
View file

@ -6,6 +6,7 @@ import StillImage from 'components/still-image/still-image.vue'
import { assign, clone } from 'lodash'
import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import EmojiEditingPopover from '../helpers/emoji_editing_popover.vue'
import ModifiedIndicator from '../helpers/modified_indicator.vue'
@ -102,7 +103,7 @@ const EmojiTab = {
// Remote pack
return `${this.pack.remote.instance}/emoji/${encodeURIComponent(this.pack.remote.baseName)}/${name}`
} else {
return `${this.$store.state.instance.server}/emoji/${encodeURIComponent(this.packName)}/${name}`
return `${useInstanceStore().server}/emoji/${encodeURIComponent(this.packName)}/${name}`
}
},

5
src/components/settings_modal/helpers/attachment_setting.js
View file

@ -1,6 +1,7 @@
import Attachment from 'src/components/attachment/attachment.vue'
import MediaUpload from 'src/components/media_upload/media_upload.vue'
import { fileTypeExt } from 'src/services/file_type/file_type.service.js'
import { useInstanceStore } from 'src/stores/instance.js'
import Setting from './setting.js'
export default {
@ -24,9 +25,7 @@ export default {
attachment() {
const path = this.realDraftMode ? this.draft : this.state
// The "server" part is primarily for local dev, but could be useful for alt-domain or multiuser usage.
const url = path.includes('://')
? path
: this.$store.state.instance.server + path
const url = path.includes('://') ? path : useInstanceStore().server + path
return {
mimetype: fileTypeExt(url),
url,

5
src/components/settings_modal/helpers/pwa_manifest_icons_setting.js
View file

@ -4,6 +4,7 @@ import Attachment from 'src/components/attachment/attachment.vue'
import MediaUpload from 'src/components/media_upload/media_upload.vue'
import Select from 'src/components/select/select.vue'
import { fileTypeExt } from 'src/services/file_type/file_type.service.js'
import { useInstanceStore } from 'src/stores/instance.js'
import Setting from './setting.js'
export default {
@ -34,9 +35,7 @@ export default {
url: '',
}
}
const url = path.includes('://')
? path
: this.$store.state.instance.server + path
const url = path.includes('://') ? path : useInstanceStore().server + path
return {
mimetype: fileTypeExt(url),

12
src/components/settings_modal/helpers/setting.js
View file

@ -1,7 +1,7 @@
import { cloneDeep, get, isEqual, set } from 'lodash'
import { useInstanceStore } from 'src/stores/instance'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import DraftButtons from './draft_buttons.vue'
import ModifiedIndicator from './modified_indicator.vue'
import ProfileSettingIndicator from './profile_setting_indicator.vue'
@ -229,13 +229,13 @@ export default {
configSource() {
switch (this.realSource) {
case 'server-side':
return useServerSideStorageStore().mergedConfig
return useSyncConfigStore().mergedConfig
case 'profile':
return this.$store.state.profileConfig
case 'admin':
return this.$store.state.adminSettings.config
default:
return this.$store.getters.mergedConfig
return useSyncConfigStore().mergedConfig
}
},
configSink() {
@ -246,8 +246,8 @@ export default {
case 'server-side': {
return (originalPath, value, operator) => {
const path = `simple.${originalPath}`
useServerSideStorageStore().setPreference({ path, value })
useServerSideStorageStore().pushServerSideStorage()
useSyncConfigStore().setPreference({ path, value })
useSyncConfigStore().pushSyncConfig()
}
}
case 'profile':
@ -353,7 +353,7 @@ export default {
this.draft = cloneDeep(this.state)
} else {
set(
this.$store.getters.mergedConfig,
useSyncConfigStore().mergedConfig,
this.path,
cloneDeep(this.defaultState),
)

4
src/components/settings_modal/helpers/shared_computed_object.js
View file

@ -1,10 +1,10 @@
import { mapState as mapPiniaState } from 'pinia'
import { mapGetters, mapState } from 'vuex'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const SharedComputedObject = () => ({
...mapPiniaState(useServerSideStorageStore, {
...mapPiniaState(useSyncConfigStore, {
serverSide: (store) => store.state.prefsStorage,
}),
...mapGetters(['mergedConfig']),

25
src/components/settings_modal/tabs/appearance_tab.js
View file

@ -11,7 +11,9 @@ import { getCssRules } from 'src/services/theme_data/css_utils.js'
import { deserialize } from 'src/services/theme_data/iss_deserializer.js'
import { init } from 'src/services/theme_data/theme_data_3.service.js'
import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { normalizeThemeData, useInterfaceStore } from 'src/stores/interface'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
@ -83,7 +85,7 @@ const AppearanceTab = {
const updateIndex = (resource) => {
const capitalizedResource = resource[0].toUpperCase() + resource.slice(1)
const currentIndex = this.$store.state.instance[`${resource}sIndex`]
const currentIndex = useInstanceStore()[`${resource}sIndex`]
let promise
if (currentIndex) {
@ -273,11 +275,11 @@ const AppearanceTab = {
return !window.IntersectionObserver
},
instanceWallpaper() {
this.$store.state.instance.background
useInstanceStore().background
},
instanceWallpaperUsed() {
return (
this.$store.state.instance.background &&
useInstanceStore().background &&
!this.$store.state.users.currentUser.background_image
)
},
@ -332,20 +334,13 @@ const AppearanceTab = {
}
},
isThemeActive(key) {
return (
key === (this.mergedConfig.theme || this.$store.state.instance.theme)
)
return key === (this.mergedConfig.theme || useInstanceStore().theme)
},
isStyleActive(key) {
return (
key === (this.mergedConfig.style || this.$store.state.instance.style)
)
return key === (this.mergedConfig.style || useInstanceStore().style)
},
isPaletteActive(key) {
return (
key ===
(this.mergedConfig.palette || this.$store.state.instance.palette)
)
return key === (this.mergedConfig.palette || useInstanceStore().palette)
},
...mapActions(useInterfaceStore, ['setStyle', 'setTheme']),
setPalette(name, data) {
@ -431,10 +426,10 @@ const AppearanceTab = {
if (!file) {
return
}
if (file.size > this.$store.state.instance[slot + 'limit']) {
if (file.size > useInstanceStore()[slot + 'limit']) {
const filesize = fileSizeFormatService.fileSizeFormat(file.size)
const allowedsize = fileSizeFormatService.fileSizeFormat(
this.$store.state.instance[slot + 'limit'],
useInstanceStore()[slot + 'limit'],
)
useInterfaceStore().pushGlobalNotice({
messageKey: 'upload.error.message',

21
src/components/settings_modal/tabs/clutter_tab.js
View file

@ -4,7 +4,8 @@ import { mapState as mapVuexState } from 'vuex'
import Checkbox from 'src/components/checkbox/checkbox.vue'
import Select from 'src/components/select/select.vue'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import HelpIndicator from '../helpers/help_indicator.vue'
@ -24,10 +25,10 @@ const ClutterTab = {
},
computed: {
instanceSpecificPanelPresent() {
return this.$store.state.instance.showInstanceSpecificPanel
return useInstanceStore().showInstanceSpecificPanel
},
...SharedComputedObject(),
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
muteFilters: (store) =>
Object.entries(store.prefsStorage.simple.muteFilters),
muteFiltersObject: (store) => store.prefsStorage.simple.muteFilters,
@ -86,10 +87,10 @@ const ClutterTab = {
},
},
methods: {
...mapActions(useServerSideStorageStore, [
...mapActions(useSyncConfigStore, [
'setPreference',
'unsetPreference',
'pushServerSideStorage',
'pushSyncConfig',
]),
getDatetimeLocal(timestamp) {
const date = new Date(timestamp)
@ -136,7 +137,7 @@ const ClutterTab = {
filter.order = this.muteFilters.length + 2
this.muteFiltersDraftObject[newId] = filter
this.setPreference({ path: 'simple.muteFilters.' + newId, value: filter })
this.pushServerSideStorage()
this.pushSyncConfig()
},
exportFilter(id) {
this.exportedFilter = { ...this.muteFiltersDraftObject[id] }
@ -152,19 +153,19 @@ const ClutterTab = {
this.muteFiltersDraftObject[newId] = filter
this.setPreference({ path: 'simple.muteFilters.' + newId, value: filter })
this.pushServerSideStorage()
this.pushSyncConfig()
},
deleteFilter(id) {
delete this.muteFiltersDraftObject[id]
this.unsetPreference({ path: 'simple.muteFilters.' + id, value: null })
this.pushServerSideStorage()
this.pushSyncConfig()
},
purgeExpiredFilters() {
this.muteFiltersExpired.forEach(([id]) => {
delete this.muteFiltersDraftObject[id]
this.unsetPreference({ path: 'simple.muteFilters.' + id, value: null })
})
this.pushServerSideStorage()
this.pushSyncConfig()
},
updateFilter(id, field, value) {
const filter = { ...this.muteFiltersDraftObject[id] }
@ -190,7 +191,7 @@ const ClutterTab = {
path: 'simple.muteFilters.' + id,
value: this.muteFiltersDraftObject[id],
})
this.pushServerSideStorage()
this.pushSyncConfig()
this.muteFiltersDraftDirty[id] = false
},
},

6
src/components/settings_modal/tabs/composing_tab.js
View file

@ -6,6 +6,8 @@ import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
import Select from 'src/components/select/select.vue'
import localeService from 'src/services/locale/locale.service.js'
import { cacheKey, clearCache, emojiCacheKey } from 'src/services/sw/sw.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
@ -108,7 +110,7 @@ const ComposingTab = {
},
computed: {
postFormats() {
return this.$store.state.instance.postFormats || []
return useInstanceStore().postFormats || []
},
postContentOptions() {
return this.postFormats.map((format) => ({
@ -119,7 +121,7 @@ const ComposingTab = {
},
language: {
get: function () {
return this.$store.getters.mergedConfig.interfaceLanguage
return useSyncConfigStore().mergedConfig.interfaceLanguage
},
set: function (val) {
this.$store.dispatch('setOption', {

25
src/components/settings_modal/tabs/filtering_tab.js
View file

@ -9,8 +9,9 @@ import {
newExporter,
newImporter,
} from 'src/services/export_import/export_import.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import HelpIndicator from '../helpers/help_indicator.vue'
@ -34,11 +35,11 @@ const FilteringTab = {
label: this.$t(`user_card.mute_block_${mode}`),
})),
muteFiltersDraftObject: cloneDeep(
useServerSideStorageStore().prefsStorage.simple.muteFilters,
useSyncConfigStore().prefsStorage.simple.muteFilters,
),
muteFiltersDraftDirty: Object.fromEntries(
Object.entries(
useServerSideStorageStore().prefsStorage.simple.muteFilters,
useSyncConfigStore().prefsStorage.simple.muteFilters,
).map(([k]) => [k, false]),
),
exportedFilter: null,
@ -90,10 +91,10 @@ const FilteringTab = {
},
computed: {
instanceSpecificPanelPresent() {
return this.$store.state.instance.showInstanceSpecificPanel
return useInstanceStore().showInstanceSpecificPanel
},
...SharedComputedObject(),
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
muteFilters: (store) =>
Object.entries(store.prefsStorage.simple.muteFilters),
muteFiltersObject: (store) => store.prefsStorage.simple.muteFilters,
@ -152,10 +153,10 @@ const FilteringTab = {
},
},
methods: {
...mapActions(useServerSideStorageStore, [
...mapActions(useSyncConfigStore, [
'setPreference',
'unsetPreference',
'pushServerSideStorage',
'pushSyncConfig',
]),
getDatetimeLocal(timestamp) {
const date = new Date(timestamp)
@ -202,7 +203,7 @@ const FilteringTab = {
filter.order = this.muteFilters.length + 2
this.muteFiltersDraftObject[newId] = filter
this.setPreference({ path: 'simple.muteFilters.' + newId, value: filter })
this.pushServerSideStorage()
this.pushSyncConfig()
},
exportFilter(id) {
this.exportedFilter = { ...this.muteFiltersDraftObject[id] }
@ -218,19 +219,19 @@ const FilteringTab = {
this.muteFiltersDraftObject[newId] = filter
this.setPreference({ path: 'simple.muteFilters.' + newId, value: filter })
this.pushServerSideStorage()
this.pushSyncConfig()
},
deleteFilter(id) {
delete this.muteFiltersDraftObject[id]
this.unsetPreference({ path: 'simple.muteFilters.' + id, value: null })
this.pushServerSideStorage()
this.pushSyncConfig()
},
purgeExpiredFilters() {
this.muteFiltersExpired.forEach(([id]) => {
delete this.muteFiltersDraftObject[id]
this.unsetPreference({ path: 'simple.muteFilters.' + id, value: null })
})
this.pushServerSideStorage()
this.pushSyncConfig()
},
updateFilter(id, field, value) {
const filter = { ...this.muteFiltersDraftObject[id] }
@ -256,7 +257,7 @@ const FilteringTab = {
path: 'simple.muteFilters.' + id,
value: this.muteFiltersDraftObject[id],
})
this.pushServerSideStorage()
this.pushSyncConfig()
this.muteFiltersDraftDirty[id] = false
},
},

4
src/components/settings_modal/tabs/general_tab.js
View file

@ -3,6 +3,8 @@ import { mapState } from 'vuex'
import FontControl from 'src/components/font_control/font_control.vue'
import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
import localeService from 'src/services/locale/locale.service.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
@ -39,7 +41,7 @@ const GeneralTab = {
computed: {
language: {
get: function () {
return this.$store.getters.mergedConfig.interfaceLanguage
return useSyncConfigStore().mergedConfig.interfaceLanguage
},
set: function (val) {
this.$store.dispatch('setOption', {

10
src/components/settings_modal/tabs/layout_tab.js
View file

@ -1,3 +1,5 @@
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
@ -30,18 +32,18 @@ const GeneralTab = {
},
computed: {
postFormats() {
return this.$store.state.instance.postFormats || []
return useInstanceStore().postFormats || []
},
instanceShoutboxPresent() {
return this.$store.state.instance.shoutAvailable
return useInstanceStore().shoutAvailable
},
columns() {
const mode = this.$store.getters.mergedConfig.thirdColumnMode
const mode = useSyncConfigStore().mergedConfig.thirdColumnMode
const notif = mode === 'none' ? [] : ['notifs']
if (
this.$store.getters.mergedConfig.sidebarRight ||
useSyncConfigStore().mergedConfig.sidebarRight ||
mode === 'postform'
) {
return [...notif, 'content', 'sidebar']

4
src/components/settings_modal/tabs/mutes_and_blocks_tab.js
View file

@ -12,7 +12,9 @@ import MuteCard from 'src/components/mute_card/mute_card.vue'
import ProgressButton from 'src/components/progress_button/progress_button.vue'
import SelectableList from 'src/components/selectable_list/selectable_list.vue'
import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
import { useInstanceStore } from 'src/stores/instance.js'
import { useOAuthTokensStore } from 'src/stores/oauth_tokens'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const BlockList = withLoadMore({
fetch: (props, $store) => $store.dispatch('fetchBlocks'),
@ -64,7 +66,7 @@ const MutesAndBlocks = {
},
computed: {
knownDomains() {
return this.$store.state.instance.knownDomains
return useInstanceStore().knownDomains
},
user() {
return this.$store.state.users.currentUser

6
src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.js
View file

@ -41,7 +41,9 @@ import {
} from 'src/services/theme_data/theme_data.service.js'
import { init } from 'src/services/theme_data/theme_data_3.service.js'
import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import Preview from './theme_preview.vue'
// List of color values used in v1
@ -78,7 +80,7 @@ export default {
}),
availableStyles: [],
selected: '',
selectedTheme: this.$store.getters.mergedConfig.theme,
selectedTheme: useSyncConfigStore().mergedConfig.theme,
themeWarning: undefined,
tempImportFile: undefined,
engineVersion: 0,
@ -125,7 +127,7 @@ export default {
}
},
created() {
const currentIndex = this.$store.state.instance.instanceThemesIndex
const currentIndex = useInstanceStore().instanceThemesIndex
let promise
if (currentIndex) {

3
src/components/settings_modal/tabs/security_tab/security_tab.js
View file

@ -1,6 +1,7 @@
import Checkbox from 'src/components/checkbox/checkbox.vue'
import ProgressButton from 'src/components/progress_button/progress_button.vue'
import localeService from 'src/services/locale/locale.service.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useOAuthTokensStore } from 'src/stores/oauth_tokens'
import Mfa from './mfa.vue'
@ -42,7 +43,7 @@ const SecurityTab = {
return this.$store.state.users.currentUser
},
pleromaExtensionsAvailable() {
return this.$store.state.instance.pleromaExtensionsAvailable
return useInstanceStore().pleromaExtensionsAvailable
},
oauthTokens() {
return useOAuthTokensStore().tokens.map((oauthToken) => {

3
src/components/shout_panel/shout_panel.js
View file

@ -1,4 +1,5 @@
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useInstanceStore } from 'src/stores/instance.js'
import { useShoutStore } from 'src/stores/shout'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -32,7 +33,7 @@ const shoutPanel = {
return generateProfileLink(
user.id,
user.username,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
},

13
src/components/side_drawer/side_drawer.js
View file

@ -3,6 +3,7 @@ import { mapGetters, mapState } from 'vuex'
import { USERNAME_ROUTES } from 'src/components/navigation/navigation.js'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useShoutStore } from 'src/stores/shout'
import GestureService from '../../services/gesture_service/gesture_service'
@ -75,25 +76,25 @@ const SideDrawer = {
return this.unseenNotifications.length
},
suggestionsEnabled() {
return this.$store.state.instance.suggestionsEnabled
return useInstanceStore().suggestionsEnabled
},
logo() {
return this.$store.state.instance.logo
return useInstanceStore().logo
},
hideSitename() {
return this.$store.state.instance.hideSitename
return useInstanceStore().hideSitename
},
sitename() {
return this.$store.state.instance.name
return useInstanceStore().name
},
followRequestCount() {
return this.$store.state.api.followRequests.length
},
privateMode() {
return this.$store.state.instance.private
return useInstanceStore().private
},
federating() {
return this.$store.state.instance.federating
return useInstanceStore().federating
},
timelinesRoute() {
let name

3
src/components/staff_panel/staff_panel.js
View file

@ -2,11 +2,12 @@ import groupBy from 'lodash/groupBy'
import map from 'lodash/map'
import { mapGetters, mapState } from 'vuex'
import { useInstanceStore } from 'src/stores/instance.js'
import BasicUserCard from '../basic_user_card/basic_user_card.vue'
const StaffPanel = {
created() {
const nicknames = this.$store.state.instance.staffAccounts
const nicknames = useInstanceStore().staffAccounts
nicknames.forEach((nickname) =>
this.$store.dispatch('fetchUserIfMissing', nickname),
)

11
src/components/status/status.js
View file

@ -6,7 +6,8 @@ import MentionsLine from 'src/components/mentions_line/mentions_line.vue'
import RichContent from 'src/components/rich_content/rich_content.jsx'
import StatusActionButtons from 'src/components/status_action_buttons/status_action_buttons.vue'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { muteFilterHits } from '../../services/status_parser/status_parser.js'
import {
highlightClass,
@ -469,7 +470,7 @@ const Status = {
return this.$store.state.users.currentUser
},
mergedConfig() {
return this.$store.getters.mergedConfig
return useSyncConfigStore().mergedConfig
},
isSuspendable() {
return !this.replying && this.mediaPlaying.length === 0
@ -487,7 +488,7 @@ const Status = {
return this.status.edited_at !== null
},
editingAvailable() {
return this.$store.state.instance.editingAvailable
return useInstanceStore().editingAvailable
},
hasVisibleQuote() {
return this.status.quote_url && this.status.quote_visible
@ -529,7 +530,7 @@ const Status = {
scrobble() {
return this.status.user?.latestScrobble
},
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
muteFilters: (store) => store.prefsStorage.simple.muteFilters,
hideBotIndicatior: (store) => store.prefsStorage.simple.hideBotIndicator,
hidePostStats: (store) => store.mergedConfig.hidePostStats,
@ -588,7 +589,7 @@ const Status = {
return generateProfileLink(
id,
name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
addMediaPlaying(id) {

3
src/components/status_action_buttons/action_button.js
View file

@ -1,6 +1,7 @@
import EmojiPicker from 'src/components/emoji_picker/emoji_picker.vue'
import Popover from 'src/components/popover/popover.vue'
import StatusBookmarkFolderMenu from 'src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -91,7 +92,7 @@ export default {
return this.status.thread_muted
},
hideCustomEmoji() {
return !this.$store.state.instance.pleromaCustomEmojiReactionsAvailable
return !useInstanceStore().pleromaCustomEmojiReactionsAvailable
},
buttonInnerClass() {
return [

12
src/components/status_action_buttons/status_action_buttons.js
View file

@ -3,7 +3,7 @@ import { mapState } from 'pinia'
import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
import Popover from 'src/components/popover/popover.vue'
import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import ActionButtonContainer from './action_button_container.vue'
import { BUTTONS } from './buttons_definitions.js'
@ -34,7 +34,7 @@ const StatusActionButtons = {
ActionButtonContainer,
},
computed: {
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedStatusActions),
}),
@ -109,18 +109,18 @@ const StatusActionButtons = {
return this.pinnedItems.has(button.name)
},
unpin(button) {
useServerSideStorageStore().removeCollectionPreference({
useSyncConfigStore().removeCollectionPreference({
path: 'collections.pinnedStatusActions',
value: button.name,
})
useServerSideStorageStore().pushServerSideStorage()
useSyncConfigStore().pushSyncConfig()
},
pin(button) {
useServerSideStorageStore().addCollectionPreference({
useSyncConfigStore().addCollectionPreference({
path: 'collections.pinnedStatusActions',
value: button.name,
})
useServerSideStorageStore().pushServerSideStorage()
useSyncConfigStore().pushSyncConfig()
},
getComponent(button) {
if (!this.$store.state.users.currentUser && button.anonLink) {

4
src/components/status_body/status_body.js
View file

@ -1,7 +1,9 @@
import { mapState } from 'pinia'
import { mapGetters } from 'vuex'
import RichContent from 'src/components/rich_content/rich_content.jsx'
import fileType from 'src/services/file_type/file_type.service'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -109,7 +111,7 @@ const StatusBody = {
collapsedStatus() {
return this.status.raw_html.replace(/(\n|<br\s?\/?>)/g, ' ')
},
...mapGetters(['mergedConfig']),
...mapState(useSyncConfigStore, ['mergedConfig']),
},
components: {
RichContent,

6
src/components/status_content/status_content.js
View file

@ -3,7 +3,7 @@ import { mapGetters, mapState } from 'vuex'
import StatusBody from 'src/components/status_body/status_body.vue'
import { useMediaViewerStore } from 'src/stores/media_viewer'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import Attachment from '../attachment/attachment.vue'
import Gallery from '../gallery/gallery.vue'
import LinkPreview from '../link-preview/link-preview.vue'
@ -75,7 +75,7 @@ const StatusContent = {
uncontrolledShowingLongSubject: false,
// not as computed because it sets the initial state which will be changed later
uncontrolledExpandingSubject:
!this.$store.getters.mergedConfig.collapseMessageWithSubject,
!useSyncConfigStore().mergedConfig.collapseMessageWithSubject,
}
},
computed: {
@ -124,7 +124,7 @@ const StatusContent = {
...mapState({
currentUser: (state) => state.users.currentUser,
}),
...mapPiniaState(useServerSideStorageStore, {
...mapPiniaState(useSyncConfigStore, {
maxThumbnails: (store) => store.prefsStorage.simple.maxThumbnails,
hideAttachments: (store) => store.prefsStorage.simple.hideAttachments,
hideAttachmentsInConv: (store) =>

4
src/components/sticker_picker/sticker_picker.js
View file

@ -1,4 +1,6 @@
/* eslint-env browser */
import { useInstanceStore } from 'src/stores/instance.js'
import statusPosterService from '../../services/status_poster/status_poster.service.js'
import TabSwitcher from '../tab_switcher/tab_switcher.jsx'
@ -16,7 +18,7 @@ const StickerPicker = {
},
computed: {
pack() {
return this.$store.state.instance.stickers || []
return useInstanceStore().stickers || []
},
},
methods: {

5
src/components/still-image/still-image-emoji-popover.vue
View file

@ -60,6 +60,7 @@ import Popover from 'components/popover/popover.vue'
import SelectComponent from 'components/select/select.vue'
import { assign } from 'lodash'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import StillImage from './still-image.vue'
@ -125,7 +126,7 @@ export default {
const allPacks = {}
return listFunction({
instance: this.$store.state.instance.server,
instance: useInstanceStore().server,
page: 1,
pageSize: 0,
})
@ -140,7 +141,7 @@ export default {
resultingPromise = resultingPromise
.then(() =>
listFunction({
instance: this.$store.state.instance.server,
instance: useInstanceStore().server,
page: i,
pageSize,
}),

4
src/components/still-image/still-image.js
View file

@ -1,3 +1,5 @@
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const StillImage = {
props: [
'src',
@ -15,7 +17,7 @@ const StillImage = {
return {
// for lazy loading, see loadLazy()
realSrc: this.src,
stopGifs: this.$store.getters.mergedConfig.stopGifs,
stopGifs: useSyncConfigStore().mergedConfig.stopGifs,
}
},
computed: {

16
src/components/terms_of_service_panel/terms_of_service_panel.js
View file

@ -1,12 +1,12 @@
import { mapState } from 'pinia'
import { useInstanceStore } from 'src/stores/instance.js'
const TermsOfServicePanel = {
computed: {
content() {
return this.$store.state.instance.tos
},
embedded() {
return this.$store.state.instance.embeddedToS
},
},
computed: mapState(useInstanceStore, {
content: (state) => state.tos,
embedded: (state) => state.embeddedToS,
}),
}
export default TermsOfServicePanel

7
src/components/timeago/timeago.vue
View file

@ -10,6 +10,7 @@
<script>
import * as DateUtils from 'src/services/date_utils/date_utils.js'
import localeService from 'src/services/locale/locale.service.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
export default {
name: 'Timeago',
@ -23,17 +24,17 @@ export default {
},
computed: {
shouldUseAbsoluteTimeFormat() {
if (!this.$store.getters.mergedConfig.useAbsoluteTimeFormat) {
if (!useSyncConfigStore().mergedConfig.useAbsoluteTimeFormat) {
return false
}
return (
DateUtils.durationStrToMs(
this.$store.getters.mergedConfig.absoluteTimeFormatMinAge,
useSyncConfigStore().mergedConfig.absoluteTimeFormatMinAge,
) <= this.relativeTimeMs
)
},
time12hFormat() {
return this.$store.getters.mergedConfig.absoluteTimeFormat12h === '12h'
return useSyncConfigStore().mergedConfig.absoluteTimeFormat12h === '12h'
},
browserLocale() {
return localeService.internalToBrowserLocale(this.$i18n.locale)

10
src/components/timeline/timeline.js
View file

@ -2,7 +2,9 @@ import { debounce, keyBy, throttle } from 'lodash'
import { mapState } from 'pinia'
import timelineFetcher from 'src/services/timeline_fetcher/timeline_fetcher.service.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import Conversation from '../conversation/conversation.vue'
import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue'
import QuickViewSettings from '../quick_view_settings/quick_view_settings.vue'
@ -123,7 +125,7 @@ const Timeline = {
return this.timeline.visibleStatuses.slice(min, max).map((_) => _.id)
},
virtualScrollingEnabled() {
return this.$store.getters.mergedConfig.virtualScrolling
return useSyncConfigStore().mergedConfig.virtualScrolling
},
...mapState(useInterfaceStore, {
mobileLayout: (store) => store.layoutType === 'mobile',
@ -311,7 +313,7 @@ const Timeline = {
},
watch: {
newStatusCount(count) {
if (!this.$store.getters.mergedConfig.streaming) {
if (!useSyncConfigStore().mergedConfig.streaming) {
return
}
if (count > 0) {
@ -321,7 +323,9 @@ const Timeline = {
if (
top < 15 &&
!this.paused &&
!(this.unfocused && this.$store.getters.mergedConfig.pauseOnUnfocused)
!(
this.unfocused && useSyncConfigStore().mergedConfig.pauseOnUnfocused
)
) {
this.showNewStatuses()
} else {

10
src/components/timeline_menu/timeline_menu.js
View file

@ -64,10 +64,12 @@ const TimelineMenu = {
currentUser: (state) => state.users.currentUser,
}),
...mapPiniaState(useInstanceStore, {
bookmarkFolders: (store) => store.featureSet.pleromaBookmarkFoldersAvailable,
bubbleTimeline: (state) => store.featureSet.localBubbleInstances.length > 0,
privateMode: (state) => store.private,
federating: (state) => store.federating,
bookmarkFolders: (state) =>
state.featureSet.pleromaBookmarkFoldersAvailable,
bubbleTimeline: (state) =>
state.featureSet.localBubbleInstances.length > 0,
privateMode: (state) => state.private,
federating: (state) => state.federating,
}),
timelinesList() {
return filterNavigation(

19
src/components/update_notification/update_notification.js
View file

@ -1,7 +1,8 @@
import pleromaTanFoxMask from 'src/assets/pleromatan_apology_fox_mask.png'
import pleromaTanMask from 'src/assets/pleromatan_apology_mask.png'
import Modal from 'src/components/modal/modal.vue'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faTimes } from '@fortawesome/free-solid-svg-icons'
@ -36,11 +37,11 @@ const UpdateNotification = {
},
shouldShow() {
return (
!this.$store.state.instance.disableUpdateNotification &&
!useInstanceStore().disableUpdateNotification &&
this.$store.state.users.currentUser &&
useServerSideStorageStore().flagStorage.updateCounter <
useSyncConfigStore().flagStorage.updateCounter <
CURRENT_UPDATE_COUNTER &&
!useServerSideStorageStore().prefsStorage.simple.dontShowUpdateNotifs
!useSyncConfigStore().prefsStorage.simple.dontShowUpdateNotifs
)
},
},
@ -50,22 +51,22 @@ const UpdateNotification = {
},
neverShowAgain() {
this.toggleShow()
useServerSideStorageStore().setFlag({
useSyncConfigStore().setFlag({
flag: 'updateCounter',
value: CURRENT_UPDATE_COUNTER,
})
useServerSideStorageStore().setPreference({
useSyncConfigStore().setPreference({
path: 'simple.dontShowUpdateNotifs',
value: true,
})
useServerSideStorageStore().pushServerSideStorage()
useSyncConfigStore().pushSyncConfig()
},
dismiss() {
useServerSideStorageStore().setFlag({
useSyncConfigStore().setFlag({
flag: 'updateCounter',
value: CURRENT_UPDATE_COUNTER,
})
useServerSideStorageStore().pushServerSideStorage()
useSyncConfigStore().pushSyncConfig()
},
},
mounted() {

3
src/components/user_avatar/user_avatar.js
View file

@ -1,3 +1,4 @@
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import StillImage from '../still-image/still-image.vue'
@ -35,7 +36,7 @@ const UserAvatar = {
data() {
return {
showPlaceholder: false,
defaultAvatar: `${this.$store.state.instance.server + this.$store.state.instance.defaultAvatar}`,
defaultAvatar: `${useInstanceStore().server + useInstanceStore().defaultAvatar}`,
betterShadow: useInterfaceStore().browserSupport.cssFilter,
}
},

29
src/components/user_card/user_card.js
View file

@ -16,7 +16,8 @@ import { propsToNative } from 'src/services/attributes_helper/attributes_helper.
import localeService from 'src/services/locale/locale.service.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { usePostStatusStore } from 'src/stores/post_status'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from '../../stores/interface'
import { useMediaViewerStore } from '../../stores/media_viewer'
import AccountActions from '../account_actions/account_actions.vue'
@ -178,7 +179,7 @@ export default {
return false
},
groupActorAvailable() {
return this.$store.state.instance.groupActorAvailable
return useInstanceStore().groupActorAvailable
},
availableActorTypes() {
return this.groupActorAvailable
@ -211,7 +212,7 @@ export default {
return Math.round(this.user.statuses_count / days)
},
emoji() {
return this.$store.state.instance.customEmoji.map((e) => ({
return useEmojiStore().customEmoji.map((e) => ({
shortcode: e.displayText,
static_url: e.imageUrl,
url: e.imageUrl,
@ -334,18 +335,18 @@ export default {
},
defaultAvatar() {
return (
this.$store.state.instance.server +
this.$store.state.instance.defaultAvatar
useInstanceStore().server +
useInstanceStore().defaultAvatar
)
},
defaultBanner() {
return (
this.$store.state.instance.server +
this.$store.state.instance.defaultBanner
useInstanceStore().server +
useInstanceStore().defaultBanner
)
},
isDefaultAvatar() {
const baseAvatar = this.$store.state.instance.defaultAvatar
const baseAvatar = useInstanceStore().defaultAvatar
return (
!this.$store.state.users.currentUser.profile_image_url ||
this.$store.state.users.currentUser.profile_image_url.includes(
@ -354,14 +355,14 @@ export default {
)
},
isDefaultBanner() {
const baseBanner = this.$store.state.instance.defaultBanner
const baseBanner = useInstanceStore().defaultBanner
return (
!this.$store.state.users.currentUser.cover_photo ||
this.$store.state.users.currentUser.cover_photo.includes(baseBanner)
)
},
fieldsLimits() {
return this.$store.state.instance.fieldsLimits
return useInstanceStore().fieldsLimits
},
maxFields() {
return this.fieldsLimits ? this.fieldsLimits.maxFields : 0
@ -370,7 +371,7 @@ export default {
return suggestor({
emoji: [
...this.$store.getters.standardEmojiList,
...this.$store.state.instance.customEmoji,
...useEmojiStore().customEmoji,
],
store: this.$store,
})
@ -379,12 +380,12 @@ export default {
return suggestor({
emoji: [
...this.$store.getters.standardEmojiList,
...this.$store.state.instance.customEmoji,
...useEmojiStore().customEmoji,
],
})
},
...mapGetters(['mergedConfig']),
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
hideUserStats: (store) => store.prefsStorage.simple.hideUserStats,
userCardHidePersonalMarks: (store) =>
store.prefsStorage.simple.userCardHidePersonalMarks,
@ -415,7 +416,7 @@ export default {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
openProfileTab() {

3
src/components/user_link/user_link.vue
View file

@ -15,6 +15,7 @@
<script>
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useInstanceStore } from 'src/stores/instance.js'
import UnicodeDomainIndicator from '../unicode_domain_indicator/unicode_domain_indicator.vue'
const UserLink = {
@ -33,7 +34,7 @@ const UserLink = {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
},

15
src/components/user_popover/user_popover.js
View file

@ -1,5 +1,7 @@
import { mapState } from 'pinia'
import { defineAsyncComponent } from 'vue'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import UserCard from '../user_card/user_card.vue'
const UserPopover = {
@ -9,14 +11,11 @@ const UserPopover = {
UserCard,
Popover: defineAsyncComponent(() => import('../popover/popover.vue')),
},
computed: {
userPopoverAvatarAction() {
return this.$store.getters.mergedConfig.userPopoverAvatarAction
},
userPopoverOverlay() {
return this.$store.getters.mergedConfig.userPopoverOverlay
},
},
computed: mapState(useSyncConfigStore, {
userPopoverAvatarAction: (state) =>
state.mergedConfig.userPopoverAvatarAction,
userPopoverOverlay: (state) => state.mergedConfig.userPopoverOverlay,
}),
}
export default UserPopover

4
src/components/user_profile/user_profile.js
View file

@ -2,6 +2,8 @@ import get from 'lodash/get'
import RichContent from 'src/components/rich_content/rich_content.jsx'
import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
import { useInstanceStore } from 'src/stores/instance.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import withLoadMore from '../../hocs/with_load_more/with_load_more'
import Conversation from '../conversation/conversation.vue'
import FollowCard from '../follow_card/follow_card.vue'
@ -87,7 +89,7 @@ const UserProfile = {
favoritesTabVisible() {
return (
this.isUs ||
(this.$store.state.instance.pleromaPublicFavouritesAvailable &&
(useInstanceStore().pleromaPublicFavouritesAvailable &&
!this.user.hide_favorites)
)
},

9
src/components/user_timed_filter_modal/user_timed_filter_modal.js
View file

@ -2,12 +2,13 @@ import Checkbox from 'src/components/checkbox/checkbox.vue'
import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
import Select from 'src/components/select/select.vue'
import { durationStrToMs } from 'src/services/date_utils/date_utils.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const UserTimedFilterModal = {
data() {
const action = this.isMute
? this.$store.getters.mergedConfig.onMuteDefaultAction
: this.$store.getters.mergedConfig.onBlockDefaultAction
? useSyncConfigStore().mergedConfig.onMuteDefaultAction
: useSyncConfigStore().mergedConfig.onBlockDefaultAction
const doAsk = action === 'ask'
const defaultValues = {}
@ -43,9 +44,9 @@ const UserTimedFilterModal = {
computed: {
shouldConfirm() {
if (this.isMute) {
return this.$store.getters.mergedConfig.onMuteDefaultAction === 'ask'
return useSyncConfigStore().mergedConfig.onMuteDefaultAction === 'ask'
} else {
return this.$store.getters.mergedConfig.onBlockDefaultAction === 'ask'
return useSyncConfigStore().mergedConfig.onBlockDefaultAction === 'ask'
}
},
expiryString() {

6
src/components/video_attachment/video_attachment.js
View file

@ -1,3 +1,5 @@
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const VideoAttachment = {
props: ['attachment', 'controls'],
data() {
@ -9,10 +11,10 @@ const VideoAttachment = {
},
computed: {
loopVideo() {
if (this.$store.getters.mergedConfig.loopVideoSilentOnly) {
if (useSyncConfigStore().mergedConfig.loopVideoSilentOnly) {
return !this.hasAudio
}
return this.$store.getters.mergedConfig.loopVideo
return useSyncConfigStore().mergedConfig.loopVideo
},
},
methods: {

1
src/components/who_to_follow/who_to_follow.js
View file

@ -1,3 +1,4 @@
import { useInstanceStore } from 'src/stores/instance.js'
import apiService from '../../services/api/api.service.js'
import FollowCard from '../follow_card/follow_card.vue'

9
src/components/who_to_follow_panel/who_to_follow_panel.js
View file

@ -1,6 +1,7 @@
import { shuffle } from 'lodash'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useInstanceStore } from 'src/stores/instance.js'
import apiService from '../../services/api/api.service.js'
function showWhoToFollow(panel, reply) {
@ -8,7 +9,7 @@ function showWhoToFollow(panel, reply) {
panel.usersToFollow.forEach((toFollow, index) => {
const user = shuffled[index]
const img = user.avatar || this.$store.state.instance.defaultAvatar
const img = user.avatar || useInstanceStore().defaultAvatar
const name = user.acct
toFollow.img = img
@ -46,7 +47,7 @@ const WhoToFollowPanel = {
return this.$store.state.users.currentUser.screen_name
},
suggestionsEnabled() {
return this.$store.state.instance.suggestionsEnabled
return useInstanceStore().suggestionsEnabled
},
},
methods: {
@ -54,7 +55,7 @@ const WhoToFollowPanel = {
return generateProfileLink(
id,
name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
},
@ -67,7 +68,7 @@ const WhoToFollowPanel = {
},
mounted: function () {
this.usersToFollow = new Array(3).fill().map(() => ({
img: this.$store.state.instance.defaultAvatar,
img: useInstanceStore().defaultAvatar,
name: '',
id: 0,
}))