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

Merge pull request 'Synchronized Settings' (#3473) from setttingssync into develop

Browse source 
Reviewed-on: https://git.pleroma.social/pleroma/pleroma-fe/pulls/3473
This commit is contained in:
HJ 2026-04-23 18:56:01 +00:00
commit 9f3c0ec60b
150 changed files with 3942 additions and 1810 deletions
Download patch file Download diff file Expand all files Collapse all files

6
build/emojis_plugin.js
View file

@ -25,7 +25,11 @@ const getAllAccessibleAnnotations = async (projectRoot) => {
await access(importFile)
return `'${lang}': () => import('${importModule}')`
} catch (e) {
console.error(e)
if (e.message.match(/ENOENT/)) {
console.warn(`Missing emoji annotations locale: ${destLang}`)
} else {
console.error('test', e.message)
}
return
}
}),

42
src/App.js
View file

@ -1,7 +1,6 @@
import { throttle } from 'lodash'
import { mapState } from 'pinia'
import { defineAsyncComponent } from 'vue'
import { mapGetters } from 'vuex'
import DesktopNav from './components/desktop_nav/desktop_nav.vue'
import EditStatusModal from './components/edit_status_modal/edit_status_modal.vue'
@ -22,11 +21,20 @@ import WhoToFollowPanel from './components/who_to_follow_panel/who_to_follow_pan
import { getOrCreateServiceWorker } from './services/sw/sw'
import { windowHeight, windowWidth } from './services/window_utils/window_utils'
import { useEmojiStore } from 'src/stores/emoji.js'
import { useI18nStore } from 'src/stores/i18n.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useShoutStore } from 'src/stores/shout.js'
import messages from 'src/i18n/messages'
import localeService from 'src/services/locale/locale.service.js'
// Helper to unwrap reactive proxies
window.toValue = (x) => JSON.parse(JSON.stringify(x))
export default {
name: 'app',
components: {
@ -72,8 +80,10 @@ export default {
},
created() {
// Load the locale from the storage
const val = this.$store.getters.mergedConfig.interfaceLanguage
this.$store.dispatch('setOption', { name: 'interfaceLanguage', value: val })
const value = useMergedConfigStore().mergedConfig.interfaceLanguage
useI18nStore().setLanguage(value)
useEmojiStore().loadUnicodeEmojiData(value)
document.getElementById('modal').classList = ['-' + this.layoutType]
// Create bound handlers
@ -122,7 +132,7 @@ export default {
]
},
navClasses() {
const { navbarColumnStretch } = this.$store.getters.mergedConfig
const { navbarColumnStretch } = useMergedConfigStore().mergedConfig
return [
'-' + this.layoutType,
...(navbarColumnStretch ? ['-column-stretch'] : []),
@ -135,7 +145,9 @@ export default {
return this.currentUser.background_image
},
instanceBackground() {
return this.mergedConfig.hideInstanceWallpaper ? null : this.background
return useMergedConfigStore().mergedConfig.hideInstanceWallpaper
? null
: this.instanceBackgroundUrl
},
background() {
return this.userBackground || this.instanceBackground
@ -160,19 +172,21 @@ export default {
if (this.isChats) return false
if (this.isListEdit) return false
return (
this.$store.getters.mergedConfig.alwaysShowNewPostButton ||
useMergedConfigStore().mergedConfig.alwaysShowNewPostButton ||
this.layoutType === 'mobile'
)
},
shoutboxPosition() {
return this.$store.getters.mergedConfig.alwaysShowNewPostButton || false
return (
useMergedConfigStore().mergedConfig.alwaysShowNewPostButton || false
)
},
hideShoutbox() {
return this.$store.getters.mergedConfig.hideShoutbox
return useMergedConfigStore().mergedConfig.hideShoutbox
},
reverseLayout() {
const { thirdColumnMode, sidebarRight: reverseSetting } =
this.$store.getters.mergedConfig
useMergedConfigStore().mergedConfig
if (this.layoutType !== 'wide') {
return reverseSetting
} else {
@ -182,10 +196,10 @@ export default {
}
},
noSticky() {
return this.$store.getters.mergedConfig.disableStickyHeaders
return useMergedConfigStore().mergedConfig.disableStickyHeaders
},
showScrollbars() {
return this.$store.getters.mergedConfig.showScrollbars
return useMergedConfigStore().mergedConfig.showScrollbars
},
scrollParent() {
return window /* this.$refs.appContentRef */
@ -193,10 +207,10 @@ export default {
showInstanceSpecificPanel() {
return (
this.instanceSpecificPanelPresent &&
!this.$store.getters.mergedConfig.hideISP
!useMergedConfigStore().mergedConfig.hideISP
)
},
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
...mapState(useInterfaceStore, [
'themeApplied',
'styleDataUsed',
@ -208,7 +222,7 @@ export default {
'editingAvailable',
]),
...mapState(useInstanceStore, {
background: (store) => store.instanceIdentity.background,
instanceBackgroundUrl: (store) => store.instanceIdentity.background,
showFeaturesPanel: (store) => store.instanceIdentity.showFeaturesPanel,
instanceSpecificPanelPresent: (store) =>
store.instanceIdentity.showInstanceSpecificPanel &&

15
src/App.scss
View file

@ -797,14 +797,17 @@ option {
}
.notice-dismissible {
padding-right: 4rem;
position: relative;
display: flex;
padding: 0.75em 1em;
align-items: baseline;
line-height: 1.5;
span {
display: block;
flex: 1 1 auto;
}
.dismiss {
position: absolute;
top: 0;
right: 0;
padding: 0.5em;
color: inherit;
}
}

53
src/boot/after_store.js
View file

@ -32,12 +32,17 @@ import { useI18nStore } from 'src/stores/i18n'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useLocalConfigStore } from 'src/stores/local_config.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useOAuthStore } from 'src/stores/oauth'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { useUserHighlightStore } from 'src/stores/user_highlight.js'
import VBodyScrollLock from 'src/directives/body_scroll_lock'
import {
instanceDefaultConfig,
staticOrApiConfigDefault,
INSTANCE_DEFAULT_CONFIG_DEFINITIONS,
INSTANCE_IDENTITY_DEFAULT_DEFINITIONS,
INSTANCE_IDENTIY_EXTERNAL,
} from 'src/modules/default_config_state.js'
let staticInitialResults = null
@ -80,7 +85,7 @@ const getInstanceConfig = async ({ store }) => {
const res = await preloadFetch('/api/v1/instance')
if (res.ok) {
const data = await res.json()
const textlimit = data.max_toot_chars
const textLimit = data.max_toot_chars
const vapidPublicKey = data.pleroma.vapid_public_key
useInstanceCapabilitiesStore().set(
@ -88,8 +93,8 @@ const getInstanceConfig = async ({ store }) => {
data.pleroma,
)
useInstanceStore().set({
path: 'textlimit',
value: textlimit,
path: 'limits.textLimit',
value: textLimit,
})
useInstanceStore().set({
path: 'accountApprovalRequired',
@ -166,18 +171,21 @@ const setSettings = async ({ apiConfig, staticConfig, store }) => {
config = Object.assign({}, staticConfig, apiConfig)
}
const copyInstanceOption = ({ source, destination }) => {
if (typeof config[source] !== 'undefined') {
useInstanceStore().set({ path: destination, value: config[source] })
}
}
Object.keys(INSTANCE_IDENTITY_DEFAULT_DEFINITIONS).forEach((source) => {
if (source === 'name') return
if (INSTANCE_IDENTIY_EXTERNAL.has(source)) return
useInstanceStore().set({
value: config[source],
path: `instanceIdentity.${source}`,
})
})
Object.keys(staticOrApiConfigDefault)
.map((k) => ({ source: k, destination: `instanceIdentity.${k}` }))
.forEach(copyInstanceOption)
Object.keys(instanceDefaultConfig)
.map((k) => ({ source: k, destination: `prefsStorage.${k}` }))
.forEach(copyInstanceOption)
Object.keys(INSTANCE_DEFAULT_CONFIG_DEFINITIONS).forEach((source) =>
useInstanceStore().set({
value: config[source],
path: `prefsStorage.${source}`,
}),
)
useAuthFlowStore().setInitialStrategy(config.loginMethod)
}
@ -187,7 +195,7 @@ const getTOS = async ({ store }) => {
const res = await window.fetch('/static/terms-of-service.html')
if (res.ok) {
const html = await res.text()
useInstanceStore().set({ name: 'instanceIdentity.tos', value: html })
useInstanceStore().set({ path: 'instanceIdentity.tos', value: html })
} else {
throw res
}
@ -272,7 +280,7 @@ const getNodeInfo = async ({ store }) => {
const metadata = data.metadata
const features = metadata.features
useInstanceStore().set({
path: 'name',
path: 'instanceIdentity.name',
value: metadata.nodeName,
})
useInstanceStore().set({
@ -523,6 +531,11 @@ const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => {
useInterfaceStore().setLayoutWidth(windowWidth())
useInterfaceStore().setLayoutHeight(windowHeight())
window.syncConfig = useSyncConfigStore()
window.mergedConfig = useMergedConfigStore()
window.localConfig = useLocalConfigStore()
window.highlightConfig = useUserHighlightStore()
FaviconService.initFaviconService()
initServiceWorker(store)
@ -533,7 +546,7 @@ const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => {
typeof overrides.target !== 'undefined'
? overrides.target
: window.location.origin
useInstanceStore().set({ name: 'server', value: server })
useInstanceStore().set({ path: 'server', value: server })
await setConfig({ store })
try {
@ -547,7 +560,7 @@ const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => {
return Promise.reject(e)
}
applyStyleConfig(store.state.config, i18n.global)
applyStyleConfig(useMergedConfigStore().mergedConfig, i18n.global)
// Now we can try getting the server settings and logging in
// Most of these are preloaded into the index.html so blocking is minimized

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

@ -5,6 +5,7 @@ import StaffPanel from '../staff_panel/staff_panel.vue'
import TermsOfServicePanel from '../terms_of_service_panel/terms_of_service_panel.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
const About = {
components: {
@ -21,7 +22,7 @@ const About = {
showInstanceSpecificPanel() {
return (
useInstanceStore().instanceIdentity.showInstanceSpecificPanel &&
!this.$store.getters.mergedConfig.hideISP &&
!useMergedConfigStore().mergedConfig.hideISP &&
useInstanceStore().instanceIdentity.instanceSpecificPanelContent
)
},

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

@ -7,6 +7,7 @@ import Popover from '../popover/popover.vue'
import ProgressButton from '../progress_button/progress_button.vue'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useReportsStore } from 'src/stores/reports'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -89,10 +90,10 @@ const AccountActions = {
},
computed: {
shouldConfirmBlock() {
return this.$store.getters.mergedConfig.modalOnBlock
return useMergedConfigStore().mergedConfig.modalOnBlock
},
shouldConfirmRemoveUserFromFollowers() {
return this.$store.getters.mergedConfig.modalOnRemoveUserFromFollowers
return useMergedConfigStore().mergedConfig.modalOnRemoveUserFromFollowers
},
...mapState(useInstanceCapabilitiesStore, [
'blockExpiration',

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

@ -1,4 +1,4 @@
import { mapGetters } from 'vuex'
import { mapState } from 'pinia'
import nsfwImage from '../../assets/nsfw.png'
import Flash from '../flash/flash.vue'
@ -8,6 +8,7 @@ import VideoAttachment from '../video_attachment/video_attachment.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useMediaViewerStore } from 'src/stores/media_viewer'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -57,8 +58,8 @@ const Attachment = {
localDescription: this.description || this.attachment.description,
nsfwImage:
useInstanceStore().instanceIdentity.nsfwCensorImage || nsfwImage,
hideNsfwLocal: this.$store.getters.mergedConfig.hideNsfw,
preloadImage: this.$store.getters.mergedConfig.preloadImage,
hideNsfwLocal: useMergedConfigStore().mergedConfig.hideNsfw,
preloadImage: useMergedConfigStore().mergedConfig.preloadImage,
loading: false,
img: this.attachment.type === 'image' && document.createElement('img'),
modalOpen: false,
@ -90,7 +91,7 @@ const Attachment = {
return this.size === 'hide'
},
useContainFit() {
return this.$store.getters.mergedConfig.useContainFit
return this.mergedConfig.useContainFit
},
placeholderName() {
if (this.attachment.description === '' || !this.attachment.description) {
@ -133,7 +134,7 @@ const Attachment = {
videoTag() {
return this.useModal ? 'button' : 'span'
},
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
},
watch: {
'attachment.description'(newVal) {
@ -186,7 +187,8 @@ const Attachment = {
if (
this.mergedConfig.useOneClickNsfw &&
!this.showHidden &&
(this.attachment.type !== 'video' || this.mergedConfig.playVideosInModal)
(this.attachment.type !== 'video' ||
this.mergedConfig.playVideosInModal)
) {
this.openModal(event)
return

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

@ -25,9 +25,7 @@ const ChatListItem = {
return
}
const types = this.chat.lastMessage.attachments.map((file) =>
file.type,
)
const types = this.chat.lastMessage.attachments.map((file) => file.type)
if (types.includes('video')) {
return this.$t('file_type.video')
} else if (types.includes('audio')) {

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

@ -12,6 +12,7 @@ import UserAvatar from '../user_avatar/user_avatar.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faEllipsisH, faTimes } from '@fortawesome/free-solid-svg-icons'
@ -85,7 +86,7 @@ const ChatMessage = {
return { left: 50 }
}
},
...mapGetters(['mergedConfig', 'findUser']),
...mapPiniaState(useMergedConfigStore, ['mergedConfig', 'findUser']),
},
data() {
return {

6
src/components/confirm_modal/mute_confirm.js
View file

@ -1,8 +1,10 @@
import { mapGetters } from 'vuex'
import { mapState } from 'pinia'
import Select from 'src/components/select/select.vue'
import ConfirmModal from './confirm_modal.vue'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
export default {
props: ['type', 'user', 'status'],
emits: ['hide', 'show', 'muted'],
@ -43,7 +45,7 @@ export default {
}
}
},
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
},
methods: {
optionallyPrompt() {

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

@ -1,6 +1,6 @@
import { clone, filter, findIndex, get, reduce } from 'lodash'
import { mapState as mapPiniaState } from 'pinia'
import { mapGetters, mapState } from 'vuex'
import { mapState } from 'vuex'
import { WSConnectionStatus } from '../../services/api/api.service.js'
import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue'
@ -9,6 +9,7 @@ import Status from '../status/status.vue'
import ThreadTree from '../thread_tree/thread_tree.vue'
import { useInterfaceStore } from 'src/stores/interface'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -81,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 = this.mergedConfig.maxDepthInThread - 2
return maxDepth >= 1 ? maxDepth : 1
},
streamingEnabled() {
@ -91,22 +92,22 @@ const conversation = {
)
},
displayStyle() {
return this.$store.getters.mergedConfig.conversationDisplay
return this.mergedConfig.conversationDisplay
},
isTreeView() {
return !this.isLinearView
},
treeViewIsSimple() {
return !this.$store.getters.mergedConfig.conversationTreeAdvanced
return !this.mergedConfig.conversationTreeAdvanced
},
isLinearView() {
return this.displayStyle === 'linear'
},
shouldFadeAncestors() {
return this.$store.getters.mergedConfig.conversationTreeFadeAncestors
return this.mergedConfig.conversationTreeFadeAncestors
},
otherRepliesButtonPosition() {
return this.$store.getters.mergedConfig.conversationOtherRepliesButton
return this.mergedConfig.conversationOtherRepliesButton
},
showOtherRepliesButtonBelowStatus() {
return this.otherRepliesButtonPosition === 'below'
@ -392,7 +393,7 @@ const conversation = {
maybeHighlight() {
return this.isExpanded ? this.highlight : null
},
...mapGetters(['mergedConfig']),
...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
...mapState({
mastoUserSocketStatus: (state) => state.api.mastoUserSocketStatus,
}),

64
src/components/conversation/conversation.vue
View file

@ -88,38 +88,34 @@
class="thread-ancestor"
:class="{'thread-ancestor-has-other-replies': getReplies(status.id).length > 1, '-faded': shouldFadeAncestors}"
>
<status
<Status
ref="statusComponent"
:inline-expanded="collapsable && isExpanded"
:statusoid="status"
:expandable="!isExpanded"
:show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
:focused="isFocused(status.id)"
:in-conversation="isExpanded"
:highlight="getHighlight()"
:replies="getReplies(status.id)"
:in-profile="inProfile"
:profile-user-id="profileUserId"
class="conversation-status status-fadein panel-body"
:statusoid="status"
:replies="getReplies(status.id)"
:expandable="!isExpanded"
:focused="isFocused(status.id)"
:highlight="getHighlight()"
:inline-expanded="collapsable && isExpanded"
:show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
:in-profile="inProfile"
:in-conversation="isExpanded"
:profile-user-id="profileUserId"
:simple-tree="treeViewIsSimple"
:toggle-thread-display="toggleThreadDisplay"
:thread-display-status="threadDisplayStatus"
:show-thread-recursively="showThreadRecursively"
:total-reply-count="totalReplyCount"
:total-reply-depth="totalReplyDepth"
:show-other-replies-as-button="showOtherRepliesButtonInsideStatus"
:dive="() => diveIntoStatus(status.id)"
:controlled-showing-tall="statusContentProperties[status.id].showingTall"
:controlled-expanding-subject="statusContentProperties[status.id].expandingSubject"
:controlled-showing-long-subject="statusContentProperties[status.id].showingLongSubject"
:controlled-replying="statusContentProperties[status.id].replying"
:controlled-media-playing="statusContentProperties[status.id].mediaPlaying"
:controlled-toggle-showing-tall="() => toggleStatusContentProperty(status.id, 'showingTall')"
:controlled-expanding-subject="statusContentProperties[status.id].expandingSubject"
:controlled-toggle-expanding-subject="() => toggleStatusContentProperty(status.id, 'expandingSubject')"
:controlled-showing-long-subject="statusContentProperties[status.id].showingLongSubject"
:controlled-toggle-showing-long-subject="() => toggleStatusContentProperty(status.id, 'showingLongSubject')"
:controlled-replying="statusContentProperties[status.id].replying"
:controlled-toggle-replying="() => toggleStatusContentProperty(status.id, 'replying')"
:controlled-media-playing="statusContentProperties[status.id].mediaPlaying"
:controlled-set-media-playing="(newVal) => toggleStatusContentProperty(status.id, 'mediaPlaying', newVal)"
@goto="setHighlight"
@ -195,26 +191,18 @@
v-for="status in conversation"
:key="status.id"
ref="statusComponent"
:inline-expanded="collapsable && isExpanded"
:statusoid="status"
:expandable="!isExpanded"
:show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
:focused="isFocused(status.id)"
:in-conversation="isExpanded"
:highlight="getHighlight()"
:replies="getReplies(status.id)"
:in-profile="inProfile"
:profile-user-id="profileUserId"
class="conversation-status status-fadein panel-body"
:statusoid="status"
:replies="getReplies(status.id)"
:toggle-thread-display="toggleThreadDisplay"
:thread-display-status="threadDisplayStatus"
:show-thread-recursively="showThreadRecursively"
:total-reply-count="totalReplyCount"
:total-reply-depth="totalReplyDepth"
:status-content-properties="statusContentProperties"
:set-status-content-property="setStatusContentProperty"
:toggle-status-content-property="toggleStatusContentProperty"
:expandable="!isExpanded"
:focused="isFocused(status.id)"
:highlight="getHighlight()"
:inline-expanded="collapsable && isExpanded"
:show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
:in-profile="inProfile"
:in-conversation="isExpanded"
:profile-user-id="profileUserId"
@goto="setHighlight"
@toggle-expanded="toggleExpanded"

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

@ -5,6 +5,7 @@ import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -96,7 +97,7 @@ export default {
return this.$store.state.users.currentUser
},
shouldConfirmLogout() {
return this.$store.getters.mergedConfig.modalOnLogout
return useMergedConfigStore().mergedConfig.modalOnLogout
},
},
methods: {

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

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

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

@ -6,6 +6,8 @@ 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 { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faPollH } from '@fortawesome/free-solid-svg-icons'
@ -62,7 +64,7 @@ const Draft = {
: undefined
},
localCollapseSubjectDefault() {
return this.$store.getters.mergedConfig.collapseMessageWithSubject
return useMergedConfigStore().mergedConfig.collapseMessageWithSubject
},
nsfwClickthrough() {
if (!this.draft.nsfw) {

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

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

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

@ -9,6 +9,8 @@ import genRandomSeed from '../../services/random_seed/random_seed.service.js'
import EmojiPicker from '../emoji_picker/emoji_picker.vue'
import UnicodeDomainIndicator from '../unicode_domain_indicator/unicode_domain_indicator.vue'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faSmileBeam } from '@fortawesome/free-regular-svg-icons'
@ -131,10 +133,10 @@ const EmojiInput = {
},
computed: {
padEmoji() {
return this.$store.getters.mergedConfig.padEmoji
return useMergedConfigStore().mergedConfig.padEmoji
},
defaultCandidateIndex() {
return this.$store.getters.mergedConfig.autocompleteSelect ? 0 : -1
return useMergedConfigStore().mergedConfig.autocompleteSelect ? 0 : -1
},
preText() {
return this.modelValue.slice(0, this.caret)
@ -163,7 +165,7 @@ const EmojiInput = {
},
languages() {
return ensureFinalFallback(
this.$store.getters.mergedConfig.interfaceLanguage,
useMergedConfigStore().mergedConfig.interfaceLanguage,
)
},
maybeLocalizedEmojiNamesAndKeywords() {

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

@ -1,3 +1,5 @@
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:

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

@ -8,6 +8,7 @@ import StillImage from '../still-image/still-image.vue'
import { useEmojiStore } from 'src/stores/emoji.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -340,7 +341,7 @@ const EmojiPicker = {
this.$nextTick(() => {
this.updateEmojiSize()
})
return this.$store.getters.mergedConfig.fontSize
return useMergedConfigStore().mergedConfig.fontSize
},
emojiHeight() {
return this.emojiSize
@ -405,7 +406,7 @@ const EmojiPicker = {
},
languages() {
return ensureFinalFallback(
this.$store.getters.mergedConfig.interfaceLanguage,
useMergedConfigStore().mergedConfig.interfaceLanguage,
)
},
maybeLocalizedEmojiName() {

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

@ -2,6 +2,8 @@ import StillImage from 'src/components/still-image/still-image.vue'
import UserAvatar from '../user_avatar/user_avatar.vue'
import UserListPopover from '../user_list_popover/user_list_popover.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faCheck, faMinus, faPlus } from '@fortawesome/free-solid-svg-icons'
@ -42,7 +44,7 @@ const EmojiReactions = {
return !!this.$store.state.users.currentUser
},
remoteInteractionLink() {
return this.$store.getters.remoteInteractionLink({
return useInstanceStore().getRemoteInteractionLink({
statusId: this.status.id,
})
},

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

@ -3,6 +3,8 @@ import { mapGetters } from 'vuex'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -51,18 +53,19 @@ const ExtraNotifications = {
currentUser() {
return this.$store.state.users.currentUser
},
...mapGetters(['unreadChatCount', 'followRequestCount', 'mergedConfig']),
...mapGetters(['unreadChatCount', 'followRequestCount']),
...mapPiniaState(useAnnouncementsStore, {
unreadAnnouncementCount: 'unreadAnnouncementCount',
}),
...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
},
methods: {
openNotificationSettings() {
return useInterfaceStore().openSettingsModalTab('notifications')
},
dismissConfigurationTip() {
return this.$store.dispatch('setOption', {
name: 'showExtraNotificationsTip',
return useSyncConfigStore().setSimplePrefAndSave({
path: 'showExtraNotificationsTip',
value: false,
})
},

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

@ -15,7 +15,7 @@ const FeaturesPanel = {
'mediaProxyAvailable',
]),
...mapState(useInstanceStore, {
textlimit: (store) => store.limits.textlimit,
textLimit: (store) => store.limits.textLimit,
uploadlimit: (store) =>
fileSizeFormatService.fileSizeFormat(store.limits.uploadlimit),
}),

2
src/components/features_panel/features_panel.vue
View file

@ -24,7 +24,7 @@
{{ $t('features_panel.media_proxy') }}
</li>
<li>{{ $t('features_panel.scope_options') }}</li>
<li>{{ $t('features_panel.text_limit') }} = {{ textlimit }}</li>
<li>{{ $t('features_panel.text_limit') }} = {{ textLimit }}</li>
<li>{{ $t('features_panel.upload_limit') }} = {{ uploadlimit.num }} {{ $t('upload.file_size_units.' + uploadlimit.unit) }}</li>
</ul>
</div>

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

@ -3,6 +3,8 @@ import {
requestUnfollow,
} from '../../services/follow_manipulate/follow_manipulate'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
export default {
props: ['relationship', 'user', 'labelFollowing', 'buttonClass'],
components: {
@ -16,7 +18,7 @@ export default {
},
computed: {
shouldConfirmUnfollow() {
return this.$store.getters.mergedConfig.modalOnUnfollow
return useMergedConfigStore().mergedConfig.modalOnUnfollow
},
isPressed() {
return this.inProgress || this.relationship.following

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

@ -2,6 +2,8 @@ import { notificationsFromStore } from '../../services/notification_utils/notifi
import BasicUserCard from '../basic_user_card/basic_user_card.vue'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
const FollowRequestCard = {
props: ['user'],
components: {
@ -76,7 +78,7 @@ const FollowRequestCard = {
},
computed: {
mergedConfig() {
return this.$store.getters.mergedConfig
return useMergedConfigStore().mergedConfig
},
shouldConfirmApprove() {
return this.mergedConfig.modalOnApproveFollow

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

@ -1,5 +1,6 @@
import Checkbox from 'src/components/checkbox/checkbox.vue'
import Popover from 'src/components/popover/popover.vue'
import LocalSettingIndicator from 'src/components/settings_modal/helpers/local_setting_indicator.vue'
import Select from '../select/select.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
@ -18,6 +19,7 @@ export default {
Select,
Checkbox,
Popover,
LocalSettingIndicator,
},
props: ['name', 'label', 'modelValue', 'fallback', 'options', 'no-inherit'],
mounted() {
@ -43,7 +45,7 @@ export default {
},
computed: {
present() {
return typeof this.modelValue !== 'undefined'
return this.modelValue != null
},
localFontsList() {
return useInterfaceStore().localFonts

4
src/components/font_control/font_control.vue
View file

@ -6,8 +6,10 @@
:id="name + '-o'"
class="font-checkbox setting-control setting-label"
:model-value="present"
@change="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
@change="$emit('update:modelValue', modelValue == null ? fallback : null)"
>
<LocalSettingIndicator />
{{ ' ' }}
<i18n-t
scope="global"
keypath="settings.style.fonts.override"

2
src/components/gallery/gallery.js
View file

@ -4,7 +4,7 @@ import Attachment from '../attachment/attachment.vue'
import { useMediaViewerStore } from 'src/stores/media_viewer.js'
const displayTypes = new Set(["image", "video", "flash"])
const displayTypes = new Set(['image', 'video', 'flash'])
const Gallery = {
props: [

2
src/components/interface_language_switcher/interface_language_switcher.js
View file

@ -1,13 +1,11 @@
import { v4 as uuidv4 } from 'uuid'
import ProfileSettingIndicator from 'src/components/settings_modal/helpers/profile_setting_indicator.vue'
import localeService from '../../services/locale/locale.service.js'
import Select from '../select/select.vue'
export default {
components: {
Select,
ProfileSettingIndicator,
},
props: {
// List of languages (or just one language)

6
src/components/link-preview/link-preview.js
View file

@ -1,4 +1,6 @@
import { mapGetters } from 'vuex'
import { mapState } from 'pinia'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
const LinkPreview = {
name: 'LinkPreview',
@ -24,7 +26,7 @@ const LinkPreview = {
hideNsfwConfig() {
return this.mergedConfig.hideNsfw
},
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
},
created() {
if (this.useImage) {

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

@ -124,11 +124,10 @@ const ListsNew = {
useListsStore()
.createList({ title: this.titleDraft })
.then((list) => {
useListsStore()
.setListAccounts({
listId: list.id,
accountIds: [...this.addedUserIds],
})
useListsStore().setListAccounts({
listId: list.id,
accountIds: [...this.addedUserIds],
})
return list.id
})
.then((listId) => {

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

@ -2,6 +2,7 @@ import fileSizeFormatService from '../../services/file_size_format/file_size_for
import statusPosterService from '../../services/status_poster/status_poster.service.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faCircleNotch, faUpload } from '@fortawesome/free-solid-svg-icons'
@ -33,7 +34,7 @@ const mediaUpload = {
}
// Skip if image compression is disabled
if (!this.$store.getters.mergedConfig.imageCompression) {
if (!useMergedConfigStore().mergedConfig.imageCompression) {
return file
}
@ -78,7 +79,7 @@ const mediaUpload = {
// Convert to WebP if supported and alwaysUseJpeg is false, otherwise JPEG
const type =
!this.$store.getters.mergedConfig.alwaysUseJpeg && supportsWebP
!useMergedConfigStore().mergedConfig.alwaysUseJpeg && supportsWebP
? 'image/webp'
: 'image/jpeg'
const extension = type === 'image/webp' ? '.webp' : '.jpg'

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

@ -1,3 +1,4 @@
import { mapState as mapPiniaState } from 'pinia'
import { defineAsyncComponent } from 'vue'
import { mapGetters, mapState } from 'vuex'
@ -8,6 +9,9 @@ import {
import UnicodeDomainIndicator from '../unicode_domain_indicator/unicode_domain_indicator.vue'
import UserAvatar from '../user_avatar/user_avatar.vue'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useUserHighlightStore } from 'src/stores/user_highlight.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -97,23 +101,23 @@ const MentionLink = {
userNameFullUi() {
return this.user && this.user.screen_name_ui
},
highlight() {
return this.user && this.mergedConfig.highlight[this.user.screen_name]
highlightData() {
return this.highlight[this.user?.screen_name]
},
highlightType() {
return this.highlight && '-' + this.highlight.type
return this.highlightData && '-' + this.highlightData.type
},
highlightClass() {
if (this.highlight) return highlightClass(this.user)
return this.highlightData && highlightClass(this.user)
},
style() {
if (this.highlight) {
if (this.highlightData) {
const {
backgroundColor,
backgroundPosition,
backgroundImage,
...rest
} = highlightStyle(this.highlight)
} = highlightStyle(this.highlightData)
return rest
}
},
@ -121,7 +125,7 @@ const MentionLink = {
return [
{
'-you': this.isYou && this.shouldBoldenYou,
'-highlighted': this.highlight,
'-highlighted': !!this.highlightData,
'-has-selection': this.hasSelection,
},
this.highlightType,
@ -156,7 +160,8 @@ const MentionLink = {
shouldFadeDomain() {
return this.mergedConfig.mentionLinkFadeDomain
},
...mapGetters(['mergedConfig']),
...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
...mapPiniaState(useUserHighlightStore, ['highlight']),
...mapState({
currentUser: (state) => state.users.currentUser,
}),

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

@ -1,7 +1,9 @@
import { mapGetters } from 'vuex'
import { mapState } from 'pinia'
import MentionLink from 'src/components/mention_link/mention_link.vue'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
export const MENTIONS_LIMIT = 5
const MentionsLine = {
@ -26,7 +28,7 @@ const MentionsLine = {
manyMentions() {
return this.extraMentions.length > 0
},
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
},
methods: {
toggleShowMore() {

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

@ -13,7 +13,7 @@ import SideDrawer from '../side_drawer/side_drawer.vue'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -52,11 +52,19 @@ const MobileNav = {
return this.$store.state.users.currentUser
},
unseenNotifications() {
return unseenNotificationsFromStore(this.$store)
return unseenNotificationsFromStore(
this.$store,
useMergedConfigStore().mergedConfig.notificationVisibility,
useMergedConfigStore().mergedConfig.ignoreInactionableSeen,
)
},
unseenNotificationsCount() {
return (
this.unseenNotifications.length + countExtraNotifications(this.$store)
this.unseenNotifications.length +
countExtraNotifications(
this.$store,
useMergedConfigStore().mergedConfig,
)
)
},
unseenCount() {
@ -75,15 +83,15 @@ const MobileNav = {
return this.$route.name === 'chat'
},
...mapState(useAnnouncementsStore, ['unreadAnnouncementCount']),
...mapState(useServerSideStorageStore, {
...mapState(useMergedConfigStore, {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems).has('chats'),
}),
shouldConfirmLogout() {
return this.$store.getters.mergedConfig.modalOnLogout
return useMergedConfigStore().mergedConfig.modalOnLogout
},
closingDrawerMarksAsSeen() {
return this.$store.getters.mergedConfig.closingDrawerMarksAsSeen
return useMergedConfigStore().mergedConfig.closingDrawerMarksAsSeen
},
...mapGetters(['unreadChatCount']),
},

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

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

39
src/components/mrf_transparency_panel/mrf_transparency_panel.js
View file

@ -1,5 +1,6 @@
import { get } from 'lodash'
import { mapState } from 'vuex'
import { mapState } from 'pinia'
import { useInstanceStore } from 'src/stores/instance.js'
/**
* This is for backwards compatibility. We originally didn't recieve
@ -18,64 +19,64 @@ const toInstanceReasonObject = (instances, info, key) => {
const MRFTransparencyPanel = {
computed: {
...mapState({
federationPolicy: (state) => get(state, 'instance.federationPolicy'),
...mapState(useInstanceStore, {
federationPolicy: (state) => state.federationPolicy,
mrfPolicies: (state) =>
get(state, 'instance.federationPolicy.mrf_policies', []),
get(state, 'federationPolicy.mrf_policies', []),
quarantineInstances: (state) =>
toInstanceReasonObject(
get(state, 'instance.federationPolicy.quarantined_instances', []),
get(state, 'federationPolicy.quarantined_instances', []),
get(
state,
'instance.federationPolicy.quarantined_instances_info',
'federationPolicy.quarantined_instances_info',
[],
),
'quarantined_instances',
),
acceptInstances: (state) =>
toInstanceReasonObject(
get(state, 'instance.federationPolicy.mrf_simple.accept', []),
get(state, 'instance.federationPolicy.mrf_simple_info', []),
get(state, 'federationPolicy.mrf_simple.accept', []),
get(state, 'federationPolicy.mrf_simple_info', []),
'accept',
),
rejectInstances: (state) =>
toInstanceReasonObject(
get(state, 'instance.federationPolicy.mrf_simple.reject', []),
get(state, 'instance.federationPolicy.mrf_simple_info', []),
get(state, 'federationPolicy.mrf_simple.reject', []),
get(state, 'federationPolicy.mrf_simple_info', []),
'reject',
),
ftlRemovalInstances: (state) =>
toInstanceReasonObject(
get(
state,
'instance.federationPolicy.mrf_simple.federated_timeline_removal',
'federationPolicy.mrf_simple.federated_timeline_removal',
[],
),
get(state, 'instance.federationPolicy.mrf_simple_info', []),
get(state, 'federationPolicy.mrf_simple_info', []),
'federated_timeline_removal',
),
mediaNsfwInstances: (state) =>
toInstanceReasonObject(
get(state, 'instance.federationPolicy.mrf_simple.media_nsfw', []),
get(state, 'instance.federationPolicy.mrf_simple_info', []),
get(state, 'federationPolicy.mrf_simple.media_nsfw', []),
get(state, 'federationPolicy.mrf_simple_info', []),
'media_nsfw',
),
mediaRemovalInstances: (state) =>
toInstanceReasonObject(
get(state, 'instance.federationPolicy.mrf_simple.media_removal', []),
get(state, 'instance.federationPolicy.mrf_simple_info', []),
get(state, 'federationPolicy.mrf_simple.media_removal', []),
get(state, 'federationPolicy.mrf_simple_info', []),
'media_removal',
),
keywordsFtlRemoval: (state) =>
get(
state,
'instance.federationPolicy.mrf_keyword.federated_timeline_removal',
'federationPolicy.mrf_keyword.federated_timeline_removal',
[],
),
keywordsReject: (state) =>
get(state, 'instance.federationPolicy.mrf_keyword.reject', []),
get(state, 'federationPolicy.mrf_keyword.reject', []),
keywordsReplace: (state) =>
get(state, 'instance.federationPolicy.mrf_keyword.replace', []),
get(state, 'federationPolicy.mrf_keyword.replace', []),
}),
hasInstanceSpecificPolicies() {
return (

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

@ -12,7 +12,7 @@ import NavigationPins from 'src/components/navigation/navigation_pins.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -84,28 +84,28 @@ const NavPanel = {
this.editMode = !this.editMode
},
toggleCollapse() {
useServerSideStorageStore().setPreference({
path: 'simple.collapseNav',
useSyncConfigStore().setSimplePrefAndSave({
path: '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: {
@ -122,7 +122,7 @@ const NavPanel = {
...mapPiniaState(useInstanceStore, {
privateMode: (store) => store.private,
}),
...mapPiniaState(useServerSideStorageStore, {
...mapPiniaState(useSyncConfigStore, {
collapsed: (store) => store.prefsStorage.simple.collapseNav,
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems),

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

@ -5,7 +5,7 @@ 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.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faThumbtack } from '@fortawesome/free-solid-svg-icons'
@ -23,17 +23,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: {
@ -47,7 +47,7 @@ const NavigationEntry = {
...mapState({
currentUser: (state) => state.users.currentUser,
}),
...mapPiniaState(useServerSideStorageStore, {
...mapPiniaState(useSyncConfigStore, {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems),
}),

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

@ -18,7 +18,7 @@ import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useListsStore } from 'src/stores/lists'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -70,7 +70,7 @@ const NavPanel = {
...mapPiniaState(useBookmarkFoldersStore, {
bookmarks: getBookmarkFolderEntries,
}),
...mapPiniaState(useServerSideStorageStore, {
...mapPiniaState(useSyncConfigStore, {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems),
}),

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

@ -17,6 +17,8 @@ import UserLink from '../user_link/user_link.vue'
import UserPopover from '../user_popover/user_popover.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useUserHighlightStore } from 'src/stores/user_highlight.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
@ -181,9 +183,8 @@ const Notification = {
return highlightClass(this.notification.from_profile)
},
userStyle() {
const highlight = this.$store.getters.mergedConfig.highlight
const user = this.notification.from_profile
return highlightStyle(highlight[user.screen_name])
const user = this.notification.from_profile.screen_name
return highlightStyle(useUserHighlightStore().get(user))
},
expandable() {
return new Set(['like', 'pleroma:emoji_reaction', 'repeat', 'poll']).has(
@ -209,7 +210,7 @@ const Notification = {
return isStatusNotification(this.notification.type)
},
mergedConfig() {
return this.$store.getters.mergedConfig
return useMergedConfigStore().mergedConfig
},
shouldConfirmApprove() {
return this.mergedConfig.modalOnApproveFollow

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

@ -108,6 +108,9 @@
<script>
import Popover from '../popover/popover.vue'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faFilter } from '@fortawesome/free-solid-svg-icons'
@ -117,13 +120,13 @@ export default {
components: { Popover },
computed: {
filters() {
return this.$store.getters.mergedConfig.notificationVisibility
return useMergedConfigStore().mergedConfig.notificationVisibility
},
},
methods: {
toggleNotificationFilter(type) {
this.$store.dispatch('setOption', {
name: 'notificationVisibility',
useSyncConfigStore().setSimplePrefAndSave({
path: 'notificationVisibility',
value: {
...this.filters,
[type]: !this.filters[type],

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

@ -17,6 +17,7 @@ import NotificationFilters from './notification_filters.vue'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -75,20 +76,29 @@ const Notifications = {
return this.$store.state.notifications.error
},
unseenNotifications() {
return unseenNotificationsFromStore(this.$store)
return unseenNotificationsFromStore(
this.$store,
useMergedConfigStore().mergedConfig.notificationVisibility,
)
},
filteredNotifications() {
if (this.unseenAtTop) {
return [
...filteredNotificationsFromStore(this.$store).filter((n) =>
this.shouldShowUnseen(n),
),
...filteredNotificationsFromStore(this.$store).filter(
(n) => !this.shouldShowUnseen(n),
),
...filteredNotificationsFromStore(
this.$store,
useMergedConfigStore().mergedConfig.notificationVisibility,
).filter((n) => this.shouldShowUnseen(n)),
...filteredNotificationsFromStore(
this.$store,
useMergedConfigStore().mergedConfig.notificationVisibility,
).filter((n) => !this.shouldShowUnseen(n)),
]
} else {
return filteredNotificationsFromStore(this.$store, this.filterMode)
return filteredNotificationsFromStore(
this.$store,
useMergedConfigStore().mergedConfig.notificationVisibility,
this.filterMode,
)
}
},
unseenCountBadgeText() {
@ -98,10 +108,13 @@ const Notifications = {
return this.unseenNotifications.length
},
ignoreInactionableSeen() {
return this.$store.getters.mergedConfig.ignoreInactionableSeen
return useMergedConfigStore().mergedConfig.ignoreInactionableSeen
},
extraNotificationsCount() {
return countExtraNotifications(this.$store)
return countExtraNotifications(
this.$store,
useMergedConfigStore().mergedConfig,
)
},
unseenCountTitle() {
return (
@ -136,10 +149,10 @@ const Notifications = {
)
},
noSticky() {
return this.$store.getters.mergedConfig.disableStickyHeaders
return useMergedConfigStore().mergedConfig.disableStickyHeaders
},
unseenAtTop() {
return this.$store.getters.mergedConfig.unseenAtTop
return useMergedConfigStore().mergedConfig.unseenAtTop
},
showExtraNotifications() {
return !this.noExtra

11
src/components/password_reset/password_reset.vue
View file

@ -61,15 +61,16 @@
</div>
<p
v-if="error"
class="alert error notice-dismissible"
class="alert error"
>
<span>{{ error }}</span>
<a
<button
class="fa-scale-110 fa-old-padding dismiss"
type="button"
@click.prevent="dismissError()"
>
<FAIcon icon="times" />
</a>
</button>
</p>
</div>
</form>
@ -117,10 +118,6 @@
margin: 0.3em 0 1em;
}
.notice-dismissible {
padding-right: 2rem;
}
.dismiss {
cursor: pointer;
}

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

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

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

@ -25,6 +25,8 @@ import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMediaViewerStore } from 'src/stores/media_viewer.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { pollFormToMasto } from 'src/services/poll/poll.service.js'
@ -170,7 +172,7 @@ const PostStatusForm = {
const preset = this.$route.query.message
let statusText = preset || ''
const { scopeCopy } = this.$store.getters.mergedConfig
const { scopeCopy } = useMergedConfigStore().mergedConfig
const [statusType, refId] = typeAndRefId({
replyTo: this.replyTo,
@ -200,7 +202,7 @@ const PostStatusForm = {
: this.$store.state.users.currentUser.default_scope
const { postContentType: contentType, sensitiveByDefault } =
this.$store.getters.mergedConfig
useMergedConfigStore().mergedConfig
statusParams = {
type: statusType,
@ -301,7 +303,7 @@ const PostStatusForm = {
return this.newStatus.spoilerText.length
},
statusLengthLimit() {
return useInstanceStore().textlimit
return useInstanceStore().limits.textLimit
},
hasStatusLengthLimit() {
return this.statusLengthLimit > 0
@ -335,7 +337,8 @@ const PostStatusForm = {
},
hideScopeNotice() {
return (
this.disableNotice || this.$store.getters.mergedConfig.hideScopeNotice
this.disableNotice ||
useMergedConfigStore().mergedConfig.hideScopeNotice
)
},
pollContentError() {
@ -420,7 +423,7 @@ const PostStatusForm = {
return this.newStatus.hasQuote && !this.newStatus.quote.thread
},
shouldAutoSaveDraft() {
return this.$store.getters.mergedConfig.autoSaveDraft
return useMergedConfigStore().mergedConfig.autoSaveDraft
},
autoSaveState() {
if (this.saveable) {
@ -453,7 +456,7 @@ const PostStatusForm = {
)
)
},
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
...mapState(useInterfaceStore, {
mobileLayout: (store) => store.mobileLayout,
}),
@ -879,8 +882,8 @@ const PostStatusForm = {
this.newStatus.hasQuote = !this.newStatus.hasQuote
},
dismissScopeNotice() {
this.$store.dispatch('setOption', {
name: 'hideScopeNotice',
useSyncConfigStore().setSimplePrefAndSave({
path: 'hideScopeNotice',
value: true,
})
},

1
src/components/post_status_form/post_status_form.scss
View file

@ -111,7 +111,6 @@
.visibility-notice {
border: 1px solid var(--border);
border-radius: var(--roundness);
padding: 0.5em 1em
}
.visibility-notice.edit-warning {

28
src/components/post_status_form/post_status_form.vue
View file

@ -9,20 +9,24 @@
@dragover.prevent="fileDrag"
>
<div class="form-group">
<i18n-t
<div
v-if="!$store.state.users.currentUser.locked && newStatus.visibility == 'private' && !disableLockWarning"
keypath="post_status.account_not_locked_warning"
tag="p"
class="visibility-notice"
scope="global"
class="visibility-notice notice-dismissible"
>
<button
class="button-unstyled -link"
@click="openProfileTab"
<i18n-t
keypath="post_status.account_not_locked_warning"
tag="p"
class=""
scope="global"
>
{{ $t('post_status.account_not_locked_warning_link') }}
</button>
</i18n-t>
<button
class="button-unstyled -link"
@click="openProfileTab"
>
{{ $t('post_status.account_not_locked_warning_link') }}
</button>
</i18n-t>
</div>
<p
v-if="!hideScopeNotice && newStatus.visibility === 'public'"
class="visibility-notice notice-dismissible"
@ -70,7 +74,7 @@
</p>
<p
v-else-if="newStatus.visibility === 'direct'"
class="visibility-notice"
class="visibility-notice notice-dismissible"
>
<span v-if="safeDMEnabled">{{ $t('post_status.direct_warning_to_first_only') }}</span>
<span v-else>{{ $t('post_status.direct_warning_to_all') }}</span>

44
src/components/quick_filter_settings/quick_filter_settings.js
View file

@ -1,9 +1,11 @@
import { mapState } from 'pinia'
import { mapGetters } from 'vuex'
import Popover from '../popover/popover.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useLocalConfigStore } from 'src/stores/local_config.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faFilter, faFont, faWrench } from '@fortawesome/free-solid-svg-icons'
@ -20,8 +22,8 @@ const QuickFilterSettings = {
},
methods: {
setReplyVisibility(visibility) {
this.$store.dispatch('setOption', {
name: 'replyVisibility',
useSyncConfigStore().setSimplePrefAndSave({
path: 'replyVisibility',
value: visibility,
})
this.$store.dispatch('queueFlushAll')
@ -31,7 +33,7 @@ const QuickFilterSettings = {
},
},
computed: {
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
...mapState(useInterfaceStore, {
mobileLayout: (state) => state.layoutType === 'mobile',
}),
@ -85,11 +87,13 @@ const QuickFilterSettings = {
this.mergedConfig.hideAttachmentsInConv
)
},
set() {
const value = !this.hideMedia
this.$store.dispatch('setOption', { name: 'hideAttachments', value })
this.$store.dispatch('setOption', {
name: 'hideAttachmentsInConv',
set(value) {
useLocalConfigStore().set({
path: 'hideAttachments',
value,
})
useLocalConfigStore().set({
path: 'hideAttachmentsInConv',
value,
})
},
@ -98,10 +102,9 @@ const QuickFilterSettings = {
get() {
return this.mergedConfig.hideFilteredStatuses
},
set() {
const value = !this.hideMutedPosts
this.$store.dispatch('setOption', {
name: 'hideFilteredStatuses',
set(value) {
useSyncConfigStore().setSimplePrefAndSave({
path: 'hideFilteredStatuses',
value,
})
},
@ -110,19 +113,20 @@ const QuickFilterSettings = {
get() {
return this.mergedConfig.muteBotStatuses
},
set() {
const value = !this.muteBotStatuses
this.$store.dispatch('setOption', { name: 'muteBotStatuses', value })
set(value) {
useSyncConfigStore().setSimplePrefAndSave({
path: 'muteBotStatuses',
value,
})
},
},
muteSensitiveStatuses: {
get() {
return this.mergedConfig.muteSensitiveStatuses
},
set() {
const value = !this.muteSensitiveStatuses
this.$store.dispatch('setOption', {
name: 'muteSensitiveStatuses',
set(value) {
useSyncConfigStore().setSimplePrefAndSave({
path: 'muteSensitiveStatuses',
value,
})
},

37
src/components/quick_view_settings/quick_view_settings.js
View file

@ -1,10 +1,11 @@
import { mapState } from 'pinia'
import { mapGetters } from 'vuex'
import Popover from 'src/components/popover/popover.vue'
import QuickFilterSettings from 'src/components/quick_filter_settings/quick_filter_settings.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -25,18 +26,12 @@ const QuickViewSettings = {
QuickFilterSettings,
},
methods: {
setConversationDisplay(visibility) {
this.$store.dispatch('setOption', {
name: 'conversationDisplay',
value: visibility,
})
},
openTab(tab) {
useInterfaceStore().openSettingsModalTab(tab)
},
},
computed: {
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
...mapState(useInterfaceStore, {
mobileLayout: (state) => state.layoutType === 'mobile',
}),
@ -47,8 +42,11 @@ const QuickViewSettings = {
get() {
return this.mergedConfig.conversationDisplay
},
set(newVal) {
this.setConversationDisplay(newVal)
set(value) {
useSyncConfigStore().setSimplePrefAndSave({
path: 'conversationDisplay',
value,
})
},
},
autoUpdate: {
@ -57,7 +55,7 @@ const QuickViewSettings = {
},
set() {
const value = !this.autoUpdate
this.$store.dispatch('setOption', { name: 'streaming', value })
useSyncConfigStore().setSimplePrefAndSave({ path: 'streaming', value })
},
},
collapseWithSubjects: {
@ -66,8 +64,8 @@ const QuickViewSettings = {
},
set() {
const value = !this.collapseWithSubjects
this.$store.dispatch('setOption', {
name: 'collapseMessageWithSubject',
useSyncConfigStore().setSimplePrefAndSave({
path: 'collapseMessageWithSubject',
value,
})
},
@ -78,8 +76,8 @@ const QuickViewSettings = {
},
set() {
const value = !this.showUserAvatars
this.$store.dispatch('setOption', {
name: 'mentionLinkShowAvatar',
useSyncConfigStore().setSimplePrefAndSave({
path: 'mentionLinkShowAvatar',
value,
})
},
@ -90,7 +88,10 @@ const QuickViewSettings = {
},
set() {
const value = !this.muteBotStatuses
this.$store.dispatch('setOption', { name: 'muteBotStatuses', value })
useSyncConfigStore().setSimplePrefAndSave({
path: 'muteBotStatuses',
value,
})
},
},
muteSensitiveStatuses: {
@ -99,8 +100,8 @@ const QuickViewSettings = {
},
set() {
const value = !this.muteSensitiveStatuses
this.$store.dispatch('setOption', {
name: 'muteSensitiveStatuses',
useSyncConfigStore().setSimplePrefAndSave({
path: 'muteSensitiveStatuses',
value,
})
},

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

@ -1,5 +1,7 @@
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
export default {
props: ['user', 'relationship'],
data() {
@ -20,7 +22,7 @@ export default {
}
},
shouldConfirmRemoveUserFromFollowers() {
return this.$store.getters.mergedConfig.modalOnRemoveUserFromFollowers
return useMergedConfigStore().mergedConfig.modalOnRemoveUserFromFollowers
},
},
methods: {

2
src/components/settings_modal/helpers/attachment_setting.vue
View file

@ -40,7 +40,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
</div>
<div v-if="!compact">{{ $t('settings.preview') }}</div>
<Attachment

2
src/components/settings_modal/helpers/boolean_setting.vue
View file

@ -18,7 +18,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
{{ ' ' }}
<template v-if="backendDescriptionLabel">
{{ backendDescriptionLabel }}

2
src/components/settings_modal/helpers/choice_setting.vue
View file

@ -9,7 +9,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
{{ ' ' }}
<template v-if="backendDescriptionLabel">
{{ backendDescriptionLabel }}

2
src/components/settings_modal/helpers/color_setting.vue
View file

@ -33,7 +33,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
<DraftButtons v-if="!hideDraftButtons" />
<p
v-if="backendDescriptionDescription"

2
src/components/settings_modal/helpers/group_setting.vue
View file

@ -7,7 +7,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
<DraftButtons />
</span>
</template>

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

@ -1,6 +1,8 @@
import Checkbox from 'src/components/checkbox/checkbox.vue'
import Setting from './setting.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
export default {
...Setting,
data() {
@ -43,7 +45,7 @@ export default {
if (this.forceNew) return true
if (!this.allowNew) return false
const isExpert = this.$store.state.config.expertLevel > 0
const isExpert = useMergedConfigStore().mergedConfig.expertLevel > 0
const hasBuiltins = this.builtinEntries.length > 0
if (hasBuiltins) {

2
src/components/settings_modal/helpers/list_setting.vue
View file

@ -75,7 +75,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
<DraftButtons />
</div>
</template>

1
src/components/settings_modal/helpers/list_tuple_setting.vue
View file

@ -77,7 +77,6 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<DraftButtons />
</div>
</template>

18
src/components/settings_modal/helpers/profile_setting_indicator.vue → src/components/settings_modal/helpers/local_setting_indicator.vue
View file

@ -1,7 +1,7 @@
<template>
<span
v-if="isProfile"
class="ProfileSettingIndicator"
v-if="isLocal"
class="LocalSettingIndicator"
>
<Popover
trigger="hover"
@ -9,13 +9,13 @@
<template #trigger>
&nbsp;
<FAIcon
icon="server"
:aria-label="$t('settings.setting_server_side')"
icon="desktop"
:aria-label="$t('settings.setting_local_side')"
/>
</template>
<template #content>
<div class="profilesetting-tooltip">
{{ $t('settings.setting_server_side') }}
{{ $t('settings.setting_local_side') }}
</div>
</template>
</Popover>
@ -26,18 +26,18 @@
import Popover from 'src/components/popover/popover.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faServer } from '@fortawesome/free-solid-svg-icons'
import { faDesktop } from '@fortawesome/free-solid-svg-icons'
library.add(faServer)
library.add(faDesktop)
export default {
components: { Popover },
props: ['isProfile'],
props: ['isLocal'],
}
</script>
<style lang="scss">
.ProfileSettingIndicator {
.LocalSettingIndicator {
display: inline-block;
position: relative;
}

2
src/components/settings_modal/helpers/map_setting.vue
View file

@ -77,7 +77,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
<DraftButtons />
</div>
</template>

14
src/components/settings_modal/helpers/number_setting.vue
View file

@ -9,6 +9,13 @@
class="setting-label"
:class="{ 'faint': shouldBeDisabled }"
>
<ModifiedIndicator
:changed="isChanged"
:onclick="reset"
/>
<LocalSettingIndicator :is-local="isLocalSetting" />
{{ ' ' }}
<DraftButtons v-if="!hideDraftButtons" />
<template v-if="backendDescriptionLabel">
{{ backendDescriptionLabel + ' ' }}
</template>
@ -29,13 +36,6 @@
:value="realDraftMode ? draft :state"
@change="update"
>
{{ ' ' }}
<ModifiedIndicator
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<DraftButtons v-if="!hideDraftButtons" />
<p
v-if="backendDescriptionDescription"
class="setting-description"

1
src/components/settings_modal/helpers/proxy_setting.vue
View file

@ -44,7 +44,6 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<DraftButtons v-if="!hideDraftButtons" />
<p
v-if="backendDescriptionDescription"

1
src/components/settings_modal/helpers/pwa_manifest_icons_setting.vue
View file

@ -11,7 +11,6 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
{{ ' ' }}
<template v-if="backendDescriptionLabel">
{{ backendDescriptionLabel + ' ' }}

2
src/components/settings_modal/helpers/rate_setting.vue
View file

@ -11,7 +11,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
{{ ' ' }}
<template v-if="backendDescriptionLabel">
{{ backendDescriptionLabel + ' ' }}

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

@ -1,14 +1,20 @@
import { cloneDeep, get, isEqual, set } from 'lodash'
import DraftButtons from './draft_buttons.vue'
import LocalSettingIndicator from './local_setting_indicator.vue'
import ModifiedIndicator from './modified_indicator.vue'
import ProfileSettingIndicator from './profile_setting_indicator.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useLocalConfigStore } from 'src/stores/local_config.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
export default {
components: {
ModifiedIndicator,
DraftButtons,
ProfileSettingIndicator,
LocalSettingIndicator,
},
props: {
modelValue: {
@ -43,6 +49,10 @@ export default {
type: Boolean,
default: false,
},
local: {
type: Boolean,
default: false,
},
parentPath: {
type: [String, Array],
},
@ -235,13 +245,14 @@ export default {
case 'admin':
return this.$store.state.adminSettings.config
default:
return this.$store.getters.mergedConfig
return useMergedConfigStore().mergedConfig
}
},
configSink() {
if (this.path == null) {
return (k, v) => this.$emit('update:modelValue', v)
}
switch (this.realSource) {
case 'profile':
return (k, v) =>
@ -250,15 +261,61 @@ export default {
return (k, v) =>
this.$store.dispatch('pushAdminSetting', { path: k, value: v })
default:
if (this.timedApplyMode) {
return (k, v) =>
this.$store.dispatch('setOptionTemporarily', {
name: k,
value: v,
})
} else {
return (k, v) =>
this.$store.dispatch('setOption', { name: k, value: v })
return (readPath, value) => {
const writePath = `${readPath}`
if (!this.timedApplyMode) {
if (this.local) {
useLocalConfigStore().set({
path: writePath,
value,
})
} else {
useSyncConfigStore().setSimplePrefAndSave({
path: writePath,
value,
})
}
} else {
if (useInterfaceStore().temporaryChangesTimeoutId !== null) {
console.error("Can't track more than one temporary change")
return
}
const oldValue = get(this.configSource, readPath)
if (this.local) {
useLocalConfigStore().setTemporarily({ path: writePath, value })
} else {
useSyncConfigStore().setPreference({ path: writePath, value })
}
const confirm = () => {
if (this.local) {
useLocalConfigStore().set({ path: writePath, value })
} else {
useSyncConfigStore().pushSyncConfig()
}
useInterfaceStore().clearTemporaryChanges()
}
const revert = () => {
if (this.local) {
useLocalConfigStore().unsetTemporarily({
path: writePath,
value,
})
} else {
useSyncConfigStore().setPreference({
path: writePath,
value: oldValue,
})
}
useInterfaceStore().clearTemporaryChanges()
}
useInterfaceStore().setTemporaryChanges({ confirm, revert })
}
}
}
},
@ -266,13 +323,17 @@ export default {
switch (this.realSource) {
case 'profile':
return {}
default:
return get(this.$store.getters.defaultConfig, this.path)
default: {
return get(useMergedConfigStore().mergedConfigDefault, this.path)
}
}
},
isProfileSetting() {
return this.realSource === 'profile'
},
isLocalSetting() {
return this.local
},
isChanged() {
if (this.path == null) return false
switch (this.realSource) {
@ -318,7 +379,8 @@ export default {
},
matchesExpertLevel() {
const settingExpertLevel = this.expert || 0
const userToggleExpert = this.$store.state.config.expertLevel || 0
const userToggleExpert =
useMergedConfigStore().mergedConfig.expertLevel || 0
return settingExpertLevel <= userToggleExpert
},
@ -344,7 +406,7 @@ export default {
this.draft = cloneDeep(this.state)
} else {
set(
this.$store.getters.mergedConfig,
useMergedConfigStore().mergedConfig,
this.path,
cloneDeep(this.defaultState),
)

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

@ -1,19 +1,18 @@
import { mapState as mapPiniaState } from 'pinia'
import { mapState } from 'vuex'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
const SharedComputedObject = () => ({
user() {
return this.$store.state.users.currentUser
},
expertLevel() {
return this.$store.getters.mergedConfig.expertLevel > 0
},
mergedConfig() {
return this.$store.getters.mergedConfig
},
adminConfig() {
return this.$store.state.adminSettings.config
},
adminDraft() {
return this.$store.state.adminSettings.draft
},
...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
...mapPiniaState(useMergedConfigStore, {
expertLevel: (store) => store.mergedConfig.expertLevel,
}),
...mapState({
adminConfig: (state) => state.adminSettings.config,
adminDraft: (state) => state.adminSettings.draft,
user: (state) => state.users.currentUser,
}),
})
export default SharedComputedObject

2
src/components/settings_modal/helpers/string_setting.vue
View file

@ -13,7 +13,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
{{ ' ' }}
<template v-if="backendDescriptionLabel">
{{ backendDescriptionLabel + ' ' }}

2
src/components/settings_modal/helpers/tuple_setting.vue
View file

@ -13,7 +13,7 @@
:changed="isChanged"
:onclick="reset"
/>
<ProfileSettingIndicator :is-profile="isProfileSetting" />
<LocalSettingIndicator :is-local="isLocalSetting" />
{{ ' ' }}
<template v-if="backendDescriptionLabel">
{{ backendDescriptionLabel + ' ' }}

1
src/components/settings_modal/helpers/unit_setting.vue
View file

@ -7,6 +7,7 @@
:for="path"
class="setting-label size-label"
>
<LocalSettingIndicator :is-local="isLocalSetting" />
<ModifiedIndicator
:changed="isChanged"
:onclick="reset"

78
src/components/settings_modal/settings_modal.js
View file

@ -9,7 +9,16 @@ import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
import Popover from '../popover/popover.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useLocalConfigStore } from 'src/stores/local_config.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import {
LOCAL_ONLY_KEYS,
ROOT_CONFIG,
ROOT_CONFIG_DEFINITIONS,
validateSetting,
} from 'src/modules/default_config_state.js'
import {
newExporter,
newImporter,
@ -134,10 +143,52 @@ const SettingsModal = {
})
}
},
onImport(data) {
if (data) {
this.$store.dispatch('loadSettings', data)
}
onImport(input) {
if (!input) return
const { _pleroma_settings_version, ...data } = input
Object.entries(data).forEach(([path, value]) => {
const definition = ROOT_CONFIG_DEFINITIONS[path]
const finalValue = validateSetting({
path,
value,
definition,
throwError: false,
defaultState: ROOT_CONFIG,
})
if (finalValue === undefined) return
if (LOCAL_ONLY_KEYS.has(path)) {
useLocalConfigStore().set({ path, value: finalValue })
} else {
if (path.startsWith('muteFilters')) {
Object.keys(
useMergedConfigStore().mergedConfig.muteFilters,
).forEach((key) => {
useSyncConfigStore().unsetPreference({
path: `simple.${path}.${key}`,
})
})
Object.entries(value).forEach(([key, filter]) => {
useSyncConfigStore().setPreference({
path: `simple.${path}.${key}`,
value: filter,
})
})
} else {
if (finalValue !== undefined) {
useSyncConfigStore().setPreference({
path: `simple.${path}`,
value: finalValue,
})
}
}
}
})
useSyncConfigStore().pushSyncConfig()
},
restore() {
this.dataImporter.importData()
@ -149,16 +200,25 @@ const SettingsModal = {
this.dataThemeExporter.exportData()
},
generateExport(theme = false) {
const { config } = this.$store.state
const config = useMergedConfigStore().mergedConfigWithoutDefaults
let sample = config
if (!theme) {
const ignoreList = new Set([
'theme',
'customTheme',
'customThemeSource',
'colors',
'style',
'styleCustomData',
'palette',
'paletteCustomData',
'themeChecksum',
])
sample = Object.fromEntries(
Object.entries(sample).filter(([key]) => !ignoreList.has(key)),
Object.entries(sample).filter(
([key, value]) => !ignoreList.has(key) && value !== undefined,
),
)
}
const clone = cloneDeep(sample)
@ -191,11 +251,11 @@ const SettingsModal = {
}),
expertLevel: {
get() {
return this.$store.state.config.expertLevel > 0
return useMergedConfigStore().mergedConfig.expertLevel > 0
},
set(value) {
this.$store.dispatch('setOption', {
name: 'expertLevel',
useSyncConfigStore().setSimplePrefAndSave({
path: 'expertLevel',
value: value ? 1 : 0,
})
},

2
src/components/settings_modal/settings_modal.scss
View file

@ -73,7 +73,7 @@
}
.ModifiedIndicator,
.ProfileSettingIndicator {
.LocalSettingIndicator {
grid-area: indicator;
}

3
src/components/settings_modal/settings_modal_user_content.js
View file

@ -16,6 +16,7 @@ import SecurityTab from './tabs/security_tab/security_tab.vue'
import StyleTab from './tabs/style_tab/style_tab.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -83,7 +84,7 @@ const SettingsModalContent = {
return useInterfaceStore().settingsModalState === 'visible'
},
expertLevel() {
return this.$store.state.config.expertLevel
return useMergedConfigStore().mergedConfig.expertLevel
},
},
data() {

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

@ -6,7 +6,6 @@ import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
import IntegerSetting from '../helpers/integer_setting.vue'
import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import UnitSetting from '../helpers/unit_setting.vue'
import Preview from './old_theme_tab/theme_preview.vue'
@ -77,7 +76,6 @@ const AppearanceTab = {
IntegerSetting,
FloatSetting,
UnitSetting,
ProfileSettingIndicator,
Preview,
PaletteEditor,
},

4
src/components/settings_modal/tabs/appearance_tab.vue
View file

@ -54,7 +54,7 @@
:key="style.key"
:data-theme-key="style.key"
class="button-default theme-preview"
:class="{ toggled: isThemeActive(style.key), disabled: switchInProgress }"
:class="{ toggled: isStyleActive(style.key), disabled: switchInProgress }"
:disabled="switchInProgress"
@click="style.version === 'v2' ? setTheme(style.key) : setStyle(style.key)"
>
@ -235,7 +235,7 @@
<li>
<ChoiceSetting
id="underlayOverride"
path="theme3hacks.underlay"
path="underlay"
:options="underlayOverrideModes"
>
{{ $t('settings.style.themes3.hacks.underlay_overrides') }}

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

@ -12,7 +12,7 @@ import UnitSetting from '../helpers/unit_setting.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const ClutterTab = {
components: {
@ -33,66 +33,17 @@ const ClutterTab = {
store.instanceIdentity.showInstanceSpecificPanel &&
store.instanceIdentity.instanceSpecificPanelContent,
}),
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
muteFilters: (store) =>
Object.entries(store.prefsStorage.simple.muteFilters),
muteFiltersObject: (store) => store.prefsStorage.simple.muteFilters,
}),
onMuteDefaultActionLv1: {
get() {
const value = this.$store.state.config.onMuteDefaultAction
if (value === 'ask' || value === 'forever') {
return value
} else {
return 'temporarily'
}
},
set(value) {
let realValue = value
if (value !== 'ask' && value !== 'forever') {
realValue = '14d'
}
this.$store.dispatch('setOption', {
name: 'onMuteDefaultAction',
value: realValue,
})
},
},
onBlockDefaultActionLv1: {
get() {
const value = this.$store.state.config.onBlockDefaultAction
if (value === 'ask' || value === 'forever') {
return value
} else {
return 'temporarily'
}
},
set(value) {
let realValue = value
if (value !== 'ask' && value !== 'forever') {
realValue = '14d'
}
this.$store.dispatch('setOption', {
name: 'onBlockDefaultAction',
value: realValue,
})
},
},
muteFiltersDraft() {
return Object.entries(this.muteFiltersDraftObject)
},
muteFiltersExpired() {
const now = Date.now()
return Object.entries(this.muteFiltersDraftObject).filter(
([, { expires }]) => expires != null && expires <= now,
)
},
},
methods: {
...mapActions(useServerSideStorageStore, [
'setPreference',
'unsetPreference',
'pushServerSideStorage',
...mapActions(useSyncConfigStore, [
'setSimplePrefAndSave',
'unsetSimplePrefAndSave',
'pushSyncConfig',
]),
getDatetimeLocal(timestamp) {
const date = new Date(timestamp)
@ -138,8 +89,8 @@ const ClutterTab = {
filter.order = this.muteFilters.length + 2
this.muteFiltersDraftObject[newId] = filter
this.setPreference({ path: 'simple.muteFilters.' + newId, value: filter })
this.pushServerSideStorage()
this.setSimplePrefAndSave({ path: 'muteFilters.' + newId, value: filter })
this.pushSyncConfig()
},
exportFilter(id) {
this.exportedFilter = { ...this.muteFiltersDraftObject[id] }
@ -154,20 +105,20 @@ const ClutterTab = {
const newId = uuidv4()
this.muteFiltersDraftObject[newId] = filter
this.setPreference({ path: 'simple.muteFilters.' + newId, value: filter })
this.pushServerSideStorage()
this.setSimplePrefAndSave({ path: 'muteFilters.' + newId, value: filter })
this.pushSyncConfig()
},
deleteFilter(id) {
delete this.muteFiltersDraftObject[id]
this.unsetPreference({ path: 'simple.muteFilters.' + id, value: null })
this.pushServerSideStorage()
this.unsetSimplePrefAndSave({ path: 'muteFilters.' + id, value: null })
this.pushSyncConfig()
},
purgeExpiredFilters() {
this.muteFiltersExpired.forEach(([id]) => {
delete this.muteFiltersDraftObject[id]
this.unsetPreference({ path: 'simple.muteFilters.' + id, value: null })
this.unsetSimplePrefAndSave({ path: 'muteFilters.' + id, value: null })
})
this.pushServerSideStorage()
this.pushSyncConfig()
},
updateFilter(id, field, value) {
const filter = { ...this.muteFiltersDraftObject[id] }
@ -189,11 +140,11 @@ const ClutterTab = {
this.muteFiltersDraftDirty[id] = true
},
saveFilter(id) {
this.setPreference({
path: 'simple.muteFilters.' + id,
this.setSimplePrefAndSave({
path: 'muteFilters.' + id,
value: this.muteFiltersDraftObject[id],
})
this.pushServerSideStorage()
this.pushSyncConfig()
this.muteFiltersDraftDirty[id] = false
},
},

18
src/components/settings_modal/tabs/clutter_tab.vue
View file

@ -19,9 +19,7 @@
</BooleanSetting>
</li>
<li>
<BooleanSetting
path="hideUserStats"
>
<BooleanSetting path="hideUserStats">
{{ $t('settings.hide_user_stats') }}
</BooleanSetting>
</li>
@ -64,12 +62,18 @@
</IntegerSetting>
</li>
<li>
<BooleanSetting path="hideAttachments">
<BooleanSetting
:local="true"
path="hideAttachments"
>
{{ $t('settings.hide_attachments_in_tl') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="hideAttachmentsInConv">
<BooleanSetting
:local="true"
path="hideAttachmentsInConv"
>
{{ $t('settings.hide_attachments_in_convo') }}
</BooleanSetting>
</li>
@ -79,9 +83,7 @@
</BooleanSetting>
</li>
<li v-if="shoutAvailable">
<BooleanSetting
path="hideShoutbox"
>
<BooleanSetting path="hideShoutbox">
{{ $t('settings.hide_shoutbox') }}
</BooleanSetting>
</li>

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

@ -8,11 +8,13 @@ import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
import IntegerSetting from '../helpers/integer_setting.vue'
import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import UnitSetting from '../helpers/unit_setting.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import localeService from 'src/services/locale/locale.service.js'
import { cacheKey, clearCache, emojiCacheKey } from 'src/services/sw/sw.js'
@ -98,14 +100,13 @@ const ComposingTab = {
FloatSetting,
UnitSetting,
InterfaceLanguageSwitcher,
ProfileSettingIndicator,
ScopeSelector,
Select,
FontControl,
},
computed: {
postFormats() {
return useInstanceStore().postFormats || []
return useInstanceCapabilitiesStore().postFormats
},
postContentOptions() {
return this.postFormats.map((format) => ({
@ -116,11 +117,11 @@ const ComposingTab = {
},
language: {
get: function () {
return this.$store.getters.mergedConfig.interfaceLanguage
return useMergedConfigStore().mergedConfig.interfaceLanguage
},
set: function (val) {
this.$store.dispatch('setOption', {
name: 'interfaceLanguage',
useSyncConfigStore().setSimplePrefAndSave({
path: 'interfaceLanguage',
value: val,
})
},
@ -171,8 +172,8 @@ const ComposingTab = {
})
},
updateFont(key, value) {
this.$store.dispatch('setOption', {
name: 'theme3hacks',
useSyncConfigStore().setSimplePrefAndSave({
path: 'theme3hacks',
value: {
...this.mergedConfig.theme3hacks,
fonts: {

8
src/components/settings_modal/tabs/composing_tab.vue
View file

@ -8,10 +8,6 @@
class="setting-item "
for="default-vis"
>
<span class="setting-label">
<ProfileSettingIndicator :is-profile="true" />
{{ $t('settings.default_vis') }}
</span>
<ScopeSelector
class="scope-selector setting-control"
:show-all="true"
@ -19,7 +15,6 @@
:initial-scope="$store.state.profileConfig.defaultScope"
:on-scope-change="changeDefaultScope"
:unstyled="false"
uns
/>
</label>
</li>
@ -34,6 +29,7 @@
id="postContentType"
path="postContentType"
:options="postContentOptions"
:local="true"
>
{{ $t('settings.default_post_status_content_type') }}
</ChoiceSetting>
@ -95,6 +91,7 @@
<li>
<BooleanSetting
path="imageCompression"
:local="true"
expert="1"
>
{{ $t('settings.image_compression') }}
@ -103,6 +100,7 @@
<li>
<BooleanSetting
path="alwaysUseJpeg"
:local="true"
expert="1"
parent-path="imageCompression"
>

7
src/components/settings_modal/tabs/developer_tab.vue
View file

@ -28,13 +28,17 @@
<h3>{{ $t('settings.debug') }}</h3>
<ul class="setting-list">
<li>
<BooleanSetting path="virtualScrolling">
<BooleanSetting
:local="true"
path="virtualScrolling"
>
{{ $t('settings.virtual_scrolling') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting
path="themeDebug"
:local="true"
:expert="1"
>
{{ $t('settings.theme_debug') }}
@ -43,6 +47,7 @@
<li>
<BooleanSetting
path="forceThemeRecompilation"
:local="true"
:expert="1"
>
{{ $t('settings.force_theme_recompilation_debug') }}

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

@ -13,7 +13,8 @@ import UnitSetting from '../helpers/unit_setting.vue'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import {
newExporter,
@ -36,11 +37,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,
@ -92,7 +93,7 @@ const FilteringTab = {
},
computed: {
...SharedComputedObject(),
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
muteFilters: (store) =>
Object.entries(store.prefsStorage.simple.muteFilters),
muteFiltersObject: (store) => store.prefsStorage.simple.muteFilters,
@ -100,7 +101,7 @@ const FilteringTab = {
...mapState(useInstanceCapabilitiesStore, ['blockExpiration']),
onMuteDefaultActionLv1: {
get() {
const value = this.$store.state.config.onMuteDefaultAction
const value = useMergedConfigStore().mergedConfig.onMuteDefaultAction
if (value === 'ask' || value === 'forever') {
return value
} else {
@ -112,15 +113,15 @@ const FilteringTab = {
if (value !== 'ask' && value !== 'forever') {
realValue = '14d'
}
this.$store.dispatch('setOption', {
name: 'onMuteDefaultAction',
this.setPreference({
path: 'simple.onMuteDefaultAction',
value: realValue,
})
},
},
onBlockDefaultActionLv1: {
get() {
const value = this.$store.state.config.onBlockDefaultAction
const value = useMergedConfigStore().mergedConfig.onBlockDefaultAction
if (value === 'ask' || value === 'forever') {
return value
} else {
@ -132,8 +133,8 @@ const FilteringTab = {
if (value !== 'ask' && value !== 'forever') {
realValue = '14d'
}
this.$store.dispatch('setOption', {
name: 'onBlockDefaultAction',
this.setPreference({
path: 'simple.onBlockDefaultAction',
value: realValue,
})
},
@ -149,10 +150,13 @@ const FilteringTab = {
},
},
methods: {
...mapActions(useServerSideStorageStore, [
...mapActions(useSyncConfigStore, [
'setPreference',
'setSimplePrefAndSave',
'unsetSimplePrefAndSave',
'unsetPreference',
'pushServerSideStorage',
'unsetPrefAndSave',
'pushSyncConfig',
]),
getDatetimeLocal(timestamp) {
const date = new Date(timestamp)
@ -198,8 +202,7 @@ const FilteringTab = {
filter.order = this.muteFilters.length + 2
this.muteFiltersDraftObject[newId] = filter
this.setPreference({ path: 'simple.muteFilters.' + newId, value: filter })
this.pushServerSideStorage()
this.setSimplePrefAndSave({ path: 'muteFilters.' + newId, value: filter })
},
exportFilter(id) {
this.exportedFilter = { ...this.muteFiltersDraftObject[id] }
@ -214,20 +217,18 @@ const FilteringTab = {
const newId = uuidv4()
this.muteFiltersDraftObject[newId] = filter
this.setPreference({ path: 'simple.muteFilters.' + newId, value: filter })
this.pushServerSideStorage()
this.setSimplePrefAndSave({ path: 'muteFilters.' + newId, value: filter })
},
deleteFilter(id) {
delete this.muteFiltersDraftObject[id]
this.unsetPreference({ path: 'simple.muteFilters.' + id, value: null })
this.pushServerSideStorage()
this.unsetSimplePrefAndSave({ path: 'muteFilters.' + id, value: null })
},
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] }
@ -249,11 +250,10 @@ const FilteringTab = {
this.muteFiltersDraftDirty[id] = true
},
saveFilter(id) {
this.setPreference({
path: 'simple.muteFilters.' + id,
this.setSimplePrefAndSave({
path: 'muteFilters.' + id,
value: this.muteFiltersDraftObject[id],
})
this.pushServerSideStorage()
this.muteFiltersDraftDirty[id] = false
},
},
@ -262,6 +262,11 @@ const FilteringTab = {
replyVisibility() {
this.$store.dispatch('queueFlushAll')
},
muteFiltersObject() {
this.muteFiltersDraftObject = cloneDeep(
useMergedConfigStore().mergedConfig.muteFilters,
)
},
},
}

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

@ -5,12 +5,14 @@ import InterfaceLanguageSwitcher from 'src/components/interface_language_switche
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import UnitSetting from '../helpers/unit_setting.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useLocalConfigStore } from 'src/stores/local_config.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import localeService from 'src/services/locale/locale.service.js'
@ -32,16 +34,15 @@ const GeneralTab = {
FloatSetting,
FontControl,
InterfaceLanguageSwitcher,
ProfileSettingIndicator,
},
computed: {
language: {
get: function () {
return this.$store.getters.mergedConfig.interfaceLanguage
return useMergedConfigStore().mergedConfig.interfaceLanguage
},
set: function (val) {
this.$store.dispatch('setOption', {
name: 'interfaceLanguage',
useSyncConfigStore().setSimplePrefAndSave({
path: 'interfaceLanguage',
value: val,
})
},
@ -64,17 +65,8 @@ const GeneralTab = {
this.$store.commit('setCurrentUser', user)
})
},
updateFont(key, value) {
this.$store.dispatch('setOption', {
name: 'theme3hacks',
value: {
...this.mergedConfig.theme3hacks,
fonts: {
...this.mergedConfig.theme3hacks.fonts,
[key]: value,
},
},
})
updateFont(path, value) {
useLocalConfigStore().set({ path, value })
},
},
}

17
src/components/settings_modal/tabs/general_tab.vue
View file

@ -9,11 +9,6 @@
class="lang-selector"
@update="val => language = val"
/>
<h4>
{{ $t('settings.email_language') }}
{{ ' ' }}
<ProfileSettingIndicator :is-profile="true" />
</h4>
<interface-language-switcher
v-model="emailLanguage"
class="lang-selector"
@ -44,6 +39,7 @@
:units="['px', 'rem']"
:reset-default="{ 'px': 14, 'rem': 1 }"
timed-apply-mode
:local="true"
>
{{ $t('settings.text_size') }}
</UnitSetting>
@ -68,27 +64,28 @@
</li>
<li>
<FontControl
:model-value="mergedConfig.theme3hacks.fonts.interface"
:model-value="mergedConfig.fontInterface"
name="ui"
:label="$t('settings.style.fonts.components_inline.interface')"
:fallback="{ family: 'sans-serif' }"
no-inherit="1"
@update:model-value="v => updateFont('interface', v)"
@update:model-value="v => updateFont('fontInterface', v)"
/>
</li>
<li>
<FontControl
:model-value="mergedConfig.theme3hacks.fonts.input"
:model-value="mergedConfig.fontInput"
name="input"
:fallback="{ family: 'inherit' }"
:label="$t('settings.style.fonts.components_inline.input')"
@update:model-value="v => updateFont('input', v)"
@update:model-value="v => updateFont('fontInput', v)"
/>
</li>
<li>
<UnitSetting
path="emojiSize"
:step="0.1"
:local="true"
:units="['px', 'rem']"
:reset-default="{ 'px': 32, 'rem': 2.2 }"
>
@ -101,6 +98,7 @@
<FloatSetting
v-if="user"
path="emojiReactionsScale"
:local="true"
>
{{ $t('settings.emoji_reactions_scale') }}
</FloatSetting>
@ -128,6 +126,7 @@
<li>
<BooleanSetting
path="useStreamingApi"
:local="true"
expert="1"
>
{{ $t('settings.useStreamingApi') }}

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

@ -2,11 +2,11 @@ import { mapState } from 'pinia'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import UnitSetting from '../helpers/unit_setting.vue'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
const GeneralTab = {
data() {
@ -24,7 +24,6 @@ const GeneralTab = {
BooleanSetting,
ChoiceSetting,
UnitSetting,
ProfileSettingIndicator,
},
computed: {
...mapState(useInstanceCapabilitiesStore, [
@ -32,12 +31,12 @@ const GeneralTab = {
'suggestionsEnabled',
]),
columns() {
const mode = this.$store.getters.mergedConfig.thirdColumnMode
const mode = useMergedConfigStore().mergedConfig.thirdColumnMode
const notif = mode === 'none' ? [] : ['notifs']
if (
this.$store.getters.mergedConfig.sidebarRight ||
useMergedConfigStore().mergedConfig.sidebarRight ||
mode === 'postform'
) {
return [...notif, 'content', 'sidebar']

14
src/components/settings_modal/tabs/layout_tab.vue
View file

@ -40,6 +40,7 @@
<li>
<UnitSetting
path="themeEditorMinWidth"
:local="true"
:units="['px', 'rem']"
expert="1"
>
@ -50,6 +51,7 @@
<UnitSetting
path="navbarSize"
:step="0.1"
:local="true"
:units="['px', 'rem']"
:reset-default="{ 'px': 55, 'rem': 3.5 }"
>
@ -72,6 +74,7 @@
<li>
<UnitSetting
path="panelHeaderSize"
:local="true"
:step="0.1"
:units="['px', 'rem']"
:reset-default="{ 'px': 52, 'rem': 3.2 }"
@ -81,12 +84,18 @@
</UnitSetting>
</li>
<li>
<BooleanSetting path="sidebarRight">
<BooleanSetting
:local="true"
path="sidebarRight"
>
{{ $t('settings.right_sidebar') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="navbarColumnStretch">
<BooleanSetting
:local="true"
path="navbarColumnStretch"
>
{{ $t('settings.navbar_column_stretch') }}
</BooleanSetting>
</li>
@ -106,6 +115,7 @@
<UnitSetting
v-for="column in columns"
:key="column"
:local="true"
:path="column + 'ColumnWidth'"
:units="horizontalUnits"
expert="1"

3
src/components/settings_modal/tabs/notifications_tab.vue
View file

@ -249,6 +249,7 @@
<li>
<BooleanSetting
path="webPushNotifications"
:local="true"
expert="1"
>
{{ $t('settings.enable_web_push_notifications') }}
@ -257,6 +258,7 @@
<li>
<BooleanSetting
path="webPushAlwaysShowNotifications"
:local="true"
:disabled="!mergedConfig.webPushNotifications"
>
{{ $t('settings.enable_web_push_always_show') }}
@ -273,6 +275,7 @@
<li>
<BooleanSetting
source="profile"
:local="true"
path="webPushHideContents"
expert="1"
>

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

@ -11,6 +11,7 @@ import Preview from './theme_preview.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import {
getContrastRatioLayers,
@ -81,7 +82,7 @@ export default {
}),
availableStyles: [],
selected: '',
selectedTheme: this.$store.getters.mergedConfig.theme,
selectedTheme: useMergedConfigStore().mergedConfig.theme,
themeWarning: undefined,
tempImportFile: undefined,
engineVersion: 0,

22
src/components/settings_modal/tabs/posts_tab.js
View file

@ -2,10 +2,12 @@ import FontControl from 'src/components/font_control/font_control.vue'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import IntegerSetting from '../helpers/integer_setting.vue'
import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
const GeneralTab = {
import { useLocalConfigStore } from 'src/stores/local_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
const PostsTab = {
data() {
return {
conversationDisplayOptions: ['tree', 'linear'].map((mode) => ({
@ -60,25 +62,15 @@ const GeneralTab = {
ChoiceSetting,
IntegerSetting,
FontControl,
ProfileSettingIndicator,
},
computed: {
...SharedComputedObject(),
},
methods: {
updateFont(key, value) {
this.$store.dispatch('setOption', {
name: 'theme3hacks',
value: {
...this.mergedConfig.theme3hacks,
fonts: {
...this.mergedConfig.theme3hacks.fonts,
[key]: value,
},
},
})
updateFont(path, value) {
useLocalConfigStore().set({ path, value })
},
},
}
export default GeneralTab
export default PostsTab

16
src/components/settings_modal/tabs/posts_tab.vue
View file

@ -56,20 +56,20 @@
</li>
<li>
<FontControl
:model-value="mergedConfig.theme3hacks.fonts.post"
:model-value="mergedConfig.fontPosts"
name="post"
:fallback="{ family: 'inherit' }"
:label="$t('settings.style.fonts.components.post')"
@update:model-value="v => updateFont('post', v)"
@update:model-value="v => updateFont('fontPosts', v)"
/>
</li>
<li>
<FontControl
:model-value="mergedConfig.theme3hacks.fonts.monospace"
:model-value="mergedConfig.fontMonospace"
name="postCode"
:fallback="{ family: 'monospace' }"
:label="$t('settings.style.fonts.components.monospace')"
@update:model-value="v => updateFont('monospace', v)"
@update:model-value="v => updateFont('fontMonospace', v)"
/>
</li>
<li>
@ -99,6 +99,7 @@
<ChoiceSetting
id="mentionLinkDisplay"
path="mentionLinkDisplay"
:local="true"
:options="mentionLinkDisplayOptions"
>
{{ $t('settings.mention_link_display') }}
@ -169,7 +170,10 @@
</BooleanSetting>
</li>
<li>
<BooleanSetting path="hideNsfw">
<BooleanSetting
:local="true"
path="hideNsfw"
>
{{ $t('settings.nsfw_clickthrough') }}
</BooleanSetting>
<ul class="setting-list suboptions">
@ -177,6 +181,7 @@
<BooleanSetting
path="preloadImage"
expert="1"
:local="true"
parent-path="hideNsfw"
>
{{ $t('settings.preload_images') }}
@ -186,6 +191,7 @@
<BooleanSetting
path="useOneClickNsfw"
expert="1"
:local="true"
parent-path="hideNsfw"
>
{{ $t('settings.use_one_click_nsfw') }}

2
src/components/settings_modal/tabs/profile_tab.js
View file

@ -1,7 +1,6 @@
import Checkbox from 'src/components/checkbox/checkbox.vue'
import UserCard from 'src/components/user_card/user_card.vue'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -24,7 +23,6 @@ const ProfileTab = {
UserCard,
Checkbox,
BooleanSetting,
ProfileSettingIndicator,
},
computed: {
user() {

1
src/components/settings_modal/tabs/profile_tab.vue
View file

@ -16,7 +16,6 @@
v-model="locked"
class="setting-label setting-control custom-boolean-setting"
>
<ProfileSettingIndicator :is-profile="true" />
{{ $t('settings.lock_account_description') }}
</Checkbox>
</div>

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

@ -10,6 +10,7 @@ import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useShoutStore } from 'src/stores/shout'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -72,7 +73,10 @@ const SideDrawer = {
return useShoutStore().joined
},
unseenNotifications() {
return unseenNotificationsFromStore(this.$store)
return unseenNotificationsFromStore(
this.$store,
useMergedConfigStore().mergedConfig.notificationVisibility,
)
},
unseenNotificationsCount() {
return this.unseenNotifications.length

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

@ -23,7 +23,9 @@ import UserPopover from '../user_popover/user_popover.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import { useUserHighlightStore } from 'src/stores/user_highlight.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
@ -133,25 +135,26 @@ const Status = {
},
props: [
'statusoid',
'replies',
'expandable',
'inConversation',
'focused',
'highlight',
'compact',
'replies',
'isPreview',
'noHeading',
'inlineExpanded',
'showPinned',
'inProfile',
'profileUserId',
'inConversation',
'inQuote',
'profileUserId',
'simpleTree',
'showOtherRepliesAsButton',
'dive',
'controlledThreadDisplayStatus',
'controlledToggleThreadDisplay',
'showOtherRepliesAsButton',
'controlledShowingTall',
'controlledToggleShowingTall',
'controlledExpandingSubject',
@ -162,9 +165,8 @@ const Status = {
'controlledToggleReplying',
'controlledMediaPlaying',
'controlledSetMediaPlaying',
'dive',
],
emits: ['interacted'],
emits: ['interacted', 'goto', 'toggleExpanded'],
data() {
return {
uncontrolledReplying: false,
@ -200,16 +202,14 @@ const Status = {
},
repeaterStyle() {
const user = this.statusoid.user
const highlight = this.mergedConfig.highlight
return highlightStyle(highlight[user.screen_name])
return highlightStyle(useUserHighlightStore().get(user.screen_name))
},
userStyle() {
if (this.noHeading) return
const user = this.retweet
? this.statusoid.retweeted_status.user
: this.statusoid.user
const highlight = this.mergedConfig.highlight
return highlightStyle(highlight[user.screen_name])
return highlightStyle(useUserHighlightStore().get(user.screen_name))
},
userProfileLink() {
return this.generateUserProfileLink(
@ -260,9 +260,7 @@ const Status = {
},
muteFilterHits() {
return muteFilterHits(
Object.values(
useServerSideStorageStore().prefsStorage.simple.muteFilters,
),
Object.values(useSyncConfigStore().prefsStorage.simple.muteFilters),
this.status,
)
},
@ -481,7 +479,7 @@ const Status = {
return this.$store.state.users.currentUser
},
mergedConfig() {
return this.$store.getters.mergedConfig
return useMergedConfigStore().mergedConfig
},
isSuspendable() {
return !this.replying && this.mediaPlaying.length === 0

5
src/components/status/status.vue
View file

@ -10,12 +10,13 @@
class="alert error"
>
{{ error }}
<span
<button
class="fa-scale-110 fa-old-padding"
type="button"
@click="clearError"
>
<FAIcon icon="times" />
</span>
</button>
</div>
<template v-if="muted && !isPreview">
<div class="status-container muted">

2
src/components/status_action_buttons/action_button.vue
View file

@ -88,7 +88,7 @@
<StatusBookmarkFolderMenu
v-if="button.name === 'bookmark'"
:status="status"
:close="() => { close(); outerClose() }"
@close="() => { close(); outerClose?.() }"
/>
</template>
</Popover>

5
src/components/status_action_buttons/buttons_definitions.js
View file

@ -1,6 +1,7 @@
import { useEditStatusStore } from 'src/stores/editStatus.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { useReportsStore } from 'src/stores/reports.js'
import { useStatusHistoryStore } from 'src/stores/statusHistory.js'
@ -52,7 +53,7 @@ export const BUTTONS = [
!PRIVATE_SCOPES.has(status.visibility)),
toggleable: true,
confirm: ({ status, getters }) =>
!status.repeated && getters.mergedConfig.modalOnRepeat,
!status.repeated && useMergedConfigStore().mergedConfig.modalOnRepeat,
confirmStrings: {
title: 'status.repeat_confirm_title',
body: 'status.repeat_confirm',
@ -228,7 +229,7 @@ export const BUTTONS = [
currentUser.privileges.includes('messages_delete'))
)
},
confirm: ({ getters }) => getters.mergedConfig.modalOnDelete,
confirm: ({ getters }) => useMergedConfigStore().mergedConfig.modalOnDelete,
confirmStrings: {
title: 'status.delete_confirm_title',
body: 'status.delete_confirm',

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

@ -5,7 +5,7 @@ import Popover from 'src/components/popover/popover.vue'
import ActionButtonContainer from './action_button_container.vue'
import { BUTTONS } from './buttons_definitions.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage.js'
import { useSyncConfigStore } from 'src/stores/sync_config.js'
import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
@ -36,7 +36,7 @@ const StatusActionButtons = {
ActionButtonContainer,
},
computed: {
...mapState(useServerSideStorageStore, {
...mapState(useSyncConfigStore, {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedStatusActions),
}),
@ -111,18 +111,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) {

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

@ -1,7 +1,9 @@
import { mapGetters } from 'vuex'
import { mapState } from 'pinia'
import RichContent from 'src/components/rich_content/rich_content.jsx'
import { useMergedConfigStore } from 'src/stores/merged_config.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faFile,
@ -101,14 +103,12 @@ const StatusBody = {
)
},
attachmentTypes() {
return this.status.attachments.map((file) =>
file.type,
)
return this.status.attachments.map((file) => file.type)
},
collapsedStatus() {
return this.status.raw_html.replace(/(\n|<br\s?\/?>)/g, ' ')
},
...mapGetters(['mergedConfig']),
...mapState(useMergedConfigStore, ['mergedConfig']),
},
components: {
RichContent,

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

@ -11,7 +11,8 @@ import { faChevronRight, faFolder } from '@fortawesome/free-solid-svg-icons'
library.add(faChevronRight, faFolder)
const StatusBookmarkFolderMenu = {
props: ['status', 'close'],
props: ['status'],
emits: ['success', 'error', 'close'],
data() {
return {}
},
@ -33,8 +34,8 @@ const StatusBookmarkFolderMenu = {
this.$store
.dispatch('bookmark', { id: this.status.id, bookmark_folder_id: value })
.then(() => this.$emit('onSuccess'))
.catch((err) => this.$emit('onError', err.error.error))
.then(() => this.$emit('success'))
.catch((err) => this.$emit('error', err.error.error))
},
},
}

2
src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.vue
View file

@ -8,7 +8,7 @@
<button
class="main-button"
@click="toggleFolder(folder.id)"
@click.stop="close"
@click.stop="$emit('close')"
>
<span
class="input menu-checkbox -radio"

Some files were not shown because too many files have changed in this diff Show more