No OneTemporary
Actions

Size

104 KB

Referenced Files

None

Subscribers

None

View Options

	diff --git a/src/components/poll/poll_form.js b/src/components/poll/poll_form.js
	index e30645c34e..a207015537 100644
	--- a/src/components/poll/poll_form.js
	+++ b/src/components/poll/poll_form.js
	@@ -1,136 +1,127 @@
	import * as DateUtils from 'src/services/date_utils/date_utils.js'
	import { uniq } from 'lodash'
	import { library } from '@fortawesome/fontawesome-svg-core'
	import Select from '../select/select.vue'
	import {
	faTimes,
	faPlus
	} from '@fortawesome/free-solid-svg-icons'

	library.add(
	faTimes,
	faPlus
	)

	export default {
	components: {
	Select
	},
	name: 'PollForm',
	props: ['visible'],
	data: () => ({
	pollType: 'single',
	options: ['', ''],
	expiryAmount: 10,
	expiryUnit: 'minutes'
	}),
	computed: {
	pollLimits () {
	return this.$store.state.instance.pollLimits
	},
	maxOptions () {
	return this.pollLimits.max_options
	},
	maxLength () {
	return this.pollLimits.max_option_chars
	},
	expiryUnits () {
	const allUnits = ['minutes', 'hours', 'days']
	const expiry = this.convertExpiryFromUnit
	return allUnits.filter(
	unit => this.pollLimits.max_expiration >= expiry(unit, 1)
	)
	},
	minExpirationInCurrentUnit () {
	return Math.ceil(
	this.convertExpiryToUnit(
	this.expiryUnit,
	this.pollLimits.min_expiration
	)
	)
	},
	maxExpirationInCurrentUnit () {
	return Math.floor(
	this.convertExpiryToUnit(
	this.expiryUnit,
	this.pollLimits.max_expiration
	)
	)
	}
	},
	methods: {
	clear () {
	this.pollType = 'single'
	this.options = ['', '']
	this.expiryAmount = 10
	this.expiryUnit = 'minutes'
	},
	nextOption (index) {
	const element = this.$el.querySelector(`#poll-${index + 1}`)
	if (element) {
	element.focus()
	} else {
	// Try adding an option and try focusing on it
	const addedOption = this.addOption()
	if (addedOption) {
	this.$nextTick(function () {
	this.nextOption(index)
	})
	}
	}
	},
	addOption () {
	if (this.options.length < this.maxOptions) {
	this.options.push('')
	return true
	}
	return false
	},
	deleteOption (index, event) {
	if (this.options.length > 2) {
	this.options.splice(index, 1)
	this.updatePollToParent()
	}
	},
	convertExpiryToUnit (unit, amount) {
	// Note: we want seconds and not milliseconds
	- switch (unit) {
	- case 'minutes': return (1000 * amount) / DateUtils.MINUTE
	- case 'hours': return (1000 * amount) / DateUtils.HOUR
	- case 'days': return (1000 * amount) / DateUtils.DAY
	- }
	+ return DateUtils.secondsToUnit(unit, amount)
	},
	convertExpiryFromUnit (unit, amount) {
	- // Note: we want seconds and not milliseconds
	- switch (unit) {
	- case 'minutes': return 0.001 * amount * DateUtils.MINUTE
	- case 'hours': return 0.001 * amount * DateUtils.HOUR
	- case 'days': return 0.001 * amount * DateUtils.DAY
	- }
	+ return DateUtils.unitToSeconds(unit, amount)
	},
	expiryAmountChange () {
	this.expiryAmount =
	Math.max(this.minExpirationInCurrentUnit, this.expiryAmount)
	this.expiryAmount =
	Math.min(this.maxExpirationInCurrentUnit, this.expiryAmount)
	this.updatePollToParent()
	},
	updatePollToParent () {
	const expiresIn = this.convertExpiryFromUnit(
	this.expiryUnit,
	this.expiryAmount
	)

	const options = uniq(this.options.filter(option => option !== ''))
	if (options.length < 2) {
	this.$emit('update-poll', { error: this.$t('polls.not_enough_options') })
	return
	}
	this.$emit('update-poll', {
	options,
	multiple: this.pollType === 'multiple',
	expiresIn
	})
	}
	}
	}
	diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
	index 1bcc434100..e17bf8eb28 100644
	--- a/src/components/user_card/user_card.js
	+++ b/src/components/user_card/user_card.js
	@@ -1,228 +1,237 @@
	+import { unitToSeconds } from 'src/services/date_utils/date_utils.js'
	import UserAvatar from '../user_avatar/user_avatar.vue'
	import RemoteFollow from '../remote_follow/remote_follow.vue'
	import ProgressButton from '../progress_button/progress_button.vue'
	import FollowButton from '../follow_button/follow_button.vue'
	import ModerationTools from '../moderation_tools/moderation_tools.vue'
	import AccountActions from '../account_actions/account_actions.vue'
	import UserNote from '../user_note/user_note.vue'
	import Select from '../select/select.vue'
	import UserLink from '../user_link/user_link.vue'
	import RichContent from 'src/components/rich_content/rich_content.jsx'
	import ConfirmModal from '../confirm_modal/confirm_modal.vue'
	import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
	import { mapGetters } from 'vuex'
	import { library } from '@fortawesome/fontawesome-svg-core'
	import {
	faBell,
	faRss,
	faSearchPlus,
	faExternalLinkAlt,
	faEdit,
	faTimes,
	faExpandAlt
	} from '@fortawesome/free-solid-svg-icons'

	library.add(
	faRss,
	faBell,
	faSearchPlus,
	faExternalLinkAlt,
	faEdit,
	faTimes,
	faExpandAlt
	)

	export default {
	props: [
	'userId',
	'switcher',
	'selected',
	'hideBio',
	'rounded',
	'bordered',
	'avatarAction', // default - open profile, 'zoom' - zoom, function - call function
	'onClose',
	'hasNoteEditor'
	],
	data () {
	return {
	followRequestInProgress: false,
	betterShadow: this.$store.state.interface.browserSupport.cssFilter,
	- showingConfirmMute: false
	+ showingConfirmMute: false,
	+ muteExpiryAmount: 0,
	+ muteExpiryUnit: 'minutes'
	}
	},
	created () {
	this.$store.dispatch('fetchUserRelationship', this.user.id)
	},
	computed: {
	user () {
	return this.$store.getters.findUser(this.userId)
	},
	relationship () {
	return this.$store.getters.relationship(this.userId)
	},
	classes () {
	return [{
	'-rounded-t': this.rounded === 'top', // set border-top-left-radius and border-top-right-radius
	'-rounded': this.rounded === true, // set border-radius for all sides
	'-bordered': this.bordered === true, // set border for all sides
	'-popover': !!this.onClose // set popover rounding
	}]
	},
	style () {
	return {
	backgroundImage: [
	'linear-gradient(to bottom, var(--profileTint), var(--profileTint))',
	`url(${this.user.cover_photo})`
	].join(', ')
	}
	},
	isOtherUser () {
	return this.user.id !== this.$store.state.users.currentUser.id
	},
	subscribeUrl () {
	// eslint-disable-next-line no-undef
	const serverUrl = new URL(this.user.statusnet_profile_url)
	return `${serverUrl.protocol}//${serverUrl.host}/main/ostatus`
	},
	loggedIn () {
	return this.$store.state.users.currentUser
	},
	dailyAvg () {
	const days = Math.ceil((new Date() - new Date(this.user.created_at)) / (60 * 60 * 24 * 1000))
	return Math.round(this.user.statuses_count / days)
	},
	userHighlightType: {
	get () {
	const data = this.$store.getters.mergedConfig.highlight[this.user.screen_name]
	return (data && data.type) \|\| 'disabled'
	},
	set (type) {
	const data = this.$store.getters.mergedConfig.highlight[this.user.screen_name]
	if (type !== 'disabled') {
	this.$store.dispatch('setHighlight', { user: this.user.screen_name, color: (data && data.color) \|\| '#FFFFFF', type })
	} else {
	this.$store.dispatch('setHighlight', { user: this.user.screen_name, color: undefined })
	}
	},
	...mapGetters(['mergedConfig'])
	},
	userHighlightColor: {
	get () {
	const data = this.$store.getters.mergedConfig.highlight[this.user.screen_name]
	return data && data.color
	},
	set (color) {
	this.$store.dispatch('setHighlight', { user: this.user.screen_name, color })
	}
	},
	visibleRole () {
	const rights = this.user.rights
	if (!rights) { return }
	const validRole = rights.admin \|\| rights.moderator
	const roleTitle = rights.admin ? 'admin' : 'moderator'
	return validRole && roleTitle
	},
	hideFollowsCount () {
	return this.isOtherUser && this.user.hide_follows_count
	},
	hideFollowersCount () {
	return this.isOtherUser && this.user.hide_followers_count
	},
	showModerationMenu () {
	const privileges = this.loggedIn.privileges
	return this.loggedIn.role === 'admin' \|\| privileges.includes('users_manage_activation_state') \|\| privileges.includes('users_delete') \|\| privileges.includes('users_manage_tags')
	},
	hasNote () {
	return this.relationship.note
	},
	supportsNote () {
	return 'note' in this.relationship
	},
	shouldConfirmMute () {
	return this.mergedConfig.modalOnMute
	},
	+ muteExpiryUnits () {
	+ return ['minutes', 'hours', 'days']
	+ },
	...mapGetters(['mergedConfig'])
	},
	components: {
	UserAvatar,
	RemoteFollow,
	ModerationTools,
	AccountActions,
	ProgressButton,
	FollowButton,
	Select,
	RichContent,
	UserLink,
	UserNote,
	ConfirmModal
	},
	methods: {
	showConfirmMute () {
	this.showingConfirmMute = true
	},
	hideConfirmMute () {
	this.showingConfirmMute = false
	},
	muteUser () {
	if (!this.shouldConfirmMute) {
	this.doMuteUser()
	} else {
	this.showConfirmMute()
	}
	},
	doMuteUser () {
	- this.$store.dispatch('muteUser', this.user.id)
	+ this.$store.dispatch('muteUser', {
	+ id: this.user.id,
	+ expiresIn: this.shouldConfirmMute ? unitToSeconds(this.muteExpiryUnit, this.muteExpiryAmount) : 0
	+ })
	this.hideConfirmMute()
	},
	unmuteUser () {
	this.$store.dispatch('unmuteUser', this.user.id)
	},
	subscribeUser () {
	return this.$store.dispatch('subscribeUser', this.user.id)
	},
	unsubscribeUser () {
	return this.$store.dispatch('unsubscribeUser', this.user.id)
	},
	setProfileView (v) {
	if (this.switcher) {
	const store = this.$store
	store.commit('setProfileView', { v })
	}
	},
	linkClicked ({ target }) {
	if (target.tagName === 'SPAN') {
	target = target.parentNode
	}
	if (target.tagName === 'A') {
	window.open(target.href, '_blank')
	}
	},
	userProfileLink (user) {
	return generateProfileLink(
	user.id, user.screen_name,
	this.$store.state.instance.restrictedNicknames
	)
	},
	openProfileTab () {
	this.$store.dispatch('openSettingsModalTab', 'profile')
	},
	zoomAvatar () {
	const attachment = {
	url: this.user.profile_image_url_original,
	mimetype: 'image'
	}
	this.$store.dispatch('setMedia', [attachment])
	this.$store.dispatch('setCurrentMedia', attachment)
	},
	mentionUser () {
	this.$store.dispatch('openPostStatusModal', { replyTo: true, repliedUser: this.user })
	},
	onAvatarClickHandler (e) {
	if (this.onAvatarClick) {
	e.preventDefault()
	this.onAvatarClick()
	}
	}
	}
	}
	diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
	index d56b667203..4ab93a8a36 100644
	--- a/src/components/user_card/user_card.scss
	+++ b/src/components/user_card/user_card.scss
	@@ -1,357 +1,362 @@
	@import "../../variables";

	.user-card {
	position: relative;
	z-index: 1;

	&:hover {
	--_still-image-img-visibility: visible;
	--_still-image-canvas-visibility: hidden;
	--_still-image-label-visibility: hidden;
	}

	.panel-heading {
	padding: 0.5em 0;
	text-align: center;
	box-shadow: none;
	background: transparent;
	flex-direction: column;
	align-items: stretch;
	// create new stacking context
	position: relative;
	}

	.panel-body {
	word-wrap: break-word;
	border-bottom-right-radius: inherit;
	border-bottom-left-radius: inherit;
	// create new stacking context
	position: relative;
	}

	.background-image {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	mask:
	linear-gradient(to top, white, transparent) bottom no-repeat,
	linear-gradient(to top, white, white);
	// Autoprefixer seem to ignore this one, and also syntax is different
	mask-composite: xor;
	mask-composite: exclude;
	background-size: cover;
	mask-size: 100% 60%;
	border-top-left-radius: calc(var(--__roundnessTop, --panelRadius) - 1px);
	border-top-right-radius: calc(var(--__roundnessTop, --panelRadius) - 1px);
	border-bottom-left-radius: calc(var(--__roundnessBottom, --panelRadius) - 1px);
	border-bottom-right-radius: calc(var(--__roundnessBottom, --panelRadius) - 1px);
	background-color: var(--profileBg);
	z-index: -2;

	&.hide-bio {
	mask-size: 100% 40px;
	}
	}

	&-bio {
	text-align: center;
	display: block;
	line-height: 1.3;
	padding: 1em;
	margin: 0;

	a {
	color: $fallback--link;
	color: var(--postLink, $fallback--link);
	}

	img {
	object-fit: contain;
	vertical-align: middle;
	max-width: 100%;
	max-height: 400px;
	}
	}

	&.-rounded-t {
	border-top-left-radius: $fallback--panelRadius;
	border-top-left-radius: var(--panelRadius, $fallback--panelRadius);
	border-top-right-radius: $fallback--panelRadius;
	border-top-right-radius: var(--panelRadius, $fallback--panelRadius);

	--__roundnessTop: var(--panelRadius);
	--__roundnessBottom: 0;
	}

	&.-rounded {
	border-radius: $fallback--panelRadius;
	border-radius: var(--panelRadius, $fallback--panelRadius);

	--__roundnessTop: var(--panelRadius);
	--__roundnessBottom: var(--panelRadius);
	}

	&.-popover {
	border-radius: $fallback--tooltipRadius;
	border-radius: var(--tooltipRadius, $fallback--tooltipRadius);

	--__roundnessTop: var(--tooltipRadius);
	--__roundnessBottom: var(--tooltipRadius);
	}

	&.-bordered {
	border-width: 1px;
	border-style: solid;
	border-color: $fallback--border;
	border-color: var(--border, $fallback--border);
	}
	}

	.user-info {
	color: $fallback--lightText;
	color: var(--lightText, $fallback--lightText);
	padding: 0 26px;

	a {
	color: $fallback--lightText;
	color: var(--lightText, $fallback--lightText);

	&:hover {
	color: var(--icon);
	}
	}

	.container {
	min-width: 0;
	padding: 16px 0 6px;
	display: flex;
	align-items: flex-start;
	max-height: 56px;

	> * {
	min-width: 0;
	}

	> a {
	vertical-align: middle;
	display: flex;
	}

	.Avatar {
	--_avatarShadowBox: var(--avatarShadow);
	--_avatarShadowFilter: var(--avatarShadowFilter);
	--_avatarShadowInset: var(--avatarShadowInset);

	width: 56px;
	height: 56px;
	object-fit: cover;
	}
	}

	&-avatar {
	position: relative;
	cursor: pointer;

	&.-overlay {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background-color: rgb(0 0 0 / 30%);
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: $fallback--avatarRadius;
	border-radius: var(--avatarRadius, $fallback--avatarRadius);
	opacity: 0;
	transition: opacity 0.2s ease;

	svg {
	color: #fff;
	}
	}

	&:hover &.-overlay {
	opacity: 1;
	}
	}

	.external-link-button,
	.edit-profile-button {
	cursor: pointer;
	width: 2.5em;
	text-align: center;
	margin: -0.5em 0;
	padding: 0.5em 0;

	&:not(:hover) .icon {
	color: $fallback--lightText;
	color: var(--lightText, $fallback--lightText);
	}
	}

	.bottom-line {
	font-weight: light;
	font-size: 1.1em;
	align-items: baseline;

	.lock-icon {
	margin-left: 0.5em;
	}

	.user-screen-name {
	min-width: 1px;
	flex: 0 1 auto;
	text-overflow: ellipsis;
	overflow: hidden;
	}

	.dailyAvg {
	min-width: 1px;
	flex: 0 0 auto;
	margin-left: 1em;
	font-size: 0.7em;
	color: $fallback--text;
	color: var(--text, $fallback--text);
	}

	.user-role {
	flex: none;
	color: $fallback--text;
	color: var(--alertNeutralText, $fallback--text);
	background-color: $fallback--fg;
	background-color: var(--alertNeutral, $fallback--fg);
	}
	}

	.user-summary {
	display: block;
	margin-left: 0.6em;
	text-align: left;
	text-overflow: ellipsis;
	white-space: nowrap;
	flex: 1 1 0;
	// This is so that text doesn't get overlapped by avatar's shadow if it has
	// big one
	z-index: 1;
	line-height: 2em;

	--emoji-size: 1.7em;

	.top-line,
	.bottom-line {
	display: flex;
	}
	}

	.user-name {
	text-overflow: ellipsis;
	overflow: hidden;
	flex: 1 1 auto;
	margin-right: 1em;
	font-size: 1.1em;
	}

	.user-meta {
	margin-bottom: 0.15em;
	display: flex;
	align-items: baseline;
	line-height: 22px;
	flex-wrap: wrap;

	.following {
	flex: 1 0 auto;
	margin: 0;
	margin-bottom: 0.25em;
	text-align: left;
	}

	.highlighter {
	flex: 0 1 auto;
	display: flex;
	flex-wrap: wrap;
	margin-right: -0.5em;
	align-self: start;

	.userHighlightCl {
	padding: 2px 10px;
	flex: 1 0 auto;
	}

	.userHighlightSel {
	padding-top: 0;
	padding-bottom: 0;
	flex: 1 0 auto;
	}

	.userHighlightText {
	width: 70px;
	flex: 1 0 auto;
	}

	.userHighlightCl,
	.userHighlightText,
	.userHighlightSel {
	vertical-align: top;
	margin-right: 0.5em;
	margin-bottom: 0.25em;
	}
	}
	}

	.user-interactions {
	position: relative;
	display: flex;
	flex-flow: row wrap;
	margin-right: -0.75em;

	> * {
	margin: 0 0.75em 0.6em 0;
	white-space: nowrap;
	min-width: 95px;
	}

	button {
	margin: 0;
	}
	}

	.user-note {
	margin: 0 0.75em 0.6em 0;
	}
	}

	.sidebar .edit-profile-button {
	display: none;
	}

	.user-counts {
	display: flex;
	line-height: 16px;
	padding: 0.5em 1.5em 0;
	text-align: center;
	justify-content: space-between;
	color: $fallback--lightText;
	color: var(--lightText, $fallback--lightText);
	flex-wrap: wrap;
	}

	.user-count {
	flex: 1 0 auto;
	padding: 0.5em 0;
	margin: 0 0.5em;

	h5 {
	font-size: 1em;
	font-weight: bolder;
	margin: 0 0 0.25em;
	}

	/* stylelint-disable-next-line no-descending-specificity */
	a {
	text-decoration: none;
	}
	}
	+
	+.mute-expiry {
	+ display: flex;
	+ flex-direction: row;
	+}
	diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
	index 01882aa828..2de14063de 100644
	--- a/src/components/user_card/user_card.vue
	+++ b/src/components/user_card/user_card.vue
	@@ -1,343 +1,369 @@
	<template>
	<div
	class="user-card"
	:class="classes"
	>
	<div
	:class="{ 'hide-bio': hideBio }"
	:style="style"
	class="background-image"
	/>
	<div :class="onClose ? '' : panel-heading -flexible-height">
	<div class="user-info">
	<div class="container">
	<a
	v-if="avatarAction === 'zoom'"
	class="user-info-avatar -link"
	@click="zoomAvatar"
	>
	<UserAvatar
	:better-shadow="betterShadow"
	:user="user"
	/>
	<div class="user-info-avatar -link -overlay">
	<FAIcon
	class="fa-scale-110 fa-old-padding"
	icon="search-plus"
	/>
	</div>
	</a>
	<UserAvatar
	v-else-if="typeof avatarAction === 'function'"
	class="user-info-avatar"
	:better-shadow="betterShadow"
	:user="user"
	@click="avatarAction"
	/>
	<router-link
	v-else
	:to="userProfileLink(user)"
	>
	<UserAvatar
	:better-shadow="betterShadow"
	:user="user"
	/>
	</router-link>
	<div class="user-summary">
	<div class="top-line">
	<router-link
	:to="userProfileLink(user)"
	class="user-name"
	>
	<RichContent
	:title="user.name"
	:html="user.name"
	:emoji="user.emoji"
	/>
	</router-link>
	<button
	v-if="!isOtherUser && user.is_local"
	class="button-unstyled edit-profile-button"
	@click.stop="openProfileTab"
	>
	<FAIcon
	fixed-width
	class="icon"
	icon="edit"
	:title="$t('user_card.edit_profile')"
	/>
	</button>
	<a
	v-if="isOtherUser && !user.is_local"
	:href="user.statusnet_profile_url"
	target="_blank"
	class="button-unstyled external-link-button"
	>
	<FAIcon
	class="icon"
	icon="external-link-alt"
	/>
	</a>
	<AccountActions
	v-if="isOtherUser && loggedIn"
	:user="user"
	:relationship="relationship"
	/>
	<router-link
	v-if="onClose"
	:to="userProfileLink(user)"
	class="button-unstyled external-link-button"
	@click="onClose"
	>
	<FAIcon
	class="icon"
	icon="expand-alt"
	/>
	</router-link>
	<button
	v-if="onClose"
	class="button-unstyled external-link-button"
	@click="onClose"
	>
	<FAIcon
	class="icon"
	icon="times"
	/>
	</button>
	</div>
	<div class="bottom-line">
	<user-link
	class="user-screen-name"
	:user="user"
	/>
	<template v-if="!hideBio">
	<span
	v-if="user.deactivated"
	class="alert user-role"
	>
	{{ $t('user_card.deactivated') }}
	</span>
	<span
	v-if="!!visibleRole"
	class="alert user-role"
	>
	{{ $t(`general.role.${visibleRole}`) }}
	</span>
	<span
	v-if="user.bot"
	class="alert user-role"
	>
	{{ $t('user_card.bot') }}
	</span>
	</template>
	<span v-if="user.locked">
	<FAIcon
	class="lock-icon"
	icon="lock"
	size="sm"
	/>
	</span>
	<span
	v-if="!mergedConfig.hideUserStats && !hideBio"
	class="dailyAvg"
	>{{ dailyAvg }} {{ $t('user_card.per_day') }}</span>
	</div>
	</div>
	</div>
	<div class="user-meta">
	<div
	v-if="relationship.followed_by && loggedIn && isOtherUser"
	class="following"
	>
	{{ $t('user_card.follows_you') }}
	</div>
	<div
	v-if="isOtherUser && (loggedIn \|\| !switcher)"
	class="highlighter"
	>
	<!-- id's need to be unique, otherwise vue confuses which user-card checkbox belongs to -->
	<input
	v-if="userHighlightType !== 'disabled'"
	:id="'userHighlightColorTx'+user.id"
	v-model="userHighlightColor"
	class="userHighlightText"
	type="text"
	>
	<input
	v-if="userHighlightType !== 'disabled'"
	:id="'userHighlightColor'+user.id"
	v-model="userHighlightColor"
	class="userHighlightCl"
	type="color"
	>
	{{ ' ' }}
	<Select
	:id="'userHighlightSel'+user.id"
	v-model="userHighlightType"
	class="userHighlightSel"
	>
	<option value="disabled">
	{{ $t('user_card.highlight.disabled') }}
	</option>
	<option value="solid">
	{{ $t('user_card.highlight.solid') }}
	</option>
	<option value="striped">
	{{ $t('user_card.highlight.striped') }}
	</option>
	<option value="side">
	{{ $t('user_card.highlight.side') }}
	</option>
	</Select>
	</div>
	</div>
	<div
	v-if="loggedIn && isOtherUser"
	class="user-interactions"
	>
	<div class="btn-group">
	<FollowButton
	:relationship="relationship"
	:user="user"
	/>
	<template v-if="relationship.following">
	<ProgressButton
	v-if="!relationship.subscribing"
	class="btn button-default"
	:click="subscribeUser"
	:title="$t('user_card.subscribe')"
	>
	<FAIcon icon="bell" />
	</ProgressButton>
	<ProgressButton
	v-else
	class="btn button-default toggled"
	:click="unsubscribeUser"
	:title="$t('user_card.unsubscribe')"
	>
	<FALayers>
	<FAIcon
	icon="rss"
	transform="left-5 shrink-6 up-3 rotate-20"
	flip="horizontal"
	/>
	<FAIcon
	icon="rss"
	transform="right-5 shrink-6 up-3 rotate-20"
	/>
	<FAIcon icon="bell" />
	</FALayers>
	</ProgressButton>
	</template>
	</div>
	<div>
	<button
	v-if="relationship.muting"
	class="btn button-default btn-block toggled"
	:disabled="user.deactivated"
	@click="unmuteUser"
	>
	{{ $t('user_card.muted') }}
	</button>
	<button
	v-else
	class="btn button-default btn-block"
	:disabled="user.deactivated"
	@click="muteUser"
	>
	{{ $t('user_card.mute') }}
	</button>
	</div>
	<div>
	<button
	class="btn button-default btn-block"
	:disabled="user.deactivated"
	@click="mentionUser"
	>
	{{ $t('user_card.mention') }}
	</button>
	</div>
	<ModerationTools
	v-if="showModerationMenu"
	:user="user"
	/>
	</div>
	<div
	v-if="!loggedIn && user.is_local"
	class="user-interactions"
	>
	<RemoteFollow :user="user" />
	</div>
	<UserNote
	v-if="loggedIn && isOtherUser && (hasNote \|\| (hasNoteEditor && supportsNote))"
	:user="user"
	:relationship="relationship"
	:editable="hasNoteEditor"
	/>
	</div>
	</div>
	<div
	v-if="!hideBio"
	class="panel-body"
	>
	<div
	v-if="!mergedConfig.hideUserStats && switcher"
	class="user-counts"
	>
	<div
	class="user-count"
	@click.prevent="setProfileView('statuses')"
	>
	<h5>{{ $t('user_card.statuses') }}</h5>
	<span>{{ user.statuses_count }} <br></span>
	</div>
	<div
	class="user-count"
	@click.prevent="setProfileView('friends')"
	>
	<h5>{{ $t('user_card.followees') }}</h5>
	<span>{{ hideFollowsCount ? $t('user_card.hidden') : user.friends_count }}</span>
	</div>
	<div
	class="user-count"
	@click.prevent="setProfileView('followers')"
	>
	<h5>{{ $t('user_card.followers') }}</h5>
	<span>{{ hideFollowersCount ? $t('user_card.hidden') : user.followers_count }}</span>
	</div>
	</div>
	<RichContent
	v-if="!hideBio"
	class="user-card-bio"
	:html="user.description_html"
	:emoji="user.emoji"
	:handle-links="true"
	/>
	</div>
	<teleport to="#modal">
	<confirm-modal
	v-if="showingConfirmMute"
	:title="$t('user_card.mute_confirm_title')"
	:confirm-text="$t('user_card.mute_confirm_accept_button')"
	:cancel-text="$t('user_card.mute_confirm_cancel_button')"
	@accepted="doMuteUser"
	@cancelled="hideConfirmMute"
	>
	<i18n-t
	keypath="user_card.mute_confirm"
	- tag="span"
	+ tag="div"
	>
	<template #user>
	<span
	v-text="user.screen_name_ui"
	/>
	</template>
	</i18n-t>
	+ <div
	+ class="mute-expiry"
	+ >
	+ <label>
	+ {{ $t('user_card.mute_duration_prompt') }}
	+ </label>
	+ <input
	+ v-model="muteExpiryAmount"
	+ type="number"
	+ class="expiry-amount hide-number-spinner"
	+ :min="0"
	+ >
	+ <Select
	+ v-model="muteExpiryUnit"
	+ unstyled="true"
	+ class="expiry-unit"
	+ >
	+ <option
	+ v-for="unit in muteExpiryUnits"
	+ :key="unit"
	+ :value="unit"
	+ >
	+ {{ $t(`time.${unit}_short`, ['']) }}
	+ </option>
	+ </Select>
	+ </div>
	</confirm-modal>
	</teleport>
	</div>
	</template>

	<script src="./user_card.js"></script>

	<style lang="scss" src="./user_card.scss" />
	diff --git a/src/modules/users.js b/src/modules/users.js
	index 053e44b690..a1316ba259 100644
	--- a/src/modules/users.js
	+++ b/src/modules/users.js
	@@ -1,643 +1,646 @@
	import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
	import { windowWidth, windowHeight } from '../services/window_utils/window_utils'
	import oauthApi from '../services/new_api/oauth.js'
	import { compact, map, each, mergeWith, last, concat, uniq, isArray } from 'lodash'
	import { registerPushNotifications, unregisterPushNotifications } from '../services/push/push.js'

	// TODO: Unify with mergeOrAdd in statuses.js
	export const mergeOrAdd = (arr, obj, item) => {
	if (!item) { return false }
	const oldItem = obj[item.id]
	if (oldItem) {
	// We already have this, so only merge the new info.
	mergeWith(oldItem, item, mergeArrayLength)
	return { item: oldItem, new: false }
	} else {
	// This is a new item, prepare it
	arr.push(item)
	obj[item.id] = item
	return { item, new: true }
	}
	}

	const mergeArrayLength = (oldValue, newValue) => {
	if (isArray(oldValue) && isArray(newValue)) {
	oldValue.length = newValue.length
	return mergeWith(oldValue, newValue, mergeArrayLength)
	}
	}

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

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

	const blockUser = (store, id) => {
	return store.rootState.api.backendInteractor.blockUser({ id })
	.then((relationship) => {
	store.commit('updateUserRelationship', [relationship])
	store.commit('addBlockId', id)
	store.commit('removeStatus', { timeline: 'friends', userId: id })
	store.commit('removeStatus', { timeline: 'public', userId: id })
	store.commit('removeStatus', { timeline: 'publicAndExternal', userId: id })
	})
	}

	const unblockUser = (store, id) => {
	return store.rootState.api.backendInteractor.unblockUser({ id })
	.then((relationship) => store.commit('updateUserRelationship', [relationship]))
	}

	const removeUserFromFollowers = (store, id) => {
	return store.rootState.api.backendInteractor.removeUserFromFollowers({ id })
	.then((relationship) => store.commit('updateUserRelationship', [relationship]))
	}

	const editUserNote = (store, { id, comment }) => {
	return store.rootState.api.backendInteractor.editUserNote({ id, comment })
	.then((relationship) => store.commit('updateUserRelationship', [relationship]))
	}

	-const muteUser = (store, id) => {
	+const muteUser = (store, args) => {
	+ const id = typeof args === 'object' ? args.id : args
	+ const expiresIn = typeof args === 'object' ? args.expiresIn : 0
	+
	const predictedRelationship = store.state.relationships[id] \|\| { id }
	predictedRelationship.muting = true
	store.commit('updateUserRelationship', [predictedRelationship])
	store.commit('addMuteId', id)

	- return store.rootState.api.backendInteractor.muteUser({ id })
	+ return store.rootState.api.backendInteractor.muteUser({ id, expiresIn })
	.then((relationship) => {
	store.commit('updateUserRelationship', [relationship])
	store.commit('addMuteId', id)
	})
	}

	const unmuteUser = (store, id) => {
	const predictedRelationship = store.state.relationships[id] \|\| { id }
	predictedRelationship.muting = false
	store.commit('updateUserRelationship', [predictedRelationship])

	return store.rootState.api.backendInteractor.unmuteUser({ id })
	.then((relationship) => store.commit('updateUserRelationship', [relationship]))
	}

	const hideReblogs = (store, userId) => {
	return store.rootState.api.backendInteractor.followUser({ id: userId, reblogs: false })
	.then((relationship) => {
	store.commit('updateUserRelationship', [relationship])
	})
	}

	const showReblogs = (store, userId) => {
	return store.rootState.api.backendInteractor.followUser({ id: userId, reblogs: true })
	.then((relationship) => store.commit('updateUserRelationship', [relationship]))
	}

	const muteDomain = (store, domain) => {
	return store.rootState.api.backendInteractor.muteDomain({ domain })
	.then(() => store.commit('addDomainMute', domain))
	}

	const unmuteDomain = (store, domain) => {
	return store.rootState.api.backendInteractor.unmuteDomain({ domain })
	.then(() => store.commit('removeDomainMute', domain))
	}

	export const mutations = {
	tagUser (state, { user: { id }, tag }) {
	const user = state.usersObject[id]
	const tags = user.tags \|\| []
	const newTags = tags.concat([tag])
	user.tags = newTags
	},
	untagUser (state, { user: { id }, tag }) {
	const user = state.usersObject[id]
	const tags = user.tags \|\| []
	const newTags = tags.filter(t => t !== tag)
	user.tags = newTags
	},
	updateRight (state, { user: { id }, right, value }) {
	const user = state.usersObject[id]
	const newRights = user.rights
	newRights[right] = value
	user.rights = newRights
	},
	updateActivationStatus (state, { user: { id }, deactivated }) {
	const user = state.usersObject[id]
	user.deactivated = deactivated
	},
	setCurrentUser (state, user) {
	state.lastLoginName = user.screen_name
	state.currentUser = mergeWith(state.currentUser \|\| {}, user, mergeArrayLength)
	},
	clearCurrentUser (state) {
	state.currentUser = false
	state.lastLoginName = false
	},
	beginLogin (state) {
	state.loggingIn = true
	},
	endLogin (state) {
	state.loggingIn = false
	},
	saveFriendIds (state, { id, friendIds }) {
	const user = state.usersObject[id]
	user.friendIds = uniq(concat(user.friendIds \|\| [], friendIds))
	},
	saveFollowerIds (state, { id, followerIds }) {
	const user = state.usersObject[id]
	user.followerIds = uniq(concat(user.followerIds \|\| [], followerIds))
	},
	// Because frontend doesn't have a reason to keep these stuff in memory
	// outside of viewing someones user profile.
	clearFriends (state, userId) {
	const user = state.usersObject[userId]
	if (user) {
	user.friendIds = []
	}
	},
	clearFollowers (state, userId) {
	const user = state.usersObject[userId]
	if (user) {
	user.followerIds = []
	}
	},
	addNewUsers (state, users) {
	each(users, (user) => {
	if (user.relationship) {
	state.relationships[user.relationship.id] = user.relationship
	}
	const res = mergeOrAdd(state.users, state.usersObject, user)
	const item = res.item
	if (res.new && item.screen_name && !item.screen_name.includes('@')) {
	state.usersByNameObject[item.screen_name.toLowerCase()] = item
	}
	})
	},
	updateUserRelationship (state, relationships) {
	relationships.forEach((relationship) => {
	state.relationships[relationship.id] = relationship
	})
	},
	updateUserInLists (state, { id, inLists }) {
	state.usersObject[id].inLists = inLists
	},
	saveBlockIds (state, blockIds) {
	state.currentUser.blockIds = blockIds
	},
	addBlockId (state, blockId) {
	if (state.currentUser.blockIds.indexOf(blockId) === -1) {
	state.currentUser.blockIds.push(blockId)
	}
	},
	saveMuteIds (state, muteIds) {
	state.currentUser.muteIds = muteIds
	},
	addMuteId (state, muteId) {
	if (state.currentUser.muteIds.indexOf(muteId) === -1) {
	state.currentUser.muteIds.push(muteId)
	}
	},
	saveDomainMutes (state, domainMutes) {
	state.currentUser.domainMutes = domainMutes
	},
	addDomainMute (state, domain) {
	if (state.currentUser.domainMutes.indexOf(domain) === -1) {
	state.currentUser.domainMutes.push(domain)
	}
	},
	removeDomainMute (state, domain) {
	const index = state.currentUser.domainMutes.indexOf(domain)
	if (index !== -1) {
	state.currentUser.domainMutes.splice(index, 1)
	}
	},
	setPinnedToUser (state, status) {
	const user = state.usersObject[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 (state, status) {
	status.user = state.usersObject[status.user.id]
	},
	setUserForNotification (state, notification) {
	if (notification.type !== 'follow') {
	notification.action.user = state.usersObject[notification.action.user.id]
	}
	notification.from_profile = state.usersObject[notification.from_profile.id]
	},
	setColor (state, { user: { id }, highlighted }) {
	const user = state.usersObject[id]
	user.highlight = highlighted
	},
	signUpPending (state) {
	state.signUpPending = true
	state.signUpErrors = []
	},
	signUpSuccess (state) {
	state.signUpPending = false
	},
	signUpFailure (state, errors) {
	state.signUpPending = false
	state.signUpErrors = errors
	}
	}

	export const getters = {
	findUser: state => query => {
	return state.usersObject[query]
	},
	findUserByName: state => query => {
	return state.usersByNameObject[query.toLowerCase()]
	},
	findUserByUrl: state => query => {
	return state.users
	.find(u => u.statusnet_profile_url &&
	u.statusnet_profile_url.toLowerCase() === query.toLowerCase())
	},
	relationship: state => id => {
	const rel = id && state.relationships[id]
	return rel \|\| { id, loading: true }
	}
	}

	export const defaultState = {
	loggingIn: false,
	lastLoginName: false,
	currentUser: false,
	users: [],
	usersObject: {},
	usersByNameObject: {},
	signUpPending: false,
	signUpErrors: [],
	relationships: {}
	}

	const users = {
	state: defaultState,
	mutations,
	getters,
	actions: {
	fetchUserIfMissing (store, id) {
	if (!store.getters.findUser(id)) {
	store.dispatch('fetchUser', id)
	}
	},
	fetchUser (store, id) {
	return store.rootState.api.backendInteractor.fetchUser({ id })
	.then((user) => {
	store.commit('addNewUsers', [user])
	return user
	})
	},
	fetchUserByName (store, name) {
	return store.rootState.api.backendInteractor.fetchUserByName({ name })
	.then((user) => {
	store.commit('addNewUsers', [user])
	return user
	})
	},
	fetchUserRelationship (store, id) {
	if (store.state.currentUser) {
	store.rootState.api.backendInteractor.fetchUserRelationship({ id })
	.then((relationships) => store.commit('updateUserRelationship', relationships))
	}
	},
	fetchUserInLists (store, id) {
	if (store.state.currentUser) {
	store.rootState.api.backendInteractor.fetchUserInLists({ id })
	.then((inLists) => store.commit('updateUserInLists', { id, inLists }))
	}
	},
	fetchBlocks (store) {
	return store.rootState.api.backendInteractor.fetchBlocks()
	.then((blocks) => {
	store.commit('saveBlockIds', map(blocks, 'id'))
	store.commit('addNewUsers', blocks)
	return blocks
	})
	},
	blockUser (store, id) {
	return blockUser(store, id)
	},
	unblockUser (store, id) {
	return unblockUser(store, id)
	},
	removeUserFromFollowers (store, id) {
	return removeUserFromFollowers(store, id)
	},
	blockUsers (store, ids = []) {
	return Promise.all(ids.map(id => blockUser(store, id)))
	},
	unblockUsers (store, ids = []) {
	return Promise.all(ids.map(id => unblockUser(store, id)))
	},
	editUserNote (store, args) {
	return editUserNote(store, args)
	},
	fetchMutes (store) {
	return store.rootState.api.backendInteractor.fetchMutes()
	.then((mutes) => {
	store.commit('saveMuteIds', map(mutes, 'id'))
	store.commit('addNewUsers', mutes)
	return mutes
	})
	},
	muteUser (store, id) {
	return muteUser(store, id)
	},
	unmuteUser (store, id) {
	return unmuteUser(store, id)
	},
	hideReblogs (store, id) {
	return hideReblogs(store, id)
	},
	showReblogs (store, id) {
	return showReblogs(store, id)
	},
	muteUsers (store, ids = []) {
	return Promise.all(ids.map(id => muteUser(store, id)))
	},
	unmuteUsers (store, ids = []) {
	return Promise.all(ids.map(id => unmuteUser(store, id)))
	},
	fetchDomainMutes (store) {
	return store.rootState.api.backendInteractor.fetchDomainMutes()
	.then((domainMutes) => {
	store.commit('saveDomainMutes', domainMutes)
	return domainMutes
	})
	},
	muteDomain (store, domain) {
	return muteDomain(store, domain)
	},
	unmuteDomain (store, domain) {
	return unmuteDomain(store, domain)
	},
	muteDomains (store, domains = []) {
	return Promise.all(domains.map(domain => muteDomain(store, domain)))
	},
	unmuteDomains (store, domain = []) {
	return Promise.all(domain.map(domain => unmuteDomain(store, domain)))
	},
	fetchFriends ({ rootState, commit }, id) {
	const user = rootState.users.usersObject[id]
	const maxId = last(user.friendIds)
	return rootState.api.backendInteractor.fetchFriends({ id, maxId })
	.then((friends) => {
	commit('addNewUsers', friends)
	commit('saveFriendIds', { id, friendIds: map(friends, 'id') })
	return friends
	})
	},
	fetchFollowers ({ rootState, commit }, id) {
	const user = rootState.users.usersObject[id]
	const maxId = last(user.followerIds)
	return rootState.api.backendInteractor.fetchFollowers({ id, maxId })
	.then((followers) => {
	commit('addNewUsers', followers)
	commit('saveFollowerIds', { id, followerIds: map(followers, 'id') })
	return followers
	})
	},
	clearFriends ({ commit }, userId) {
	commit('clearFriends', userId)
	},
	clearFollowers ({ commit }, userId) {
	commit('clearFollowers', userId)
	},
	subscribeUser ({ rootState, commit }, id) {
	return rootState.api.backendInteractor.subscribeUser({ id })
	.then((relationship) => commit('updateUserRelationship', [relationship]))
	},
	unsubscribeUser ({ rootState, commit }, id) {
	return rootState.api.backendInteractor.unsubscribeUser({ id })
	.then((relationship) => commit('updateUserRelationship', [relationship]))
	},
	toggleActivationStatus ({ rootState, commit }, { user }) {
	const api = user.deactivated ? rootState.api.backendInteractor.activateUser : rootState.api.backendInteractor.deactivateUser
	api({ user })
	.then((user) => { const deactivated = !user.is_active; commit('updateActivationStatus', { user, deactivated }) })
	},
	registerPushNotifications (store) {
	const token = store.state.currentUser.credentials
	const vapidPublicKey = store.rootState.instance.vapidPublicKey
	const isEnabled = store.rootState.config.webPushNotifications
	const notificationVisibility = store.rootState.config.notificationVisibility

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

	unregisterPushNotifications(token)
	},
	addNewUsers ({ commit }, users) {
	commit('addNewUsers', users)
	},
	addNewStatuses (store, { statuses }) {
	const users = map(statuses, 'user')
	const retweetedUsers = compact(map(statuses, 'retweeted_status.user'))
	store.commit('addNewUsers', users)
	store.commit('addNewUsers', retweetedUsers)

	each(statuses, (status) => {
	// Reconnect users to statuses
	store.commit('setUserForStatus', status)
	// Set pinned statuses to user
	store.commit('setPinnedToUser', status)
	})
	each(compact(map(statuses, 'retweeted_status')), (status) => {
	// Reconnect users to retweets
	store.commit('setUserForStatus', status)
	// Set pinned retweets to user
	store.commit('setPinnedToUser', status)
	})
	},
	addNewNotifications (store, { notifications }) {
	const users = map(notifications, 'from_profile')
	const targetUsers = map(notifications, 'target').filter(_ => _)
	const notificationIds = notifications.map(_ => _.id)
	store.commit('addNewUsers', users)
	store.commit('addNewUsers', targetUsers)

	const notificationsObject = store.rootState.statuses.notifications.idStore
	const relevantNotifications = Object.entries(notificationsObject)
	.filter(([k, val]) => notificationIds.includes(k))
	.map(([k, val]) => val)

	// Reconnect users to notifications
	each(relevantNotifications, (notification) => {
	store.commit('setUserForNotification', notification)
	})
	},
	searchUsers ({ rootState, commit }, { query }) {
	return rootState.api.backendInteractor.searchUsers({ query })
	.then((users) => {
	commit('addNewUsers', users)
	return users
	})
	},
	async signUp (store, userInfo) {
	store.commit('signUpPending')

	const rootState = store.rootState

	try {
	const data = await rootState.api.backendInteractor.register(
	{ params: { ...userInfo } }
	)
	store.commit('signUpSuccess')
	store.commit('setToken', data.access_token)
	store.dispatch('loginUser', data.access_token)
	} catch (e) {
	const errors = e.message
	store.commit('signUpFailure', errors)
	throw e
	}
	},
	async getCaptcha (store) {
	return store.rootState.api.backendInteractor.getCaptcha()
	},

	logout (store) {
	const { oauth, instance } = store.rootState

	const data = {
	...oauth,
	commit: store.commit,
	instance: instance.server
	}

	return oauthApi.getOrCreateApp(data)
	.then((app) => {
	const params = {
	app,
	instance: data.instance,
	token: oauth.userToken
	}

	return oauthApi.revokeToken(params)
	})
	.then(() => {
	store.commit('clearCurrentUser')
	store.dispatch('disconnectFromSocket')
	store.commit('clearToken')
	store.dispatch('stopFetchingTimeline', 'friends')
	store.commit('setBackendInteractor', backendInteractorService(store.getters.getToken()))
	store.dispatch('stopFetchingNotifications')
	store.dispatch('stopFetchingLists')
	store.dispatch('stopFetchingFollowRequests')
	store.commit('clearNotifications')
	store.commit('resetStatuses')
	store.dispatch('resetChats')
	store.dispatch('setLastTimeline', 'public-timeline')
	store.dispatch('setLayoutWidth', windowWidth())
	store.dispatch('setLayoutHeight', windowHeight())
	store.commit('clearServerSideStorage')
	})
	},
	loginUser (store, accessToken) {
	return new Promise((resolve, reject) => {
	const commit = store.commit
	commit('beginLogin')
	store.rootState.api.backendInteractor.verifyCredentials(accessToken)
	.then((data) => {
	if (!data.error) {
	const user = data
	// user.credentials = userCredentials
	user.credentials = accessToken
	user.blockIds = []
	user.muteIds = []
	user.domainMutes = []
	commit('setCurrentUser', user)
	commit('setServerSideStorage', user)
	commit('addNewUsers', [user])

	store.dispatch('fetchEmoji')

	getNotificationPermission()
	.then(permission => commit('setNotificationPermission', permission))

	// Set our new backend interactor
	commit('setBackendInteractor', backendInteractorService(accessToken))
	store.dispatch('pushServerSideStorage')

	if (user.token) {
	store.dispatch('setWsToken', user.token)

	// Initialize the shout socket.
	store.dispatch('initializeSocket')
	}

	const startPolling = () => {
	// Start getting fresh posts.
	store.dispatch('startFetchingTimeline', { timeline: 'friends' })

	// Start fetching notifications
	store.dispatch('startFetchingNotifications')

	// Start fetching chats
	store.dispatch('startFetchingChats')
	}

	store.dispatch('startFetchingLists')

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

	if (store.getters.mergedConfig.useStreamingApi) {
	store.dispatch('fetchTimeline', { timeline: 'friends', since: null })
	store.dispatch('fetchNotifications', { since: null })
	store.dispatch('enableMastoSockets', true).catch((error) => {
	console.error('Failed initializing MastoAPI Streaming socket', error)
	}).then(() => {
	store.dispatch('fetchChats', { latest: true })
	setTimeout(() => store.dispatch('setNotificationsSilence', false), 10000)
	})
	} else {
	startPolling()
	}

	// Get user mutes
	store.dispatch('fetchMutes')

	store.dispatch('setLayoutWidth', windowWidth())
	store.dispatch('setLayoutHeight', windowHeight())

	// Fetch our friends
	store.rootState.api.backendInteractor.fetchFriends({ id: user.id })
	.then((friends) => commit('addNewUsers', friends))
	} else {
	const response = data.error
	// Authentication failed
	commit('endLogin')
	if (response.status === 401) {
	reject(new Error('Wrong username or password'))
	} else {
	reject(new Error('An error occurred, please try again'))
	}
	}
	commit('endLogin')
	resolve()
	})
	.catch((error) => {
	console.log(error)
	commit('endLogin')
	reject(new Error('Failed to connect to server, try again'))
	})
	})
	}
	}
	}

	export default users
	diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
	index af12265e89..c7a36af921 100644
	--- a/src/services/api/api.service.js
	+++ b/src/services/api/api.service.js
	@@ -1,1774 +1,1778 @@
	import { each, map, concat, last, get } from 'lodash'
	import { parseStatus, parseSource, parseUser, parseNotification, parseAttachment, parseChat, parseLinkHeaderPagination } from '../entity_normalizer/entity_normalizer.service.js'
	import { RegistrationError, StatusCodeError } from '../errors/errors'

	/* eslint-env browser */
	const MUTES_IMPORT_URL = '/api/pleroma/mutes_import'
	const BLOCKS_IMPORT_URL = '/api/pleroma/blocks_import'
	const FOLLOW_IMPORT_URL = '/api/pleroma/follow_import'
	const DELETE_ACCOUNT_URL = '/api/pleroma/delete_account'
	const CHANGE_EMAIL_URL = '/api/pleroma/change_email'
	const CHANGE_PASSWORD_URL = '/api/pleroma/change_password'
	const MOVE_ACCOUNT_URL = '/api/pleroma/move_account'
	const ALIASES_URL = '/api/pleroma/aliases'
	const TAG_USER_URL = '/api/pleroma/admin/users/tag'
	const PERMISSION_GROUP_URL = (screenName, right) => `/api/pleroma/admin/users/${screenName}/permission_group/${right}`
	const ACTIVATE_USER_URL = '/api/pleroma/admin/users/activate'
	const DEACTIVATE_USER_URL = '/api/pleroma/admin/users/deactivate'
	const ADMIN_USERS_URL = '/api/pleroma/admin/users'
	const SUGGESTIONS_URL = '/api/v1/suggestions'
	const NOTIFICATION_SETTINGS_URL = '/api/pleroma/notification_settings'
	const NOTIFICATION_READ_URL = '/api/v1/pleroma/notifications/read'

	const MFA_SETTINGS_URL = '/api/pleroma/accounts/mfa'
	const MFA_BACKUP_CODES_URL = '/api/pleroma/accounts/mfa/backup_codes'

	const MFA_SETUP_OTP_URL = '/api/pleroma/accounts/mfa/setup/totp'
	const MFA_CONFIRM_OTP_URL = '/api/pleroma/accounts/mfa/confirm/totp'
	const MFA_DISABLE_OTP_URL = '/api/pleroma/accounts/mfa/totp'

	const MASTODON_LOGIN_URL = '/api/v1/accounts/verify_credentials'
	const MASTODON_REGISTRATION_URL = '/api/v1/accounts'
	const MASTODON_USER_FAVORITES_TIMELINE_URL = '/api/v1/favourites'
	const MASTODON_USER_NOTIFICATIONS_URL = '/api/v1/notifications'
	const MASTODON_DISMISS_NOTIFICATION_URL = id => `/api/v1/notifications/${id}/dismiss`
	const MASTODON_FAVORITE_URL = id => `/api/v1/statuses/${id}/favourite`
	const MASTODON_UNFAVORITE_URL = id => `/api/v1/statuses/${id}/unfavourite`
	const MASTODON_RETWEET_URL = id => `/api/v1/statuses/${id}/reblog`
	const MASTODON_UNRETWEET_URL = id => `/api/v1/statuses/${id}/unreblog`
	const MASTODON_DELETE_URL = id => `/api/v1/statuses/${id}`
	const MASTODON_FOLLOW_URL = id => `/api/v1/accounts/${id}/follow`
	const MASTODON_UNFOLLOW_URL = id => `/api/v1/accounts/${id}/unfollow`
	const MASTODON_FOLLOWING_URL = id => `/api/v1/accounts/${id}/following`
	const MASTODON_FOLLOWERS_URL = id => `/api/v1/accounts/${id}/followers`
	const MASTODON_FOLLOW_REQUESTS_URL = '/api/v1/follow_requests'
	const MASTODON_APPROVE_USER_URL = id => `/api/v1/follow_requests/${id}/authorize`
	const MASTODON_DENY_USER_URL = id => `/api/v1/follow_requests/${id}/reject`
	const MASTODON_DIRECT_MESSAGES_TIMELINE_URL = '/api/v1/timelines/direct'
	const MASTODON_PUBLIC_TIMELINE = '/api/v1/timelines/public'
	const MASTODON_USER_HOME_TIMELINE_URL = '/api/v1/timelines/home'
	const MASTODON_STATUS_URL = id => `/api/v1/statuses/${id}`
	const MASTODON_STATUS_CONTEXT_URL = id => `/api/v1/statuses/${id}/context`
	const MASTODON_STATUS_SOURCE_URL = id => `/api/v1/statuses/${id}/source`
	const MASTODON_STATUS_HISTORY_URL = id => `/api/v1/statuses/${id}/history`
	const MASTODON_USER_URL = '/api/v1/accounts'
	const MASTODON_USER_LOOKUP_URL = '/api/v1/accounts/lookup'
	const MASTODON_USER_RELATIONSHIPS_URL = '/api/v1/accounts/relationships'
	const MASTODON_USER_TIMELINE_URL = id => `/api/v1/accounts/${id}/statuses`
	const MASTODON_USER_IN_LISTS = id => `/api/v1/accounts/${id}/lists`
	const MASTODON_LIST_URL = id => `/api/v1/lists/${id}`
	const MASTODON_LIST_TIMELINE_URL = id => `/api/v1/timelines/list/${id}`
	const MASTODON_LIST_ACCOUNTS_URL = id => `/api/v1/lists/${id}/accounts`
	const MASTODON_TAG_TIMELINE_URL = tag => `/api/v1/timelines/tag/${tag}`
	const MASTODON_BOOKMARK_TIMELINE_URL = '/api/v1/bookmarks'
	const MASTODON_USER_BLOCKS_URL = '/api/v1/blocks/'
	const MASTODON_USER_MUTES_URL = '/api/v1/mutes/'
	const MASTODON_BLOCK_USER_URL = id => `/api/v1/accounts/${id}/block`
	const MASTODON_UNBLOCK_USER_URL = id => `/api/v1/accounts/${id}/unblock`
	const MASTODON_MUTE_USER_URL = id => `/api/v1/accounts/${id}/mute`
	const MASTODON_UNMUTE_USER_URL = id => `/api/v1/accounts/${id}/unmute`
	const MASTODON_REMOVE_USER_FROM_FOLLOWERS = id => `/api/v1/accounts/${id}/remove_from_followers`
	const MASTODON_SUBSCRIBE_USER = id => `/api/v1/pleroma/accounts/${id}/subscribe`
	const MASTODON_UNSUBSCRIBE_USER = id => `/api/v1/pleroma/accounts/${id}/unsubscribe`
	const MASTODON_USER_NOTE_URL = id => `/api/v1/accounts/${id}/note`
	const MASTODON_BOOKMARK_STATUS_URL = id => `/api/v1/statuses/${id}/bookmark`
	const MASTODON_UNBOOKMARK_STATUS_URL = id => `/api/v1/statuses/${id}/unbookmark`
	const MASTODON_POST_STATUS_URL = '/api/v1/statuses'
	const MASTODON_MEDIA_UPLOAD_URL = '/api/v1/media'
	const MASTODON_VOTE_URL = id => `/api/v1/polls/${id}/votes`
	const MASTODON_POLL_URL = id => `/api/v1/polls/${id}`
	const MASTODON_STATUS_FAVORITEDBY_URL = id => `/api/v1/statuses/${id}/favourited_by`
	const MASTODON_STATUS_REBLOGGEDBY_URL = id => `/api/v1/statuses/${id}/reblogged_by`
	const MASTODON_PROFILE_UPDATE_URL = '/api/v1/accounts/update_credentials'
	const MASTODON_REPORT_USER_URL = '/api/v1/reports'
	const MASTODON_PIN_OWN_STATUS = id => `/api/v1/statuses/${id}/pin`
	const MASTODON_UNPIN_OWN_STATUS = id => `/api/v1/statuses/${id}/unpin`
	const MASTODON_MUTE_CONVERSATION = id => `/api/v1/statuses/${id}/mute`
	const MASTODON_UNMUTE_CONVERSATION = id => `/api/v1/statuses/${id}/unmute`
	const MASTODON_SEARCH_2 = '/api/v2/search'
	const MASTODON_USER_SEARCH_URL = '/api/v1/accounts/search'
	const MASTODON_DOMAIN_BLOCKS_URL = '/api/v1/domain_blocks'
	const MASTODON_LISTS_URL = '/api/v1/lists'
	const MASTODON_STREAMING = '/api/v1/streaming'
	const MASTODON_KNOWN_DOMAIN_LIST_URL = '/api/v1/instance/peers'
	const MASTODON_ANNOUNCEMENTS_URL = '/api/v1/announcements'
	const MASTODON_ANNOUNCEMENTS_DISMISS_URL = id => `/api/v1/announcements/${id}/dismiss`
	const PLEROMA_EMOJI_REACTIONS_URL = id => `/api/v1/pleroma/statuses/${id}/reactions`
	const PLEROMA_EMOJI_REACT_URL = (id, emoji) => `/api/v1/pleroma/statuses/${id}/reactions/${emoji}`
	const PLEROMA_EMOJI_UNREACT_URL = (id, emoji) => `/api/v1/pleroma/statuses/${id}/reactions/${emoji}`
	const PLEROMA_CHATS_URL = '/api/v1/pleroma/chats'
	const PLEROMA_CHAT_URL = id => `/api/v1/pleroma/chats/by-account-id/${id}`
	const PLEROMA_CHAT_MESSAGES_URL = id => `/api/v1/pleroma/chats/${id}/messages`
	const PLEROMA_CHAT_READ_URL = id => `/api/v1/pleroma/chats/${id}/read`
	const PLEROMA_DELETE_CHAT_MESSAGE_URL = (chatId, messageId) => `/api/v1/pleroma/chats/${chatId}/messages/${messageId}`
	const PLEROMA_ADMIN_REPORTS = '/api/pleroma/admin/reports'
	const PLEROMA_BACKUP_URL = '/api/v1/pleroma/backups'
	const PLEROMA_ANNOUNCEMENTS_URL = '/api/v1/pleroma/admin/announcements'
	const PLEROMA_POST_ANNOUNCEMENT_URL = '/api/v1/pleroma/admin/announcements'
	const PLEROMA_EDIT_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}`
	const PLEROMA_DELETE_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}`

	const oldfetch = window.fetch

	const fetch = (url, options) => {
	options = options \|\| {}
	const baseUrl = ''
	const fullUrl = baseUrl + url
	options.credentials = 'same-origin'
	return oldfetch(fullUrl, options)
	}

	const promisedRequest = ({ method, url, params, payload, credentials, headers = {} }) => {
	const options = {
	method,
	headers: {
	Accept: 'application/json',
	'Content-Type': 'application/json',
	...headers
	}
	}
	if (params) {
	url += '?' + Object.entries(params)
	.map(([key, value]) => encodeURIComponent(key) + '=' + encodeURIComponent(value))
	.join('&')
	}
	if (payload) {
	options.body = JSON.stringify(payload)
	}
	if (credentials) {
	options.headers = {
	...options.headers,
	...authHeaders(credentials)
	}
	}
	return fetch(url, options)
	.then((response) => {
	return new Promise((resolve, reject) => response.json()
	.then((json) => {
	if (!response.ok) {
	return reject(new StatusCodeError(response.status, json, { url, options }, response))
	}
	return resolve(json)
	})
	.catch((error) => {
	return reject(new StatusCodeError(response.status, error, { url, options }, response))
	})
	)
	})
	}

	const updateNotificationSettings = ({ credentials, settings }) => {
	const form = new FormData()

	each(settings, (value, key) => {
	form.append(key, value)
	})

	return fetch(`${NOTIFICATION_SETTINGS_URL}?${new URLSearchParams(settings)}`, {
	headers: authHeaders(credentials),
	method: 'PUT',
	body: form
	}).then((data) => data.json())
	}

	const updateProfileImages = ({ credentials, avatar = null, avatarName = null, banner = null, background = null }) => {
	const form = new FormData()
	if (avatar !== null) {
	if (avatarName !== null) {
	form.append('avatar', avatar, avatarName)
	} else {
	form.append('avatar', avatar)
	}
	}
	if (banner !== null) form.append('header', banner)
	if (background !== null) form.append('pleroma_background_image', background)
	return fetch(MASTODON_PROFILE_UPDATE_URL, {
	headers: authHeaders(credentials),
	method: 'PATCH',
	body: form
	})
	.then((data) => data.json())
	.then((data) => {
	if (data.error) {
	throw new Error(data.error)
	}
	return parseUser(data)
	})
	}

	const updateProfile = ({ credentials, params }) => {
	return promisedRequest({
	url: MASTODON_PROFILE_UPDATE_URL,
	method: 'PATCH',
	payload: params,
	credentials
	}).then((data) => parseUser(data))
	}

	// Params needed:
	// nickname
	// email
	// fullname
	// password
	// password_confirm
	//
	// Optional
	// bio
	// homepage
	// location
	// token
	// language
	const register = ({ params, credentials }) => {
	const { nickname, ...rest } = params
	return fetch(MASTODON_REGISTRATION_URL, {
	method: 'POST',
	headers: {
	...authHeaders(credentials),
	'Content-Type': 'application/json'
	},
	body: JSON.stringify({
	nickname,
	locale: 'en_US',
	agreement: true,
	...rest
	})
	})
	.then((response) => {
	if (response.ok) {
	return response.json()
	} else {
	return response.json().then((error) => { throw new RegistrationError(error) })
	}
	})
	}

	const getCaptcha = () => fetch('/api/pleroma/captcha').then(resp => resp.json())

	const authHeaders = (accessToken) => {
	if (accessToken) {
	return { Authorization: `Bearer ${accessToken}` }
	} else {
	return { }
	}
	}

	const followUser = ({ id, credentials, ...options }) => {
	const url = MASTODON_FOLLOW_URL(id)
	const form = {}
	if (options.reblogs !== undefined) { form.reblogs = options.reblogs }
	return fetch(url, {
	body: JSON.stringify(form),
	headers: {
	...authHeaders(credentials),
	'Content-Type': 'application/json'
	},
	method: 'POST'
	}).then((data) => data.json())
	}

	const unfollowUser = ({ id, credentials }) => {
	const url = MASTODON_UNFOLLOW_URL(id)
	return fetch(url, {
	headers: authHeaders(credentials),
	method: 'POST'
	}).then((data) => data.json())
	}

	const fetchUserInLists = ({ id, credentials }) => {
	const url = MASTODON_USER_IN_LISTS(id)
	return fetch(url, {
	headers: authHeaders(credentials)
	}).then((data) => data.json())
	}

	const pinOwnStatus = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_PIN_OWN_STATUS(id), credentials, method: 'POST' })
	.then((data) => parseStatus(data))
	}

	const unpinOwnStatus = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_UNPIN_OWN_STATUS(id), credentials, method: 'POST' })
	.then((data) => parseStatus(data))
	}

	const muteConversation = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_MUTE_CONVERSATION(id), credentials, method: 'POST' })
	.then((data) => parseStatus(data))
	}

	const unmuteConversation = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_UNMUTE_CONVERSATION(id), credentials, method: 'POST' })
	.then((data) => parseStatus(data))
	}

	const blockUser = ({ id, credentials }) => {
	return fetch(MASTODON_BLOCK_USER_URL(id), {
	headers: authHeaders(credentials),
	method: 'POST'
	}).then((data) => data.json())
	}

	const unblockUser = ({ id, credentials }) => {
	return fetch(MASTODON_UNBLOCK_USER_URL(id), {
	headers: authHeaders(credentials),
	method: 'POST'
	}).then((data) => data.json())
	}

	const removeUserFromFollowers = ({ id, credentials }) => {
	return fetch(MASTODON_REMOVE_USER_FROM_FOLLOWERS(id), {
	headers: authHeaders(credentials),
	method: 'POST'
	}).then((data) => data.json())
	}

	const editUserNote = ({ id, credentials, comment }) => {
	return promisedRequest({
	url: MASTODON_USER_NOTE_URL(id),
	credentials,
	payload: {
	comment
	},
	method: 'POST'
	})
	}

	const approveUser = ({ id, credentials }) => {
	const url = MASTODON_APPROVE_USER_URL(id)
	return fetch(url, {
	headers: authHeaders(credentials),
	method: 'POST'
	}).then((data) => data.json())
	}

	const denyUser = ({ id, credentials }) => {
	const url = MASTODON_DENY_USER_URL(id)
	return fetch(url, {
	headers: authHeaders(credentials),
	method: 'POST'
	}).then((data) => data.json())
	}

	const fetchUser = ({ id, credentials }) => {
	const url = `${MASTODON_USER_URL}/${id}`
	return promisedRequest({ url, credentials })
	.then((data) => parseUser(data))
	}

	const fetchUserByName = ({ name, credentials }) => {
	return promisedRequest({
	url: MASTODON_USER_LOOKUP_URL,
	credentials,
	params: { acct: name }
	})
	.then(data => data.id)
	.catch(error => {
	if (error && error.statusCode === 404) {
	// Either the backend does not support lookup endpoint,
	// or there is no user with such name. Fallback and treat name as id.
	return name
	} else {
	throw error
	}
	})
	.then(id => fetchUser({ id, credentials }))
	}

	const fetchUserRelationship = ({ id, credentials }) => {
	const url = `${MASTODON_USER_RELATIONSHIPS_URL}/?id=${id}`
	return fetch(url, { headers: authHeaders(credentials) })
	.then((response) => {
	return new Promise((resolve, reject) => response.json()
	.then((json) => {
	if (!response.ok) {
	return reject(new StatusCodeError(response.status, json, { url }, response))
	}
	return resolve(json)
	}))
	})
	}

	const fetchFriends = ({ id, maxId, sinceId, limit = 20, credentials }) => {
	let url = MASTODON_FOLLOWING_URL(id)
	const args = [
	maxId && `max_id=${maxId}`,
	sinceId && `since_id=${sinceId}`,
	limit && `limit=${limit}`,
	'with_relationships=true'
	].filter(_ => _).join('&')

	url = url + (args ? '?' + args : '')
	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => data.json())
	.then((data) => data.map(parseUser))
	}

	const exportFriends = ({ id, credentials }) => {
	// eslint-disable-next-line no-async-promise-executor
	return new Promise(async (resolve, reject) => {
	try {
	let friends = []
	let more = true
	while (more) {
	const maxId = friends.length > 0 ? last(friends).id : undefined
	const users = await fetchFriends({ id, maxId, credentials })
	friends = concat(friends, users)
	if (users.length === 0) {
	more = false
	}
	}
	resolve(friends)
	} catch (err) {
	reject(err)
	}
	})
	}

	const fetchFollowers = ({ id, maxId, sinceId, limit = 20, credentials }) => {
	let url = MASTODON_FOLLOWERS_URL(id)
	const args = [
	maxId && `max_id=${maxId}`,
	sinceId && `since_id=${sinceId}`,
	limit && `limit=${limit}`,
	'with_relationships=true'
	].filter(_ => _).join('&')

	url += args ? '?' + args : ''
	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => data.json())
	.then((data) => data.map(parseUser))
	}

	const fetchFollowRequests = ({ credentials }) => {
	const url = MASTODON_FOLLOW_REQUESTS_URL
	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => data.json())
	.then((data) => data.map(parseUser))
	}

	const fetchLists = ({ credentials }) => {
	const url = MASTODON_LISTS_URL
	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => data.json())
	}

	const createList = ({ title, credentials }) => {
	const url = MASTODON_LISTS_URL
	const headers = authHeaders(credentials)
	headers['Content-Type'] = 'application/json'

	return fetch(url, {
	headers,
	method: 'POST',
	body: JSON.stringify({ title })
	}).then((data) => data.json())
	}

	const getList = ({ listId, credentials }) => {
	const url = MASTODON_LIST_URL(listId)
	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => data.json())
	}

	const updateList = ({ listId, title, credentials }) => {
	const url = MASTODON_LIST_URL(listId)
	const headers = authHeaders(credentials)
	headers['Content-Type'] = 'application/json'

	return fetch(url, {
	headers,
	method: 'PUT',
	body: JSON.stringify({ title })
	})
	}

	const getListAccounts = ({ listId, credentials }) => {
	const url = MASTODON_LIST_ACCOUNTS_URL(listId)
	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => data.json())
	.then((data) => data.map(({ id }) => id))
	}

	const addAccountsToList = ({ listId, accountIds, credentials }) => {
	const url = MASTODON_LIST_ACCOUNTS_URL(listId)
	const headers = authHeaders(credentials)
	headers['Content-Type'] = 'application/json'

	return fetch(url, {
	headers,
	method: 'POST',
	body: JSON.stringify({ account_ids: accountIds })
	})
	}

	const removeAccountsFromList = ({ listId, accountIds, credentials }) => {
	const url = MASTODON_LIST_ACCOUNTS_URL(listId)
	const headers = authHeaders(credentials)
	headers['Content-Type'] = 'application/json'

	return fetch(url, {
	headers,
	method: 'DELETE',
	body: JSON.stringify({ account_ids: accountIds })
	})
	}

	const deleteList = ({ listId, credentials }) => {
	const url = MASTODON_LIST_URL(listId)
	return fetch(url, {
	method: 'DELETE',
	headers: authHeaders(credentials)
	})
	}

	const fetchConversation = ({ id, credentials }) => {
	const urlContext = MASTODON_STATUS_CONTEXT_URL(id)
	return fetch(urlContext, { headers: authHeaders(credentials) })
	.then((data) => {
	if (data.ok) {
	return data
	}
	throw new Error('Error fetching timeline', data)
	})
	.then((data) => data.json())
	.then(({ ancestors, descendants }) => ({
	ancestors: ancestors.map(parseStatus),
	descendants: descendants.map(parseStatus)
	}))
	}

	const fetchStatus = ({ id, credentials }) => {
	const url = MASTODON_STATUS_URL(id)
	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => {
	if (data.ok) {
	return data
	}
	throw new Error('Error fetching timeline', data)
	})
	.then((data) => data.json())
	.then((data) => parseStatus(data))
	}

	const fetchStatusSource = ({ id, credentials }) => {
	const url = MASTODON_STATUS_SOURCE_URL(id)
	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => {
	if (data.ok) {
	return data
	}
	throw new Error('Error fetching source', data)
	})
	.then((data) => data.json())
	.then((data) => parseSource(data))
	}

	const fetchStatusHistory = ({ status, credentials }) => {
	const url = MASTODON_STATUS_HISTORY_URL(status.id)
	return promisedRequest({ url, credentials })
	.then((data) => {
	data.reverse()
	return data.map((item) => {
	item.originalStatus = status
	return parseStatus(item)
	})
	})
	}

	const tagUser = ({ tag, credentials, user }) => {
	const screenName = user.screen_name
	const form = {
	nicknames: [screenName],
	tags: [tag]
	}

	const headers = authHeaders(credentials)
	headers['Content-Type'] = 'application/json'

	return fetch(TAG_USER_URL, {
	method: 'PUT',
	headers,
	body: JSON.stringify(form)
	})
	}

	const untagUser = ({ tag, credentials, user }) => {
	const screenName = user.screen_name
	const body = {
	nicknames: [screenName],
	tags: [tag]
	}

	const headers = authHeaders(credentials)
	headers['Content-Type'] = 'application/json'

	return fetch(TAG_USER_URL, {
	method: 'DELETE',
	headers,
	body: JSON.stringify(body)
	})
	}

	const addRight = ({ right, credentials, user }) => {
	const screenName = user.screen_name

	return fetch(PERMISSION_GROUP_URL(screenName, right), {
	method: 'POST',
	headers: authHeaders(credentials),
	body: {}
	})
	}

	const deleteRight = ({ right, credentials, user }) => {
	const screenName = user.screen_name

	return fetch(PERMISSION_GROUP_URL(screenName, right), {
	method: 'DELETE',
	headers: authHeaders(credentials),
	body: {}
	})
	}

	const activateUser = ({ credentials, user: { screen_name: nickname } }) => {
	return promisedRequest({
	url: ACTIVATE_USER_URL,
	method: 'PATCH',
	credentials,
	payload: {
	nicknames: [nickname]
	}
	}).then(response => get(response, 'users.0'))
	}

	const deactivateUser = ({ credentials, user: { screen_name: nickname } }) => {
	return promisedRequest({
	url: DEACTIVATE_USER_URL,
	method: 'PATCH',
	credentials,
	payload: {
	nicknames: [nickname]
	}
	}).then(response => get(response, 'users.0'))
	}

	const deleteUser = ({ credentials, user }) => {
	const screenName = user.screen_name
	const headers = authHeaders(credentials)

	return fetch(`${ADMIN_USERS_URL}?nickname=${screenName}`, {
	method: 'DELETE',
	headers
	})
	}

	const fetchTimeline = ({
	timeline,
	credentials,
	since = false,
	until = false,
	userId = false,
	listId = false,
	tag = false,
	withMuted = false,
	replyVisibility = 'all',
	includeTypes = []
	}) => {
	const timelineUrls = {
	public: MASTODON_PUBLIC_TIMELINE,
	friends: MASTODON_USER_HOME_TIMELINE_URL,
	dms: MASTODON_DIRECT_MESSAGES_TIMELINE_URL,
	notifications: MASTODON_USER_NOTIFICATIONS_URL,
	publicAndExternal: MASTODON_PUBLIC_TIMELINE,
	user: MASTODON_USER_TIMELINE_URL,
	media: MASTODON_USER_TIMELINE_URL,
	list: MASTODON_LIST_TIMELINE_URL,
	favorites: MASTODON_USER_FAVORITES_TIMELINE_URL,
	tag: MASTODON_TAG_TIMELINE_URL,
	bookmarks: MASTODON_BOOKMARK_TIMELINE_URL
	}
	const isNotifications = timeline === 'notifications'
	const params = []

	let url = timelineUrls[timeline]

	if (timeline === 'user' \|\| timeline === 'media') {
	url = url(userId)
	}

	if (timeline === 'list') {
	url = url(listId)
	}

	if (since) {
	params.push(['since_id', since])
	}
	if (until) {
	params.push(['max_id', until])
	}
	if (tag) {
	url = url(tag)
	}
	if (timeline === 'media') {
	params.push(['only_media', 1])
	}
	if (timeline === 'public') {
	params.push(['local', true])
	}
	if (timeline === 'public' \|\| timeline === 'publicAndExternal') {
	params.push(['only_media', false])
	}
	if (timeline !== 'favorites' && timeline !== 'bookmarks') {
	params.push(['with_muted', withMuted])
	}
	if (replyVisibility !== 'all') {
	params.push(['reply_visibility', replyVisibility])
	}
	if (includeTypes.length > 0) {
	includeTypes.forEach(type => {
	params.push(['include_types[]', type])
	})
	}

	params.push(['limit', 20])

	const queryString = map(params, (param) => `${param[0]}=${param[1]}`).join('&')
	url += `?${queryString}`

	return fetch(url, { headers: authHeaders(credentials) })
	.then(async (response) => {
	const success = response.ok

	const data = await response.json()

	if (success && !data.errors) {
	const pagination = parseLinkHeaderPagination(response.headers.get('Link'), {
	flakeId: timeline !== 'bookmarks' && timeline !== 'notifications'
	})

	return { data: data.map(isNotifications ? parseNotification : parseStatus), pagination }
	} else {
	data.errors \|\|= []
	data.status = response.status
	data.statusText = response.statusText
	return data
	}
	})
	}

	const fetchPinnedStatuses = ({ id, credentials }) => {
	const url = MASTODON_USER_TIMELINE_URL(id) + '?pinned=true'
	return promisedRequest({ url, credentials })
	.then((data) => data.map(parseStatus))
	}

	const verifyCredentials = (user) => {
	return fetch(MASTODON_LOGIN_URL, {
	headers: authHeaders(user)
	})
	.then((response) => {
	if (response.ok) {
	return response.json()
	} else {
	return {
	error: response
	}
	}
	})
	.then((data) => data.error ? data : parseUser(data))
	}

	const favorite = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_FAVORITE_URL(id), method: 'POST', credentials })
	.then((data) => parseStatus(data))
	}

	const unfavorite = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_UNFAVORITE_URL(id), method: 'POST', credentials })
	.then((data) => parseStatus(data))
	}

	const retweet = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_RETWEET_URL(id), method: 'POST', credentials })
	.then((data) => parseStatus(data))
	}

	const unretweet = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_UNRETWEET_URL(id), method: 'POST', credentials })
	.then((data) => parseStatus(data))
	}

	const bookmarkStatus = ({ id, credentials }) => {
	return promisedRequest({
	url: MASTODON_BOOKMARK_STATUS_URL(id),
	headers: authHeaders(credentials),
	method: 'POST'
	})
	}

	const unbookmarkStatus = ({ id, credentials }) => {
	return promisedRequest({
	url: MASTODON_UNBOOKMARK_STATUS_URL(id),
	headers: authHeaders(credentials),
	method: 'POST'
	})
	}

	const postStatus = ({
	credentials,
	status,
	spoilerText,
	visibility,
	sensitive,
	poll,
	mediaIds = [],
	inReplyToStatusId,
	contentType,
	preview,
	idempotencyKey
	}) => {
	const form = new FormData()
	const pollOptions = poll.options \|\| []

	form.append('status', status)
	form.append('source', 'Pleroma FE')
	if (spoilerText) form.append('spoiler_text', spoilerText)
	if (visibility) form.append('visibility', visibility)
	if (sensitive) form.append('sensitive', sensitive)
	if (contentType) form.append('content_type', contentType)
	mediaIds.forEach(val => {
	form.append('media_ids[]', val)
	})
	if (pollOptions.some(option => option !== '')) {
	const normalizedPoll = {
	expires_in: poll.expiresIn,
	multiple: poll.multiple
	}
	Object.keys(normalizedPoll).forEach(key => {
	form.append(`poll[${key}]`, normalizedPoll[key])
	})

	pollOptions.forEach(option => {
	form.append('poll[options][]', option)
	})
	}
	if (inReplyToStatusId) {
	form.append('in_reply_to_id', inReplyToStatusId)
	}
	if (preview) {
	form.append('preview', 'true')
	}

	const postHeaders = authHeaders(credentials)
	if (idempotencyKey) {
	postHeaders['idempotency-key'] = idempotencyKey
	}

	return fetch(MASTODON_POST_STATUS_URL, {
	body: form,
	method: 'POST',
	headers: postHeaders
	})
	.then((response) => {
	return response.json()
	})
	.then((data) => data.error ? data : parseStatus(data))
	}

	const editStatus = ({
	id,
	credentials,
	status,
	spoilerText,
	sensitive,
	poll,
	mediaIds = [],
	contentType
	}) => {
	const form = new FormData()
	const pollOptions = poll.options \|\| []

	form.append('status', status)
	if (spoilerText) form.append('spoiler_text', spoilerText)
	if (sensitive) form.append('sensitive', sensitive)
	if (contentType) form.append('content_type', contentType)
	mediaIds.forEach(val => {
	form.append('media_ids[]', val)
	})

	if (pollOptions.some(option => option !== '')) {
	const normalizedPoll = {
	expires_in: poll.expiresIn,
	multiple: poll.multiple
	}
	Object.keys(normalizedPoll).forEach(key => {
	form.append(`poll[${key}]`, normalizedPoll[key])
	})

	pollOptions.forEach(option => {
	form.append('poll[options][]', option)
	})
	}

	const putHeaders = authHeaders(credentials)

	return fetch(MASTODON_STATUS_URL(id), {
	body: form,
	method: 'PUT',
	headers: putHeaders
	})
	.then((response) => {
	return response.json()
	})
	.then((data) => data.error ? data : parseStatus(data))
	}

	const deleteStatus = ({ id, credentials }) => {
	return fetch(MASTODON_DELETE_URL(id), {
	headers: authHeaders(credentials),
	method: 'DELETE'
	})
	}

	const uploadMedia = ({ formData, credentials }) => {
	return fetch(MASTODON_MEDIA_UPLOAD_URL, {
	body: formData,
	method: 'POST',
	headers: authHeaders(credentials)
	})
	.then((data) => data.json())
	.then((data) => parseAttachment(data))
	}

	const setMediaDescription = ({ id, description, credentials }) => {
	return promisedRequest({
	url: `${MASTODON_MEDIA_UPLOAD_URL}/${id}`,
	method: 'PUT',
	headers: authHeaders(credentials),
	payload: {
	description
	}
	}).then((data) => parseAttachment(data))
	}

	const importMutes = ({ file, credentials }) => {
	const formData = new FormData()
	formData.append('list', file)
	return fetch(MUTES_IMPORT_URL, {
	body: formData,
	method: 'POST',
	headers: authHeaders(credentials)
	})
	.then((response) => response.ok)
	}

	const importBlocks = ({ file, credentials }) => {
	const formData = new FormData()
	formData.append('list', file)
	return fetch(BLOCKS_IMPORT_URL, {
	body: formData,
	method: 'POST',
	headers: authHeaders(credentials)
	})
	.then((response) => response.ok)
	}

	const importFollows = ({ file, credentials }) => {
	const formData = new FormData()
	formData.append('list', file)
	return fetch(FOLLOW_IMPORT_URL, {
	body: formData,
	method: 'POST',
	headers: authHeaders(credentials)
	})
	.then((response) => response.ok)
	}

	const deleteAccount = ({ credentials, password }) => {
	const form = new FormData()

	form.append('password', password)

	return fetch(DELETE_ACCOUNT_URL, {
	body: form,
	method: 'POST',
	headers: authHeaders(credentials)
	})
	.then((response) => response.json())
	}

	const changeEmail = ({ credentials, email, password }) => {
	const form = new FormData()

	form.append('email', email)
	form.append('password', password)

	return fetch(CHANGE_EMAIL_URL, {
	body: form,
	method: 'POST',
	headers: authHeaders(credentials)
	})
	.then((response) => response.json())
	}

	const moveAccount = ({ credentials, password, targetAccount }) => {
	const form = new FormData()

	form.append('password', password)
	form.append('target_account', targetAccount)

	return fetch(MOVE_ACCOUNT_URL, {
	body: form,
	method: 'POST',
	headers: authHeaders(credentials)
	})
	.then((response) => response.json())
	}

	const addAlias = ({ credentials, alias }) => {
	return promisedRequest({
	url: ALIASES_URL,
	method: 'PUT',
	credentials,
	payload: { alias }
	})
	}

	const deleteAlias = ({ credentials, alias }) => {
	return promisedRequest({
	url: ALIASES_URL,
	method: 'DELETE',
	credentials,
	payload: { alias }
	})
	}

	const listAliases = ({ credentials }) => {
	return promisedRequest({
	url: ALIASES_URL,
	method: 'GET',
	credentials,
	params: {
	_cacheBooster: (new Date()).getTime()
	}
	})
	}

	const changePassword = ({ credentials, password, newPassword, newPasswordConfirmation }) => {
	const form = new FormData()

	form.append('password', password)
	form.append('new_password', newPassword)
	form.append('new_password_confirmation', newPasswordConfirmation)

	return fetch(CHANGE_PASSWORD_URL, {
	body: form,
	method: 'POST',
	headers: authHeaders(credentials)
	})
	.then((response) => response.json())
	}

	const settingsMFA = ({ credentials }) => {
	return fetch(MFA_SETTINGS_URL, {
	headers: authHeaders(credentials),
	method: 'GET'
	}).then((data) => data.json())
	}

	const mfaDisableOTP = ({ credentials, password }) => {
	const form = new FormData()

	form.append('password', password)

	return fetch(MFA_DISABLE_OTP_URL, {
	body: form,
	method: 'DELETE',
	headers: authHeaders(credentials)
	})
	.then((response) => response.json())
	}

	const mfaConfirmOTP = ({ credentials, password, token }) => {
	const form = new FormData()

	form.append('password', password)
	form.append('code', token)

	return fetch(MFA_CONFIRM_OTP_URL, {
	body: form,
	headers: authHeaders(credentials),
	method: 'POST'
	}).then((data) => data.json())
	}
	const mfaSetupOTP = ({ credentials }) => {
	return fetch(MFA_SETUP_OTP_URL, {
	headers: authHeaders(credentials),
	method: 'GET'
	}).then((data) => data.json())
	}
	const generateMfaBackupCodes = ({ credentials }) => {
	return fetch(MFA_BACKUP_CODES_URL, {
	headers: authHeaders(credentials),
	method: 'GET'
	}).then((data) => data.json())
	}

	const fetchMutes = ({ credentials }) => {
	return promisedRequest({ url: MASTODON_USER_MUTES_URL, credentials })
	.then((users) => users.map(parseUser))
	}

	-const muteUser = ({ id, credentials }) => {
	- return promisedRequest({ url: MASTODON_MUTE_USER_URL(id), credentials, method: 'POST' })
	+const muteUser = ({ id, expiresIn, credentials }) => {
	+ const payload = {}
	+ if (expiresIn) {
	+ payload['expires_in'] = expiresIn
	+ }
	+ return promisedRequest({ url: MASTODON_MUTE_USER_URL(id), credentials, method: 'POST', payload })
	}

	const unmuteUser = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_UNMUTE_USER_URL(id), credentials, method: 'POST' })
	}

	const subscribeUser = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_SUBSCRIBE_USER(id), credentials, method: 'POST' })
	}

	const unsubscribeUser = ({ id, credentials }) => {
	return promisedRequest({ url: MASTODON_UNSUBSCRIBE_USER(id), credentials, method: 'POST' })
	}

	const fetchBlocks = ({ credentials }) => {
	return promisedRequest({ url: MASTODON_USER_BLOCKS_URL, credentials })
	.then((users) => users.map(parseUser))
	}

	const addBackup = ({ credentials }) => {
	return promisedRequest({
	url: PLEROMA_BACKUP_URL,
	method: 'POST',
	credentials
	})
	}

	const listBackups = ({ credentials }) => {
	return promisedRequest({
	url: PLEROMA_BACKUP_URL,
	method: 'GET',
	credentials,
	params: {
	_cacheBooster: (new Date()).getTime()
	}
	})
	}

	const fetchOAuthTokens = ({ credentials }) => {
	const url = '/api/oauth_tokens.json'

	return fetch(url, {
	headers: authHeaders(credentials)
	}).then((data) => {
	if (data.ok) {
	return data.json()
	}
	throw new Error('Error fetching auth tokens', data)
	})
	}

	const revokeOAuthToken = ({ id, credentials }) => {
	const url = `/api/oauth_tokens/${id}`

	return fetch(url, {
	headers: authHeaders(credentials),
	method: 'DELETE'
	})
	}

	const suggestions = ({ credentials }) => {
	return fetch(SUGGESTIONS_URL, {
	headers: authHeaders(credentials)
	}).then((data) => data.json())
	}

	const markNotificationsAsSeen = ({ id, credentials, single = false }) => {
	const body = new FormData()

	if (single) {
	body.append('id', id)
	} else {
	body.append('max_id', id)
	}

	return fetch(NOTIFICATION_READ_URL, {
	body,
	headers: authHeaders(credentials),
	method: 'POST'
	}).then((data) => data.json())
	}

	const vote = ({ pollId, choices, credentials }) => {
	const form = new FormData()
	form.append('choices', choices)

	return promisedRequest({
	url: MASTODON_VOTE_URL(encodeURIComponent(pollId)),
	method: 'POST',
	credentials,
	payload: {
	choices
	}
	})
	}

	const fetchPoll = ({ pollId, credentials }) => {
	return promisedRequest(
	{
	url: MASTODON_POLL_URL(encodeURIComponent(pollId)),
	method: 'GET',
	credentials
	}
	)
	}

	const fetchFavoritedByUsers = ({ id, credentials }) => {
	return promisedRequest({
	url: MASTODON_STATUS_FAVORITEDBY_URL(id),
	method: 'GET',
	credentials
	}).then((users) => users.map(parseUser))
	}

	const fetchRebloggedByUsers = ({ id, credentials }) => {
	return promisedRequest({
	url: MASTODON_STATUS_REBLOGGEDBY_URL(id),
	method: 'GET',
	credentials
	}).then((users) => users.map(parseUser))
	}

	const fetchEmojiReactions = ({ id, credentials }) => {
	return promisedRequest({ url: PLEROMA_EMOJI_REACTIONS_URL(id), credentials })
	.then((reactions) => reactions.map(r => {
	r.accounts = r.accounts.map(parseUser)
	return r
	}))
	}

	const reactWithEmoji = ({ id, emoji, credentials }) => {
	return promisedRequest({
	url: PLEROMA_EMOJI_REACT_URL(id, emoji),
	method: 'PUT',
	credentials
	}).then(parseStatus)
	}

	const unreactWithEmoji = ({ id, emoji, credentials }) => {
	return promisedRequest({
	url: PLEROMA_EMOJI_UNREACT_URL(id, emoji),
	method: 'DELETE',
	credentials
	}).then(parseStatus)
	}

	const reportUser = ({ credentials, userId, statusIds, comment, forward }) => {
	return promisedRequest({
	url: MASTODON_REPORT_USER_URL,
	method: 'POST',
	payload: {
	account_id: userId,
	status_ids: statusIds,
	comment,
	forward
	},
	credentials
	})
	}

	const searchUsers = ({ credentials, query }) => {
	return promisedRequest({
	url: MASTODON_USER_SEARCH_URL,
	params: {
	q: query,
	resolve: true
	},
	credentials
	})
	.then((data) => data.map(parseUser))
	}

	const search2 = ({ credentials, q, resolve, limit, offset, following, type }) => {
	let url = MASTODON_SEARCH_2
	const params = []

	if (q) {
	params.push(['q', encodeURIComponent(q)])
	}

	if (resolve) {
	params.push(['resolve', resolve])
	}

	if (limit) {
	params.push(['limit', limit])
	}

	if (offset) {
	params.push(['offset', offset])
	}

	if (following) {
	params.push(['following', true])
	}

	if (type) {
	params.push(['following', type])
	}

	params.push(['with_relationships', true])

	const queryString = map(params, (param) => `${param[0]}=${param[1]}`).join('&')
	url += `?${queryString}`

	return fetch(url, { headers: authHeaders(credentials) })
	.then((data) => {
	if (data.ok) {
	return data
	}
	throw new Error('Error fetching search result', data)
	})
	.then((data) => { return data.json() })
	.then((data) => {
	data.accounts = data.accounts.slice(0, limit).map(u => parseUser(u))
	data.statuses = data.statuses.slice(0, limit).map(s => parseStatus(s))
	return data
	})
	}

	const fetchKnownDomains = ({ credentials }) => {
	return promisedRequest({ url: MASTODON_KNOWN_DOMAIN_LIST_URL, credentials })
	}

	const fetchDomainMutes = ({ credentials }) => {
	return promisedRequest({ url: MASTODON_DOMAIN_BLOCKS_URL, credentials })
	}

	const muteDomain = ({ domain, credentials }) => {
	return promisedRequest({
	url: MASTODON_DOMAIN_BLOCKS_URL,
	method: 'POST',
	payload: { domain },
	credentials
	})
	}

	const unmuteDomain = ({ domain, credentials }) => {
	return promisedRequest({
	url: MASTODON_DOMAIN_BLOCKS_URL,
	method: 'DELETE',
	payload: { domain },
	credentials
	})
	}

	const dismissNotification = ({ credentials, id }) => {
	return promisedRequest({
	url: MASTODON_DISMISS_NOTIFICATION_URL(id),
	method: 'POST',
	payload: { id },
	credentials
	})
	}

	const adminFetchAnnouncements = ({ credentials }) => {
	return promisedRequest({ url: PLEROMA_ANNOUNCEMENTS_URL, credentials })
	}

	const fetchAnnouncements = ({ credentials }) => {
	return promisedRequest({ url: MASTODON_ANNOUNCEMENTS_URL, credentials })
	}

	const dismissAnnouncement = ({ id, credentials }) => {
	return promisedRequest({
	url: MASTODON_ANNOUNCEMENTS_DISMISS_URL(id),
	credentials,
	method: 'POST'
	})
	}

	const announcementToPayload = ({ content, startsAt, endsAt, allDay }) => {
	const payload = { content }

	if (typeof startsAt !== 'undefined') {
	payload.starts_at = startsAt ? new Date(startsAt).toISOString() : null
	}

	if (typeof endsAt !== 'undefined') {
	payload.ends_at = endsAt ? new Date(endsAt).toISOString() : null
	}

	if (typeof allDay !== 'undefined') {
	payload.all_day = allDay
	}

	return payload
	}

	const postAnnouncement = ({ credentials, content, startsAt, endsAt, allDay }) => {
	return promisedRequest({
	url: PLEROMA_POST_ANNOUNCEMENT_URL,
	credentials,
	method: 'POST',
	payload: announcementToPayload({ content, startsAt, endsAt, allDay })
	})
	}

	const editAnnouncement = ({ id, credentials, content, startsAt, endsAt, allDay }) => {
	return promisedRequest({
	url: PLEROMA_EDIT_ANNOUNCEMENT_URL(id),
	credentials,
	method: 'PATCH',
	payload: announcementToPayload({ content, startsAt, endsAt, allDay })
	})
	}

	const deleteAnnouncement = ({ id, credentials }) => {
	return promisedRequest({
	url: PLEROMA_DELETE_ANNOUNCEMENT_URL(id),
	credentials,
	method: 'DELETE'
	})
	}

	export const getMastodonSocketURI = ({ credentials, stream, args = {} }) => {
	return Object.entries({
	...(credentials
	? { access_token: credentials }
	: {}
	),
	stream,
	...args
	}).reduce((acc, [key, val]) => {
	return acc + `${key}=${val}&`
	}, MASTODON_STREAMING + '?')
	}

	const MASTODON_STREAMING_EVENTS = new Set([
	'update',
	'notification',
	'delete',
	'filters_changed',
	'status.update'
	])

	const PLEROMA_STREAMING_EVENTS = new Set([
	'pleroma:chat_update'
	])

	// A thin wrapper around WebSocket API that allows adding a pre-processor to it
	// Uses EventTarget and a CustomEvent to proxy events
	export const ProcessedWS = ({
	url,
	preprocessor = handleMastoWS,
	id = 'Unknown'
	}) => {
	const eventTarget = new EventTarget()
	const socket = new WebSocket(url)
	if (!socket) throw new Error(`Failed to create socket ${id}`)
	const proxy = (original, eventName, processor = a => a) => {
	original.addEventListener(eventName, (eventData) => {
	eventTarget.dispatchEvent(new CustomEvent(
	eventName,
	{ detail: processor(eventData) }
	))
	})
	}
	socket.addEventListener('open', (wsEvent) => {
	console.debug(`[WS][${id}] Socket connected`, wsEvent)
	})
	socket.addEventListener('error', (wsEvent) => {
	console.debug(`[WS][${id}] Socket errored`, wsEvent)
	})
	socket.addEventListener('close', (wsEvent) => {
	console.debug(
	`[WS][${id}] Socket disconnected with code ${wsEvent.code}`,
	wsEvent
	)
	})
	// Commented code reason: very spammy, uncomment to enable message debug logging
	/*
	socket.addEventListener('message', (wsEvent) => {
	console.debug(
	`[WS][${id}] Message received`,
	wsEvent
	)
	})
	/**/

	proxy(socket, 'open')
	proxy(socket, 'close')
	proxy(socket, 'message', preprocessor)
	proxy(socket, 'error')

	// 1000 = Normal Closure
	eventTarget.close = () => { socket.close(1000, 'Shutting down socket') }
	eventTarget.getState = () => socket.readyState

	return eventTarget
	}

	export const handleMastoWS = (wsEvent) => {
	const { data } = wsEvent
	if (!data) return
	const parsedEvent = JSON.parse(data)
	const { event, payload } = parsedEvent
	if (MASTODON_STREAMING_EVENTS.has(event) \|\| PLEROMA_STREAMING_EVENTS.has(event)) {
	// MastoBE and PleromaBE both send payload for delete as a PLAIN string
	if (event === 'delete') {
	return { event, id: payload }
	}
	const data = payload ? JSON.parse(payload) : null
	if (event === 'update') {
	return { event, status: parseStatus(data) }
	} else if (event === 'status.update') {
	return { event, status: parseStatus(data) }
	} else if (event === 'notification') {
	return { event, notification: parseNotification(data) }
	} else if (event === 'pleroma:chat_update') {
	return { event, chatUpdate: parseChat(data) }
	}
	} else {
	console.warn('Unknown event', wsEvent)
	return null
	}
	}

	export const WSConnectionStatus = Object.freeze({
	JOINED: 1,
	CLOSED: 2,
	ERROR: 3,
	DISABLED: 4,
	STARTING: 5,
	STARTING_INITIAL: 6
	})

	const chats = ({ credentials }) => {
	return fetch(PLEROMA_CHATS_URL, { headers: authHeaders(credentials) })
	.then((data) => data.json())
	.then((data) => {
	return { chats: data.map(parseChat).filter(c => c) }
	})
	}

	const getOrCreateChat = ({ accountId, credentials }) => {
	return promisedRequest({
	url: PLEROMA_CHAT_URL(accountId),
	method: 'POST',
	credentials
	})
	}

	const chatMessages = ({ id, credentials, maxId, sinceId, limit = 20 }) => {
	let url = PLEROMA_CHAT_MESSAGES_URL(id)
	const args = [
	maxId && `max_id=${maxId}`,
	sinceId && `since_id=${sinceId}`,
	limit && `limit=${limit}`
	].filter(_ => _).join('&')

	url = url + (args ? '?' + args : '')

	return promisedRequest({
	url,
	method: 'GET',
	credentials
	})
	}

	const sendChatMessage = ({ id, content, mediaId = null, idempotencyKey, credentials }) => {
	const payload = {
	content
	}

	if (mediaId) {
	payload.media_id = mediaId
	}

	const headers = {}

	if (idempotencyKey) {
	headers['idempotency-key'] = idempotencyKey
	}

	return promisedRequest({
	url: PLEROMA_CHAT_MESSAGES_URL(id),
	method: 'POST',
	payload,
	credentials,
	headers
	})
	}

	const readChat = ({ id, lastReadId, credentials }) => {
	return promisedRequest({
	url: PLEROMA_CHAT_READ_URL(id),
	method: 'POST',
	payload: {
	last_read_id: lastReadId
	},
	credentials
	})
	}

	const deleteChatMessage = ({ chatId, messageId, credentials }) => {
	return promisedRequest({
	url: PLEROMA_DELETE_CHAT_MESSAGE_URL(chatId, messageId),
	method: 'DELETE',
	credentials
	})
	}

	const setReportState = ({ id, state, credentials }) => {
	// TODO: Can't use promisedRequest because on OK this does not return json
	// See https://git.pleroma.social/pleroma/pleroma-fe/-/merge_requests/1322
	return fetch(PLEROMA_ADMIN_REPORTS, {
	headers: {
	...authHeaders(credentials),
	Accept: 'application/json',
	'Content-Type': 'application/json'
	},
	method: 'PATCH',
	body: JSON.stringify({
	reports: [{
	id,
	state
	}]
	})
	})
	.then(data => {
	if (data.status >= 500) {
	throw Error(data.statusText)
	} else if (data.status >= 400) {
	return data.json()
	}
	return data
	})
	.then(data => {
	if (data.errors) {
	throw Error(data.errors[0].message)
	}
	})
	}

	const apiService = {
	verifyCredentials,
	fetchTimeline,
	fetchPinnedStatuses,
	fetchConversation,
	fetchStatus,
	fetchStatusSource,
	fetchStatusHistory,
	fetchFriends,
	exportFriends,
	fetchFollowers,
	followUser,
	unfollowUser,
	pinOwnStatus,
	unpinOwnStatus,
	muteConversation,
	unmuteConversation,
	blockUser,
	unblockUser,
	removeUserFromFollowers,
	editUserNote,
	fetchUser,
	fetchUserByName,
	fetchUserRelationship,
	favorite,
	unfavorite,
	retweet,
	unretweet,
	bookmarkStatus,
	unbookmarkStatus,
	postStatus,
	editStatus,
	deleteStatus,
	uploadMedia,
	setMediaDescription,
	fetchMutes,
	muteUser,
	unmuteUser,
	subscribeUser,
	unsubscribeUser,
	fetchBlocks,
	fetchOAuthTokens,
	revokeOAuthToken,
	tagUser,
	untagUser,
	deleteUser,
	addRight,
	deleteRight,
	activateUser,
	deactivateUser,
	register,
	getCaptcha,
	updateProfileImages,
	updateProfile,
	importMutes,
	importBlocks,
	importFollows,
	deleteAccount,
	changeEmail,
	moveAccount,
	addAlias,
	deleteAlias,
	listAliases,
	changePassword,
	settingsMFA,
	mfaDisableOTP,
	generateMfaBackupCodes,
	mfaSetupOTP,
	mfaConfirmOTP,
	addBackup,
	listBackups,
	fetchFollowRequests,
	fetchLists,
	createList,
	getList,
	updateList,
	getListAccounts,
	addAccountsToList,
	removeAccountsFromList,
	deleteList,
	approveUser,
	denyUser,
	suggestions,
	markNotificationsAsSeen,
	dismissNotification,
	vote,
	fetchPoll,
	fetchFavoritedByUsers,
	fetchRebloggedByUsers,
	fetchEmojiReactions,
	reactWithEmoji,
	unreactWithEmoji,
	reportUser,
	updateNotificationSettings,
	search2,
	searchUsers,
	fetchKnownDomains,
	fetchDomainMutes,
	muteDomain,
	unmuteDomain,
	chats,
	getOrCreateChat,
	chatMessages,
	sendChatMessage,
	readChat,
	deleteChatMessage,
	setReportState,
	fetchUserInLists,
	fetchAnnouncements,
	dismissAnnouncement,
	postAnnouncement,
	editAnnouncement,
	deleteAnnouncement,
	adminFetchAnnouncements
	}

	export default apiService
	diff --git a/src/services/date_utils/date_utils.js b/src/services/date_utils/date_utils.js
	index c93d21761e..ed8e14170b 100644
	--- a/src/services/date_utils/date_utils.js
	+++ b/src/services/date_utils/date_utils.js
	@@ -1,43 +1,59 @@
	export const SECOND = 1000
	export const MINUTE = 60 * SECOND
	export const HOUR = 60 * MINUTE
	export const DAY = 24 * HOUR
	export const WEEK = 7 * DAY
	export const MONTH = 30 * DAY
	export const YEAR = 365.25 * DAY

	export const relativeTime = (date, nowThreshold = 1) => {
	if (typeof date === 'string') date = Date.parse(date)
	const round = Date.now() > date ? Math.floor : Math.ceil
	const d = Math.abs(Date.now() - date)
	const r = { num: round(d / YEAR), key: 'time.unit.years' }
	if (d < nowThreshold * SECOND) {
	r.num = 0
	r.key = 'time.now'
	} else if (d < MINUTE) {
	r.num = round(d / SECOND)
	r.key = 'time.unit.seconds'
	} else if (d < HOUR) {
	r.num = round(d / MINUTE)
	r.key = 'time.unit.minutes'
	} else if (d < DAY) {
	r.num = round(d / HOUR)
	r.key = 'time.unit.hours'
	} else if (d < WEEK) {
	r.num = round(d / DAY)
	r.key = 'time.unit.days'
	} else if (d < MONTH) {
	r.num = round(d / WEEK)
	r.key = 'time.unit.weeks'
	} else if (d < YEAR) {
	r.num = round(d / MONTH)
	r.key = 'time.unit.months'
	}
	return r
	}

	export const relativeTimeShort = (date, nowThreshold = 1) => {
	const r = relativeTime(date, nowThreshold)
	r.key += '_short'
	return r
	}
	+
	+export const unitToSeconds = (unit, amount) => {
	+ switch (unit) {
	+ case 'minutes': return 0.001 * amount * MINUTE
	+ case 'hours': return 0.001 * amount * HOUR
	+ case 'days': return 0.001 * amount * DAY
	+ }
	+}
	+
	+export const secondsToUnit = (unit, amount) => {
	+ switch (unit) {
	+ case 'minutes': return (1000 * amount) / MINUTE
	+ case 'hours': return (1000 * amount) / HOUR
	+ case 'days': return (1000 * amount) / DAY
	+ }
	+}

File Metadata

Mime Type: text/x-diff
Expires: Fri, Oct 9, 7:32 AM (1 d, 12 h)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 1784501
Default Alt Text: (104 KB)

No OneTemporaryActions

View Options

File Metadata

Event Timeline

No OneTemporary
Actions