No OneTemporary
Actions

Authored By

Unknown

Size

71 KB

Referenced Files

None

Subscribers

None

View Options

	diff --git a/src/boot/after_store.js b/src/boot/after_store.js
	index bece8e000e..2b2c75362e 100644
	--- a/src/boot/after_store.js
	+++ b/src/boot/after_store.js
	@@ -1,621 +1,626 @@
	/* global process */

	import vClickOutside from 'click-outside-vue3'
	import { createApp } from 'vue'
	import { createRouter, createWebHistory } from 'vue-router'
	import VueVirtualScroller from 'vue-virtual-scroller'
	import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'

	import RichContent from 'src/components/rich_content/rich_content.jsx'
	import Status from 'src/components/status/status.vue'
	import StillImage from 'src/components/still-image/still-image.vue'

	import { config } from '@fortawesome/fontawesome-svg-core'
	import {
	FontAwesomeIcon,
	FontAwesomeLayers,
	} from '@fortawesome/vue-fontawesome'

	config.autoAddCss = false

	import App from '../App.vue'
	import FaviconService from '../services/favicon_service/favicon_service.js'
	import { applyStyleConfig } from '../services/style_setter/style_setter.js'
	import { initServiceWorker, updateFocus } from '../services/sw/sw.js'
	import {
	windowHeight,
	windowWidth,
	} from '../services/window_utils/window_utils'
	import routes from './routes'

	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 { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
	import { useInterfaceStore } from 'src/stores/interface.js'
	import { useLocalConfigStore } from 'src/stores/local_config.js'
	import { useMergedConfigStore } from 'src/stores/merged_config.js'
	import { useOAuthStore } from 'src/stores/oauth.js'
	+import { useStatusesStore } from 'src/stores/statuses.js'
	import { useSyncConfigStore } from 'src/stores/sync_config.js'
	import { useUserHighlightStore } from 'src/stores/user_highlight.js'
	import { useUsersStore } from 'src/stores/users.js'

	import VBodyScrollLock from 'src/directives/body_scroll_lock'
	import {
	INSTANCE_DEFAULT_CONFIG_DEFINITIONS,
	INSTANCE_IDENTITY_DEFAULT_DEFINITIONS,
	INSTANCE_IDENTIY_EXTERNAL,
	} from 'src/modules/default_config_state.js'

	let staticInitialResults = null

	const parsedInitialResults = () => {
	if (!document.getElementById('initial-results')) {
	return null
	}
	if (!staticInitialResults) {
	staticInitialResults = JSON.parse(
	document.getElementById('initial-results').textContent,
	)
	}
	return staticInitialResults
	}

	const decodeUTF8Base64 = (data) => {
	const rawData = atob(data)
	const array = Uint8Array.from([...rawData].map((char) => char.codePointAt(0)))
	const text = new TextDecoder().decode(array)
	return text
	}

	const preloadFetch = async (request) => {
	const data = parsedInitialResults()
	if (!data?.[request]) {
	return window.fetch(request)
	}
	const decoded = decodeUTF8Base64(data[request])
	const requestData = JSON.parse(decoded)
	return {
	ok: true,
	json: () => requestData,
	text: () => requestData,
	}
	}

	const getInstanceConfig = async ({ store }) => {
	try {
	const res = await preloadFetch('/api/v1/instance')
	if (res.ok) {
	const data = await res.json()
	const textLimit = data.max_toot_chars
	const vapidPublicKey = data.pleroma.vapid_public_key

	useInstanceCapabilitiesStore().set(
	'pleromaExtensionsAvailable',
	data.pleroma,
	)
	useInstanceStore().set({
	path: 'limits.textLimit',
	value: textLimit,
	})
	useInstanceStore().set({
	path: 'accountApprovalRequired',
	value: data.approval_required,
	})
	useInstanceStore().set({
	path: 'birthdayRequired',
	value: !!data.pleroma?.metadata.birthday_required,
	})
	useInstanceStore().set({
	path: 'birthdayMinAge',
	value: data.pleroma?.metadata.birthday_min_age \|\| 0,
	})

	if (vapidPublicKey) {
	useInstanceStore().set({
	path: 'vapidPublicKey',
	value: vapidPublicKey,
	})
	}
	} else {
	throw res
	}
	} catch (error) {
	console.error('Could not load instance config, potentially fatal')
	console.error(error)
	}
	// We should check for scrobbles support here but it requires userId
	// so instead we check for it where it's fetched (statuses.js)
	}

	const getBackendProvidedConfig = async () => {
	try {
	const res = await window.fetch('/api/pleroma/frontend_configurations')
	if (res.ok) {
	const data = await res.json()
	return data.pleroma_fe
	} else {
	throw res
	}
	} catch (error) {
	console.error(
	'Could not load backend-provided frontend config, potentially fatal',
	)
	console.error(error)
	}
	}

	const getStaticConfig = async () => {
	try {
	const res = await window.fetch('/static/config.json')
	if (res.ok) {
	return res.json()
	} else {
	throw res
	}
	} catch (error) {
	console.warn(
	'Failed to load static/config.json, continuing without it.',
	error,
	)
	return {}
	}
	}

	const setSettings = async ({ apiConfig, staticConfig, store }) => {
	const overrides = window.___pleromafe_dev_overrides \|\| {}
	const env = window.___pleromafe_mode.NODE_ENV

	// This takes static config and overrides properties that are present in apiConfig
	let config = {}
	if (overrides.staticConfigPreference && env === 'development') {
	console.warn('OVERRIDING API CONFIG WITH STATIC CONFIG')
	config = { ...apiConfig, ...staticConfig }
	} else {
	config = { ...staticConfig, ...apiConfig }
	}

	Object.keys(INSTANCE_IDENTITY_DEFAULT_DEFINITIONS).forEach((source) => {
	if (source === 'name') return
	if (INSTANCE_IDENTIY_EXTERNAL.has(source)) return
	useInstanceStore().set({
	value:
	config[source] ?? INSTANCE_IDENTITY_DEFAULT_DEFINITIONS[source].default,
	path: `instanceIdentity.${source}`,
	})
	})

	Object.keys(INSTANCE_DEFAULT_CONFIG_DEFINITIONS).forEach((source) =>
	useInstanceStore().set({
	value:
	config[source] ?? INSTANCE_DEFAULT_CONFIG_DEFINITIONS[source].default,
	path: `prefsStorage.${source}`,
	}),
	)

	useAuthFlowStore().setInitialStrategy(config.loginMethod)
	}

	const getTOS = async ({ store }) => {
	try {
	const res = await window.fetch('/static/terms-of-service.html')
	if (res.ok) {
	const html = await res.text()
	useInstanceStore().set({ path: 'instanceIdentity.tos', value: html })
	} else {
	throw res
	}
	} catch (e) {
	console.warn("Can't load TOS\n", e)
	}
	}

	const getInstancePanel = async ({ store }) => {
	try {
	const res = await preloadFetch('/instance/panel.html')
	if (res.ok) {
	const html = await res.text()
	useInstanceStore().set({
	path: 'instanceIdentity.instanceSpecificPanelContent',
	value: html,
	})
	} else {
	throw res
	}
	} catch (e) {
	console.warn("Can't load instance panel\n", e)
	}
	}

	const getStickers = async ({ store }) => {
	try {
	const res = await window.fetch('/static/stickers.json')
	if (res.ok) {
	const values = await res.json()
	const stickers = (
	await Promise.all(
	Object.entries(values).map(async ([name, path]) => {
	const resPack = await window.fetch(path + 'pack.json')
	let meta = {}
	if (resPack.ok) {
	meta = await resPack.json()
	}
	return {
	pack: name,
	path,
	meta,
	}
	}),
	)
	).sort((a, b) => {
	return a.meta.title.localeCompare(b.meta.title)
	})
	useEmojiStore().setStickers(stickers)
	} else {
	throw res
	}
	} catch (e) {
	console.warn("Can't load stickers\n", e)
	}
	}

	const resolveStaffAccounts = ({ store, accounts }) => {
	const nicknames = accounts.map((uri) => uri.split('/').pop())
	useInstanceStore().set({
	path: 'staffAccounts',
	value: nicknames,
	})
	}

	const getNodeInfo = async ({ store }) => {
	try {
	let res = await preloadFetch('/nodeinfo/2.1.json')
	if (!res.ok) res = await preloadFetch('/nodeinfo/2.0.json')
	if (res.ok) {
	const data = await res.json()
	const metadata = data.metadata
	const features = metadata.features
	useInstanceStore().set({
	path: 'instanceIdentity.name',
	value: metadata.nodeName,
	})
	useInstanceStore().set({
	path: 'registrationOpen',
	value: data.openRegistrations,
	})
	useInstanceCapabilitiesStore().set(
	'mediaProxyAvailable',
	features.includes('media_proxy'),
	)
	useInstanceCapabilitiesStore().set(
	'safeDM',
	features.includes('safe_dm_mentions'),
	)
	useInstanceCapabilitiesStore().set(
	'shoutAvailable',
	features.includes('chat'),
	)
	useInstanceCapabilitiesStore().set(
	'pleromaChatMessagesAvailable',
	features.includes('pleroma_chat_messages'),
	)
	useInstanceCapabilitiesStore().set(
	'pleromaCustomEmojiReactionsAvailable',

	features.includes('pleroma_custom_emoji_reactions') \|\|
	features.includes('custom_emoji_reactions'),
	)
	useInstanceCapabilitiesStore().set(
	'pleromaBookmarkFoldersAvailable',
	features.includes('pleroma:bookmark_folders'),
	)
	useInstanceCapabilitiesStore().set(
	'gopherAvailable',
	features.includes('gopher'),
	)
	useInstanceCapabilitiesStore().set(
	'pollsAvailable',
	features.includes('polls'),
	)
	useInstanceCapabilitiesStore().set(
	'editingAvailable',
	features.includes('editing'),
	)
	useInstanceCapabilitiesStore().set(
	'mailerEnabled',
	metadata.mailerEnabled,
	)
	useInstanceCapabilitiesStore().set(
	'quotingAvailable',
	features.includes('quote_posting'),
	)
	useInstanceCapabilitiesStore().set(
	'groupActorAvailable',
	features.includes('pleroma:group_actors'),
	)
	useInstanceCapabilitiesStore().set(
	'blockExpiration',
	features.includes('pleroma:block_expiration'),
	)
	useInstanceStore().set({
	path: 'localBubbleInstances',
	value: metadata.localBubbleInstances ?? [],
	})
	useInstanceCapabilitiesStore().set(
	'localBubble',
	(metadata.localBubbleInstances ?? []).length > 0,
	)

	useInstanceStore().set({
	path: 'limits.pollLimits',
	value: metadata.pollLimits,
	})
	const uploadLimits = metadata.uploadLimits
	useInstanceStore().set({
	path: 'limits.uploadlimit',
	value: Number.parseInt(uploadLimits.general),
	})
	useInstanceStore().set({
	path: 'limits.avatarlimit',
	value: Number.parseInt(uploadLimits.avatar),
	})
	useInstanceStore().set({
	path: 'limits.backgroundlimit',
	value: Number.parseInt(uploadLimits.background),
	})
	useInstanceStore().set({
	path: 'limits.bannerlimit',
	value: Number.parseInt(uploadLimits.banner),
	})
	useInstanceStore().set({
	path: 'limits.fieldsLimits',
	value: metadata.fieldsLimits,
	})

	useInstanceStore().set({
	path: 'restrictedNicknames',
	value: metadata.restrictedNicknames,
	})
	useInstanceCapabilitiesStore().set('postFormats', metadata.postFormats)

	const suggestions = metadata.suggestions
	useInstanceCapabilitiesStore().set(
	'suggestionsEnabled',
	suggestions.enabled,
	)
	// this is unused, why?
	useInstanceCapabilitiesStore().set('suggestionsWeb', suggestions.web)

	const software = data.software
	useInstanceStore().set({
	path: 'backendVersion',
	value: software.version,
	})
	useInstanceStore().set({
	path: 'backendRepository',
	value: software.repository,
	})

	const priv = metadata.private
	useInstanceStore().set({ path: 'privateMode', value: priv })

	const frontendVersion = window.___pleromafe_commit_hash
	useInstanceStore().set({
	path: 'frontendVersion',
	value: frontendVersion,
	})

	const federation = metadata.federation

	useInstanceCapabilitiesStore().set(
	'tagPolicyAvailable',
	federation.mrf_policies === undefined
	? false
	: metadata.federation.mrf_policies.includes('TagPolicy'),
	)

	useInstanceStore().set({
	path: 'federationPolicy',
	value: federation,
	})
	useInstanceStore().set({
	path: 'federating',
	value: federation.enabled === undefined ? true : federation.enabled,
	})

	const accountActivationRequired = metadata.accountActivationRequired
	useInstanceStore().set({
	path: 'accountActivationRequired',
	value: accountActivationRequired,
	})

	const accounts = metadata.staffAccounts
	resolveStaffAccounts({ store, accounts })
	} else {
	throw res
	}
	} catch (e) {
	console.warn('Could not load nodeinfo', e)
	}
	}

	const setConfig = async ({ store }) => {
	// apiConfig, staticConfig
	const configInfos = await Promise.all([
	getBackendProvidedConfig(),
	getStaticConfig(),
	])
	const apiConfig = configInfos[0]
	const staticConfig = configInfos[1]

	await setSettings({ store, apiConfig, staticConfig })
	}

	const checkOAuthToken = async ({ store }) => {
	const oauth = useOAuthStore()
	if (oauth.userToken) {
	return useUsersStore().loginUser(oauth.userToken)
	}
	return
	}

	const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => {
	const app = createApp(App)
	// Must have app use pinia before we do anything that touches the store
	// https://pinia.vuejs.org/core-concepts/plugins.html#Introduction
	// "Plugins are only applied to stores created after the plugins themselves, and after pinia is passed to the app, otherwise they won't be applied."
	app.use(pinia)

	app.config.errorHandler = (error, instance, info) => {
	console.error(
	'Global Vue Error Handler caught an error:',
	error,
	instance,
	info,
	)
	useInterfaceStore().setGlobalError({ error, instance, info })
	}

	const waitForAllStoresToLoad = async () => {
	// the stores that do not persist technically do not need to be awaited here,
	// but that involves either hard-coding the stores in some place (prone to errors)
	// or writing another vite plugin to analyze which stores needs persisting (++load time)
	const allStores = import.meta.glob('../stores/*.js', { eager: true })
	if (process.env.NODE_ENV === 'development') {
	// do some checks to avoid common errors
	if (!Object.keys(allStores).length) {
	throw new TypeError(
	'No stores are available. Check the code in src/boot/after_store.js',
	)
	}
	}
	await Promise.all(
	Object.entries(allStores).map(async ([name, mod]) => {
	const isStoreName = (name) => name.startsWith('use')
	if (process.env.NODE_ENV === 'development') {
	if (Object.keys(mod).filter(isStoreName).length !== 1) {
	throw new TypeError(
	'Each store file must export exactly one store as a named export. Check your code in src/stores/',
	)
	}
	}
	const storeFuncName = Object.keys(mod).find(isStoreName)
	if (storeFuncName && typeof mod[storeFuncName] === 'function') {
	const p = mod[storeFuncName]().$persistLoaded
	if (!(p instanceof Promise)) {
	throw new TypeError(
	`${name} store's $persistLoaded is not a Promise. The persist plugin is not applied.`,
	)
	}
	await p
	} else {
	throw new TypeError(
	`Store module ${name} does not export a 'use...' function`,
	)
	}
	}),
	)
	}

	let newStorageError
	try {
	await waitForAllStoresToLoad()
	} catch (e) {
	console.error('Cannot load stores:', e)
	newStorageError = e
	}

	if (storageError \|\| newStorageError) {
	useInterfaceStore().pushGlobalNotice({
	messageKey: 'errors.storage_unavailable',
	level: 'error',
	})
	}

	useInterfaceStore().setLayoutWidth(windowWidth())
	useInterfaceStore().setLayoutHeight(windowHeight())

	window.syncConfig = useSyncConfigStore()
	window.mergedConfig = useMergedConfigStore()
	window.localConfig = useLocalConfigStore()
	window.highlightConfig = useUserHighlightStore()

	FaviconService.initFaviconService()
	initServiceWorker(store)

	window.addEventListener('focus', () => updateFocus())

	const overrides = window.___pleromafe_dev_overrides \|\| {}
	const server =
	overrides.target !== undefined ? overrides.target : window.location.origin
	useInstanceStore().set({ path: 'server', value: server })

	await setConfig({ store })
	try {
	await useInterfaceStore()
	.applyTheme()
	.catch((e) => {
	console.error('Error setting theme', e)
	})
	} catch (e) {
	window.splashError(e)
	throw e
	}

	applyStyleConfig(useMergedConfigStore().mergedConfig, i18n.global)

	// Now we can try getting the server settings and logging in
	// Most of these are preloaded into the index.html so blocking is minimized
	await Promise.all([
	checkOAuthToken({ store }),
	getInstancePanel({ store }),
	getNodeInfo({ store }),
	getInstanceConfig({ store }),
	])

	getTOS({ store })
	getStickers({ store })

	const router = createRouter({
	history: createWebHistory(),
	routes: routes(store),
	scrollBehavior: (to, _from, savedPosition) => {
	if (to.matched.some((m) => m.meta.dontScroll)) {
	return {}
	}
	return savedPosition \|\| { left: 0, top: 0 }
	},
	})

	useI18nStore().setI18n(i18n)

	+ // Global WS handlers
	+ useInterfaceStore().attachSocket()
	+ useStatusesStore().attachSocket()
	+
	app.use(router)
	app.use(store)
	app.use(i18n)

	// Little thing to get out of invalid theme state
	window.resetThemes = () => {
	useInterfaceStore().resetThemeV3()
	useInterfaceStore().resetThemeV3Palette()
	useInterfaceStore().resetThemeV2()
	}

	app.use(vClickOutside)
	app.use(VBodyScrollLock)
	app.use(VueVirtualScroller)

	app.component('FAIcon', FontAwesomeIcon)
	app.component('FALayers', FontAwesomeLayers)
	app.component('Status', Status)
	app.component('RichContent', RichContent)
	app.component('StillImage', StillImage)

	// remove after vue 3.3
	app.config.unwrapInjectedRef = true

	app.mount('#app')
	return app
	}

	export default afterStoreSetup
	diff --git a/src/stores/chats.js b/src/stores/chats.js
	index 2a65fc25f9..f12a33db1a 100644
	--- a/src/stores/chats.js
	+++ b/src/stores/chats.js
	@@ -1,114 +1,123 @@
	import { find, omitBy, orderBy, sumBy } from 'lodash'
	import { defineStore } from 'pinia'

	import { maybeShowChatNotification } from '../services/chat_utils/chat_utils.js'
	import { promiseInterval } from '../services/promise_interval/promise_interval.js'

	import { useOAuthStore } from 'src/stores/oauth.js'
	+import { useStreamingStore } from 'src/stores/streaming.js'
	import { useUsersStore } from 'src/stores/users.js'

	import { chats } from 'src/api/chats.js'

	const emptyChatList = () => ({
	data: [],
	idStore: {},
	})

	const defaultState = {
	chatList: emptyChatList(),
	chatListFetcher: null,
	}

	const getChatById = (state, id) => {
	return find(state.chatList.data, { id })
	}

	export const useChatsStore = defineStore('chats', {
	state: () => ({ ...defaultState }),
	getters: {
	sortedChatList(state) {
	return orderBy(state.chatList.data, ['updated_at'], ['desc'])
	},
	unreadChatsCount(state) {
	return sumBy(state.chatList.data, 'unread')
	},
	},
	actions: {
	+ attachSocket() {
	+ const et = new EventTarget()
	+ const socket = { et }
	+
	+ et.addEventListener('pleroma:chat_update', this.updateChat)
	+
	+ useStreamingStore().addSubscriber(socket)
	+ },
	startFetchingChats() {
	const fetcher = () => this.fetchChats()
	this.setChatListFetcher(() => promiseInterval(fetcher, 5000))
	},
	stopFetchingChats() {
	this.setChatListFetcher(null)
	},
	async fetchChats() {
	this.addNewChats(
	await chats({
	credentials: useOAuthStore().token,
	}),
	)
	},
	setChatListFetcher(fetcher) {
	const prevFetcher = this.chatListFetcher
	if (prevFetcher) {
	prevFetcher.stop()
	}
	this.chatListFetcher = fetcher?.()
	},
	resetChats() {
	this.chatList = emptyChatList()
	this.setChatListFetcher(null)
	},
	addNewChats(result) {
	useUsersStore().addNewUsers({
	...result,
	data: result.data.map((k) => k.account).filter(Boolean),
	})

	result.data.forEach((updatedChat) => {
	const chat = getChatById(this, updatedChat.id)

	if (chat) {
	const isNewMessage =
	chat.lastMessage?.id !== updatedChat.lastMessage?.id
	chat.lastMessage = updatedChat.lastMessage
	chat.unread = updatedChat.unread
	chat.updated_at = updatedChat.updated_at
	if (isNewMessage && chat.unread) {
	maybeShowChatNotification(chat)
	}
	} else {
	this.chatList.data.push(updatedChat)
	this.chatList.idStore[updatedChat.id] = updatedChat
	}
	})
	},
	readChat(id) {
	const chat = getChatById(this, id)
	if (chat) {
	chat.unread = 0
	}
	},
	updateChat({ chat: updatedChat }) {
	const chat = getChatById(this, updatedChat.id)
	if (chat) {
	chat.lastMessage = updatedChat.lastMessage
	chat.unread = updatedChat.unread
	chat.updated_at = updatedChat.updated_at
	}
	if (!chat) {
	this.chatList.data.unshift(updatedChat)
	}
	this.chatList.idStore[updatedChat.id] = updatedChat
	},
	deleteChat(id) {
	this.chats.data = this.chats.data.filter(
	(conversation) => conversation.last_status.id !== id,
	)
	this.chats.idStore = omitBy(
	this.chats.idStore,
	(conversation) => conversation.last_status.id === id,
	)
	},
	},
	})
	diff --git a/src/stores/interface.js b/src/stores/interface.js
	index 6eede1d3a5..19aa372219 100644
	--- a/src/stores/interface.js
	+++ b/src/stores/interface.js
	@@ -1,804 +1,834 @@
	import { defineStore } from 'pinia'

	import {
	applyTheme,
	getResourcesIndex,
	tryLoadCache,
	} from '../services/style_setter/style_setter.js'
	import { deserialize } from '../services/theme_data/iss_deserializer.js'

	import { useInstanceStore } from 'src/stores/instance.js'
	import { useMergedConfigStore } from 'src/stores/merged_config.js'
	+import { useStreamingStore } from 'src/stores/streaming.js'
	import { useSyncConfigStore } from 'src/stores/sync_config.js'
	import { useUsersStore } from 'src/stores/users.js'

	+import { WSConnectionStatus } from 'src/api/websocket.js'
	import {
	CURRENT_VERSION,
	generatePreset,
	} from 'src/services/theme_data/theme_data.service.js'
	import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'

	const GENERIC_FONT_NAMES = new Set([
	'serif',
	'sans-serif',
	'system-ui',
	'cursive',
	'fantasy',
	'math',
	'monospace',
	])

	export const useInterfaceStore = defineStore('interface', {
	state: () => ({
	localFonts: null,
	themeApplied: false,
	themeChangeInProgress: false,
	themeVersion: 'v3',
	styleNameUsed: null,
	styleDataUsed: null,
	useStylePalette: false, // hack for applying styles from appearance tab
	paletteNameUsed: null,
	paletteDataUsed: null,
	themeNameUsed: null,
	themeDataUsed: null,
	temporaryChangesTimeoutId: null,
	temporaryChangesCountdown: -1, // used for temporary options that revert after a timeout
	temporaryChangesConfirm: () => {
	/* no-op */
	}, // used for applying temporary options
	temporaryChangesRevert: () => {
	/* no-op */
	}, // used for reverting temporary options
	settingsModalState: 'hidden',
	settingsModalLoadedUser: false,
	settingsModalLoadedAdmin: false,
	settingsModalTargetTab: null,
	settingsModalMode: 'user',
	settings: {
	currentSaveStateNotice: null,
	noticeClearTimeout: null,
	notificationPermission: null,
	},
	browserSupport: {
	cssFilter:
	window.CSS?.supports &&
	(window.CSS.supports('filter', 'drop-shadow(0 0)') \|\|
	window.CSS.supports('-webkit-filter', 'drop-shadow(0 0)')),
	localFonts: typeof window.queryLocalFonts === 'function',
	},
	layoutType: 'normal',
	globalNotices: [],
	globalError: null,
	layoutHeight: 0,
	lastTimeline: null,
	foreignProfileBackground: null,
	}),
	actions: {
	+ attachSocket() {
	+ const et = new EventTarget()
	+ const socket = { et }
	+
	+ et.addEventListener('open', this.onStreamConnect)
	+ et.addEventListener('close', this.onStreamDisconnect)
	+
	+ useStreamingStore().addSubscriber(socket)
	+ },
	+ onStreamConnect() {
	+ if (useStreamingStore().state !== WSConnectionStatus.STARTING_INITIAL) {
	+ this.pushGlobalNotice({
	+ level: 'success',
	+ messageKey: 'timeline.socket_reconnected',
	+ timeout: 5000,
	+ })
	+ }
	+ },
	+ onStreamDisconnect(closeEvent) {
	+ // TODO better explanation/localization
	+ const { code } = closeEvent
	+ this.pushGlobalNotice({
	+ level: 'error',
	+ messageKey: 'timeline.socket_broke',
	+ messageArgs: [code],
	+ timeout: 5000,
	+ })
	+ },
	setTemporaryChanges({ confirm, revert }) {
	this.temporaryChangesCountdown = 10
	this.temporaryChangesConfirm = confirm
	this.temporaryChangesRevert = revert
	const countdownFunc = () => {
	if (this.temporaryChangesCountdown <= 1) {
	this.temporaryChangesRevert()
	this.clearTemporaryChanges()
	} else {
	this.temporaryChangesCountdown--
	this.temporaryChangesTimeoutId = setTimeout(countdownFunc, 1000)
	}
	}
	this.temporaryChangesTimeoutId = setTimeout(countdownFunc, 1000)
	},
	clearTemporaryChanges() {
	this.temporaryChangesTimeoutId ??
	clearTimeout(this.temporaryChangesTimeoutId)
	this.temporaryChangesTimeoutId = null
	this.temporaryChangesCountdown = -1
	this.temporaryChangesConfirm = () => {
	/* no-op */
	}
	this.temporaryChangesRevert = () => {
	/* no-op */
	}
	},
	setPageTitle(option = '') {
	try {
	document.title = `${option} ${useInstanceStore().instanceIdentity.name}`
	} catch (error) {
	console.error(`${error}`)
	}
	},
	setForeignProfileBackground(url) {
	this.foreignProfileBackground = url
	},
	settingsSaved({ success, error }) {
	if (success) {
	if (this.noticeClearTimeout) {
	clearTimeout(this.noticeClearTimeout)
	}
	this.settings.currentSaveStateNotice = { error: false, data: success }
	this.settings.noticeClearTimeout = setTimeout(
	() => delete this.settings.currentSaveStateNotice,
	2000,
	)
	} else {
	this.settings.currentSaveStateNotice = { error: true, errorData: error }
	}
	},
	setNotificationPermission(permission) {
	this.notificationPermission = permission
	},
	closeSettingsModal() {
	this.settingsModalState = 'hidden'
	},
	openSettingsModal(value) {
	this.settingsModalMode = value
	this.settingsModalState = 'visible'
	if (value === 'user') {
	if (!this.settingsModalLoadedUser) {
	this.settingsModalLoadedUser = true
	}
	} else if (value === 'admin') {
	if (!this.settingsModalLoadedAdmin) {
	this.settingsModalLoadedAdmin = true
	}
	}
	},
	setSettingsModalState(newState) {
	const oldState = this.settingsModalState
	const legal = (() => {
	switch (oldState) {
	case 'minimized':
	return true
	case 'visible':
	return true
	case 'hidden':
	return newState === 'visible'
	}
	})()

	if (legal) {
	this.settingsModalState = newState
	}
	},
	toggleMinimizeSettingsModal() {
	switch (this.settingsModalState) {
	case 'minimized':
	this.settingsModalState = 'visible'
	return
	case 'visible':
	this.settingsModalState = 'minimized'
	return
	case 'hidden':
	return
	default:
	throw new Error(
	`Illegal minimization state of settings modal: ${this.settingsModalState}`,
	)
	}
	},
	clearSettingsModalTargetTab() {
	this.settingsModalTargetTab = null
	},
	openSettingsModalTab(value, mode = 'user') {
	this.settingsModalTargetTab = value
	this.openSettingsModal(mode)
	},
	removeGlobalNotice(notice) {
	this.globalNotices = this.globalNotices.filter((n) => n !== notice)
	},
	setGlobalError({ error, instance, info }) {
	switch (info) {
	case 'https://vuejs.org/error-reference/#runtime-13': {
	this.globalError = {
	title: 'general.refresh_required',
	content: 'general.refresh_required_content',
	// `true` disables cache on Firefox (non-standard)
	recover: () => window.location.reload(true),
	recoverText: 'general.refresh_required_refresh',
	error,
	}
	break
	}
	default: {
	this.globalError = { error }
	break
	}
	}
	},
	clearGlobalError() {
	this.globalError = null
	},
	pushGlobalNotice({
	messageKey,
	messageArgs = {},
	level = 'error',
	timeout = 5000,
	}) {
	const notice = {
	messageKey,
	messageArgs,
	level,
	}

	this.globalNotices.push(notice)

	// Adding a new element to array wraps it in a Proxy, which breaks the comparison
	// TODO: Generate UUID or something instead or relying on !== operator?
	const newNotice = this.globalNotices[this.globalNotices.length - 1]
	if (timeout > 0) {
	setTimeout(() => this.removeGlobalNotice(newNotice), timeout)
	}

	return newNotice
	},
	setLayoutHeight(value) {
	this.layoutHeight = value
	},
	setLayoutWidth(value) {
	let width = value
	if (value !== undefined) {
	this.layoutWidth = value
	} else {
	width = this.layoutWidth
	}

	const mobileLayout = width <= 800
	const normalOrMobile = mobileLayout ? 'mobile' : 'normal'
	const { thirdColumnMode } = useMergedConfigStore().mergedConfig
	if (thirdColumnMode === 'none' \|\| !useUsersStore().currentUser) {
	this.layoutType = normalOrMobile
	} else {
	const wideLayout = width >= 1300
	this.layoutType = wideLayout ? 'wide' : normalOrMobile
	}
	},
	setFontsList(value) {
	this.localFonts = [...new Set(value.map(({ family }) => family)).values()]
	},
	queryLocalFonts() {
	if (this.localFonts !== null) return
	this.setFontsList([])

	if (!this.browserSupport.localFonts) {
	return
	}
	window
	.queryLocalFonts()
	.then((fonts) => {
	this.setFontsList(fonts)
	})
	.catch((e) => {
	this.pushGlobalNotice({
	messageKey: 'settings.style.themes3.font.font_list_unavailable',
	messageArgs: {
	error: e,
	},
	level: 'error',
	})
	})
	},
	setLastTimeline(value) {
	this.lastTimeline = value
	},
	async fetchPalettesIndex() {
	try {
	const value = await getResourcesIndex('/static/palettes/index.json')
	useInstanceStore().set({
	path: 'palettesIndex',
	value,
	})
	return value
	} catch (e) {
	console.error('Could not fetch palettes index', e)
	useInstanceStore().set({
	path: 'palettesIndex',
	value: { _error: e },
	})
	return {}
	}
	},
	setPalette(value) {
	this.resetThemeV3Palette()
	this.resetThemeV2()

	useSyncConfigStore().setPreference({ path: 'simple.palette', value })
	useSyncConfigStore().pushSyncConfig()

	this.applyTheme({ recompile: true })
	},
	setPaletteCustom(value) {
	this.resetThemeV3Palette()
	this.resetThemeV2()

	useSyncConfigStore().setPreference({
	path: 'simple.paletteCustomData',
	value,
	})
	useSyncConfigStore().pushSyncConfig()

	this.applyTheme({ recompile: true })
	},
	async fetchStylesIndex() {
	try {
	const value = await getResourcesIndex(
	'/static/styles/index.json',
	deserialize,
	)
	useInstanceStore().set({ path: 'stylesIndex', value })
	return value
	} catch (e) {
	console.error('Could not fetch styles index', e)
	useInstanceStore().set({
	path: 'simple.stylesIndex',
	value: { _error: e },
	})
	return {}
	}
	},
	setStyle(value) {
	this.resetThemeV3()
	this.resetThemeV2()
	this.resetThemeV3Palette()

	useSyncConfigStore().setPreference({ path: 'simple.style', value })
	useSyncConfigStore().pushSyncConfig()
	this.useStylePalette = true

	this.applyTheme({ recompile: true }).then(() => {
	this.useStylePalette = false
	})
	},
	setStyleCustom(value) {
	this.resetThemeV3()
	this.resetThemeV2()
	this.resetThemeV3Palette()

	useSyncConfigStore().setPreference({
	path: 'simple.styleCustomData',
	value,
	})
	useSyncConfigStore().pushSyncConfig()

	this.useStylePalette = true
	this.applyTheme({ recompile: true }).then(() => {
	this.useStylePalette = false
	})
	},
	async fetchThemesIndex() {
	try {
	const value = await getResourcesIndex('/static/styles.json')
	useInstanceStore().set({ path: 'themesIndex', value })
	return value
	} catch (e) {
	console.error('Could not fetch themes index', e)
	useInstanceStore().set({
	path: 'themesIndex',
	value: { _error: e },
	})
	return {}
	}
	},
	setTheme(value) {
	this.resetThemeV3()
	this.resetThemeV3Palette()
	this.resetThemeV2()

	useSyncConfigStore().setPreference({ path: 'simple.theme', value })
	useSyncConfigStore().pushSyncConfig()

	this.applyTheme({ recompile: true })
	},
	setThemeCustom(value) {
	this.resetThemeV3()
	this.resetThemeV3Palette()
	this.resetThemeV2()

	useSyncConfigStore().setPreference({ path: 'simple.customTheme', value })
	useSyncConfigStore().setPreference({
	path: 'simple.customThemeSource',
	value,
	})
	useSyncConfigStore().pushSyncConfig()

	this.applyTheme({ recompile: true })
	},
	resetThemeV3() {
	useSyncConfigStore().setPreference({ path: 'simple.style', value: null })
	useSyncConfigStore().setPreference({
	path: 'simple.styleCustomData',
	value: null,
	})
	},
	resetThemeV3Palette() {
	useSyncConfigStore().setPreference({
	path: 'simple.palette',
	value: null,
	})
	useSyncConfigStore().setPreference({
	path: 'simple.paletteCustomData',
	value: null,
	})
	},
	resetThemeV2() {
	useSyncConfigStore().setPreference({ path: 'simple.theme', value: null })
	useSyncConfigStore().setPreference({
	path: 'simple.customTheme',
	value: null,
	})
	useSyncConfigStore().setPreference({
	path: 'simple.customThemeSource',
	value: null,
	})
	},
	async getThemeData() {
	const getData = async (resource, index, customData, name) => {
	const capitalizedResource =
	resource[0].toUpperCase() + resource.slice(1)
	const result = {}

	if (customData) {
	result.nameUsed = 'custom' // custom data overrides name
	result.dataUsed = customData
	} else {
	result.nameUsed = name

	if (result.nameUsed == null) {
	result.dataUsed = null
	return result
	}

	let fetchFunc = index[result.nameUsed]
	// Fallbacks
	if (!fetchFunc) {
	if (resource === 'style' \|\| resource === 'palette') {
	return result
	}
	const newName = Object.keys(index)[0]
	fetchFunc = index[newName]
	console.warn(
	`${capitalizedResource} with id '${this.styleNameUsed}' not found, trying back to '${newName}'`,
	)
	if (!fetchFunc) {
	console.warn(
	`${capitalizedResource} doesn't have a fallback, defaulting to stock.`,
	)
	fetchFunc = () => Promise.resolve(null)
	}
	}
	result.dataUsed = await fetchFunc()
	}
	return result
	}

	let {
	theme: instanceThemeName,
	style: instanceStyleName,
	palette: instancePaletteName,
	} = useInstanceStore().instanceIdentity

	let { themesIndex, stylesIndex, palettesIndex } = useInstanceStore()

	const {
	style: userStyleName,
	styleCustomData: userStyleCustomData,
	palette: userPaletteName,
	paletteCustomData: userPaletteCustomData,
	} = useMergedConfigStore().mergedConfig

	let {
	theme: userThemeV2Name,
	customTheme: userThemeV2Snapshot,
	customThemeSource: userThemeV2Source,
	} = useMergedConfigStore().mergedConfig

	let majorVersionUsed

	console.debug(
	`User V3 palette: ${userPaletteName}, style: ${userStyleName} , custom: ${!!userStyleCustomData}`,
	)
	console.debug(
	`User V2 name: ${userThemeV2Name}, source: ${!!userThemeV2Source}, snapshot: ${!!userThemeV2Snapshot}`,
	)

	console.debug(
	`Instance V3 palette: ${instancePaletteName}, style: ${instanceStyleName}`,
	)
	console.debug('Instance V2 theme: ' + instanceThemeName)

	if (
	userPaletteName \|\|
	userPaletteCustomData \|\|
	userStyleName \|\|
	userStyleCustomData \|\|
	// User V2 overrides instance V3
	((instancePaletteName \|\| instanceStyleName) &&
	instanceThemeName == null &&
	userThemeV2Name == null)
	) {
	// Palette and/or style overrides V2 themes
	instanceThemeName = null
	userThemeV2Name = null
	userThemeV2Source = null
	userThemeV2Snapshot = null

	majorVersionUsed = 'v3'
	} else if (
	userThemeV2Name \|\|
	userThemeV2Snapshot \|\|
	userThemeV2Source \|\|
	instanceThemeName
	) {
	majorVersionUsed = 'v2'
	} else {
	// if all fails fallback to v3
	majorVersionUsed = 'v3'
	}

	if (majorVersionUsed === 'v3') {
	const result = await Promise.all([
	this.fetchPalettesIndex(),
	this.fetchStylesIndex(),
	])

	palettesIndex = result[0]
	stylesIndex = result[1]
	} else {
	// Promise.all just to be uniform with v3
	const result = await Promise.all([this.fetchThemesIndex()])

	themesIndex = result[0]
	}

	this.themeVersion = majorVersionUsed

	console.debug('Version used', majorVersionUsed)

	if (majorVersionUsed === 'v3') {
	this.themeDataUsed = null
	this.themeNameUsed = null

	const style = await getData(
	'style',
	stylesIndex,
	userStyleCustomData,
	userStyleName \|\| instanceStyleName,
	)
	this.styleNameUsed = style.nameUsed
	this.styleDataUsed = style.dataUsed

	let firstStylePaletteName = null
	style.dataUsed
	?.filter((x) => x.component === '@palette')
	.map((x) => {
	const cleanDirectives = Object.fromEntries(
	Object.entries(x.directives).filter(([k]) => k),
	)

	return { name: x.variant, ...cleanDirectives }
	})
	.forEach((palette) => {
	const key =
	'style.' + palette.name.toLowerCase().replaceAll(' ', '_')
	if (!firstStylePaletteName) firstStylePaletteName = key
	palettesIndex[key] = () => Promise.resolve(palette)
	})

	const palette = await getData(
	'palette',
	palettesIndex,
	userPaletteCustomData,
	this.useStylePalette
	? firstStylePaletteName
	: userPaletteName \|\| instancePaletteName,
	)

	if (this.useStylePalette) {
	useSyncConfigStore().setPreference({
	path: 'simple.palette',
	value: firstStylePaletteName,
	})
	useSyncConfigStore().pushSyncConfig()
	}

	this.paletteNameUsed = palette.nameUsed
	this.paletteDataUsed = palette.dataUsed

	if (this.paletteDataUsed) {
	this.paletteDataUsed.link =
	this.paletteDataUsed.link \|\| this.paletteDataUsed.accent
	this.paletteDataUsed.accent =
	this.paletteDataUsed.accent \|\| this.paletteDataUsed.link
	}
	if (Array.isArray(this.paletteDataUsed)) {
	const [
	name,
	bg,
	fg,
	text,
	link,
	cRed = '#FF0000',
	cGreen = '#00FF00',
	cBlue = '#0000FF',
	cOrange = '#E3FF00',
	] = palette.dataUsed
	this.paletteDataUsed = {
	name,
	bg,
	fg,
	text,
	link,
	accent: link,
	cRed,
	cBlue,
	cGreen,
	cOrange,
	}
	}
	console.debug('Palette data used', palette.dataUsed)
	} else {
	this.styleNameUsed = null
	this.styleDataUsed = null
	this.paletteNameUsed = null
	this.paletteDataUsed = null

	const theme = await getData(
	'theme',
	themesIndex,
	userThemeV2Source \|\| userThemeV2Snapshot,
	userThemeV2Name \|\| instanceThemeName,
	)
	this.themeNameUsed = theme.nameUsed
	this.themeDataUsed = theme.dataUsed
	}
	},
	async setThemeApplied() {
	this.themeApplied = true
	},
	async applyTheme({ recompile = false } = {}) {
	const { mergedConfig } = useMergedConfigStore()
	const { forceThemeRecompilation, themeDebug } = mergedConfig

	this.themeChangeInProgress = true
	// If we're not forced to recompile try using
	// cache (tryLoadCache return true if load successful)

	const forceRecompile = forceThemeRecompilation \|\| recompile

	await this.getThemeData()

	if (!forceRecompile && !themeDebug && (await tryLoadCache())) {
	this.themeChangeInProgress = false
	return this.setThemeApplied()
	}
	window.splashUpdate('splash.theme')

	try {
	const paletteIss = (() => {
	if (!this.paletteDataUsed) return null
	const result = {
	component: 'Root',
	directives: {},
	}

	Object.entries(this.paletteDataUsed)
	.filter(([k]) => k !== 'name')
	.forEach(([k, v]) => {
	let issRootDirectiveName
	switch (k) {
	case 'background':
	issRootDirectiveName = 'bg'
	break
	case 'foreground':
	issRootDirectiveName = 'fg'
	break
	default:
	issRootDirectiveName = k
	}
	result.directives['--' + issRootDirectiveName] = 'color \| ' + v
	})
	return result
	})()

	const theme2ruleset =
	this.themeDataUsed &&
	convertTheme2To3(normalizeThemeData(this.themeDataUsed))
	const hacks = []

	const fontMap = {
	Interface: 'Root',
	Input: 'Input',
	Posts: 'Post',
	Monospace: 'Root',
	}

	Object.entries(fontMap).forEach(([font, component]) => {
	const family = mergedConfig[`font${font}`]
	const variable = font === 'Monospace' ? '--monoFont' : '--font'
	if (typeof family === 'string') {
	const familyString = GENERIC_FONT_NAMES.has(family)
	? family
	: `"${family}"`
	hacks.push({
	component,
	directives: {
	[variable]: `generic \| ${familyString}`,
	},
	})
	}
	})

	if (mergedConfig.underlay !== 'none') {
	const newRule = {
	component: 'Underlay',
	directives: {},
	}
	if (mergedConfig.underlay === 'opaque') {
	newRule.directives.opacity = 1
	newRule.directives.background = '--wallpaper'
	}
	if (mergedConfig.underlay === 'transparent') {
	newRule.directives.opacity = 0
	}
	hacks.push(newRule)
	}

	const rulesetArray = [
	theme2ruleset,
	this.styleDataUsed,
	paletteIss,
	hacks,
	].filter(Boolean)

	return applyTheme(
	rulesetArray.flat(),
	() => this.setThemeApplied(),
	() => {
	this.themeChangeInProgress = false
	},
	themeDebug,
	)
	} catch (e) {
	console.error(e)
	window.splashError(e)
	}
	},
	},
	})

	export const normalizeThemeData = (input) => {
	let themeData, themeSource

	if (input.themeFileVerison === 1) {
	// this might not be even used at all, some leftover of unimplemented code in V2 editor
	return generatePreset(input).theme
	} else if (
	Object.hasOwn(input, '_pleroma_theme_version') \|\|
	Object.hasOwn(input, 'source') \|\|
	Object.hasOwn(input, 'theme')
	) {
	// We got passed a full theme file
	themeData = input.theme
	themeSource = input.source
	} else if (
	Object.hasOwn(input, 'themeEngineVersion') \|\|
	Object.hasOwn(input, 'colors')
	) {
	// We got passed a source/snapshot
	themeData = input
	themeSource = input
	}
	// New theme presets don't have 'theme' property, they use 'source'

	let out // shout, shout let it all out
	if (themeSource?.themeEngineVersion === CURRENT_VERSION) {
	// There are some themes in wild that have completely broken source
	out = { ...(themeData \|\| {}), ...themeSource }
	} else {
	out = themeData
	}

	// generatePreset here basically creates/updates "snapshot",
	// while also fixing the 2.2 -> 2.3 colors/shadows/etc
	return generatePreset(out).theme
	}
	diff --git a/src/stores/users.js b/src/stores/users.js
	index 06b3f0386a..009d86c26a 100644
	--- a/src/stores/users.js
	+++ b/src/stores/users.js
	@@ -1,789 +1,788 @@
	import Cookies from 'js-cookie'
	import { last, map } from 'lodash'
	import { defineStore } from 'pinia'

	import {
	registerPushNotifications,
	unregisterPushNotifications,
	} from '../services/sw/sw.js'
	import {
	windowHeight,
	windowWidth,
	} from '../services/window_utils/window_utils'

	import { useAnnouncementsStore } from 'src/stores/announcements.js'
	import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
	import { useChatsStore } from 'src/stores/chats.js'
	import { useEmojiStore } from 'src/stores/emoji.js'
	import { useInstanceStore } from 'src/stores/instance.js'
	import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
	import { useInterfaceStore } from 'src/stores/interface.js'
	import { useListsStore } from 'src/stores/lists.js'
	import { useMergedConfigStore } from 'src/stores/merged_config.js'
	import { useNotificationsStore } from 'src/stores/notifications.js'
	import { useOAuthStore } from 'src/stores/oauth.js'
	import { useStatusesStore } from 'src/stores/statuses.js'
	import { useStreamingStore } from 'src/stores/streaming.js'
	import { useSyncConfigStore } from 'src/stores/sync_config.js'
	import { useTimelinesStore } from 'src/stores/timelines.js'
	import { useUserHighlightStore } from 'src/stores/user_highlight.js'

	import { revokeToken } from 'src/api/oauth.js'
	import {
	fetchFollowers,
	fetchFriends,
	fetchUser,
	fetchUserByName,
	searchUsers,
	verifyCredentials,
	} from 'src/api/public.js'
	import {
	blockUser,
	editUserNote,
	fetchBlocks,
	fetchDomainMutes,
	fetchMutes,
	fetchUserInLists,
	fetchUserRelationship,
	followUser,
	muteDomain,
	muteUser,
	removeUserFromFollowers,
	unblockUser,
	unmuteDomain,
	unmuteUser,
	} from 'src/api/user.js'

	const getNotificationPermission = async () => {
	const Notification = window.Notification

	if (!Notification) return null
	if (Notification.permission === 'default')
	return Notification.requestPermission()
	return Notification.permission
	}

	export const useUsersStore = defineStore('users', {
	state: () => ({
	loggingIn: false,
	lastLoginName: null,
	currentUser: null,
	users: new Map(),
	usersByName: new Map(),
	usersByURL: new Map(),
	relationships: new Map(),
	relationshipsLists: {
	friends: new WeakMap(),
	followers: new WeakMap(),
	},
	timestamps: new WeakMap(),
	fetchesIds: new Map(),
	fetchesNames: new Map(),
	}),
	getters: {
	loggedIn: (state) => !!state.currentUser,
	findUser: (state) => (query) => {
	return state.users.get(query)
	},
	findUserByName: (state) => (query) => {
	return state.usersByName.get(query.toLowerCase())
	},
	findUserByUrl: (state) => (query) => {
	return state.usersByURL.get(query.toLowerCase())
	},
	relationship: (state) => (id) => {
	const rel = id && state.relationships.get(id)
	return rel \|\| { id, loading: true }
	},
	},
	actions: {
	tagUser({ user: { id }, tag }) {
	const user = this.users.get(id)
	user.tags.add(tag)
	},
	untagUser({ user: { id }, tag }) {
	const user = this.users.get(id)
	user.tags.delete(tag)
	},
	updateRight({ user: { id }, right, value }) {
	const user = this.users.get(id)
	const newRights = user.rights
	newRights[right] = value
	user.rights = newRights
	},
	async updateUserAdminData({ user }) {
	const localUser = await this.fetchUserIfMissing({ id: user.id })

	localUser.adminData = user
	localUser.deactivated = !user.is_active
	localUser.tags = new Set(user.tags)
	},
	setCurrentUser(user) {
	this.lastLoginName = user.screen_name
	this.currentUser = user
	},
	clearCurrentUser() {
	this.currentUser = null
	this.lastLoginName = null
	},
	saveFriendIds(id, friendIds) {
	const user = this.users.get(id)
	const list = this.relationshipsLists.friends.get(user)
	friendIds.forEach((id) => list.add(id))
	},
	saveFollowerIds(id, followerIds) {
	const user = this.users.get(id)
	const list = this.relationshipsLists.followers.get(user)
	followerIds.forEach((id) => list.add(id))
	},
	// Because frontend doesn't have a reason to keep these stuff in memory
	// outside of viewing someones user profile.
	clearFriends(userId) {
	const user = this.users.get(userId)
	if (user) {
	user.friendIds = new Set()
	}
	},
	clearFollowers(userId) {
	const user = this.users.get(userId)
	if (user) {
	user.followerIds = new Set()
	}
	},
	addNewUsers(response) {
	const { data, timestamp } = response
	const users = Array.isArray(data) ? data : [data]

	return users.map((user) => {
	const existing = this.users.get(user.id) ?? {}
	const oldTimestamp = this.timestamps.get(existing)

	// Relationship might have different timestamp and
	// might need updating separate from user
	const relationship = this.updateUserRelationships({
	timestamp,
	data: { id: user.id, ...(user.relationship ?? {}) },
	})[0]

	// implicit: if oldTimestamp is undefined this will still be false
	if (oldTimestamp > timestamp) return existing // not overwriting old data with new

	const { relationship: unused1, ...newUser } = user

	// Initializing reactivity
	if (!this.users.has(user.id)) this.users.set(user.id, existing)
	const reactive = this.users.get(user.id)

	// Relying on object reactivity to avoid mutating the Map
	reactive.relationship = relationship

	Object.entries(newUser).forEach(([k, v]) => {
	reactive[k] = v
	})

	// Updating the timestamp
	this.timestamps.set(reactive, timestamp)

	// Avoiding excessive Map mutation
	if (!this.users.has(user.id)) {
	this.usersByName.set(user.screen_name.toLowerCase(), reactive)
	this.usersByURL.set(user.url.toLowerCase(), reactive)
	}

	if (user.id === this.currentUser.id) {
	this.currentUser = reactive
	}

	// Initialize some stuff
	const { friends, followers } = this.relationshipsLists
	if (!friends.has(reactive)) friends.set(reactive, new Set())
	if (!followers.has(reactive)) followers.set(reactive, new Set())

	return reactive
	})
	},
	updateUserRelationships({ timestamp, optimism, data }) {
	const relationships = Array.isArray(data) ? data : [data]

	return relationships.map((relationship) => {
	const { id } = relationship
	const existing = this.relationships.get(id) ?? {}
	const oldTimestamp = this.timestamps.get(existing)

	// implicit: if oldTimestamp is undefined this will still be false
	if (!optimism && oldTimestamp > timestamp) existing

	// Initializing reactivity
	if (!this.relationships.has(id)) this.relationships.set(id, existing)
	const reactive = this.relationships.get(id)

	// Relying on reactivity
	Object.entries(relationship).forEach(([k, v]) => {
	reactive[k] = v
	})

	if (timestamp) {
	this.timestamps.set(reactive)
	}

	// Updating user property if there is such a user
	if (this.users.has(id)) {
	this.users.get(id).relationship = reactive
	}

	return reactive
	})
	},
	updateUserInLists({ id, inLists }) {
	this.users.get(id).inLists = inLists
	},
	saveBlockIds(blockIds) {
	this.currentUser.blockIds = blockIds
	},
	addBlockId(blockId) {
	if (this.currentUser.blockIds.includes(blockId)) {
	this.currentUser.blockIds.push(blockId)
	}
	},
	setBlockIdsMaxId(blockIdsMaxId) {
	this.currentUser.blockIdsMaxId = blockIdsMaxId
	},
	saveMuteIds(muteIds) {
	this.currentUser.muteIds = muteIds
	},
	setMuteIdsMaxId(muteIdsMaxId) {
	this.currentUser.muteIdsMaxId = muteIdsMaxId
	},
	addMuteId(muteId) {
	if (this.currentUser.muteIds.includes(muteId)) {
	this.currentUser.muteIds.push(muteId)
	}
	},
	saveDomainMutes(domainMutes) {
	this.currentUser.domainMutes = domainMutes
	},
	addDomainMute(domain) {
	if (this.currentUser.domainMutes.includes(domain)) {
	this.currentUser.domainMutes.push(domain)
	}
	},
	removeDomainMute(domain) {
	const index = this.currentUser.domainMutes.indexOf(domain)
	if (index !== -1) {
	this.currentUser.domainMutes.splice(index, 1)
	}
	},
	setPinnedToUser(status) {
	const user = this.users.get(status.user.id)
	user.pinnedStatusIds = user.pinnedStatusIds \|\| []
	const index = user.pinnedStatusIds.indexOf(status.id)

	if (status.pinned && index === -1) {
	user.pinnedStatusIds.push(status.id)
	} else if (!status.pinned && index !== -1) {
	user.pinnedStatusIds.splice(index, 1)
	}
	},
	setUserForStatus(status) {
	status.user = this.users.get(status.user.id)
	},
	setUserForNotification(notification) {
	if (notification.type !== 'follow') {
	notification.action.user = this.users.get(notification.action.user.id)
	}
	notification.from_profile = this.users.get(notification.from_profile.id)
	},
	async fetchUserIfMissing({ id, name }) {
	let findFunc
	let fetchFunc
	let map
	let identifier

	if (id) {
	findFunc = this.findUser
	fetchFunc = this.fetchUser
	map = this.fetchesIds
	identifier = id
	} else if (name) {
	findFunc = this.findUserByName
	fetchFunc = this.fetchUserByName
	map = this.fetchesNames
	identifier = name
	} else {
	throw new TypeError('No identifier provided')
	}

	// Search in cache
	const user = findFunc(identifier)

	// not found => fetch
	if (!user) {
	let promise

	// Did we already search for this user?
	if (map.has(identifier)) {
	// if so, reuse the promise
	promise = map.get(identifier)
	} else {
	// if not, make a new one
	promise = fetchFunc(identifier)
	}

	map.set(identifier, promise)

	const result = await promise

	if (result?.data) {
	const { id, screen_name } = result.data

	// Save promise for future use
	this.fetchesIds.set(id, promise)
	this.fetchesNames.set(screen_name, promise)
	this.addNewUsers(result)
	return this.users.get(id)
	} else {
	return null
	}
	} else {
	return user
	}
	},
	async fetchUser(id) {
	try {
	const result = await fetchUser({
	id,
	credentials: useOAuthStore().token,
	})

	this.addNewUsers(result)

	return this.users.get(result.data.id)
	} catch (error) {
	if (error.name === 'StatusCodeError' && error.statusCode === 404) {
	console.warn(`User ${id} not found`)
	return null
	} else {
	throw error
	}
	}
	},
	async fetchUserByName(name) {
	try {
	const result = await fetchUserByName({
	name,
	credentials: useOAuthStore().token,
	})

	this.addNewUsers(result)

	return this.users.get(result.data.id)
	} catch (error) {
	if (error.name === 'StatusCodeError' && error.statusCode === 404) {
	console.warn(`User ${name} not found`)
	return null
	} else {
	throw error
	}
	}
	},
	fetchUserRelationship(id) {
	if (this.currentUser) {
	fetchUserRelationship({
	id,
	credentials: useOAuthStore().token,
	}).then((result) => this.updateUserRelationships(result))
	}
	},
	fetchUserInLists(id) {
	if (this.currentUser) {
	fetchUserInLists({
	id,
	credentials: useOAuthStore().token,
	}).then(({ data: inLists }) => this.updateUserInLists({ id, inLists }))
	}
	},
	fetchBlocks(args) {
	const { reset } = args \|\| {}

	const maxId = this.currentUser.blockIdsMaxId
	return fetchBlocks({
	maxId,
	credentials: useOAuthStore().token,
	}).then((result) => {
	const { data: blocks } = result
	if (reset) {
	this.saveBlockIds(blocks.map(({ id }) => id))
	} else {
	blocks.forEach(({ id }) => this.addBlockId(id))
	}
	if (blocks.length) {
	this.setBlockIdsMaxId(last(blocks).id)
	}
	this.addNewUsers(result)
	return blocks
	})
	},
	blockUser(id, expiresIn = 0) {
	const store = window.vuex

	const predictedRelationship = this.relationships[id] \|\| { id }
	this.updateUserRelationships({
	optimism: true,
	data: [predictedRelationship],
	})
	this.addBlockId(id)

	return blockUser({ id, expiresIn }).then((result) => {
	this.updateUserRelationships(result)
	this.addBlockId(id)

	store.commit('removeStatus', { timeline: 'friends', userId: id })
	store.commit('removeStatus', { timeline: 'public', userId: id })
	store.commit('removeStatus', {
	timeline: 'publicAndExternal',
	userId: id,
	})
	})
	},
	unblockUser(id) {
	return unblockUser({ id }).then((data) =>
	this.updateUserRelationships(data),
	)
	},
	removeUserFromFollowers(id) {
	return removeUserFromFollowers({ id }).then((data) =>
	this.updateUserRelationships(data),
	)
	},
	blockUsers(data = []) {
	return Promise.all(data.map((d) => this.blockUser(d)))
	},
	unblockUsers(data = []) {
	return Promise.all(data.map((d) => unblockUser(d)))
	},
	editUserNote({ id, comment }) {
	return editUserNote({ id, comment }).then(({ data }) =>
	this.updateUserRelationships(data),
	)
	},
	fetchMutes(args) {
	const { reset } = args \|\| {}

	const maxId = this.currentUser.muteIdsMaxId
	return fetchMutes({
	maxId,
	credentials: useOAuthStore().token,
	}).then((result) => {
	const { data: mutes } = result
	if (reset) {
	this.saveMuteIds(mutes.map(({ id }) => id))
	} else {
	mutes.forEach(({ id }) => this.addMuteId(id))
	}
	if (mutes.length) {
	this.setMuteIdsMaxId(last(mutes).id)
	}
	this.addNewUsers(result)
	return mutes
	})
	},
	muteUser(id, expiresIn = 0) {
	const predictedRelationship = this.relationships[id] \|\| { id }
	predictedRelationship.muting = true
	this.updateUserRelationships({
	optimism: true,
	data: [predictedRelationship],
	})
	this.addMuteId(id)

	return muteUser({
	id,
	expiresIn,
	credentials: useOAuthStore().token,
	}).then(({ data }) => {
	this.updateUserRelationships(data)
	this.addMuteId(id)
	})
	},
	unmuteUser(id) {
	const predictedRelationship = this.relationships[id] \|\| { id }
	predictedRelationship.muting = false
	this.updateUserRelationships({
	optimism: true,
	data: [predictedRelationship],
	})

	return unmuteUser({ id }).then(({ data }) =>
	this.updateUserRelationships(data),
	)
	},
	hideReblogs(id) {
	return followUser({
	id,
	reblogs: false,
	credentials: useOAuthStore().token,
	}).then(({ data }) => this.updateUserRelationships(data))
	},
	showReblogs(id) {
	return followUser({
	id,
	reblogs: true,
	credentials: useOAuthStore().token,
	}).then(({ data }) => this.updateUserRelationships(data))
	},
	muteUsers(data = []) {
	return Promise.all(data.map((d) => this.muteUser(d)))
	},
	unmuteUsers(ids = []) {
	return Promise.all(ids.map((d) => this.unmuteUser(d)))
	},
	fetchDomainMutes() {
	return fetchDomainMutes({
	credentials: useOAuthStore().token,
	}).then(({ data: domainMutes }) => {
	this.saveDomainMutes(domainMutes)
	return domainMutes
	})
	},
	muteDomain(domain) {
	return muteDomain({
	domain,
	credentials: useOAuthStore().token,
	}).then(() => this.addDomainMute(domain))
	},
	unmuteDomain(domain) {
	return unmuteDomain({
	domain,
	credentials: useOAuthStore().token,
	}).then(() => this.removeDomainMute(domain))
	},
	muteDomains(domains = []) {
	return Promise.all(domains.map((domain) => this.muteDomain(domain)))
	},
	unmuteDomains(domain = []) {
	return Promise.all(domain.map((domain) => this.unmuteDomain(domain)))
	},
	fetchFriends(id) {
	const user = this.users.get(id)
	const maxId = last([...this.relationshipsLists.friends.get(user)])
	return fetchFriends({
	id,
	maxId,
	credentials: useOAuthStore().token,
	}).then((result) => {
	this.addNewUsers(result)
	this.saveFriendIds(id, map(result.data, 'id'))
	return result.data
	})
	},
	fetchFollowers(id) {
	const user = this.users.get(id)
	const maxId = last([...this.relationshipsLists.followers.get(user)])
	return fetchFollowers({
	id,
	maxId,
	credentials: useOAuthStore().token,
	}).then((result) => {
	this.addNewUsers(result)
	this.saveFollowerIds(id, map(result.data, 'id'))
	return result.data
	})
	},
	subscribeUser(id) {
	return followUser({
	id,
	notify: true,
	credentials: useOAuthStore().token,
	}).then(({ data }) => this.updateUserRelationships(data))
	},
	unsubscribeUser(id) {
	return followUser({
	id,
	notify: false,
	credentials: useOAuthStore().token,
	}).then(({ data }) => this.updateUserRelationships(data))
	},
	registerPushNotifications() {
	const token = this.currentUser.credentials
	const vapidPublicKey = useInstanceStore().vapidPublicKey
	const isEnabled = useMergedConfigStore().mergedConfig.webPushNotifications
	const notificationVisibility =
	useMergedConfigStore().mergedConfig.notificationVisibility

	registerPushNotifications(
	isEnabled,
	vapidPublicKey,
	token,
	notificationVisibility,
	)
	},
	unregisterPushNotifications() {
	const token = this.currentUser.credentials

	unregisterPushNotifications(token)
	},
	searchUsers({ query }) {
	return searchUsers({
	query,
	credentials: useOAuthStore().token,
	}).then(({ data: users }) => {
	this.addNewUsers(users)
	return users
	})
	},

	logout() {
	const store = window.vuex
	const oauth = useOAuthStore()

	// NOTE: No need to verify the app still exists, because if it doesn't,
	// the token will be invalid too
	return oauth
	.ensureApp()
	.then((app) => {
	const params = {
	app,
	instance: useInstanceStore().server,
	token: oauth.userToken,
	}

	return revokeToken(params)
	})
	.then(() => {
	this.clearCurrentUser()
	store.dispatch('stopFetchingNotifications')
	useListsStore().stopFetching()
	useBookmarkFoldersStore().stopFetching()
	store.dispatch('stopFetchingFollowRequests')
	store.commit('clearNotifications')
	useTimelinesStore().deactivateAll()
	useStatusesStore().resetStatuses()
	useNotificationsStore().clearNotifications()
	useChatsStore().resetChats()
	oauth.clearToken()
	Cookies.remove('__Host-pleroma_key', { path: '/' })
	useInterfaceStore().setLastTimeline('public-timeline')
	useInterfaceStore().setLayoutWidth(windowWidth())
	useInterfaceStore().setLayoutHeight(windowHeight())
	})
	},
	loginUser(accessToken) {
	return new Promise((resolve, reject) => {
	const store = window.vuex
	const dispatch = store.dispatch

	this.loggingIn = true

	verifyCredentials({
	credentials: useOAuthStore().token,
	})
	.then(({ data: user, ...rest }) => {
	// user.credentials = userCredentials
	user.credentials = accessToken
	user.blockIds = []
	user.muteIds = []
	user.domainMutes = []
	this.setCurrentUser(user)

	useSyncConfigStore()
	.initSyncConfig(user)
	.then(() => {
	useInterfaceStore()
	.applyTheme()
	.catch((e) => {
	console.error('Error setting theme', e)
	})
	})
	useUserHighlightStore().initUserHighlight(user)
	this.addNewUsers({ data: user, ...rest })

	useEmojiStore().fetchEmoji()

	getNotificationPermission().then((permission) =>
	useInterfaceStore().setNotificationPermission(permission),
	)

	// Do server-side storage migrations

	// Debug snippet to clean up storage and reset migrations
	/*
	// Reset wordfilter
	Object.keys(
	useSyncConfigStore().prefsStorage.simple.muteFilters
	).forEach(key => {
	useSyncConfigStore().unsetSimplePrefAndSave({ path: 'muteFilters.' + key, value: null })
	})

	// Reset flag to 0 to re-run migrations
	useSyncConfigStore().setFlag({ flag: 'configMigration', value: 0 })
	/**/

	if (user.token) {
	// Shoutbox
	dispatch('setWsToken', user.token)
	dispatch('initializeSocket')
	}

	// DMs and Home
	- useStatusesStore().attachSocket()
	useNotificationsStore().activate()
	useTimelinesStore().activatePersistents()

	if (useInstanceCapabilitiesStore().pleromaChatMessagesAvailable) {
	// Start fetching chats
	useChatsStore().startFetchingChats()
	}

	useListsStore().startFetching()
	useBookmarkFoldersStore().startFetching()

	if (user.locked) {
	dispatch('startFetchingFollowRequests')
	}

	- useStreamingStore().initSocket()
	+ useStreamingStore().initSocket(true)
	if (useMergedConfigStore().mergedConfig.useStreamingApi) {
	- useStreamingStore().initSocket()
	+ useStreamingStore().initSocket(true)
	}

	// Start fetching things that don't need to block the UI
	useAnnouncementsStore().startFetchingAnnouncements()

	this.fetchMutes()
	dispatch('loadDrafts')

	useInterfaceStore().setLayoutWidth(windowWidth())
	useInterfaceStore().setLayoutHeight(windowHeight())

	// Fetch our friends
	fetchFriends({ id: user.id }).then((friends) =>
	this.addNewUsers(friends),
	)
	this.loggingIn = false
	resolve()
	})
	.catch((error) => {
	console.error(error)

	// Authentication failed
	this.loggingIn = false

	// remove authentication token on client/authentication errors
	if ([400, 401, 403, 422].includes(error.statusCode)) {
	useOAuthStore().clearToken()
	}

	this.loggingIn = false
	if (error.tatusCode === 401) {
	throw new Error('Wrong username or password', error)
	} else {
	throw new Error('An error occurred, please try again', error)
	}
	})
	})
	},
	},
	persist: {
	paths: ['lastLoginName'],
	},
	})

File Metadata

Mime Type: text/x-diff
Expires: Fri, Oct 30, 7:35 PM (15 h, 6 m)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 1800468
Default Alt Text: (71 KB)

No OneTemporaryActions

View Options

File Metadata

Event Timeline

No OneTemporary
Actions