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

Merge branch 'instance-migration' into shigusegubu-themes3

Browse source
This commit is contained in:
Henry Jameson 2026-01-29 20:47:31 +02:00
commit a96e3b4b5d
144 changed files with 1013 additions and 778 deletions
Download patch file Download diff file Expand all files Collapse all files

9
CHANGELOG.md
View file

@ -3,6 +3,15 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
## 2.10.1
### Fixed
- fixed being unable to set actor type from profile page
- fixed error when clicking mute menu itself (instead of submenu items)
- fixed mute -> domain status submenu not working
### Internal
- Add playwright E2E-tests with an optional docker-based backend
## 2.10.0
### Changed
- Temporary changes modal now shows actual countdown instead of fixed timeout

6
biome.json
View file

@ -132,7 +132,11 @@
"groups": [
[":NODE:", ":PACKAGE:", "!src/**", "!@fortawesome/**"],
":BLANK_LINE:",
[":PATH:", "src/**"],
[":PATH:", "src/components/**"],
":BLANK_LINE:",
[":PATH:", "src/stores/**"],
":BLANK_LINE:",
[":PATH:", "src/**", "src/stores/**", "src/components/**"],
":BLANK_LINE:",
"@fortawesome/fontawesome-svg-core",
"@fortawesome/*"

1
changelog.d/actor-type.fix
View file

@ -1 +0,0 @@
fixed being unable to set actor type from profile page

0
changelog.d/biome.skip
View file

1
changelog.d/e2e-tests.add
View file

@ -1 +0,0 @@
Add playwright E2E-tests with an optional docker-based backend

1
changelog.d/e2e.skip
View file

@ -1 +0,0 @@
fix e2e

2
package.json
View file

@ -1,6 +1,6 @@
{
"name": "pleroma_fe",
"version": "2.10.0",
"version": "2.10.1",
"description": "Pleroma frontend, the default frontend of Pleroma social network server",
"author": "Pleroma contributors <https://git.pleroma.social/pleroma/pleroma-fe/-/blob/develop/CONTRIBUTORS.md>",
"private": false,

53
src/App.js
View file

@ -1,4 +1,5 @@
import { throttle } from 'lodash'
import { mapState } from 'pinia'
import { defineAsyncComponent } from 'vue'
import { mapGetters } from 'vuex'
@ -20,8 +21,10 @@ import UserReportingModal from './components/user_reporting_modal/user_reporting
import WhoToFollowPanel from './components/who_to_follow_panel/who_to_follow_panel.vue'
import { getOrCreateServiceWorker } from './services/sw/sw'
import { windowHeight, windowWidth } from './services/window_utils/window_utils'
import { useInterfaceStore } from './stores/interface'
import { useShoutStore } from './stores/shout'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useShoutStore } from 'src/stores/shout.js'
export default {
name: 'app',
@ -91,12 +94,9 @@ export default {
this.scrollParent.removeEventListener('scroll', this.updateScrollState)
},
computed: {
themeApplied() {
return useInterfaceStore().themeApplied
},
currentTheme() {
if (useInterfaceStore().styleDataUsed) {
const styleMeta = useInterfaceStore().styleDataUsed.find(
if (this.styleDataUsed) {
const styleMeta = this.styleDataUsed.find(
(x) => x.component === '@meta',
)
@ -134,9 +134,7 @@ export default {
return this.currentUser.background_image
},
instanceBackground() {
return this.mergedConfig.hideInstanceWallpaper
? null
: this.$store.state.instance.background
return this.mergedConfig.hideInstanceWallpaper ? null : this.background
},
background() {
return this.userBackground || this.instanceBackground
@ -151,14 +149,11 @@ export default {
shout() {
return useShoutStore().joined
},
suggestionsEnabled() {
return this.$store.state.instance.suggestionsEnabled
},
showInstanceSpecificPanel() {
return (
this.$store.state.instance.showInstanceSpecificPanel &&
this.showInstanceSpecificPanel &&
!this.$store.getters.mergedConfig.hideISP &&
this.$store.state.instance.instanceSpecificPanelContent
this.instanceSpecificPanelContent
)
},
isChats() {
@ -175,24 +170,12 @@ export default {
this.layoutType === 'mobile'
)
},
showFeaturesPanel() {
return this.$store.state.instance.showFeaturesPanel
},
editingAvailable() {
return this.$store.state.instance.editingAvailable
},
shoutboxPosition() {
return this.$store.getters.mergedConfig.alwaysShowNewPostButton || false
},
hideShoutbox() {
return this.$store.getters.mergedConfig.hideShoutbox
},
layoutType() {
return useInterfaceStore().layoutType
},
privateMode() {
return this.$store.state.instance.private
},
reverseLayout() {
const { thirdColumnMode, sidebarRight: reverseSetting } =
this.$store.getters.mergedConfig
@ -214,6 +197,22 @@ export default {
return window /* this.$refs.appContentRef */
},
...mapGetters(['mergedConfig']),
...mapState(useInterfaceStore, [
'themeApplied',
'styleDataUsed',
'layoutType',
]),
...mapState(useInstanceStore, ['styleDataUsed', 'private']),
...mapState(useInstanceStore, {
background: (store) => store.instanceIdentity.background,
showFeaturesPanel: (store) => store.instanceIdentity.showFeaturesPanel,
showInstanceSpecificPanel: (store) =>
store.instanceIdentity.showInstanceSpecificPanel,
suggestionsEnabled: (store) => store.featureSet.suggestionsEnabled,
editingAvailable: (store) => store.featureSet.editingAvailable,
instanceSpecificPanelContent: (store) =>
store.instanceIdentity.instanceSpecificPanelContent,
}),
},
methods: {
resizeHandler() {

192
src/boot/after_store.js
View file

@ -14,16 +14,6 @@ import {
config.autoAddCss = false
import VBodyScrollLock from 'src/directives/body_scroll_lock'
import {
instanceDefaultConfig,
staticOrApiConfigDefault,
} from 'src/modules/default_config_state.js'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useAuthFlowStore } from 'src/stores/auth_flow'
import { useI18nStore } from 'src/stores/i18n'
import { useInterfaceStore } from 'src/stores/interface'
import { useOAuthStore } from 'src/stores/oauth'
import App from '../App.vue'
import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
import FaviconService from '../services/favicon_service/favicon_service.js'
@ -35,6 +25,20 @@ import {
} from '../services/window_utils/window_utils'
import routes from './routes'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useAuthFlowStore } from 'src/stores/auth_flow'
import { useEmojiStore } from 'src/stores/emoji.js'
import { useI18nStore } from 'src/stores/i18n'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useOAuthStore } from 'src/stores/oauth'
import VBodyScrollLock from 'src/directives/body_scroll_lock'
import {
instanceDefaultConfig,
staticOrApiConfigDefault,
} from 'src/modules/default_config_state.js'
let staticInitialResults = null
const parsedInitialResults = () => {
@ -78,29 +82,29 @@ const getInstanceConfig = async ({ store }) => {
const textlimit = data.max_toot_chars
const vapidPublicKey = data.pleroma.vapid_public_key
store.dispatch('setInstanceOption', {
name: 'pleromaExtensionsAvailable',
useInstanceStore().set({
name: 'featureSet.pleromaExtensionsAvailable',
value: data.pleroma,
})
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'textlimit',
value: textlimit,
})
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'accountApprovalRequired',
value: data.approval_required,
})
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'birthdayRequired',
value: !!data.pleroma?.metadata.birthday_required,
})
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'birthdayMinAge',
value: data.pleroma?.metadata.birthday_min_age || 0,
})
if (vapidPublicKey) {
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'vapidPublicKey',
value: vapidPublicKey,
})
@ -161,14 +165,18 @@ const setSettings = async ({ apiConfig, staticConfig, store }) => {
config = Object.assign({}, staticConfig, apiConfig)
}
const copyInstanceOption = (name) => {
if (typeof config[name] !== 'undefined') {
store.dispatch('setInstanceOption', { name, value: config[name] })
const copyInstanceOption = ({ source, destination }) => {
if (typeof config[source] !== 'undefined') {
useInstanceStore().set({ path: destination, value: config[source] })
}
}
Object.keys(staticOrApiConfigDefault).forEach(copyInstanceOption)
Object.keys(instanceDefaultConfig).forEach(copyInstanceOption)
Object.keys(staticOrApiConfigDefault)
.map((k) => ({ source: k, destination: `instanceIdentity.${k}` }))
.forEach(copyInstanceOption)
Object.keys(instanceDefaultConfig)
.map((k) => ({ source: k, destination: `prefsStorage.${k}` }))
.forEach(copyInstanceOption)
useAuthFlowStore().setInitialStrategy(config.loginMethod)
}
@ -178,7 +186,7 @@ const getTOS = async ({ store }) => {
const res = await window.fetch('/static/terms-of-service.html')
if (res.ok) {
const html = await res.text()
store.dispatch('setInstanceOption', { name: 'tos', value: html })
useInstanceStore().set({ name: 'instanceIdentity.tos', value: html })
} else {
throw res
}
@ -192,8 +200,8 @@ const getInstancePanel = async ({ store }) => {
const res = await preloadFetch('/instance/panel.html')
if (res.ok) {
const html = await res.text()
store.dispatch('setInstanceOption', {
name: 'instanceSpecificPanelContent',
useInstanceStore().set({
name: 'instanceIdentity.instanceSpecificPanelContent',
value: html,
})
} else {
@ -227,7 +235,7 @@ const getStickers = async ({ store }) => {
).sort((a, b) => {
return a.meta.title.localeCompare(b.meta.title)
})
store.dispatch('setInstanceOption', { name: 'stickers', value: stickers })
useEmojiStore().setStickers(stickers)
} else {
throw res
}
@ -248,7 +256,7 @@ const getAppSecret = async ({ store }) => {
const resolveStaffAccounts = ({ store, accounts }) => {
const nicknames = accounts.map((uri) => uri.split('/').pop())
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'staffAccounts',
value: nicknames,
})
@ -262,159 +270,163 @@ const getNodeInfo = async ({ store }) => {
const data = await res.json()
const metadata = data.metadata
const features = metadata.features
store.dispatch('setInstanceOption', {
name: 'name',
useInstanceStore().set({
path: 'name',
value: metadata.nodeName,
})
store.dispatch('setInstanceOption', {
name: 'registrationOpen',
useInstanceStore().set({
path: 'registrationOpen',
value: data.openRegistrations,
})
store.dispatch('setInstanceOption', {
name: 'mediaProxyAvailable',
useInstanceStore().set({
path: 'featureSet.mediaProxyAvailable',
value: features.includes('media_proxy'),
})
store.dispatch('setInstanceOption', {
name: 'safeDM',
useInstanceStore().set({
path: 'featureSet.safeDM',
value: features.includes('safe_dm_mentions'),
})
store.dispatch('setInstanceOption', {
name: 'shoutAvailable',
useInstanceStore().set({
path: 'featureSet.shoutAvailable',
value: features.includes('chat'),
})
store.dispatch('setInstanceOption', {
name: 'pleromaChatMessagesAvailable',
useInstanceStore().set({
path: 'featureSet.pleromaChatMessagesAvailable',
value: features.includes('pleroma_chat_messages'),
})
store.dispatch('setInstanceOption', {
name: 'pleromaCustomEmojiReactionsAvailable',
useInstanceStore().set({
path: 'featureSet.pleromaCustomEmojiReactionsAvailable',
value:
features.includes('pleroma_custom_emoji_reactions') ||
features.includes('custom_emoji_reactions'),
})
store.dispatch('setInstanceOption', {
name: 'pleromaBookmarkFoldersAvailable',
useInstanceStore().set({
path: 'featureSet.pleromaBookmarkFoldersAvailable',
value: features.includes('pleroma:bookmark_folders'),
})
store.dispatch('setInstanceOption', {
name: 'gopherAvailable',
useInstanceStore().set({
path: 'featureSet.gopherAvailable',
value: features.includes('gopher'),
})
store.dispatch('setInstanceOption', {
name: 'pollsAvailable',
useInstanceStore().set({
path: 'featureSet.pollsAvailable',
value: features.includes('polls'),
})
store.dispatch('setInstanceOption', {
name: 'editingAvailable',
useInstanceStore().set({
path: 'featureSet.editingAvailable',
value: features.includes('editing'),
})
store.dispatch('setInstanceOption', {
name: 'pollLimits',
value: metadata.pollLimits,
})
store.dispatch('setInstanceOption', {
name: 'mailerEnabled',
useInstanceStore().set({
path: 'featureSet.mailerEnabled',
value: metadata.mailerEnabled,
})
store.dispatch('setInstanceOption', {
name: 'quotingAvailable',
useInstanceStore().set({
path: 'featureSet.quotingAvailable',
value: features.includes('quote_posting'),
})
store.dispatch('setInstanceOption', {
name: 'groupActorAvailable',
useInstanceStore().set({
path: 'featureSet.groupActorAvailable',
value: features.includes('pleroma:group_actors'),
})
store.dispatch('setInstanceOption', {
name: 'blockExpiration',
useInstanceStore().set({
path: 'featureSet.blockExpiration',
value: features.includes('pleroma:block_expiration'),
})
store.dispatch('setInstanceOption', {
name: 'localBubbleInstances',
useInstanceStore().set({
path: 'localBubbleInstances',
value: metadata.localBubbleInstances ?? [],
})
useInstanceStore().set({
path: 'featureSet.localBubble',
value: (metadata.localBubbleInstances ?? []).length > 0,
})
useInstanceStore().set({
path: 'limits.pollLimits',
value: metadata.pollLimits,
})
const uploadLimits = metadata.uploadLimits
store.dispatch('setInstanceOption', {
name: 'uploadlimit',
useInstanceStore().set({
name: 'limits.uploadlimit',
value: parseInt(uploadLimits.general),
})
store.dispatch('setInstanceOption', {
name: 'avatarlimit',
useInstanceStore().set({
name: 'limits.avatarlimit',
value: parseInt(uploadLimits.avatar),
})
store.dispatch('setInstanceOption', {
name: 'backgroundlimit',
useInstanceStore().set({
name: 'limits.backgroundlimit',
value: parseInt(uploadLimits.background),
})
store.dispatch('setInstanceOption', {
name: 'bannerlimit',
useInstanceStore().set({
name: 'limits.bannerlimit',
value: parseInt(uploadLimits.banner),
})
store.dispatch('setInstanceOption', {
name: 'fieldsLimits',
useInstanceStore().set({
name: 'limits.fieldsLimits',
value: metadata.fieldsLimits,
})
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'restrictedNicknames',
value: metadata.restrictedNicknames,
})
store.dispatch('setInstanceOption', {
name: 'postFormats',
useInstanceStore().set({
name: 'featureSet.postFormats',
value: metadata.postFormats,
})
const suggestions = metadata.suggestions
store.dispatch('setInstanceOption', {
name: 'suggestionsEnabled',
useInstanceStore().set({
name: 'featureSet.suggestionsEnabled',
value: suggestions.enabled,
})
store.dispatch('setInstanceOption', {
name: 'suggestionsWeb',
useInstanceStore().set({
name: 'featureSet.suggestionsWeb',
value: suggestions.web,
})
const software = data.software
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'backendVersion',
value: software.version,
})
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'backendRepository',
value: software.repository,
})
const priv = metadata.private
store.dispatch('setInstanceOption', { name: 'private', value: priv })
useInstanceStore().set({ name: 'private', value: priv })
const frontendVersion = window.___pleromafe_commit_hash
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'frontendVersion',
value: frontendVersion,
})
const federation = metadata.federation
store.dispatch('setInstanceOption', {
name: 'tagPolicyAvailable',
useInstanceStore().set({
name: 'featureSet.tagPolicyAvailable',
value:
typeof federation.mrf_policies === 'undefined'
? false
: metadata.federation.mrf_policies.includes('TagPolicy'),
})
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'federationPolicy',
value: federation,
})
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'federating',
value:
typeof federation.enabled === 'undefined' ? true : federation.enabled,
})
const accountActivationRequired = metadata.accountActivationRequired
store.dispatch('setInstanceOption', {
useInstanceStore().set({
name: 'accountActivationRequired',
value: accountActivationRequired,
})
@ -526,7 +538,7 @@ const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => {
typeof overrides.target !== 'undefined'
? overrides.target
: window.location.origin
store.dispatch('setInstanceOption', { name: 'server', value: server })
useInstanceStore().set({ name: 'server', value: server })
await setConfig({ store })
try {

13
src/boot/routes.js
View file

@ -32,12 +32,16 @@ import BookmarkFolderEdit from '../components/bookmark_folder_edit/bookmark_fold
import BookmarkFolders from '../components/bookmark_folders/bookmark_folders.vue'
import QuotesTimeline from '../components/quotes_timeline/quotes_timeline.vue'
import { useInstanceStore } from 'src/stores/instance.js'
export default (store) => {
const validateAuthenticatedRoute = (to, from, next) => {
if (store.state.users.currentUser) {
next()
} else {
next(store.state.instance.redirectRootNoLogin || '/main/all')
next(
useInstanceStore().instanceIdentity.redirectRootNoLogin || '/main/all',
)
}
}
@ -48,8 +52,9 @@ export default (store) => {
redirect: () => {
return (
(store.state.users.currentUser
? store.state.instance.redirectRootLogin
: store.state.instance.redirectRootNoLogin) || '/main/all'
? useInstanceStore().instanceIdentity.redirectRootLogin
: useInstanceStore().instanceIdentity.redirectRootNoLogin) ||
'/main/all'
)
},
},
@ -200,7 +205,7 @@ export default (store) => {
},
]
if (store.state.instance.pleromaChatMessagesAvailable) {
if (useInstanceStore().featureSet.pleromaChatMessagesAvailable) {
routes = routes.concat([
{
name: 'chat',

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

@ -4,6 +4,8 @@ import MRFTransparencyPanel from '../mrf_transparency_panel/mrf_transparency_pan
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'
const About = {
components: {
InstanceSpecificPanel,
@ -14,13 +16,13 @@ const About = {
},
computed: {
showFeaturesPanel() {
return this.$store.state.instance.showFeaturesPanel
return useInstanceStore().instanceIdentity.showFeaturesPanel
},
showInstanceSpecificPanel() {
return (
this.$store.state.instance.showInstanceSpecificPanel &&
useInstanceStore().instanceIdentity.showInstanceSpecificPanel &&
!this.$store.getters.mergedConfig.hideISP &&
this.$store.state.instance.instanceSpecificPanelContent
useInstanceStore().instanceIdentity.instanceSpecificPanelContent
)
},
},

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

@ -1,12 +1,14 @@
import { mapState } from 'vuex'
import { mapState } from 'pinia'
import UserListMenu from 'src/components/user_list_menu/user_list_menu.vue'
import UserTimedFilterModal from 'src/components/user_timed_filter_modal/user_timed_filter_modal.vue'
import { useReportsStore } from 'src/stores/reports'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import Popover from '../popover/popover.vue'
import ProgressButton from '../progress_button/progress_button.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useReportsStore } from 'src/stores/reports'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faEllipsisV } from '@fortawesome/free-solid-svg-icons'
@ -92,10 +94,10 @@ const AccountActions = {
shouldConfirmRemoveUserFromFollowers() {
return this.$store.getters.mergedConfig.modalOnRemoveUserFromFollowers
},
...mapState({
blockExpirationSupported: (state) => state.instance.blockExpiration,
pleromaChatMessagesAvailable: (state) =>
state.instance.pleromaChatMessagesAvailable,
...mapState(useInstanceStore, {
blockExpirationSupported: (store) => store.featureSet.blockExpiration,
pleromaChatMessagesAvailable: (store) =>
store.featureSet.pleromaChatMessagesAvailable,
}),
},
}

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

@ -1,10 +1,11 @@
import { mapState } from 'vuex'
import { useAnnouncementsStore } from 'src/stores/announcements'
import localeService from '../../services/locale/locale.service.js'
import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
import RichContent from '../rich_content/rich_content.jsx'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
const Announcement = {
components: {
AnnouncementEditor,

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

@ -1,9 +1,10 @@
import { mapState } from 'vuex'
import { useAnnouncementsStore } from 'src/stores/announcements'
import Announcement from '../announcement/announcement.vue'
import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
const AnnouncementsPage = {
components: {
Announcement,

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

@ -1,12 +1,14 @@
import { mapGetters } from 'vuex'
import { useMediaViewerStore } from 'src/stores/media_viewer'
import nsfwImage from '../../assets/nsfw.png'
import fileTypeService from '../../services/file_type/file_type.service.js'
import Flash from '../flash/flash.vue'
import StillImage from '../still-image/still-image.vue'
import VideoAttachment from '../video_attachment/video_attachment.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useMediaViewerStore } from 'src/stores/media_viewer'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faAlignRight,
@ -53,7 +55,8 @@ const Attachment = {
data() {
return {
localDescription: this.description || this.attachment.description,
nsfwImage: this.$store.state.instance.nsfwCensorImage || nsfwImage,
nsfwImage:
useInstanceStore().instanceIdentity.nsfwCensorImage || nsfwImage,
hideNsfwLocal: this.$store.getters.mergedConfig.hideNsfw,
preloadImage: this.$store.getters.mergedConfig.preloadImage,
loading: false,
@ -104,7 +107,9 @@ const Attachment = {
return 'file'
},
referrerpolicy() {
return this.$store.state.instance.mediaProxyAvailable ? '' : 'no-referrer'
return useInstanceStore().featureSet.mediaProxyAvailable
? ''
: 'no-referrer'
},
type() {
return fileTypeService.fileType(this.attachment.mimetype)

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

@ -1,11 +1,12 @@
import { mapState } from 'pinia'
import { h, resolveComponent } from 'vue'
import { useAuthFlowStore } from 'src/stores/auth_flow'
import LoginForm from '../login_form/login_form.vue'
import MFARecoveryForm from '../mfa_form/recovery_form.vue'
import MFATOTPForm from '../mfa_form/totp_form.vue'
import { useAuthFlowStore } from 'src/stores/auth_flow.js'
const AuthForm = {
name: 'AuthForm',
render() {

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

@ -1,6 +1,9 @@
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import UserAvatar from '../user_avatar/user_avatar.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
const AvatarList = {
props: ['users'],
computed: {
@ -16,7 +19,7 @@ const AvatarList = {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
},

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

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

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

@ -1,7 +1,9 @@
import { mapState } from 'vuex'
import { mapState } from 'pinia'
import BasicUserCard from '../basic_user_card/basic_user_card.vue'
import { useInstanceStore } from 'src/stores/instance.js'
const BlockCard = {
props: ['userId'],
computed: {
@ -24,8 +26,8 @@ const BlockCard = {
new Date(this.user.mute_expires_at).toLocaleString(),
])
},
...mapState({
blockExpirationSupported: (state) => state.instance.blockExpiration,
...mapState(useInstanceStore, {
blockExpirationSupported: (store) => store.featureSet.blockExpiration,
}),
},
components: {

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

@ -1,8 +1,9 @@
import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
import { useInterfaceStore } from 'src/stores/interface'
import apiService from '../../services/api/api.service'
import EmojiPicker from '../emoji_picker/emoji_picker.vue'
import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
import { useInterfaceStore } from 'src/stores/interface.js'
const BookmarkFolderEdit = {
data() {
return {

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

@ -1,6 +1,7 @@
import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
import BookmarkFolderCard from '../bookmark_folder_card/bookmark_folder_card.vue'
import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
const BookmarkFolders = {
data() {
return {

3
src/components/bookmark_folders_menu/bookmark_folders_menu_content.js
View file

@ -2,7 +2,8 @@ import { mapState } from 'pinia'
import { getBookmarkFolderEntries } from 'src/components/navigation/filter.js'
import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
export const BookmarkFoldersMenuContent = {
props: ['showPin'],

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

@ -2,7 +2,6 @@ import _ from 'lodash'
import { mapState as mapPiniaState } from 'pinia'
import { mapGetters, mapState } from 'vuex'
import { useInterfaceStore } from 'src/stores/interface.js'
import { WSConnectionStatus } from '../../services/api/api.service.js'
import chatService from '../../services/chat_service/chat_service.js'
import { buildFakeMessage } from '../../services/chat_utils/chat_utils.js'
@ -17,6 +16,8 @@ import {
isScrollable,
} from './chat_layout_utils.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faChevronDown, faChevronLeft } from '@fortawesome/free-solid-svg-icons'

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

@ -1,12 +1,13 @@
import { mapState } from 'vuex'
import fileType from 'src/services/file_type/file_type.service'
import AvatarList from '../avatar_list/avatar_list.vue'
import ChatTitle from '../chat_title/chat_title.vue'
import StatusBody from '../status_content/status_content.vue'
import Timeago from '../timeago/timeago.vue'
import UserAvatar from '../user_avatar/user_avatar.vue'
import fileType from 'src/services/file_type/file_type.service'
const ChatListItem = {
name: 'ChatListItem',
props: ['chat'],

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

@ -2,7 +2,6 @@ import { mapState as mapPiniaState } from 'pinia'
import { defineAsyncComponent } from 'vue'
import { mapGetters, mapState } from 'vuex'
import { useInterfaceStore } from 'src/stores/interface'
import Attachment from '../attachment/attachment.vue'
import ChatMessageDate from '../chat_message_date/chat_message_date.vue'
import Gallery from '../gallery/gallery.vue'
@ -11,6 +10,9 @@ import Popover from '../popover/popover.vue'
import StatusContent from '../status_content/status_content.vue'
import UserAvatar from '../user_avatar/user_avatar.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faEllipsisH, faTimes } from '@fortawesome/free-solid-svg-icons'
@ -74,7 +76,7 @@ const ChatMessage = {
}),
...mapState({
currentUser: (state) => state.users.currentUser,
restrictedNicknames: (state) => state.instance.restrictedNicknames,
restrictedNicknames: (state) => useInstanceStore().restrictedNicknames,
}),
popoverMarginStyle() {
if (this.isCurrentUser) {

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

@ -1,5 +1,6 @@
import Checkbox from 'src/components/checkbox/checkbox.vue'
import ColorInput from 'src/components/color_input/color_input.vue'
import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
import {
adoptStyleSheets,

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

@ -2,13 +2,14 @@ import { clone, filter, findIndex, get, reduce } from 'lodash'
import { mapState as mapPiniaState } from 'pinia'
import { mapGetters, mapState } from 'vuex'
import { useInterfaceStore } from 'src/stores/interface'
import { WSConnectionStatus } from '../../services/api/api.service.js'
import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue'
import QuickViewSettings from '../quick_view_settings/quick_view_settings.vue'
import Status from '../status/status.vue'
import ThreadTree from '../thread_tree/thread_tree.vue'
import { useInterfaceStore } from 'src/stores/interface'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faAngleDoubleDown,

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

@ -1,8 +1,11 @@
import SearchBar from 'components/search_bar/search_bar.vue'
import { mapActions, mapState } from 'pinia'
import { useInterfaceStore } from 'src/stores/interface'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faBell,
@ -51,7 +54,7 @@ export default {
}),
computed: {
enableMask() {
return this.supportsMask && this.$store.state.instance.logoMask
return this.supportsMask && this.logoMask
},
logoStyle() {
return {
@ -61,7 +64,7 @@ export default {
logoMaskStyle() {
return this.enableMask
? {
'mask-image': `url(${this.$store.state.instance.logo})`,
'mask-image': `url(${this.logo})`,
}
: {
'background-color': this.enableMask ? '' : 'transparent',
@ -70,7 +73,7 @@ export default {
logoBgStyle() {
return Object.assign(
{
margin: `${this.$store.state.instance.logoMargin} 0`,
margin: `${this.logoMargin} 0`,
opacity: this.searchBarHidden ? 1 : 0,
},
this.enableMask
@ -80,24 +83,18 @@ export default {
},
)
},
logo() {
return this.$store.state.instance.logo
},
sitename() {
return this.$store.state.instance.name
},
hideSitename() {
return this.$store.state.instance.hideSitename
},
logoLeft() {
return this.$store.state.instance.logoLeft
},
...mapState(useInstanceStore, ['private']),
...mapState(useInstanceStore, {
logoMask: (store) => store.instanceIdentity.logoMask,
logo: (store) => store.instanceIdentity.logo,
logoLeft: (store) => store.instanceIdentity.logoLeft,
logoMargin: (store) => store.instanceIdentity.logoMargin,
sitename: (store) => store.instanceIdentity.name,
hideSitename: (store) => store.instanceIdentity.hideSitename,
}),
currentUser() {
return this.$store.state.users.currentUser
},
privateMode() {
return this.$store.state.instance.private
},
shouldConfirmLogout() {
return this.$store.getters.mergedConfig.modalOnLogout
},
@ -127,11 +124,6 @@ export default {
onSearchBarToggled(hidden) {
this.searchBarHidden = hidden
},
openSettingsModal() {
useInterfaceStore().openSettingsModal('user')
},
openAdminModal() {
useInterfaceStore().openSettingsModal('admin')
},
...mapActions(useInterfaceStore, ['openSettingsModal']),
},
}

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

@ -40,7 +40,7 @@
<button
class="button-unstyled nav-icon"
:title="$t('nav.preferences')"
@click.stop="openSettingsModal"
@click.stop="openSettingsModal('user')"
>
<FAIcon
fixed-width
@ -53,7 +53,7 @@
class="button-unstyled nav-icon"
target="_blank"
:title="$t('nav.administration')"
@click.stop="openAdminModal"
@click.stop="openSettingsModal('admin')"
>
<FAIcon
fixed-width

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

@ -1,9 +1,10 @@
import get from 'lodash/get'
import { useEditStatusStore } from 'src/stores/editStatus'
import EditStatusForm from '../edit_status_form/edit_status_form.vue'
import Modal from '../modal/modal.vue'
import { useEditStatusStore } from 'src/stores/editStatus.js'
const EditStatusModal = {
components: {
EditStatusForm,

4
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 { useEmojiStore } from 'src/stores/emoji.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faSmileBeam } from '@fortawesome/free-regular-svg-icons'
@ -131,7 +133,7 @@ const EmojiInput = {
},
computed: {
padEmoji() {
return this.$store.getters.mergedConfig.padEmoji
return useEmojiStore().mergedConfig.padEmoji
},
defaultCandidateIndex() {
return this.$store.getters.mergedConfig.autocompleteSelect ? 0 : -1

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

@ -2,7 +2,7 @@
* suggest - generates a suggestor function to be used by emoji-input
* data: object providing source information for specific types of suggestions:
* data.emoji - optional, an array of all emoji available i.e.
* (getters.standardEmojiList + state.instance.customEmoji)
* (useEmojiStore().standardEmojiList + state.instance.customEmoji)
* data.users - optional, an array of all known users
* updateUsersList - optional, a function to search and append to users
*

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

@ -6,6 +6,9 @@ import { ensureFinalFallback } from '../../i18n/languages.js'
import Checkbox from '../checkbox/checkbox.vue'
import StillImage from '../still-image/still-image.vue'
import { useEmojiStore } from 'src/stores/emoji.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faBasketballBall,
@ -349,8 +352,8 @@ const EmojiPicker = {
return this.showingStickers ? '' : this.activeGroup
},
stickersAvailable() {
if (this.$store.state.instance.stickers) {
return this.$store.state.instance.stickers.length > 0
if (useEmojiStore().stickers) {
return useEmojiStore().stickers.length > 0
}
return 0
},
@ -358,7 +361,7 @@ const EmojiPicker = {
if (this.hideCustomEmoji || this.hideCustomEmojiInPicker) {
return {}
}
const emojis = this.$store.getters.groupedCustomEmojis
const emojis = useEmojiStore().groupedCustomEmojis
if (emojis.unpacked) {
emojis.unpacked.text = this.$t('emoji.unpacked')
}
@ -368,7 +371,7 @@ const EmojiPicker = {
return Object.keys(this.allCustomGroups)[0]
},
unicodeEmojiGroups() {
return this.$store.getters.standardEmojiGroupList.map((group) => ({
return useEmojiStore().standardEmojiGroupList.map((group) => ({
id: `standard-${group.id}`,
text: this.$t(`emoji.unicode_groups.${group.id}`),
icon: UNICODE_EMOJI_GROUP_ICON[group.id],
@ -381,7 +384,7 @@ const EmojiPicker = {
.concat(this.unicodeEmojiGroups)
},
stickerPickerEnabled() {
return (this.$store.state.instance.stickers || []).length !== 0
return (useEmojiStore().stickers || []).length !== 0
},
debouncedHandleKeywordChange() {
return debounce(() => {

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

@ -1,8 +1,8 @@
import { mapState as mapPiniaState } from 'pinia'
import { mapGetters } from 'vuex'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInterfaceStore } from 'src/stores/interface'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {

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

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

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

@ -1,8 +1,9 @@
import Checkbox from 'src/components/checkbox/checkbox.vue'
import Popover from 'src/components/popover/popover.vue'
import { useInterfaceStore } from 'src/stores/interface'
import Select from '../select/select.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faExclamationTriangle,

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

@ -1,8 +1,9 @@
import { set, sumBy } from 'lodash'
import { useMediaViewerStore } from 'src/stores/media_viewer'
import Attachment from '../attachment/attachment.vue'
import { useMediaViewerStore } from 'src/stores/media_viewer.js'
const Gallery = {
props: [
'attachments',

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

@ -1,4 +1,4 @@
import { useInterfaceStore } from 'src/stores/interface'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faTimes } from '@fortawesome/free-solid-svg-icons'

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

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

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

@ -1,6 +1,7 @@
import { useListsStore } from 'src/stores/lists'
import ListsCard from '../lists_card/lists_card.vue'
import { useListsStore } from 'src/stores/lists.js'
const Lists = {
data() {
return {

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

@ -3,12 +3,13 @@ import { mapGetters, mapState } from 'vuex'
import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
import { useInterfaceStore } from 'src/stores/interface'
import { useListsStore } from 'src/stores/lists'
import BasicUserCard from '../basic_user_card/basic_user_card.vue'
import ListsUserSearch from '../lists_user_search/lists_user_search.vue'
import UserAvatar from '../user_avatar/user_avatar.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useListsStore } from 'src/stores/lists.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faChevronLeft, faSearch } from '@fortawesome/free-solid-svg-icons'

8
src/components/lists_menu/lists_menu_content.js
View file

@ -3,7 +3,9 @@ import { mapState } from 'vuex'
import { getListEntries } from 'src/components/navigation/filter.js'
import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
import { useListsStore } from 'src/stores/lists'
import { useInstanceStore } from 'src/stores/instance.js'
import { useListsStore } from 'src/stores/lists.js'
export const ListsMenuContent = {
props: ['showPin'],
@ -16,8 +18,8 @@ export const ListsMenuContent = {
}),
...mapState({
currentUser: (state) => state.users.currentUser,
privateMode: (state) => state.instance.private,
federating: (state) => state.instance.federating,
privateMode: (state) => useInstanceStore().private,
federating: (state) => useInstanceStore().federating,
}),
},
}

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

@ -1,6 +1,7 @@
import { useListsStore } from 'src/stores/lists'
import Timeline from '../timeline/timeline.vue'
import { useListsStore } from 'src/stores/lists.js'
const ListsTimeline = {
data() {
return {

43
src/components/login_form/login_form.js
View file

@ -1,10 +1,12 @@
import { mapActions, mapState as mapPiniaState, mapStores } from 'pinia'
import { mapState } from 'vuex'
import { useAuthFlowStore } from 'src/stores/auth_flow.js'
import { useOAuthStore } from 'src/stores/oauth.js'
import oauthApi from '../../services/new_api/oauth.js'
import { useAuthFlowStore } from 'src/stores/auth_flow.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useOAuthStore } from 'src/stores/oauth.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faTimes } from '@fortawesome/free-solid-svg-icons'
@ -16,41 +18,34 @@ const LoginForm = {
error: false,
}),
computed: {
isPasswordAuth() {
return this.requiredPassword
},
isTokenAuth() {
return this.requiredToken
},
...mapStores(useOAuthStore),
...mapState({
registrationOpen: (state) => state.instance.registrationOpen,
instance: (state) => state.instance,
loggingIn: (state) => state.users.loggingIn,
}),
...mapPiniaState(useAuthFlowStore, [
'requiredPassword',
'requiredToken',
'requiredMFA',
]),
...mapPiniaState(useOAuthStore, ['clientId', 'clientSecret']),
...mapPiniaState(useInstanceStore, ['server', 'registrationOpen']),
...mapPiniaState(useAuthFlowStore, {
isTokenAuth: (store) => store.requiredToken,
isPasswordAuth: (store) => !store.requiredToken,
}),
},
methods: {
...mapActions(useAuthFlowStore, ['requireMFA', 'login']),
...mapActions(useOAuthStore, ['ensureAppToken']),
submit() {
this.isTokenAuth ? this.submitToken() : this.submitPassword()
},
submitToken() {
const data = {
instance: this.instance.server,
instance: this.server,
commit: this.$store.commit,
}
// NOTE: we do not really need the app token, but obtaining a token and
// calling verify_credentials is the only way to ensure the app still works.
this.oauthStore.ensureAppToken().then(() => {
this.ensureAppToken().then(() => {
const app = {
clientId: this.oauthStore.clientId,
clientSecret: this.oauthStore.clientSecret,
clientId: this.clientId,
clientSecret: this.clientSecret,
}
oauthApi.login({ ...app, ...data })
})
@ -60,16 +55,16 @@ const LoginForm = {
// NOTE: we do not really need the app token, but obtaining a token and
// calling verify_credentials is the only way to ensure the app still works.
this.oauthStore.ensureAppToken().then(() => {
this.ensureAppToken().then(() => {
const app = {
clientId: this.oauthStore.clientId,
clientSecret: this.oauthStore.clientSecret,
clientId: this.clientId,
clientSecret: this.clientSecret,
}
oauthApi
.getTokenWithCredentials({
...app,
instance: this.instance.server,
instance: this.server,
username: this.user.username,
password: this.user.password,
})

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

@ -1,5 +1,4 @@
import Flash from 'src/components/flash/flash.vue'
import { useMediaViewerStore } from 'src/stores/media_viewer'
import fileTypeService from '../../services/file_type/file_type.service.js'
import GestureService from '../../services/gesture_service/gesture_service'
import Modal from '../modal/modal.vue'
@ -8,6 +7,8 @@ import StillImage from '../still-image/still-image.vue'
import SwipeClick from '../swipe_click/swipe_click.vue'
import VideoAttachment from '../video_attachment/video_attachment.vue'
import { useMediaViewerStore } from 'src/stores/media_viewer.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faChevronLeft,

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

@ -1,8 +1,8 @@
/* eslint-env browser */
import fileSizeFormatService from '../../services/file_size_format/file_size_format.js'
import statusPosterService from '../../services/status_poster/status_poster.service.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faCircleNotch, faUpload } from '@fortawesome/free-solid-svg-icons'
@ -122,10 +122,10 @@ const mediaUpload = {
async uploadFile(file) {
const self = this
const store = this.$store
if (file.size > store.state.instance.uploadlimit) {
if (file.size > useInstanceStore().uploadlimit) {
const filesize = fileSizeFormatService.fileSizeFormat(file.size)
const allowedsize = fileSizeFormatService.fileSizeFormat(
store.state.instance.uploadlimit,
useInstanceStore().uploadlimit,
)
self.$emit('upload-failed', 'file_too_big', {
filesize: filesize.num,

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

@ -1,7 +1,6 @@
import { defineAsyncComponent } from 'vue'
import { mapGetters, mapState } from 'vuex'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import {
highlightClass,
highlightStyle,
@ -9,6 +8,8 @@ import {
import UnicodeDomainIndicator from '../unicode_domain_indicator/unicode_domain_indicator.vue'
import UserAvatar from '../user_avatar/user_avatar.vue'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faAt } from '@fortawesome/free-solid-svg-icons'

26
src/components/mfa_form/recovery_form.js
View file

@ -1,9 +1,10 @@
import { mapActions, mapState as mapPiniaState, mapStores } from 'pinia'
import { mapState } from 'vuex'
import { mapActions, mapState, mapStores } from 'pinia'
import mfaApi from '../../services/new_api/mfa.js'
import { useAuthFlowStore } from 'src/stores/auth_flow.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useOAuthStore } from 'src/stores/oauth.js'
import mfaApi from '../../services/new_api/mfa.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faTimes } from '@fortawesome/free-solid-svg-icons'
@ -16,13 +17,10 @@ export default {
error: false,
}),
computed: {
...mapPiniaState(useAuthFlowStore, {
authSettings: (store) => store.settings,
}),
...mapStores(useOAuthStore),
...mapState({
instance: 'instance',
}),
...mapState(useOAuthStore, ['clientId', 'clientSecret']),
...mapState(useAuthFlowStore, ['settings']),
...mapState(useInstanceStore, ['server']),
},
methods: {
...mapActions(useAuthFlowStore, ['requireTOTP', 'abortMFA', 'login']),
@ -37,13 +35,11 @@ export default {
},
submit() {
const { clientId, clientSecret } = this.oauthStore
const data = {
clientId,
clientSecret,
instance: this.instance.server,
mfaToken: this.authSettings.mfa_token,
clientId: this.clientId,
clientSecret: this.clientSecret,
instance: this.server,
mfaToken: this.settings.mfa_token,
code: this.code,
}

15
src/components/mfa_form/totp_form.js
View file

@ -1,9 +1,10 @@
import { mapActions, mapState as mapPiniaState, mapStores } from 'pinia'
import { mapState } from 'vuex'
import { mapActions, mapState, mapStores } from 'pinia'
import mfaApi from '../../services/new_api/mfa.js'
import { useAuthFlowStore } from 'src/stores/auth_flow.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useOAuthStore } from 'src/stores/oauth.js'
import mfaApi from '../../services/new_api/mfa.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faTimes } from '@fortawesome/free-solid-svg-icons'
@ -16,13 +17,11 @@ export default {
error: false,
}),
computed: {
...mapPiniaState(useAuthFlowStore, {
...mapState(useAuthFlowStore, {
authSettings: (store) => store.settings,
}),
...mapState(useInstanceStore, ['server']),
...mapStores(useOAuthStore),
...mapState({
instance: 'instance',
}),
},
methods: {
...mapActions(useAuthFlowStore, ['requireRecovery', 'abortMFA', 'login']),
@ -42,7 +41,7 @@ export default {
const data = {
clientId,
clientSecret,
instance: this.instance.server,
instance: this.server,
mfaToken: this.authSettings.mfa_token,
code: this.code,
}

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

@ -2,8 +2,6 @@ import { mapState } from 'pinia'
import { mapGetters } from 'vuex'
import NavigationPins from 'src/components/navigation/navigation_pins.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import GestureService from '../../services/gesture_service/gesture_service'
import {
countExtraNotifications,
@ -13,6 +11,10 @@ import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import Notifications from '../notifications/notifications.vue'
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 { library } from '@fortawesome/fontawesome-svg-core'
import {
faArrowUp,
@ -64,10 +66,10 @@ const MobileNav = {
return `${this.unseenCount ? this.unseenCount : ''}`
},
hideSitename() {
return this.$store.state.instance.hideSitename
return useInstanceStore().hideSitename
},
sitename() {
return this.$store.state.instance.name
return useInstanceStore().name
},
isChat() {
return this.$route.name === 'chat'

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

@ -1,6 +1,6 @@
import { debounce } from 'lodash'
import { usePostStatusStore } from 'src/stores/post_status'
import { usePostStatusStore } from 'src/stores/post_status.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faPen } from '@fortawesome/free-solid-svg-icons'

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

@ -1,6 +1,8 @@
import DialogModal from '../dialog_modal/dialog_modal.vue'
import Popover from '../popover/popover.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faChevronDown } from '@fortawesome/free-solid-svg-icons'
@ -54,7 +56,7 @@ const ModerationTools = {
},
canUseTagPolicy() {
return (
this.$store.state.instance.tagPolicyAvailable &&
useInstanceStore().featureSet.tagPolicyAvailable &&
this.privileged('users_manage_tags')
)
},

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

@ -8,7 +8,9 @@ import { filterNavigation } from 'src/components/navigation/filter.js'
import { ROOT_ITEMS, TIMELINES } from 'src/components/navigation/navigation.js'
import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
import NavigationPins from 'src/components/navigation/navigation_pins.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInstanceStore } from 'src/stores/instance.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { library } from '@fortawesome/fontawesome-svg-core'
@ -110,6 +112,14 @@ const NavPanel = {
unreadAnnouncementCount: 'unreadAnnouncementCount',
supportsAnnouncements: (store) => store.supportsAnnouncements,
}),
...mapPiniaState(useInstanceStore, ['private', 'federating']),
...mapPiniaState(useInstanceStore, {
pleromaChatMessagesAvailable: (store) =>
store.featureSet.pleromaChatMessagesAvailable,
bookmarkFolders: (store) =>
store.fetaureSet.pleromaBookmarkFoldersAvailable,
bubbleTimeline: (store) => store.fetaureSet.localBubble,
}),
...mapPiniaState(useServerSideStorageStore, {
collapsed: (store) => store.prefsStorage.simple.collapseNav,
pinnedItems: (store) =>
@ -118,13 +128,6 @@ const NavPanel = {
...mapState({
currentUser: (state) => state.users.currentUser,
followRequestCount: (state) => state.api.followRequests.length,
privateMode: (state) => state.instance.private,
federating: (state) => state.instance.federating,
pleromaChatMessagesAvailable: (state) =>
state.instance.pleromaChatMessagesAvailable,
bookmarkFolders: (state) =>
state.instance.pleromaBookmarkFoldersAvailable,
bubbleTimeline: (state) => state.instance.localBubbleInstances.length > 0,
}),
timelinesItems() {
return filterNavigation(

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

@ -3,8 +3,9 @@ import { mapState } from 'vuex'
import { routeTo } from 'src/components/navigation/navigation.js'
import OptionalRouterLink from 'src/components/optional_router_link/optional_router_link.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faThumbtack } from '@fortawesome/free-solid-svg-icons'

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

@ -12,8 +12,10 @@ import {
TIMELINES,
} from 'src/components/navigation/navigation.js'
import StillImage from 'src/components/still-image/still-image.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
import { useInstanceStore } from 'src/stores/instance.js'
import { useListsStore } from 'src/stores/lists'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
@ -71,14 +73,16 @@ const NavPanel = {
pinnedItems: (store) =>
new Set(store.prefsStorage.collections.pinnedNavItems),
}),
...mapPiniaState(useInstanceStore, {
bookmarks: getBookmarkFolderEntries,
pleromaChatMessagesAvailable: (store) =>
store.featureSet.pleromaChatMessagesAvailable,
bubbleTimeline: (store) => store.featureSet.localBubble,
}),
...mapPiniaState(useInstanceStore, ['private', 'federating']),
...mapState({
currentUser: (state) => state.users.currentUser,
followRequestCount: (state) => state.api.followRequests.length,
privateMode: (state) => state.instance.private,
federating: (state) => state.instance.federating,
pleromaChatMessagesAvailable: (state) =>
state.instance.pleromaChatMessagesAvailable,
bubbleTimeline: (state) => state.instance.localBubbleInstances.length > 0,
}),
pinnedList() {
if (!this.currentUser) {
@ -92,7 +96,7 @@ const NavPanel = {
hasChats: this.pleromaChatMessagesAvailable,
hasAnnouncements: this.supportsAnnouncements,
isFederating: this.federating,
isPrivate: this.privateMode,
isPrivate: this.private,
currentUser: this.currentUser,
supportsBubbleTimeline: this.bubbleTimeline,
supportsBookmarkFolders: this.bookmarks,
@ -116,7 +120,7 @@ const NavPanel = {
supportsBubbleTimeline: this.bubbleTimeline,
supportsBookmarkFolders: this.bookmarks,
isFederating: this.federating,
isPrivate: this.privateMode,
isPrivate: this.private,
currentUser: this.currentUser,
},
).slice(0, this.limit)

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

@ -1,7 +1,6 @@
import { mapState } from 'vuex'
import RichContent from 'src/components/rich_content/rich_content.jsx'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { isStatusNotification } from '../../services/notification_utils/notification_utils.js'
import {
highlightClass,
@ -17,6 +16,10 @@ import UserCard from '../user_card/user_card.vue'
import UserLink from '../user_link/user_link.vue'
import UserPopover from '../user_popover/user_popover.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faCheck,
@ -107,7 +110,7 @@ const Notification = {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
getUser(notification) {

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

@ -2,8 +2,6 @@ import { mapState } from 'pinia'
import { computed } from 'vue'
import { mapGetters } from 'vuex'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInterfaceStore } from 'src/stores/interface'
import FaviconService from '../../services/favicon_service/favicon_service.js'
import {
ACTIONABLE_NOTIFICATION_TYPES,
@ -17,6 +15,9 @@ import ExtraNotifications from '../extra_notifications/extra_notifications.vue'
import Notification from '../notification/notification.vue'
import NotificationFilters from './notification_filters.vue'
import { useAnnouncementsStore } from 'src/stores/announcements.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faArrowUp,

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

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

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

@ -48,11 +48,13 @@
import { computed } from 'vue'
import ColorInput from 'src/components/color_input/color_input.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import {
newExporter,
newImporter,
} from 'src/services/export_import/export_import.js'
import { useInterfaceStore } from 'src/stores/interface'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faFileExport, faFileImport } from '@fortawesome/free-solid-svg-icons'

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

@ -1,7 +1,10 @@
import { mapState as mapPiniaState } from 'pinia'
import { mapState } from 'vuex'
import passwordResetApi from '../../services/new_api/password_reset.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faTimes } from '@fortawesome/free-solid-svg-icons'
@ -20,11 +23,8 @@ const passwordReset = {
computed: {
...mapState({
signedIn: (state) => !!state.users.currentUser,
instance: (state) => state.instance,
}),
mailerEnabled() {
return this.instance.mailerEnabled
},
...mapPiniaState(useInstanceStore, ['server', 'mailerEnabled']),
},
created() {
if (this.signedIn) {
@ -44,9 +44,9 @@ const passwordReset = {
submit() {
this.isPending = true
const email = this.user.email
const instance = this.instance.server
const server = this.server
passwordResetApi({ instance, email })
passwordResetApi({ server, email })
.then(({ status }) => {
this.isPending = false
this.user.email = ''

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

@ -2,9 +2,10 @@ import Checkbox from 'components/checkbox/checkbox.vue'
import RichContent from 'components/rich_content/rich_content.jsx'
import Timeago from 'components/timeago/timeago.vue'
import { usePollsStore } from 'src/stores/polls'
import genRandomSeed from '../../services/random_seed/random_seed.service.js'
import { usePollsStore } from 'src/stores/polls.js'
export default {
name: 'Poll',
props: ['basePoll', 'emoji'],

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

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

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

@ -5,9 +5,6 @@ import { mapGetters } from 'vuex'
import DraftCloser from 'src/components/draft_closer/draft_closer.vue'
import Gallery from 'src/components/gallery/gallery.vue'
import Popover from 'src/components/popover/popover.vue'
import { pollFormToMasto } from 'src/services/poll/poll.service.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMediaViewerStore } from 'src/stores/media_viewer.js'
import { propsToNative } from '../../services/attributes_helper/attributes_helper.service.js'
import fileTypeService from '../../services/file_type/file_type.service.js'
import { findOffset } from '../../services/offset_finder/offset_finder.service.js'
@ -23,6 +20,13 @@ import ScopeSelector from '../scope_selector/scope_selector.vue'
import Select from '../select/select.vue'
import StatusContent from '../status_content/status_content.vue'
import { useEmojiStore } from 'src/stores/emoji.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import { useMediaViewerStore } from 'src/stores/media_viewer.js'
import { pollFormToMasto } from 'src/services/poll/poll.service.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faBan,
@ -258,8 +262,8 @@ const PostStatusForm = {
emojiUserSuggestor() {
return suggestor({
emoji: [
...this.$store.getters.standardEmojiList,
...this.$store.state.instance.customEmoji,
...useEmojiStore().standardEmojiList,
...useEmojiStore().customEmoji,
],
store: this.$store,
})
@ -267,16 +271,16 @@ const PostStatusForm = {
emojiSuggestor() {
return suggestor({
emoji: [
...this.$store.getters.standardEmojiList,
...this.$store.state.instance.customEmoji,
...useEmojiStore().standardEmojiList,
...useEmojiStore().customEmoji,
],
})
},
emoji() {
return this.$store.getters.standardEmojiList || []
return useEmojiStore().standardEmojiList || []
},
customEmoji() {
return this.$store.state.instance.customEmoji || []
return useEmojiStore().customEmoji || []
},
statusLength() {
return this.newStatus.status.length
@ -285,7 +289,7 @@ const PostStatusForm = {
return this.newStatus.spoilerText.length
},
statusLengthLimit() {
return this.$store.state.instance.textlimit
return useInstanceStore().textlimit
},
hasStatusLengthLimit() {
return this.statusLengthLimit > 0
@ -299,21 +303,21 @@ const PostStatusForm = {
return this.hasStatusLengthLimit && this.charactersLeft < 0
},
minimalScopesMode() {
return this.$store.state.instance.minimalScopesMode
return useInstanceStore().minimalScopesMode
},
alwaysShowSubject() {
return this.mergedConfig.alwaysShowSubjectInput
},
postFormats() {
return this.$store.state.instance.postFormats || []
return useInstanceStore().featureSet.postFormats || []
},
safeDMEnabled() {
return this.$store.state.instance.safeDM
return useInstanceStore().featureSet.safeDM
},
pollsAvailable() {
return (
this.$store.state.instance.pollsAvailable &&
this.$store.state.instance.pollLimits.max_options >= 2 &&
useInstanceStore().featureSet.pollsAvailable &&
useInstanceStore().limits.pollLimits.max_options >= 2 &&
this.disablePolls !== true
)
},
@ -342,7 +346,7 @@ const PostStatusForm = {
return typeof this.statusId !== 'undefined' && this.statusId.trim() !== ''
},
quotable() {
if (!this.$store.state.instance.quotingAvailable) {
if (!useInstanceStore().featureSet.quotingAvailable) {
return false
}

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

@ -1,9 +1,10 @@
import get from 'lodash/get'
import { usePostStatusStore } from 'src/stores/post_status'
import Modal from '../modal/modal.vue'
import PostStatusForm from '../post_status_form/post_status_form.vue'
import { usePostStatusStore } from 'src/stores/post_status.js'
const PostStatusModal = {
components: {
PostStatusForm,

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

@ -1,9 +1,10 @@
import { mapState } from 'pinia'
import { mapGetters } from 'vuex'
import { useInterfaceStore } from 'src/stores/interface'
import Popover from '../popover/popover.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faFilter, faFont, faWrench } from '@fortawesome/free-solid-svg-icons'

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

@ -3,7 +3,8 @@ 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'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {

24
src/components/registration/registration.js
View file

@ -1,12 +1,16 @@
import useVuelidate from '@vuelidate/core'
import { required, requiredIf, sameAs } from '@vuelidate/validators'
import { mapState as mapPiniaState } from 'pinia'
import { mapActions, mapState } from 'vuex'
import { DAY } from 'src/services/date_utils/date_utils.js'
import localeService from '../../services/locale/locale.service.js'
import InterfaceLanguageSwitcher from '../interface_language_switcher/interface_language_switcher.vue'
import TermsOfServicePanel from '../terms_of_service_panel/terms_of_service_panel.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { DAY } from 'src/services/date_utils/date_utils.js'
const registration = {
setup() {
return { v$: useVuelidate() }
@ -96,21 +100,21 @@ const registration = {
)
)
},
...mapPiniaState(useInstanceStore, {
registrationOpen: (store) => store.registrationOpen,
embeddedToS: (store) => store.embeddedToS,
termsOfService: (store) => store.tos,
accountActivationRequired: (store) => store.accountActivationRequired,
accountApprovalRequired: (store) => store.accountApprovalRequired,
birthdayRequired: (store) => store.birthdayRequired,
birthdayMinAge: (store) => store.birthdayMinAge,
}),
...mapState({
registrationOpen: (state) => state.instance.registrationOpen,
signedIn: (state) => !!state.users.currentUser,
isPending: (state) => state.users.signUpPending,
serverValidationErrors: (state) => state.users.signUpErrors,
signUpNotice: (state) => state.users.signUpNotice,
hasSignUpNotice: (state) => !!state.users.signUpNotice.message,
termsOfService: (state) => state.instance.tos,
embeddedToS: (state) => state.instance.embeddedToS,
accountActivationRequired: (state) =>
state.instance.accountActivationRequired,
accountApprovalRequired: (state) =>
state.instance.accountApprovalRequired,
birthdayRequired: (state) => state.instance.birthdayRequired,
birthdayMinAge: (state) => state.instance.birthdayMinAge,
}),
},
methods: {

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

@ -1,10 +1,13 @@
import RichContent from 'src/components/rich_content/rich_content.jsx'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useReportsStore } from 'src/stores/reports'
import Select from '../select/select.vue'
import StatusContent from '../status_content/status_content.vue'
import Timeago from '../timeago/timeago.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useReportsStore } from 'src/stores/reports.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
const Report = {
props: ['reportId'],
components: {
@ -31,7 +34,7 @@ const Report = {
return generateProfileLink(
user.id,
user.screen_name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
setReportState(state) {

1
src/components/rich_content/rich_content.jsx
View file

@ -5,6 +5,7 @@ import { MENTIONS_LIMIT } from 'src/components/mentions_line/mentions_line.js'
import MentionsLine from 'src/components/mentions_line/mentions_line.vue'
import StillImage from 'src/components/still-image/still-image.vue'
import StillImageEmojiPopover from 'src/components/still-image/still-image-emoji-popover.vue'
import { convertHtmlToLines } from 'src/services/html_converter/html_line_converter.service.js'
import { convertHtmlToTree } from 'src/services/html_converter/html_tree_converter.service.js'
import {

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

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

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

@ -1,6 +1,5 @@
import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
import Popover from 'src/components/popover/popover.vue'
import { useInterfaceStore } from 'src/stores/interface'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import GroupSetting from '../helpers/group_setting.vue'
@ -8,6 +7,8 @@ import IntegerSetting from '../helpers/integer_setting.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import StringSetting from '../helpers/string_setting.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faGlobe } from '@fortawesome/free-solid-svg-icons'

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

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

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

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

2
src/components/settings_modal/helpers/vertical_tab_switcher.jsx
View file

@ -8,7 +8,7 @@ import { FontAwesomeIcon as FAIcon } from '@fortawesome/vue-fontawesome'
import './vertical_tab_switcher.scss'
import { useInterfaceStore } from 'src/stores/interface'
import { useInterfaceStore } from 'src/stores/interface.js'
const findFirstUsable = (slots) => slots.findIndex((_) => _.props)

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

@ -6,13 +6,15 @@ import Checkbox from 'src/components/checkbox/checkbox.vue'
import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
import Modal from 'src/components/modal/modal.vue'
import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
import Popover from '../popover/popover.vue'
import { useInterfaceStore } from 'src/stores/interface.js'
import {
newExporter,
newImporter,
} from 'src/services/export_import/export_import.js'
import getResettableAsyncComponent from 'src/services/resettable_async_component.js'
import { useInterfaceStore } from 'src/stores/interface'
import Popover from '../popover/popover.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faWindowMinimize } from '@fortawesome/free-regular-svg-icons'

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

@ -1,4 +1,3 @@
import { useInterfaceStore } from 'src/stores/interface'
import AuthTab from './admin_tabs/auth_tab.vue'
import EmojiTab from './admin_tabs/emoji_tab.vue'
import FederationTab from './admin_tabs/federation_tab.vue'
@ -18,6 +17,8 @@ import RegistrationsTab from './admin_tabs/registrations_tab.vue'
import UploadsTab from './admin_tabs/uploads_tab.vue'
import VerticalTabSwitcher from './helpers/vertical_tab_switcher.jsx'
import { useInterfaceStore } from 'src/stores/interface.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faChain,

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

@ -1,4 +1,3 @@
import { useInterfaceStore } from 'src/stores/interface'
import VerticalTabSwitcher from './helpers/vertical_tab_switcher.jsx'
import AppearanceTab from './tabs/appearance_tab.vue'
import ClutterTab from './tabs/clutter_tab.vue'
@ -16,6 +15,8 @@ import ProfileTab from './tabs/profile_tab.vue'
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 { library } from '@fortawesome/fontawesome-svg-core'
import {
faBell,

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

@ -2,6 +2,18 @@ import { mapActions } from 'pinia'
import fileSizeFormatService from 'src/components/../services/file_size_format/file_size_format.js'
import PaletteEditor from 'src/components/palette_editor/palette_editor.vue'
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'
import { useInstanceStore } from 'src/stores/instance.js'
import { normalizeThemeData, useInterfaceStore } from 'src/stores/interface.js'
import { newImporter } from 'src/services/export_import/export_import.js'
import {
adoptStyleSheets,
@ -11,15 +23,6 @@ import { getCssRules } from 'src/services/theme_data/css_utils.js'
import { deserialize } from 'src/services/theme_data/iss_deserializer.js'
import { init } from 'src/services/theme_data/theme_data_3.service.js'
import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
import { normalizeThemeData, useInterfaceStore } from 'src/stores/interface'
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'
const AppearanceTab = {
data() {
@ -83,7 +86,7 @@ const AppearanceTab = {
const updateIndex = (resource) => {
const capitalizedResource = resource[0].toUpperCase() + resource.slice(1)
const currentIndex = this.$store.state.instance[`${resource}sIndex`]
const currentIndex = useInstanceStore()[`${resource}sIndex`]
let promise
if (currentIndex) {
@ -273,11 +276,11 @@ const AppearanceTab = {
return !window.IntersectionObserver
},
instanceWallpaper() {
this.$store.state.instance.background
useInstanceStore().instanceIdentity.background
},
instanceWallpaperUsed() {
return (
this.$store.state.instance.background &&
useInstanceStore().instanceIdentity.background &&
!this.$store.state.users.currentUser.background_image
)
},
@ -333,18 +336,21 @@ const AppearanceTab = {
},
isThemeActive(key) {
return (
key === (this.mergedConfig.theme || this.$store.state.instance.theme)
key ===
(this.mergedConfig.theme || useInstanceStore().instanceIdentity.theme)
)
},
isStyleActive(key) {
return (
key === (this.mergedConfig.style || this.$store.state.instance.style)
key ===
(this.mergedConfig.style || useInstanceStore().instanceIdentity.style)
)
},
isPaletteActive(key) {
return (
key ===
(this.mergedConfig.palette || this.$store.state.instance.palette)
(this.mergedConfig.palette ||
useInstanceStore().instanceIdentity.palette)
)
},
...mapActions(useInterfaceStore, ['setStyle', 'setTheme']),
@ -431,10 +437,10 @@ const AppearanceTab = {
if (!file) {
return
}
if (file.size > this.$store.state.instance[slot + 'limit']) {
if (file.size > useInstanceStore()[slot + 'limit']) {
const filesize = fileSizeFormatService.fileSizeFormat(file.size)
const allowedsize = fileSizeFormatService.fileSizeFormat(
this.$store.state.instance[slot + 'limit'],
useInstanceStore()[slot + 'limit'],
)
useInterfaceStore().pushGlobalNotice({
messageKey: 'upload.error.message',

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

@ -1,10 +1,8 @@
import { mapActions, mapState } from 'pinia'
import { v4 as uuidv4 } from 'uuid'
import { mapState as mapVuexState } from 'vuex'
import Checkbox from 'src/components/checkbox/checkbox.vue'
import Select from 'src/components/select/select.vue'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import HelpIndicator from '../helpers/help_indicator.vue'
@ -12,6 +10,9 @@ import IntegerSetting from '../helpers/integer_setting.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import UnitSetting from '../helpers/unit_setting.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
const ClutterTab = {
components: {
BooleanSetting,
@ -24,7 +25,7 @@ const ClutterTab = {
},
computed: {
instanceSpecificPanelPresent() {
return this.$store.state.instance.showInstanceSpecificPanel
return useInstanceStore().showInstanceSpecificPanel
},
...SharedComputedObject(),
...mapState(useServerSideStorageStore, {
@ -32,8 +33,8 @@ const ClutterTab = {
Object.entries(store.prefsStorage.simple.muteFilters),
muteFiltersObject: (store) => store.prefsStorage.simple.muteFilters,
}),
...mapVuexState({
blockExpirationSupported: (state) => state.instance.blockExpiration,
...mapState(useInstanceStore, {
blockExpirationSupported: (store) => store.featureSet.blockExpiration,
}),
onMuteDefaultActionLv1: {
get() {

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

@ -4,8 +4,6 @@ import FontControl from 'src/components/font_control/font_control.vue'
import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
import Select from 'src/components/select/select.vue'
import localeService from 'src/services/locale/locale.service.js'
import { cacheKey, clearCache, emojiCacheKey } from 'src/services/sw/sw.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
@ -14,6 +12,11 @@ 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 localeService from 'src/services/locale/locale.service.js'
import { cacheKey, clearCache, emojiCacheKey } from 'src/services/sw/sw.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faDatabase,
@ -108,7 +111,7 @@ const ComposingTab = {
},
computed: {
postFormats() {
return this.$store.state.instance.postFormats || []
return useInstanceStore().postFormats || []
},
postContentOptions() {
return this.postFormats.map((format) => ({
@ -129,8 +132,8 @@ const ComposingTab = {
},
},
...SharedComputedObject(),
...mapState({
blockExpirationSupported: (state) => state.instance.blockExpiration,
...mapState(useInstanceStore, {
blockExpirationSupported: (store) => store.featureSet.blockExpiration,
}),
},
methods: {

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

@ -3,7 +3,8 @@ import { mapState } from 'vuex'
import Checkbox from 'src/components/checkbox/checkbox.vue'
import Exporter from 'src/components/exporter/exporter.vue'
import Importer from 'src/components/importer/importer.vue'
import { useOAuthTokensStore } from 'src/stores/oauth_tokens'
import { useOAuthTokensStore } from 'src/stores/oauth_tokens.js'
const DataImportExportTab = {
data() {

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

@ -1,13 +1,16 @@
import { cacheKey, clearCache, emojiCacheKey } from 'src/services/sw/sw.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { cacheKey, clearCache, emojiCacheKey } from 'src/services/sw/sw.js'
const pleromaFeCommitUrl =
'https://git.pleroma.social/pleroma/pleroma-fe/commit/'
const VersionTab = {
data() {
const instance = this.$store.state.instance
const instance = useInstanceStore()
return {
backendVersion: instance.backendVersion,
backendRepository: instance.backendRepository,

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

@ -1,16 +1,9 @@
import { cloneDeep } from 'lodash'
import { mapActions, mapState } from 'pinia'
import { v4 as uuidv4 } from 'uuid'
import { mapState as mapVuexState } from 'vuex'
import Checkbox from 'src/components/checkbox/checkbox.vue'
import Select from 'src/components/select/select.vue'
import {
newExporter,
newImporter,
} from 'src/services/export_import/export_import.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import HelpIndicator from '../helpers/help_indicator.vue'
@ -18,6 +11,15 @@ import IntegerSetting from '../helpers/integer_setting.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
import UnitSetting from '../helpers/unit_setting.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import {
newExporter,
newImporter,
} from 'src/services/export_import/export_import.js'
const SUPPORTED_TYPES = new Set(['word', 'regexp', 'user', 'user_regexp'])
const FilteringTab = {
@ -90,7 +92,7 @@ const FilteringTab = {
},
computed: {
instanceSpecificPanelPresent() {
return this.$store.state.instance.showInstanceSpecificPanel
return useInstanceStore().instanceIdentity.showInstanceSpecificPanel
},
...SharedComputedObject(),
...mapState(useServerSideStorageStore, {
@ -98,8 +100,8 @@ const FilteringTab = {
Object.entries(store.prefsStorage.simple.muteFilters),
muteFiltersObject: (store) => store.prefsStorage.simple.muteFilters,
}),
...mapVuexState({
blockExpirationSupported: (state) => state.instance.blockExpiration,
...mapState(useInstanceStore, {
blockExpirationSupported: (store) => store.featureSet.blockExpiration,
}),
onMuteDefaultActionLv1: {
get() {

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

@ -1,8 +1,7 @@
import { mapState } from 'vuex'
import { mapState } from 'pinia'
import FontControl from 'src/components/font_control/font_control.vue'
import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
import localeService from 'src/services/locale/locale.service.js'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
@ -10,6 +9,10 @@ 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 localeService from 'src/services/locale/locale.service.js'
const GeneralTab = {
props: {
parentCollapsed: {
@ -49,8 +52,8 @@ const GeneralTab = {
},
},
...SharedComputedObject(),
...mapState({
blockExpirationSupported: (state) => state.instance.blockExpiration,
...mapState(useInstanceStore, {
blockExpirationSupported: (store) => store.featureSet.blockExpiration,
}),
},
methods: {

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

@ -4,6 +4,8 @@ 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'
const GeneralTab = {
props: {
parentCollapsed: {
@ -30,10 +32,10 @@ const GeneralTab = {
},
computed: {
postFormats() {
return this.$store.state.instance.postFormats || []
return useInstanceStore().featureSet.postFormats || []
},
instanceShoutboxPresent() {
return this.$store.state.instance.shoutAvailable
return useInstanceStore().featureSet.shoutAvailable
},
columns() {
const mode = this.$store.getters.mergedConfig.thirdColumnMode

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

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

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

@ -7,6 +7,11 @@ import RangeInput from 'src/components/range_input/range_input.vue'
import Select from 'src/components/select/select.vue'
import ShadowControl from 'src/components/shadow_control/shadow_control.vue'
import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
import Preview from './theme_preview.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface.js'
import {
getContrastRatioLayers,
hex2rgb,
@ -41,8 +46,6 @@ import {
} from 'src/services/theme_data/theme_data.service.js'
import { init } from 'src/services/theme_data/theme_data_3.service.js'
import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
import { useInterfaceStore } from 'src/stores/interface'
import Preview from './theme_preview.vue'
// List of color values used in v1
const v1OnlyNames = [
@ -125,7 +128,7 @@ export default {
}
},
created() {
const currentIndex = this.$store.state.instance.themesIndex
const currentIndex = useInstanceStore().themesIndex
let promise
if (currentIndex) {

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

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

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

@ -20,6 +20,12 @@ import SelectMotion from 'src/components/select/select_motion.vue'
import ShadowControl from 'src/components/shadow_control/shadow_control.vue'
import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
import Tooltip from 'src/components/tooltip/tooltip.vue'
import StringSetting from '../../helpers/string_setting.vue'
import Preview from '../old_theme_tab/theme_preview.vue'
import VirtualDirectivesTab from './virtual_directives_tab.vue'
import { useInterfaceStore } from 'src/stores/interface'
import {
getContrastRatio,
hex2rgb,
@ -43,10 +49,6 @@ import {
findColor,
init,
} from 'src/services/theme_data/theme_data_3.service.js'
import { useInterfaceStore } from 'src/stores/interface'
import StringSetting from '../../helpers/string_setting.vue'
import Preview from '../old_theme_tab/theme_preview.vue'
import VirtualDirectivesTab from './virtual_directives_tab.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import {

1
src/components/settings_modal/tabs/style_tab/virtual_directives_tab.js
View file

@ -4,6 +4,7 @@ import ColorInput from 'src/components/color_input/color_input.vue'
import Select from 'src/components/select/select.vue'
import SelectMotion from 'src/components/select/select_motion.vue'
import ShadowControl from 'src/components/shadow_control/shadow_control.vue'
import { serializeShadow } from 'src/services/theme_data/iss_serializer.js'
// helper for debugging

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

@ -7,6 +7,7 @@ import OpacityInput from 'src/components/opacity_input/opacity_input.vue'
import Popover from 'src/components/popover/popover.vue'
import Select from 'src/components/select/select.vue'
import SelectMotion from 'src/components/select/select_motion.vue'
import { rgb2hex } from 'src/services/color_convert/color_convert.js'
import {
getCssShadow,

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

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

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

@ -1,14 +1,16 @@
import { mapState as mapPiniaState } from 'pinia'
import { mapGetters, mapState } from 'vuex'
import { mapActions, mapState } from 'pinia'
import { mapGetters } from 'vuex'
import { USERNAME_ROUTES } from 'src/components/navigation/navigation.js'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInterfaceStore } from 'src/stores/interface'
import { useShoutStore } from 'src/stores/shout'
import GestureService from '../../services/gesture_service/gesture_service'
import { unseenNotificationsFromStore } from '../../services/notification_utils/notification_utils'
import UserCard from '../user_card/user_card.vue'
import { useAnnouncementsStore } from 'src/stores/announcements'
import { useInstanceStore } from 'src/stores/instance.js'
import { useInterfaceStore } from 'src/stores/interface'
import { useShoutStore } from 'src/stores/shout'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faBell,
@ -74,26 +76,14 @@ const SideDrawer = {
unseenNotificationsCount() {
return this.unseenNotifications.length
},
suggestionsEnabled() {
return this.$store.state.instance.suggestionsEnabled
},
logo() {
return this.$store.state.instance.logo
},
hideSitename() {
return this.$store.state.instance.hideSitename
},
sitename() {
return this.$store.state.instance.name
},
followRequestCount() {
return this.$store.state.api.followRequests.length
},
privateMode() {
return this.$store.state.instance.private
return useInstanceStore().private
},
federating() {
return this.$store.state.instance.federating
return useInstanceStore().federating
},
timelinesRoute() {
let name
@ -107,13 +97,18 @@ const SideDrawer = {
return { name }
}
},
...mapPiniaState(useAnnouncementsStore, {
supportsAnnouncements: (store) => store.supportsAnnouncements,
unreadAnnouncementCount: 'unreadAnnouncementCount',
}),
...mapState({
pleromaChatMessagesAvailable: (state) =>
state.instance.pleromaChatMessagesAvailable,
...mapState(useAnnouncementsStore, [
'supportsAnnouncements',
'unreadAnnouncementCount',
]),
...mapState(useInstanceStore, ['private', 'federating']),
...mapState(useInstanceStore, {
logo: (store) => store.instanceIdentity.logo,
sitename: (store) => store.instanceIdentity.name,
hideSitename: (store) => store.instanceIdentity.hideSitename,
pleromaChatMessagesAvailable: (store) =>
store.featureSet.pleromaChatMessagesAvailable,
suggestionsEnabled: (store) => store.featureSet.suggestionsEnabled,
}),
...mapGetters(['unreadChatCount', 'draftCount']),
},
@ -131,12 +126,7 @@ const SideDrawer = {
touchMove(e) {
GestureService.updateSwipe(e, this.closeGesture)
},
openSettingsModal() {
useInterfaceStore().openSettingsModal('user')
},
openAdminModal() {
useInterfaceStore().openSettingsModal('admin')
},
...mapActions(useInterfaceStore, ['openSettingsModal']),
},
}

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

@ -198,7 +198,7 @@
<li @click="toggleDrawer">
<button
class="menu-item"
@click="openSettingsModal"
@click="openSettingsModal('user')"
>
<FAIcon
fixed-width
@ -225,7 +225,7 @@
>
<button
class="menu-item"
@click.stop="openAdminModal"
@click.stop="openSettingsModal('admin')"
>
<FAIcon
fixed-width

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

@ -4,9 +4,11 @@ import { mapGetters, mapState } from 'vuex'
import BasicUserCard from '../basic_user_card/basic_user_card.vue'
import { useInstanceStore } from 'src/stores/instance.js'
const StaffPanel = {
created() {
const nicknames = this.$store.state.instance.staffAccounts
const nicknames = useInstanceStore().staffAccounts
nicknames.forEach((nickname) =>
this.$store.dispatch('fetchUserIfMissing', nickname),
)
@ -28,7 +30,7 @@ const StaffPanel = {
},
...mapGetters(['findUserByName']),
...mapState({
staffAccounts: (state) => state.instance.staffAccounts,
staffAccounts: (state) => useInstanceStore().staffAccounts,
}),
},
}

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

@ -4,8 +4,6 @@ import MentionLink from 'src/components/mention_link/mention_link.vue'
import MentionsLine from 'src/components/mentions_line/mentions_line.vue'
import RichContent from 'src/components/rich_content/rich_content.jsx'
import StatusActionButtons from 'src/components/status_action_buttons/status_action_buttons.vue'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import { muteFilterHits } from '../../services/status_parser/status_parser.js'
import {
highlightClass,
@ -22,6 +20,11 @@ import UserLink from '../user_link/user_link.vue'
import UserListPopover from '../user_list_popover/user_list_popover.vue'
import UserPopover from '../user_popover/user_popover.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faAngleDoubleRight,
@ -494,7 +497,7 @@ const Status = {
return this.status.edited_at !== null
},
editingAvailable() {
return this.$store.state.instance.editingAvailable
return useInstanceStore().featureSet.editingAvailable
},
hasVisibleQuote() {
return this.status.quote_url && this.status.quote_visible
@ -588,7 +591,7 @@ const Status = {
return generateProfileLink(
id,
name,
this.$store.state.instance.restrictedNicknames,
useInstanceStore().restrictedNicknames,
)
},
addMediaPlaying(id) {

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

@ -2,6 +2,8 @@ import EmojiPicker from 'src/components/emoji_picker/emoji_picker.vue'
import Popover from 'src/components/popover/popover.vue'
import StatusBookmarkFolderMenu from 'src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.vue'
import { useInstanceStore } from 'src/stores/instance.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faBookmark as faBookmarkRegular,
@ -91,7 +93,7 @@ export default {
return this.status.thread_muted
},
hideCustomEmoji() {
return !this.$store.state.instance.pleromaCustomEmojiReactionsAvailable
return !useInstanceStore().pleromaCustomEmojiReactionsAvailable
},
buttonInnerClass() {
return [
@ -107,7 +109,7 @@ export default {
]
},
remoteInteractionLink() {
return this.$store.getters.remoteInteractionLink({
return useInstanceStore().getRemoteInteractionLink({
statusId: this.status.id,
})
},

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

@ -1,4 +1,5 @@
import { useEditStatusStore } from 'src/stores/editStatus.js'
import { useInstanceStore } from 'src/stores/instance.js'
import { useReportsStore } from 'src/stores/reports.js'
import { useStatusHistoryStore } from 'src/stores/statusHistory.js'
@ -159,7 +160,10 @@ export const BUTTONS = [
icon: 'history',
label: 'status.status_history',
if({ status, state }) {
return state.instance.editingAvailable && status.edited_at !== null
return (
useInstanceStore().featureSet.editingAvailable &&
status.edited_at !== null
)
},
action({ status }) {
const originalStatus = { ...status }
@ -189,7 +193,7 @@ export const BUTTONS = [
if({ status, loggedIn, currentUser, state }) {
return (
loggedIn &&
state.instance.editingAvailable &&
useInstanceStore().featureSet.editingAvailable &&
status.user.id === currentUser.id
)
},
@ -243,7 +247,7 @@ export const BUTTONS = [
action({ state, status, router }) {
navigator.clipboard.writeText(
[
state.instance.server,
useInstanceStore().server,
router.resolve({ name: 'conversation', params: { id: status.id } })
.href,
].join(''),

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

@ -2,11 +2,13 @@ import { mapState } from 'pinia'
import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
import Popover from 'src/components/popover/popover.vue'
import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
import ActionButtonContainer from './action_button_container.vue'
import { BUTTONS } from './buttons_definitions.js'
import { useServerSideStorageStore } from 'src/stores/serverSideStorage.js'
import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faEllipsisH } from '@fortawesome/free-solid-svg-icons'

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

@ -1,6 +1,7 @@
import { mapGetters } from 'vuex'
import RichContent from 'src/components/rich_content/rich_content.jsx'
import fileType from 'src/services/file_type/file_type.service'
import { library } from '@fortawesome/fontawesome-svg-core'

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