No OneTemporary
Actions

Authored By

Unknown

Size

51 KB

Referenced Files

None

Subscribers

None

View Options

	diff --git a/config/local.example.json b/config/local.example.json
	deleted file mode 100644
	index 2a3bd00da9..0000000000
	--- a/config/local.example.json
	+++ /dev/null
	@@ -1,4 +0,0 @@
	-{
	- "target": "https://pleroma.soykaf.com/",
	- "staticConfigPreference": false
	-}
	diff --git a/src/components/notification/notification.scss b/src/components/notification/notification.scss
	index 654aca3cdc..7d32644450 100644
	--- a/src/components/notification/notification.scss
	+++ b/src/components/notification/notification.scss
	@@ -1,98 +1,101 @@
	@import "../../variables";

	// TODO Copypaste from Status, should unify it somehow
	.Notification {
	border-bottom: 1px solid;
	border-color: $fallback--border;
	border-color: var(--border, $fallback--border);
	word-wrap: break-word;
	word-break: break-word;

	--emoji-size: 14px;

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

	&.-muted {
	padding: 0.25em 0.6em;
	height: 1.2em;
	line-height: 1.2em;
	text-overflow: ellipsis;
	overflow: hidden;
	display: flex;
	flex-wrap: nowrap;

	& .status-username,
	& .mute-thread,
	- & .mute-words {
	+ & .mute-words,
	+ & .mute-regexes {
	word-wrap: normal;
	word-break: normal;
	white-space: nowrap;
	}

	& .status-username,
	- & .mute-words {
	+ & .mute-words,
	+ & .mute-regexes {
	text-overflow: ellipsis;
	overflow: hidden;
	}

	.status-username {
	font-weight: normal;
	flex: 0 1 auto;
	margin-right: 0.2em;
	font-size: smaller;
	}

	.mute-thread {
	flex: 0 0 auto;
	}

	- .mute-words {
	+ & .mute-words,
	+ & .mute-regexes {
	flex: 1 0 5em;
	margin-left: 0.2em;

	&::before {
	content: " ";
	}
	}

	.unmute {
	flex: 0 0 auto;
	margin-left: auto;
	display: block;
	}
	}

	.type-icon {
	margin: 0 0.1em;
	}

	&.-type--repeat .type-icon {
	color: $fallback--cGreen;
	color: var(--cGreen, $fallback--cGreen);
	}

	&.-type--follow .type-icon {
	color: $fallback--cBlue;
	color: var(--cBlue, $fallback--cBlue);
	}

	&.-type--follow-request .type-icon {
	color: $fallback--cBlue;
	color: var(--cBlue, $fallback--cBlue);
	}

	&.-type--like .type-icon {
	color: orange;
	color: $fallback--cOrange;
	color: var(--cOrange, $fallback--cOrange);
	}

	&.-type--move .type-icon {
	color: $fallback--cBlue;
	color: var(--cBlue, $fallback--cBlue);
	}
	}
	diff --git a/src/components/settings_modal/tabs/filtering_tab.js b/src/components/settings_modal/tabs/filtering_tab.js
	index 367397e663..f1a8c11677 100644
	--- a/src/components/settings_modal/tabs/filtering_tab.js
	+++ b/src/components/settings_modal/tabs/filtering_tab.js
	@@ -1,69 +1,70 @@
	import { filter, trim, debounce } from 'lodash'
	import BooleanSetting from '../helpers/boolean_setting.vue'
	import ChoiceSetting from '../helpers/choice_setting.vue'
	import IntegerSetting from '../helpers/integer_setting.vue'

	import SharedComputedObject from '../helpers/shared_computed_object.js'

	const FilteringTab = {
	data () {
	return {
	muteWordsStringLocal: this.$store.getters.mergedConfig.muteWords.join('\n'),
	+ muteRegexesStringLocal: this.$store.getters.mergedConfig.muteRegexes.join('\n'),
	replyVisibilityOptions: ['all', 'following', 'self'].map(mode => ({
	key: mode,
	value: mode,
	label: this.$t(`settings.reply_visibility_${mode}`)
	}))
	}
	},
	components: {
	BooleanSetting,
	ChoiceSetting,
	IntegerSetting
	},
	computed: {
	...SharedComputedObject(),
	muteWordsString: {
	get () {
	return this.muteWordsStringLocal
	},
	set (value) {
	this.muteWordsStringLocal = value
	this.debouncedSetMuteWords(value)
	}
	},
	debouncedSetMuteWords () {
	return debounce((value) => {
	this.$store.dispatch('setOption', {
	name: 'muteWords',
	value: filter(value.split('\n'), (word) => trim(word).length > 0)
	})
	}, 1000)
	},
	muteRegexesString: {
	get () {
	return this.muteRegexesStringLocal
	},
	set (value) {
	this.muteRegexesStringLocal = value
	this.debouncedSetRegexes(value)
	}
	},
	debouncedSetRegexes () {
	return debounce((value) => {
	this.$store.dispatch('setOption', {
	name: 'muteRegexes',
	value: filter(value.split('\n'), (word) => trim(word).length > 0)
	})
	}, 1000)
	}
	},
	// Updating nested properties
	watch: {
	replyVisibility () {
	this.$store.dispatch('queueFlushAll')
	}
	}
	}

	export default FilteringTab
	diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue
	index 8a702762cf..03f997c049 100644
	--- a/src/components/settings_modal/tabs/filtering_tab.vue
	+++ b/src/components/settings_modal/tabs/filtering_tab.vue
	@@ -1,120 +1,120 @@
	<template>
	<div :label="$t('settings.filtering')">
	<div class="setting-item">
	<h2>{{ $t('settings.posts') }}</h2>
	<ul class="setting-list">
	<li>
	<BooleanSetting path="hideFilteredStatuses">
	{{ $t('settings.hide_filtered_statuses') }}
	</BooleanSetting>
	<ul class="setting-list suboptions">
	<li>
	<BooleanSetting
	parent-path="hideFilteredStatuses"
	:parent-invert="true"
	path="hideWordFilteredPosts"
	>
	{{ $t('settings.hide_wordfiltered_statuses') }}
	</BooleanSetting>
	</li>
	<li>
	<BooleanSetting
	v-if="user"
	parent-path="hideFilteredStatuses"
	:parent-invert="true"
	path="hideMutedThreads"
	>
	{{ $t('settings.hide_muted_threads') }}
	</BooleanSetting>
	</li>
	<li>
	<BooleanSetting
	v-if="user"
	parent-path="hideFilteredStatuses"
	:parent-invert="true"
	path="hideMutedPosts"
	>
	{{ $t('settings.hide_muted_posts') }}
	</BooleanSetting>
	</li>
	</ul>
	</li>
	<li>
	<BooleanSetting path="muteBotStatuses">
	{{ $t('settings.mute_bot_posts') }}
	</BooleanSetting>
	</li>
	<li>
	<BooleanSetting path="hidePostStats">
	{{ $t('settings.hide_post_stats') }}
	</BooleanSetting>
	</li>
	<li>
	<BooleanSetting path="hideBotIndication">
	{{ $t('settings.hide_bot_indication') }}
	</BooleanSetting>
	</li>
	<ChoiceSetting
	v-if="user"
	id="replyVisibility"
	path="replyVisibility"
	:options="replyVisibilityOptions"
	>
	{{ $t('settings.replies_in_timeline') }}
	</ChoiceSetting>
	<li>
	<h3>{{ $t('settings.wordfilter') }}</h3>
	<textarea
	id="muteWords"
	v-model="muteWordsString"
	class="resize-height"
	/>
	<div>{{ $t('settings.filtering_explanation') }}</div>
	</li>
	<li>
	<h3>{{ $t('settings.regexfilter') }}</h3>
	<textarea
	- id="muteRegex"
	- v-model="muteRegexString"
	+ id="muteRegexes"
	+ v-model="muteRegexesString"
	class="resize-height"
	/>
	<div>{{ $t('settings.filtering_regex_explanation') }}</div>
	</li>
	<h3>{{ $t('settings.attachments') }}</h3>
	<li>
	<IntegerSetting
	path="maxThumbnails"
	expert="1"
	:min="0"
	>
	{{ $t('settings.max_thumbnails') }}
	</IntegerSetting>
	</li>
	<li>
	<BooleanSetting path="hideAttachments">
	{{ $t('settings.hide_attachments_in_tl') }}
	</BooleanSetting>
	</li>
	<li>
	<BooleanSetting path="hideAttachmentsInConv">
	{{ $t('settings.hide_attachments_in_convo') }}
	</BooleanSetting>
	</li>
	</ul>
	</div>
	<div
	v-if="expertLevel > 0"
	class="setting-item"
	>
	<h2>{{ $t('settings.user_profiles') }}</h2>
	<ul class="setting-list">
	<li>
	<BooleanSetting path="hideUserStats">
	{{ $t('settings.hide_user_stats') }}
	</BooleanSetting>
	</li>
	</ul>
	</div>
	</div>
	</template>
	<script src="./filtering_tab.js"></script>
	diff --git a/src/components/status/status.js b/src/components/status/status.js
	index f0b483d103..851e57842b 100644
	--- a/src/components/status/status.js
	+++ b/src/components/status/status.js
	@@ -1,502 +1,502 @@
	import ReplyButton from '../reply_button/reply_button.vue'
	import FavoriteButton from '../favorite_button/favorite_button.vue'
	import ReactButton from '../react_button/react_button.vue'
	import RetweetButton from '../retweet_button/retweet_button.vue'
	import ExtraButtons from '../extra_buttons/extra_buttons.vue'
	import PostStatusForm from '../post_status_form/post_status_form.vue'
	import UserAvatar from '../user_avatar/user_avatar.vue'
	import AvatarList from '../avatar_list/avatar_list.vue'
	import Timeago from '../timeago/timeago.vue'
	import StatusContent from '../status_content/status_content.vue'
	import RichContent from 'src/components/rich_content/rich_content.jsx'
	import StatusPopover from '../status_popover/status_popover.vue'
	import UserPopover from '../user_popover/user_popover.vue'
	import UserListPopover from '../user_list_popover/user_list_popover.vue'
	import EmojiReactions from '../emoji_reactions/emoji_reactions.vue'
	import UserLink from '../user_link/user_link.vue'
	import MentionsLine from 'src/components/mentions_line/mentions_line.vue'
	import MentionLink from 'src/components/mention_link/mention_link.vue'
	import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
	import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
	import { muteWordHits, muteRegexHits } from '../../services/status_parser/status_parser.js'
	import { unescape, uniqBy } from 'lodash'

	import { library } from '@fortawesome/fontawesome-svg-core'
	import {
	faEnvelope,
	faLock,
	faLockOpen,
	faGlobe,
	faTimes,
	faRetweet,
	faReply,
	faPlusSquare,
	faSmileBeam,
	faEllipsisH,
	faStar,
	faEyeSlash,
	faEye,
	faThumbtack,
	faChevronUp,
	faChevronDown,
	faAngleDoubleRight
	} from '@fortawesome/free-solid-svg-icons'

	library.add(
	faEnvelope,
	faGlobe,
	faLock,
	faLockOpen,
	faTimes,
	faRetweet,
	faReply,
	faPlusSquare,
	faStar,
	faSmileBeam,
	faEllipsisH,
	faEyeSlash,
	faEye,
	faThumbtack,
	faChevronUp,
	faChevronDown,
	faAngleDoubleRight
	)

	const camelCase = name => name.charAt(0).toUpperCase() + name.slice(1)

	const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
	const camelized = camelCase(name)
	const toggle = `controlledToggle${camelized}`
	const controlledName = `controlled${camelized}`
	const uncontrolledName = `uncontrolled${camelized}`
	res[name] = function () {
	return ((this.$data[toggle] !== undefined \|\| this.$props[toggle] !== undefined) && this[toggle]) ? this[controlledName] : this[uncontrolledName]
	}
	return res
	}, {})

	const controlledOrUncontrolledToggle = (obj, name) => {
	const camelized = camelCase(name)
	const toggle = `controlledToggle${camelized}`
	const uncontrolledName = `uncontrolled${camelized}`
	if (obj[toggle]) {
	obj[toggle]()
	} else {
	obj[uncontrolledName] = !obj[uncontrolledName]
	}
	}

	const controlledOrUncontrolledSet = (obj, name, val) => {
	const camelized = camelCase(name)
	const set = `controlledSet${camelized}`
	const uncontrolledName = `uncontrolled${camelized}`
	if (obj[set]) {
	obj[set](val)
	} else {
	obj[uncontrolledName] = val
	}
	}

	const Status = {
	name: 'Status',
	components: {
	ReplyButton,
	FavoriteButton,
	ReactButton,
	RetweetButton,
	ExtraButtons,
	PostStatusForm,
	UserAvatar,
	AvatarList,
	Timeago,
	StatusPopover,
	UserListPopover,
	EmojiReactions,
	StatusContent,
	RichContent,
	MentionLink,
	MentionsLine,
	UserPopover,
	UserLink
	},
	props: [
	'statusoid',
	'expandable',
	'inConversation',
	'focused',
	'highlight',
	'compact',
	'replies',
	'isPreview',
	'noHeading',
	'inlineExpanded',
	'showPinned',
	'inProfile',
	'profileUserId',

	'simpleTree',
	'controlledThreadDisplayStatus',
	'controlledToggleThreadDisplay',
	'showOtherRepliesAsButton',

	'controlledShowingTall',
	'controlledToggleShowingTall',
	'controlledExpandingSubject',
	'controlledToggleExpandingSubject',
	'controlledShowingLongSubject',
	'controlledToggleShowingLongSubject',
	'controlledReplying',
	'controlledToggleReplying',
	'controlledMediaPlaying',
	'controlledSetMediaPlaying',
	'dive'
	],
	data () {
	return {
	uncontrolledReplying: false,
	unmuted: false,
	userExpanded: false,
	uncontrolledMediaPlaying: [],
	suspendable: true,
	error: null,
	headTailLinks: null
	}
	},
	computed: {
	...controlledOrUncontrolledGetters(['replying', 'mediaPlaying']),
	muteWords () {
	return this.mergedConfig.muteWords
	},
	muteRegexes () {
	return this.mergedConfig.muteRegexes
	},
	showReasonMutedThread () {
	return (
	this.status.thread_muted \|\|
	(this.status.reblog && this.status.reblog.thread_muted)
	) && !this.inConversation
	},
	repeaterClass () {
	const user = this.statusoid.user
	return highlightClass(user)
	},
	userClass () {
	const user = this.retweet ? (this.statusoid.retweeted_status.user) : this.statusoid.user
	return highlightClass(user)
	},
	deleted () {
	return this.statusoid.deleted
	},
	repeaterStyle () {
	const user = this.statusoid.user
	const highlight = this.mergedConfig.highlight
	return highlightStyle(highlight[user.screen_name])
	},
	userStyle () {
	if (this.noHeading) return
	const user = this.retweet ? (this.statusoid.retweeted_status.user) : this.statusoid.user
	const highlight = this.mergedConfig.highlight
	return highlightStyle(highlight[user.screen_name])
	},
	userProfileLink () {
	return this.generateUserProfileLink(this.status.user.id, this.status.user.screen_name)
	},
	replyProfileLink () {
	if (this.isReply) {
	const user = this.$store.getters.findUser(this.status.in_reply_to_user_id)
	// FIXME Why user not found sometimes???
	return user ? user.statusnet_profile_url : 'NOT_FOUND'
	}
	},
	retweet () { return !!this.statusoid.retweeted_status },
	retweeterUser () { return this.statusoid.user },
	retweeter () { return this.statusoid.user.name \|\| this.statusoid.user.screen_name_ui },
	retweeterHtml () { return this.statusoid.user.name },
	retweeterProfileLink () { return this.generateUserProfileLink(this.statusoid.user.id, this.statusoid.user.screen_name) },
	status () {
	if (this.retweet) {
	return this.statusoid.retweeted_status
	} else {
	return this.statusoid
	}
	},
	statusFromGlobalRepository () {
	// NOTE: Consider to replace status with statusFromGlobalRepository
	return this.$store.state.statuses.allStatusesObject[this.status.id]
	},
	loggedIn () {
	return !!this.currentUser
	},
	muteWordHits () {
	return muteWordHits(this.status, this.muteWords)
	},
	muteRegexHits () {
	- return muteRegexHits(this.status, this.muteRegex)
	+ return muteRegexHits(this.status, this.muteRegexes)
	},
	rtBotStatus () {
	return this.statusoid.user.bot
	},
	botStatus () {
	return this.status.user.bot
	},
	botIndicator () {
	return this.botStatus && !this.hideBotIndication
	},
	rtBotIndicator () {
	return this.rtBotStatus && !this.hideBotIndication
	},
	mentionsLine () {
	if (!this.headTailLinks) return []
	const writtenSet = new Set(this.headTailLinks.writtenMentions.map(_ => _.url))
	return this.status.attentions.filter(attn => {
	// no reply user
	return attn.id !== this.status.in_reply_to_user_id &&
	// no self-replies
	attn.statusnet_profile_url !== this.status.user.statusnet_profile_url &&
	// don't include if mentions is written
	!writtenSet.has(attn.statusnet_profile_url)
	}).map(attn => ({
	url: attn.statusnet_profile_url,
	content: attn.screen_name,
	userId: attn.id
	}))
	},
	hasMentionsLine () {
	return this.mentionsLine.length > 0
	},
	muted () {
	if (this.statusoid.user.id === this.currentUser.id) return false
	const reasonsToMute = this.userIsMuted \|\|
	// Thread is muted
	status.thread_muted \|\|
	// Wordfiltered
	this.muteWordHits.length > 0 \|\|
	// bot status
	(this.muteBotStatuses && this.botStatus && !this.compact)
	return !this.unmuted && !this.shouldNotMute && reasonsToMute
	},
	userIsMuted () {
	if (this.statusoid.user.id === this.currentUser.id) return false
	const { status } = this
	const { reblog } = status
	const relationship = this.$store.getters.relationship(status.user.id)
	const relationshipReblog = reblog && this.$store.getters.relationship(reblog.user.id)
	return status.muted \|\|
	// Reprööt of a muted post according to BE
	(reblog && reblog.muted) \|\|
	// Muted user
	relationship.muting \|\|
	// Muted user of a reprööt
	(relationshipReblog && relationshipReblog.muting)
	},
	shouldNotMute () {
	const { status } = this
	const { reblog } = status
	return (
	(
	this.inProfile && (
	// Don't mute user's posts on user timeline (except reblogs)
	(!reblog && status.user.id === this.profileUserId) \|\|
	// Same as above but also allow self-reblogs
	(reblog && reblog.user.id === this.profileUserId)
	)
	) \|\|
	// Don't mute statuses in muted conversation when said conversation is opened
	(this.inConversation && status.thread_muted)
	// No excuses if post has muted words
	) && !this.muteWordHits.length > 0
	},
	hideMutedUsers () {
	return this.mergedConfig.hideMutedPosts
	},
	hideMutedThreads () {
	return this.mergedConfig.hideMutedThreads
	},
	hideFilteredStatuses () {
	return this.mergedConfig.hideFilteredStatuses
	},
	hideWordFilteredPosts () {
	return this.mergedConfig.hideWordFilteredPosts
	},
	hideStatus () {
	return (!this.shouldNotMute) && (
	(this.muted && this.hideFilteredStatuses) \|\|
	(this.userIsMuted && this.hideMutedUsers) \|\|
	(this.status.thread_muted && this.hideMutedThreads) \|\|
	(this.muteWordHits.length > 0 && this.hideWordFilteredPosts)
	)
	},
	isFocused () {
	// retweet or root of an expanded conversation
	if (this.focused) {
	return true
	} else if (!this.inConversation) {
	return false
	}
	// use conversation highlight only when in conversation
	return this.status.id === this.highlight
	},
	isReply () {
	return !!(this.status.in_reply_to_status_id && this.status.in_reply_to_user_id)
	},
	replyToName () {
	if (this.status.in_reply_to_screen_name) {
	return this.status.in_reply_to_screen_name
	} else {
	const user = this.$store.getters.findUser(this.status.in_reply_to_user_id)
	return user && user.screen_name_ui
	}
	},
	replySubject () {
	if (!this.status.summary) return ''
	const decodedSummary = unescape(this.status.summary)
	const behavior = this.mergedConfig.subjectLineBehavior
	const startsWithRe = decodedSummary.match(/^re[: ]/i)
	if ((behavior !== 'noop' && startsWithRe) \|\| behavior === 'masto') {
	return decodedSummary
	} else if (behavior === 'email') {
	return 're: '.concat(decodedSummary)
	} else if (behavior === 'noop') {
	return ''
	}
	},
	combinedFavsAndRepeatsUsers () {
	// Use the status from the global status repository since favs and repeats are saved in it
	const combinedUsers = [].concat(
	this.statusFromGlobalRepository.favoritedBy,
	this.statusFromGlobalRepository.rebloggedBy
	)
	return uniqBy(combinedUsers, 'id')
	},
	tags () {
	// eslint-disable-next-line no-prototype-builtins
	return this.status.tags.filter(tagObj => tagObj.hasOwnProperty('name')).map(tagObj => tagObj.name).join(' ')
	},
	hidePostStats () {
	return this.mergedConfig.hidePostStats
	},
	muteBotStatuses () {
	return this.mergedConfig.muteBotStatuses
	},
	hideBotIndication () {
	return this.mergedConfig.hideBotIndication
	},
	currentUser () {
	return this.$store.state.users.currentUser
	},
	betterShadow () {
	return this.$store.state.interface.browserSupport.cssFilter
	},
	mergedConfig () {
	return this.$store.getters.mergedConfig
	},
	isSuspendable () {
	return !this.replying && this.mediaPlaying.length === 0
	},
	inThreadForest () {
	return !!this.controlledThreadDisplayStatus
	},
	threadShowing () {
	return this.controlledThreadDisplayStatus === 'showing'
	},
	visibilityLocalized () {
	return this.$i18n.t('general.scope_in_timeline.' + this.status.visibility)
	},
	isEdited () {
	return this.status.edited_at !== null
	},
	editingAvailable () {
	return this.$store.state.instance.editingAvailable
	}
	},
	methods: {
	visibilityIcon (visibility) {
	switch (visibility) {
	case 'private':
	return 'lock'
	case 'unlisted':
	return 'lock-open'
	case 'direct':
	return 'envelope'
	default:
	return 'globe'
	}
	},
	showError (error) {
	this.error = error
	},
	clearError () {
	this.error = undefined
	},
	toggleReplying () {
	controlledOrUncontrolledToggle(this, 'replying')
	},
	gotoOriginal (id) {
	if (this.inConversation) {
	this.$emit('goto', id)
	}
	},
	toggleExpanded () {
	this.$emit('toggleExpanded')
	},
	toggleMute () {
	this.unmuted = !this.unmuted
	},
	toggleUserExpanded () {
	this.userExpanded = !this.userExpanded
	},
	generateUserProfileLink (id, name) {
	return generateProfileLink(id, name, this.$store.state.instance.restrictedNicknames)
	},
	addMediaPlaying (id) {
	controlledOrUncontrolledSet(this, 'mediaPlaying', this.mediaPlaying.concat(id))
	},
	removeMediaPlaying (id) {
	controlledOrUncontrolledSet(this, 'mediaPlaying', this.mediaPlaying.filter(mediaId => mediaId !== id))
	},
	setHeadTailLinks (headTailLinks) {
	this.headTailLinks = headTailLinks
	},
	toggleThreadDisplay () {
	this.controlledToggleThreadDisplay()
	},
	scrollIfHighlighted (highlightId) {
	const id = highlightId
	if (this.status.id === id) {
	const rect = this.$el.getBoundingClientRect()
	if (rect.top < 100) {
	// Post is above screen, match its top to screen top
	window.scrollBy(0, rect.top - 100)
	} else if (rect.height >= (window.innerHeight - 50)) {
	// Post we want to see is taller than screen so match its top to screen top
	window.scrollBy(0, rect.top - 100)
	} else if (rect.bottom > window.innerHeight - 50) {
	// Post is below screen, match its bottom to screen bottom
	window.scrollBy(0, rect.bottom - window.innerHeight + 50)
	}
	}
	}
	},
	watch: {
	highlight: function (id) {
	this.scrollIfHighlighted(id)
	},
	'status.repeat_num': function (num) {
	// refetch repeats when repeat_num is changed in any way
	if (this.isFocused && this.statusFromGlobalRepository.rebloggedBy && this.statusFromGlobalRepository.rebloggedBy.length !== num) {
	this.$store.dispatch('fetchRepeats', this.status.id)
	}
	},
	'status.fave_num': function (num) {
	// refetch favs when fave_num is changed in any way
	if (this.isFocused && this.statusFromGlobalRepository.favoritedBy && this.statusFromGlobalRepository.favoritedBy.length !== num) {
	this.$store.dispatch('fetchFavs', this.status.id)
	}
	},
	isSuspendable: function (val) {
	this.suspendable = val
	}
	}
	}

	export default Status
	diff --git a/src/components/status/status.scss b/src/components/status/status.scss
	index 448128675b..8ac6e1b496 100644
	--- a/src/components/status/status.scss
	+++ b/src/components/status/status.scss
	@@ -1,425 +1,428 @@
	@import "../../variables";

	.Status {
	min-width: 0;
	white-space: normal;
	word-wrap: break-word;
	word-break: break-word;

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

	&.-focused {
	background-color: $fallback--lightBg;
	background-color: var(--selectedPost, $fallback--lightBg);
	color: $fallback--text;
	color: var(--selectedPostText, $fallback--text);

	--lightText: var(--selectedPostLightText, $fallback--light);
	--faint: var(--selectedPostFaintText, $fallback--faint);
	--faintLink: var(--selectedPostFaintLink, $fallback--faint);
	--postLink: var(--selectedPostPostLink, $fallback--faint);
	--postFaintLink: var(--selectedPostFaintPostLink, $fallback--faint);
	--icon: var(--selectedPostIcon, $fallback--icon);
	}

	.gravestone {
	padding: var(--status-margin, $status-margin);
	color: $fallback--faint;
	color: var(--faint, $fallback--faint);
	display: flex;

	.deleted-text {
	margin: 0.5em 0;
	align-items: center;
	}
	}

	.status-container {
	display: flex;
	padding: var(--status-margin, $status-margin);

	> * {
	min-width: 0;
	}

	&.-repeat {
	padding-top: 0;
	}
	}

	.pin {
	padding: var(--status-margin, $status-margin) var(--status-margin, $status-margin) 0;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	}

	._misclick-prevention & {
	pointer-events: none;

	.attachments {
	pointer-events: initial;
	cursor: initial;
	}
	}

	.left-side {
	margin-right: var(--status-margin, $status-margin);
	}

	.right-side {
	flex: 1;
	min-width: 0;
	}

	.usercard {
	margin-bottom: var(--status-margin, $status-margin);
	}

	.status-username {
	white-space: nowrap;
	overflow: hidden;
	max-width: 85%;
	font-weight: bold;
	flex-shrink: 1;
	margin-right: 0.4em;
	text-overflow: ellipsis;

	--_still_image-label-scale: 0.25;
	--emoji-size: 14px;
	}

	.status-favicon {
	height: 18px;
	width: 18px;
	margin-right: 0.4em;
	}

	.status-heading {
	margin-bottom: 0.5em;
	}

	.heading-name-row {
	display: flex;
	justify-content: space-between;
	line-height: 1.3;

	a {
	display: inline-block;
	word-break: break-all;
	}
	}

	.account-name {
	min-width: 1.6em;
	margin-right: 0.4em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	flex: 1 1 0;
	}

	.heading-left {
	display: flex;
	min-width: 0;
	}

	.heading-right {
	display: flex;
	flex-shrink: 0;

	.button-unstyled {
	padding: 5px;
	margin: -5px;

	&:hover svg {
	color: $fallback--lightText;
	color: var(--lightText, $fallback--lightText);
	}
	}

	.svg-inline--fa {
	margin-left: 0.25em;
	}
	}

	.glued-label {
	display: inline-flex;
	white-space: nowrap;
	}

	.timeago {
	margin-right: 0.2em;
	}

	& .heading-reply-row,
	& .heading-edited-row {
	position: relative;
	align-content: baseline;
	font-size: 0.85em;
	margin-top: 0.2em;
	line-height: 130%;
	max-width: 100%;
	align-items: stretch;
	}

	& .reply-to-popover,
	& .reply-to-no-popover,
	& .mentions {
	min-width: 0;
	margin-right: 0.4em;
	flex-shrink: 0;
	}

	.reply-glued-label {
	margin-right: 0.5em;
	}

	.reply-to-popover {
	.reply-to:hover::before {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	width: 100%;
	border-bottom: 1px solid var(--faint);
	pointer-events: none;
	}

	.faint-link:hover {
	// override default
	text-decoration: none;
	}

	&.-strikethrough {
	.reply-to::after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	width: 100%;
	border-bottom: 1px solid var(--faint);
	pointer-events: none;
	}
	}
	}

	& .mentions,
	& .reply-to {
	white-space: nowrap;
	position: relative;
	}

	& .mentions-text,
	& .reply-to-text {
	color: var(--faint);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	}

	.mentions-line {
	display: inline;
	}

	.replies {
	margin-top: 0.25em;
	line-height: 1.3;
	font-size: 0.85em;
	display: flex;
	flex-wrap: wrap;

	& > * {
	margin-right: 0.4em;
	}
	}

	.reply-link {
	height: 17px;
	}

	.repeat-info {
	padding: 0.4em var(--status-margin, $status-margin);

	.repeat-icon {
	color: $fallback--cGreen;
	color: var(--cGreen, $fallback--cGreen);
	}
	}

	.repeater-avatar {
	border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);
	margin-left: 28px;
	width: 20px;
	height: 20px;
	}

	.repeater-name {
	text-overflow: ellipsis;
	margin-right: 0;

	.emoji {
	width: 14px;
	height: 14px;
	vertical-align: middle;
	object-fit: contain;
	}
	}

	.status-fadein {
	animation-duration: 0.4s;
	animation-name: fadein;
	}

	@keyframes fadein {
	from {
	opacity: 0;
	}

	to {
	opacity: 1;
	}
	}

	.status-actions {
	position: relative;
	width: 100%;
	display: flex;
	margin-top: var(--status-margin, $status-margin);

	> * {
	max-width: 4em;
	flex: 1;
	}
	}

	.muted {
	padding: 0.25em 0.6em;
	height: 1.2em;
	line-height: 1.2em;
	text-overflow: ellipsis;
	overflow: hidden;
	display: flex;
	flex-wrap: nowrap;

	& .status-username,
	& .mute-thread,
	- & .mute-words {
	+ & .mute-words,
	+ & .mute-regexes {
	word-wrap: normal;
	word-break: normal;
	white-space: nowrap;
	}

	& .status-username,
	- & .mute-words {
	+ & .mute-words,
	+ & .mute-regexes {
	text-overflow: ellipsis;
	overflow: hidden;
	}

	.status-username {
	font-weight: normal;
	flex: 0 1 auto;
	margin-right: 0.2em;
	font-size: smaller;
	}

	.mute-thread {
	flex: 0 0 auto;
	}

	- .mute-words {
	+ & .mute-words,
	+ & .mute-regexes {
	flex: 1 0 5em;
	margin-left: 0.2em;

	&::before {
	content: " ";
	}
	}

	.unmute {
	flex: 0 0 auto;
	margin-left: auto;
	display: block;
	}
	}

	.reply-form {
	padding-top: 0;
	padding-bottom: 0;
	}

	.reply-body {
	flex: 1;
	}

	.favs-repeated-users {
	margin-top: var(--status-margin, $status-margin);
	}

	.stats {
	width: 100%;
	display: flex;
	line-height: 1em;
	}

	.avatar-row {
	flex: 1;
	overflow: hidden;
	position: relative;
	display: flex;
	align-items: center;

	&::before {
	content: "";
	position: absolute;
	height: 100%;
	width: 1px;
	left: 0;
	background-color: var(--faint, $fallback--faint);
	}
	}

	.stat-count {
	margin-right: var(--status-margin, $status-margin);
	user-select: none;

	.stat-title {
	color: var(--faint, $fallback--faint);
	font-size: 0.85em;
	text-transform: uppercase;
	position: relative;
	}

	.stat-number {
	font-weight: bolder;
	font-size: 1.1em;
	line-height: 1em;
	}

	&:hover .stat-title {
	text-decoration: underline;
	}
	}

	@media all and (max-width: 800px) {
	.repeater-avatar {
	margin-left: 20px;
	}

	.post-avatar {
	width: 40px;
	height: 40px;

	// TODO define those other way somehow?
	// stylelint-disable rscss/class-format
	&.-compact {
	width: 32px;
	height: 32px;
	}
	}
	}
	}
	diff --git a/src/components/status/status.vue b/src/components/status/status.vue
	index 35b153627a..5cbfa75a10 100644
	--- a/src/components/status/status.vue
	+++ b/src/components/status/status.vue
	@@ -1,514 +1,520 @@
	<template>
	<div
	v-if="!hideStatus"
	ref="root"
	class="Status"
	:class="[{ '-focused': isFocused }, { '-conversation': inlineExpanded }]"
	>
	<div
	v-if="error"
	class="alert error"
	>
	{{ error }}
	<span
	class="fa-scale-110 fa-old-padding"
	@click="clearError"
	>
	<FAIcon icon="times" />
	</span>
	</div>
	<template v-if="muted && !isPreview">
	<div class="status-container muted">
	<small class="status-username">
	<FAIcon
	v-if="muted && retweet"
	class="fa-scale-110 fa-old-padding repeat-icon"
	icon="retweet"
	/>
	<user-link
	:user="status.user"
	:at="false"
	/>
	</small>
	<small
	v-if="showReasonMutedThread"
	class="mute-thread"
	>
	{{ $t('status.thread_muted') }}
	</small>
	<small
	v-if="showReasonMutedThread && muteWordHits.length > 0"
	class="mute-thread"
	>
	{{ $t('status.thread_muted_and_words') }}
	</small>
	<small
	class="mute-words"
	:title="muteWordHits.join(', ')"
	>
	{{ muteWordHits.join(', ') }}
	</small>
	+ <small
	+ class="mute-regexes"
	+ :title="muteRegexHits.join(', ')"
	+ >
	+ {{ muteRegexHits.join(', ') }}
	+ </small>
	<button
	class="unmute button-unstyled"
	@click.prevent="toggleMute"
	>
	<FAIcon
	icon="eye-slash"
	class="fa-scale-110 fa-old-padding"
	/>
	</button>
	</div>
	</template>
	<template v-else>
	<div
	v-if="showPinned"
	class="pin"
	>
	<FAIcon
	icon="thumbtack"
	class="faint"
	/>
	<span class="faint">{{ $t('status.pinned') }}</span>
	</div>
	<div
	v-if="retweet && !noHeading && !inConversation"
	:class="[repeaterClass, { highlighted: repeaterStyle }]"
	:style="[repeaterStyle]"
	class="status-container repeat-info"
	>
	<UserAvatar
	v-if="retweet"
	class="left-side repeater-avatar"
	:bot="rtBotIndicator"
	:better-shadow="betterShadow"
	:user="statusoid.user"
	/>
	<div class="right-side faint">
	<bdi
	class="status-username repeater-name"
	:title="retweeter"
	>
	<router-link
	v-if="retweeterHtml"
	:to="retweeterProfileLink"
	>
	<RichContent
	:html="retweeterHtml"
	:emoji="retweeterUser.emoji"
	/>
	</router-link>
	<router-link
	v-else
	:to="retweeterProfileLink"
	>{{ retweeter }}</router-link>
	</bdi>
	{{ ' ' }}
	<FAIcon
	icon="retweet"
	class="repeat-icon"
	:title="$t('tool_tip.repeat')"
	/>
	{{ $t('timeline.repeated') }}
	</div>
	</div>

	<div
	v-if="!deleted"
	:class="[userClass, { highlighted: userStyle, '-repeat': retweet && !inConversation }]"
	:style="[ userStyle ]"
	class="status-container"
	:data-tags="tags"
	>
	<div
	v-if="!noHeading"
	class="left-side"
	>
	<a
	:href="$router.resolve(userProfileLink).href"
	@click.prevent
	>
	<UserPopover
	:user-id="status.user.id"
	:overlay-centers="true"
	>
	<UserAvatar
	class="post-avatar"
	:bot="botIndicator"
	:compact="compact"
	:better-shadow="betterShadow"
	:user="status.user"
	/>
	</UserPopover>
	</a>
	</div>
	<div class="right-side">
	<div
	v-if="!noHeading"
	class="status-heading"
	>
	<div class="heading-name-row">
	<div class="heading-left">
	<h4
	v-if="status.user.name_html"
	class="status-username"
	:title="status.user.name"
	>
	<RichContent
	:html="status.user.name"
	:emoji="status.user.emoji"
	/>
	</h4>
	<h4
	v-else
	class="status-username"
	:title="status.user.name"
	>
	{{ status.user.name }}
	</h4>
	<user-link
	class="account-name"
	:title="status.user.screen_name_ui"
	:user="status.user"
	:at="false"
	/>
	<img
	v-if="!!(status.user && status.user.favicon)"
	class="status-favicon"
	:src="status.user.favicon"
	>
	</div>

	<span class="heading-right">
	<router-link
	class="timeago faint-link"
	:to="{ name: 'conversation', params: { id: status.id } }"
	>
	<Timeago
	:time="status.created_at"
	:auto-update="60"
	/>
	</router-link>
	<span
	v-if="status.visibility"
	class="visibility-icon"
	:title="visibilityLocalized"
	>
	<FAIcon
	fixed-width
	class="fa-scale-110"
	:icon="visibilityIcon(status.visibility)"
	/>
	</span>
	<button
	v-if="expandable && !isPreview"
	class="button-unstyled"
	:title="$t('status.expand')"
	@click.prevent="toggleExpanded"
	>
	<FAIcon
	fixed-width
	class="fa-scale-110"
	icon="plus-square"
	/>
	</button>
	<button
	v-if="unmuted"
	class="button-unstyled"
	@click.prevent="toggleMute"
	>
	<FAIcon
	fixed-width
	icon="eye-slash"
	class="fa-scale-110"
	/>
	</button>
	<button
	v-if="inThreadForest && replies && replies.length && !simpleTree"
	class="button-unstyled"
	:title="threadShowing ? $t('status.thread_hide') : $t('status.thread_show')"
	:aria-expanded="threadShowing ? 'true' : 'false'"
	@click.prevent="toggleThreadDisplay"
	>
	<FAIcon
	fixed-width
	class="fa-scale-110"
	:icon="threadShowing ? 'chevron-up' : 'chevron-down'"
	/>
	</button>
	<button
	v-if="dive && !simpleTree"
	class="button-unstyled"
	:title="$t('status.show_only_conversation_under_this')"
	@click.prevent="dive"
	>
	<FAIcon
	fixed-width
	class="fa-scale-110"
	:icon="'angle-double-right'"
	/>
	</button>
	</span>
	</div>
	<div
	v-if="isReply \|\| hasMentionsLine"
	class="heading-reply-row"
	>
	<span
	v-if="isReply"
	class="glued-label reply-glued-label"
	>
	<StatusPopover
	v-if="!isPreview"
	:status-id="status.parent_visible && status.in_reply_to_status_id"
	class="reply-to-popover"
	style="min-width: 0;"
	:class="{ '-strikethrough': !status.parent_visible }"
	>
	<button
	class="button-unstyled reply-to"
	:aria-label="$t('tool_tip.reply')"
	@click.prevent="gotoOriginal(status.in_reply_to_status_id)"
	>
	<FAIcon
	class="fa-scale-110 fa-old-padding"
	icon="reply"
	flip="horizontal"
	/>
	{{ ' ' }}
	<span
	class="reply-to-text"
	>
	{{ $t('status.reply_to') }}
	</span>
	</button>
	</StatusPopover>

	<span
	v-else
	class="reply-to-no-popover"
	>
	<span class="reply-to-text">{{ $t('status.reply_to') }}</span>
	</span>
	<MentionLink
	:content="replyToName"
	:url="replyProfileLink"
	:user-id="status.in_reply_to_user_id"
	:user-screen-name="status.in_reply_to_screen_name"
	/>
	</span>

	<!-- This little wrapper is made for sole purpose of "gluing" -->
	<!-- "Mentions" label to the first mention -->
	<span
	v-if="hasMentionsLine"
	class="glued-label"
	>
	<span
	class="mentions"
	:aria-label="$t('tool_tip.mentions')"
	@click.prevent="gotoOriginal(status.in_reply_to_status_id)"
	>
	<span
	class="mentions-text"
	>
	{{ $t('status.mentions') }}
	</span>
	</span>
	<MentionsLine
	v-if="hasMentionsLine"
	:mentions="mentionsLine.slice(0, 1)"
	class="mentions-line-first"
	/>
	</span>
	{{ ' ' }}
	<MentionsLine
	v-if="hasMentionsLine"
	:mentions="mentionsLine.slice(1)"
	class="mentions-line"
	/>
	</div>
	<div
	v-if="isEdited && editingAvailable && !isPreview"
	class="heading-edited-row"
	>
	<i18n-t
	keypath="status.edited_at"
	tag="span"
	>
	<template #time>
	<Timeago
	template-key="time.in_past"
	:time="status.edited_at"
	:auto-update="60"
	:long-format="true"
	/>
	</template>
	</i18n-t>
	</div>
	</div>

	<StatusContent
	ref="content"
	:status="status"
	:no-heading="noHeading"
	:highlight="highlight"
	:focused="isFocused"
	:controlled-showing-tall="controlledShowingTall"
	:controlled-expanding-subject="controlledExpandingSubject"
	:controlled-showing-long-subject="controlledShowingLongSubject"
	:controlled-toggle-showing-tall="controlledToggleShowingTall"
	:controlled-toggle-expanding-subject="controlledToggleExpandingSubject"
	:controlled-toggle-showing-long-subject="controlledToggleShowingLongSubject"
	@mediaplay="addMediaPlaying($event)"
	@mediapause="removeMediaPlaying($event)"
	@parseReady="setHeadTailLinks"
	/>

	<div
	v-if="inConversation && !isPreview && replies && replies.length"
	class="replies"
	>
	<button
	v-if="showOtherRepliesAsButton && replies.length > 1"
	class="button-unstyled -link faint"
	:title="$tc('status.ancestor_follow', replies.length - 1, { numReplies: replies.length - 1 })"
	@click.prevent="dive"
	>
	{{ $tc('status.replies_list_with_others', replies.length - 1, { numReplies: replies.length - 1 }) }}
	</button>
	<span
	v-else
	class="faint"
	>
	{{ $t('status.replies_list') }}
	</span>
	<StatusPopover
	v-for="reply in replies"
	:key="reply.id"
	:status-id="reply.id"
	>
	<button
	class="button-unstyled -link reply-link"
	@click.prevent="gotoOriginal(reply.id)"
	>
	{{ reply.name }}
	</button>
	</StatusPopover>
	</div>

	<transition name="fade">
	<div
	v-if="!hidePostStats && isFocused && combinedFavsAndRepeatsUsers.length > 0"
	class="favs-repeated-users"
	>
	<div class="stats">
	<UserListPopover
	v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0"
	:users="statusFromGlobalRepository.rebloggedBy"
	>
	<div class="stat-count">
	<a class="stat-title">{{ $t('status.repeats') }}</a>
	<div class="stat-number">
	{{ statusFromGlobalRepository.rebloggedBy.length }}
	</div>
	</div>
	</UserListPopover>
	<UserListPopover
	v-if="statusFromGlobalRepository.favoritedBy && statusFromGlobalRepository.favoritedBy.length > 0"
	:users="statusFromGlobalRepository.favoritedBy"
	>
	<div
	class="stat-count"
	>
	<a class="stat-title">{{ $t('status.favorites') }}</a>
	<div class="stat-number">
	{{ statusFromGlobalRepository.favoritedBy.length }}
	</div>
	</div>
	</UserListPopover>
	<div class="avatar-row">
	<AvatarList :users="combinedFavsAndRepeatsUsers" />
	</div>
	</div>
	</div>
	</transition>

	<EmojiReactions
	v-if="(mergedConfig.emojiReactionsOnTimeline \|\| isFocused) && (!noHeading && !isPreview)"
	:status="status"
	/>

	<div
	v-if="!noHeading && !isPreview"
	class="status-actions"
	>
	<reply-button
	:replying="replying"
	:status="status"
	@toggle="toggleReplying"
	/>
	<retweet-button
	:visibility="status.visibility"
	:logged-in="loggedIn"
	:status="status"
	/>
	<favorite-button
	:logged-in="loggedIn"
	:status="status"
	/>
	<ReactButton
	v-if="loggedIn"
	:status="status"
	/>
	<extra-buttons
	:status="status"
	@onError="showError"
	@onSuccess="clearError"
	/>
	</div>
	</div>
	</div>
	<div
	v-else
	class="gravestone"
	>
	<div class="left-side">
	<UserAvatar
	class="post-avatar"
	:compact="compact"
	:bot="botIndicator"
	/>
	</div>
	<div class="right-side">
	<div class="deleted-text">
	{{ $t('status.status_deleted') }}
	</div>
	<reply-button
	v-if="replying"
	:replying="replying"
	:status="status"
	@toggle="toggleReplying"
	/>
	</div>
	</div>
	<div
	v-if="replying"
	class="status-container reply-form"
	>
	<PostStatusForm
	class="reply-body"
	:reply-to="status.id"
	:attentions="status.attentions"
	:replied-user="status.user"
	:copy-message-scope="status.visibility"
	:subject="replySubject"
	@posted="toggleReplying"
	/>
	</div>
	</template>
	</div>
	</template>

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

	<style src="./status.scss" lang="scss"></style>
	diff --git a/src/services/status_parser/status_parser.js b/src/services/status_parser/status_parser.js
	index c94ce3b42a..670c90f475 100644
	--- a/src/services/status_parser/status_parser.js
	+++ b/src/services/status_parser/status_parser.js
	@@ -1,22 +1,21 @@
	import { filter } from 'lodash'

	export const muteWordHits = (status, muteWords) => {
	const statusText = status.text.toLowerCase()
	const statusSummary = status.summary.toLowerCase()
	const hits = filter(muteWords, (muteWord) => {
	return statusText.includes(muteWord.toLowerCase()) \|\| statusSummary.includes(muteWord.toLowerCase())
	})

	return hits
	}

	export const muteRegexHits = (status, muteRegexes) => {
	const statusText = status.text
	const statusSummary = status.summary
	-
	const hits = filter(muteRegexes, (muteRegex) => {
	return statusText.match(new RegExp(muteRegex)) \|\| statusSummary.match(new RegExp(muteRegex))
	})

	return hits
	}

File Metadata

Mime Type: text/x-diff
Expires: Sun, Nov 1, 3:14 PM (11 h, 12 m)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 1803130
Default Alt Text: (51 KB)

No OneTemporaryActions

View Options

File Metadata

Event Timeline

No OneTemporary
Actions