No OneTemporary
Actions

Authored By

Unknown

Size

34 KB

Referenced Files

None

Subscribers

None

View Options

	diff --git a/src/components/status/status.js b/src/components/status/status.js
	index 44a6d5c505..105a736b41 100644
	--- a/src/components/status/status.js
	+++ b/src/components/status/status.js
	@@ -1,321 +1,303 @@
	import Attachment from '../attachment/attachment.vue'
	import FavoriteButton from '../favorite_button/favorite_button.vue'
	import RetweetButton from '../retweet_button/retweet_button.vue'
	import DeleteButton from '../delete_button/delete_button.vue'
	import PostStatusForm from '../post_status_form/post_status_form.vue'
	import UserCardContent from '../user_card_content/user_card_content.vue'
	import StillImage from '../still-image/still-image.vue'
	import { filter, find } from 'lodash'
	import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
	import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'

	const Status = {
	name: 'Status',
	props: [
	'statusoid',
	'expandable',
	'inConversation',
	'focused',
	'highlight',
	'compact',
	'replies',
	'noReplyLinks',
	'noHeading',
	'inlineExpanded'
	],
	data () {
	return {
	replying: false,
	expanded: false,
	unmuted: false,
	userExpanded: false,
	preview: null,
	showPreview: false,
	showingTall: false,
	expandingSubject: typeof this.$store.state.config.collapseMessageWithSubject === 'undefined'
	? !this.$store.state.instance.collapseMessageWithSubject
	: !this.$store.state.config.collapseMessageWithSubject,
	betterShadow: this.$store.state.interface.browserSupport.cssFilter
	}
	},
	computed: {
	localCollapseSubjectDefault () {
	return typeof this.$store.state.config.collapseMessageWithSubject === 'undefined'
	? this.$store.state.instance.collapseMessageWithSubject
	: this.$store.state.config.collapseMessageWithSubject
	},
	muteWords () {
	return this.$store.state.config.muteWords
	},
	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.$store.state.config.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.$store.state.config.highlight
	return highlightStyle(highlight[user.screen_name])
	},
	hideAttachments () {
	return (this.$store.state.config.hideAttachments && !this.inConversation) \|\|
	(this.$store.state.config.hideAttachmentsInConv && this.inConversation)
	},
	- userProfileLink () {
	- return this.generateUserProfileLink(this.status.user.id, this.status.user.screen_name)
	- },
	- replyProfileLink () {
	- if (this.isReply) {
	- return this.generateUserProfileLink(this.status.in_reply_to_status_id, this.replyToName)
	- } else {
	- return ''
	- }
	- },
	retweet () { return !!this.statusoid.retweeted_status },
	retweeter () { return this.statusoid.user.name },
	retweeterHtml () { return this.statusoid.user.name_html },
	status () {
	if (this.retweet) {
	return this.statusoid.retweeted_status
	} else {
	return this.statusoid
	}
	},
	loggedIn () {
	return !!this.$store.state.users.currentUser
	},
	muteWordHits () {
	const statusText = this.status.text.toLowerCase()
	const hits = filter(this.muteWords, (muteWord) => {
	return statusText.includes(muteWord.toLowerCase())
	})

	return hits
	},
	muted () { return !this.unmuted && (this.status.user.muted \|\| this.muteWordHits.length > 0) },
	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
	},
	// This is a bit hacky, but we want to approximate post height before rendering
	// so we count newlines (masto uses <p> for paragraphs, GS uses <br> between them)
	// as well as approximate line count by counting characters and approximating ~80
	// per line.
	//
	// Using max-height + overflow: auto for status components resulted in false positives
	// very often with japanese characters, and it was very annoying.
	tallStatus () {
	const lengthScore = this.status.statusnet_html.split(/<p\|<br/).length + this.status.text.length / 80
	return lengthScore > 20
	},
	isReply () {
	return !!this.status.in_reply_to_status_id
	},
	- replyToName () {
	- const user = this.$store.state.users.usersObject[this.status.in_reply_to_user_id]
	- if (user) {
	- return user.screen_name
	- } else {
	- return this.status.in_reply_to_screen_name \|\| ''
	- }
	- },
	hideReply () {
	if (this.$store.state.config.replyVisibility === 'all') {
	return false
	}
	if (this.inlineExpanded \|\| this.expanded \|\| this.inConversation \|\| !this.isReply) {
	return false
	}
	if (this.status.user.id === this.$store.state.users.currentUser.id) {
	return false
	}
	if (this.status.type === 'retweet') {
	return false
	}
	var checkFollowing = this.$store.state.config.replyVisibility === 'following'
	for (var i = 0; i < this.status.attentions.length; ++i) {
	if (this.status.user.id === this.status.attentions[i].id) {
	continue
	}
	if (checkFollowing && this.status.attentions[i].following) {
	return false
	}
	if (this.status.attentions[i].id === this.$store.state.users.currentUser.id) {
	return false
	}
	}
	return this.status.attentions.length > 0
	},
	hideSubjectStatus () {
	if (this.tallStatus && !this.localCollapseSubjectDefault) {
	return false
	}
	return !this.expandingSubject && this.status.summary
	},
	hideTallStatus () {
	if (this.status.summary && this.localCollapseSubjectDefault) {
	return false
	}
	if (this.showingTall) {
	return false
	}
	return this.tallStatus
	},
	showingMore () {
	return this.showingTall \|\| (this.status.summary && this.expandingSubject)
	},
	nsfwClickthrough () {
	if (!this.status.nsfw) {
	return false
	}
	if (this.status.summary && this.localCollapseSubjectDefault) {
	return false
	}
	return true
	},
	replySubject () {
	if (!this.status.summary) return ''
	const behavior = typeof this.$store.state.config.subjectLineBehavior === 'undefined'
	? this.$store.state.instance.subjectLineBehavior
	: this.$store.state.config.subjectLineBehavior
	const startsWithRe = this.status.summary.match(/^re[: ]/i)
	if (behavior !== 'noop' && startsWithRe \|\| behavior === 'masto') {
	return this.status.summary
	} else if (behavior === 'email') {
	return 're: '.concat(this.status.summary)
	} else if (behavior === 'noop') {
	return ''
	}
	},
	attachmentSize () {
	if ((this.$store.state.config.hideAttachments && !this.inConversation) \|\|
	(this.$store.state.config.hideAttachmentsInConv && this.inConversation)) {
	return 'hide'
	} else if (this.compact) {
	return 'small'
	}
	return 'normal'
	}
	},
	components: {
	Attachment,
	FavoriteButton,
	RetweetButton,
	DeleteButton,
	PostStatusForm,
	UserCardContent,
	StillImage
	},
	methods: {
	visibilityIcon (visibility) {
	switch (visibility) {
	case 'private':
	return 'icon-lock'
	case 'unlisted':
	return 'icon-lock-open-alt'
	case 'direct':
	return 'icon-mail-alt'
	default:
	return 'icon-globe'
	}
	},
	linkClicked ({target}) {
	if (target.tagName === 'SPAN') {
	target = target.parentNode
	}
	if (target.tagName === 'A') {
	window.open(target.href, '_blank')
	}
	},
	toggleReplying () {
	this.replying = !this.replying
	},
	gotoOriginal (id) {
	// only handled by conversation, not status_or_conversation
	if (this.inConversation) {
	this.$emit('goto', id)
	}
	},
	toggleExpanded () {
	this.$emit('toggleExpanded')
	},
	toggleMute () {
	this.unmuted = !this.unmuted
	},
	toggleUserExpanded () {
	this.userExpanded = !this.userExpanded
	},
	toggleShowMore () {
	if (this.showingTall) {
	this.showingTall = false
	} else if (this.expandingSubject) {
	this.expandingSubject = false
	} else if (this.hideTallStatus) {
	this.showingTall = true
	} else if (this.hideSubjectStatus) {
	this.expandingSubject = true
	}
	},
	replyEnter (id, event) {
	this.showPreview = true
	const targetId = id
	const statuses = this.$store.state.statuses.allStatuses

	if (!this.preview) {
	// if we have the status somewhere already
	this.preview = find(statuses, { 'id': targetId })
	// or if we have to fetch it
	if (!this.preview) {
	this.$store.state.api.backendInteractor.fetchStatus({id}).then((status) => {
	this.preview = status
	})
	}
	} else if (this.preview.id !== targetId) {
	this.preview = find(statuses, { 'id': targetId })
	}
	},
	replyLeave () {
	this.showPreview = false
	},
	- generateUserProfileLink (id, name) {
	+ userProfileLink (id, name) {
	return generateProfileLink(id, name, this.$store.state.instance.restrictedNicknames)
	}
	},
	watch: {
	'highlight': function (id) {
	if (this.status.id === id) {
	let rect = this.$el.getBoundingClientRect()
	if (rect.top < 100) {
	window.scrollBy(0, rect.top - 200)
	} else if (rect.bottom > window.innerHeight - 50) {
	window.scrollBy(0, rect.bottom - window.innerHeight + 50)
	}
	}
	}
	},
	filters: {
	capitalize: function (str) {
	return str.charAt(0).toUpperCase() + str.slice(1)
	}
	}
	}

	export default Status
	diff --git a/src/components/status/status.vue b/src/components/status/status.vue
	index 5c956467e2..4a1aef8fc4 100644
	--- a/src/components/status/status.vue
	+++ b/src/components/status/status.vue
	@@ -1,587 +1,587 @@
	<template>
	<div class="status-el" v-if="!hideReply && !deleted" :class="[{ 'status-el_focused': isFocused }, { 'status-conversation': inlineExpanded }]">
	<template v-if="muted && !noReplyLinks">
	<div class="media status container muted">
	<small>
	- <router-link :to="userProfileLink">
	+ <router-link :to="userProfileLink(status.user.id, status.user.screen_name)">
	{{status.user.screen_name}}
	</router-link>
	</small>
	<small class="muteWords">{{muteWordHits.join(', ')}}</small>
	<a href="#" class="unmute" @click.prevent="toggleMute"><i class="button-icon icon-eye-off"></i></a>
	</div>
	</template>
	<template v-else>
	<div v-if="retweet && !noHeading" :class="[repeaterClass, { highlighted: repeaterStyle }]" :style="[repeaterStyle]" class="media container retweet-info">
	<StillImage v-if="retweet" class='avatar' :class='{ "better-shadow": betterShadow }' :src="statusoid.user.profile_image_url_original"/>
	<div class="media-body faint">
	<a v-if="retweeterHtml" :href="statusoid.user.statusnet_profile_url" class="user-name" :title="'@'+statusoid.user.screen_name" v-html="retweeterHtml"></a>
	<a v-else :href="statusoid.user.statusnet_profile_url" class="user-name" :title="'@'+statusoid.user.screen_name">{{retweeter}}</a>
	<i class='fa icon-retweet retweeted' :title="$t('tool_tip.repeat')"></i>
	{{$t('timeline.repeated')}}
	</div>
	</div>

	<div :class="[userClass, { highlighted: userStyle, 'is-retweet': retweet }]" :style="[ userStyle ]" class="media status">
	<div v-if="!noHeading" class="media-left">
	<a :href="status.user.statusnet_profile_url" @click.stop.prevent.capture="toggleUserExpanded">
	<StillImage class='avatar' :class="{'avatar-compact': compact, 'better-shadow': betterShadow}" :src="status.user.profile_image_url_original"/>
	</a>
	</div>
	<div class="status-body">
	<div class="usercard media-body" v-if="userExpanded">
	<user-card-content :user="status.user" :switcher="false"></user-card-content>
	</div>
	<div v-if="!noHeading" class="media-body container media-heading">
	<div class="media-heading-left">
	<div class="name-and-links">
	<h4 class="user-name" v-if="status.user.name_html" v-html="status.user.name_html"></h4>
	<h4 class="user-name" v-else>{{status.user.name}}</h4>
	<span class="links">
	- <router-link :to="userProfileLink">
	+ <router-link :to="userProfileLink(status.user.id, status.user.screen_name)">
	{{status.user.screen_name}}
	</router-link>
	- <span v-if="isReply" class="faint reply-info">
	+ <span v-if="status.in_reply_to_screen_name" class="faint reply-info">
	<i class="icon-right-open"></i>
	- <router-link :to="replyProfileLink">
	- {{replyToName}}
	+ <router-link :to="userProfileLink(status.in_reply_to_user_id, status.in_reply_to_screen_name)">
	+ {{status.in_reply_to_screen_name}}
	</router-link>
	</span>
	- <a v-if="isReply && !noReplyLinks" href="#" @click.prevent="gotoOriginal(status.in_reply_to_status_id)" :aria-label="$t('tool_tip.reply')">
	+ <a v-if="isReply && !noReplyLinks" href="#" @click.prevent="gotoOriginal(status.in_reply_to_status_id)" :title="$t('tool_tip.reply')">
	<i class="button-icon icon-reply" @mouseenter="replyEnter(status.in_reply_to_status_id, $event)" @mouseout="replyLeave()"></i>
	</a>
	</span>
	</div>
	<h4 class="replies" v-if="inConversation && !noReplyLinks">
	<small v-if="replies.length">Replies:</small>
	<small class="reply-link" v-for="reply in replies">
	<a href="#" @click.prevent="gotoOriginal(reply.id)" @mouseenter="replyEnter(reply.id, $event)" @mouseout="replyLeave()">{{reply.name}} </a>
	</small>
	</h4>
	</div>
	<div class="media-heading-right">
	<router-link class="timeago" :to="{ name: 'conversation', params: { id: status.id } }">
	<timeago :since="status.created_at" :auto-update="60"></timeago>
	</router-link>
	<div class="button-icon visibility-icon" v-if="status.visibility">
	<i :class="visibilityIcon(status.visibility)" :title="status.visibility \| capitalize"></i>
	</div>
	<a :href="status.external_url" target="_blank" v-if="!status.is_local" class="source_url" title="Source">
	<i class="button-icon icon-link-ext-alt"></i>
	</a>
	<template v-if="expandable">
	<a href="#" @click.prevent="toggleExpanded" title="Expand">
	<i class="button-icon icon-plus-squared"></i>
	</a>
	</template>
	<a href="#" @click.prevent="toggleMute" v-if="unmuted"><i class="button-icon icon-eye-off"></i></a>
	</div>
	</div>

	<div v-if="showPreview" class="status-preview-container">
	<status class="status-preview" v-if="preview" :noReplyLinks="true" :statusoid="preview" :compact=true></status>
	<div class="status-preview status-preview-loading" v-else>
	<i class="icon-spin4 animate-spin"></i>
	</div>
	</div>

	<div :class="{'tall-status': hideTallStatus}" class="status-content-wrapper">
	<a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="hideTallStatus" href="#" @click.prevent="toggleShowMore">Show more</a>
	<div @click.prevent="linkClicked" class="status-content media-body" v-html="status.statusnet_html" v-if="!hideSubjectStatus"></div>
	<div @click.prevent="linkClicked" class="status-content media-body" v-html="status.summary_html" v-else></div>
	<a v-if="hideSubjectStatus" href="#" class="cw-status-hider" @click.prevent="toggleShowMore">Show more</a>
	<a v-if="showingMore" href="#" class="status-unhider" @click.prevent="toggleShowMore">Show less</a>
	</div>

	<div v-if='status.attachments && !hideSubjectStatus' class='attachments media-body'>
	<attachment :size="attachmentSize" :status-id="status.id" :nsfw="nsfwClickthrough" :attachment="attachment" v-for="attachment in status.attachments" :key="attachment.id">
	</attachment>
	</div>

	<div v-if="!noHeading && !noReplyLinks" class='status-actions media-body'>
	<div v-if="loggedIn">
	<a href="#" v-on:click.prevent="toggleReplying" :title="$t('tool_tip.reply')">
	<i class="button-icon icon-reply" :class="{'icon-reply-active': replying}"></i>
	</a>
	</div>
	<retweet-button :visibility='status.visibility' :loggedIn='loggedIn' :status='status'></retweet-button>
	<favorite-button :loggedIn='loggedIn' :status='status'></favorite-button>
	<delete-button :status='status'></delete-button>
	</div>
	</div>
	</div>
	<div class="container" v-if="replying">
	<div class="reply-left"/>
	<post-status-form class="reply-body" :reply-to="status.id" :attentions="status.attentions" :repliedUser="status.user" :copy-message-scope="status.visibility" :subject="replySubject" v-on:posted="toggleReplying"/>
	</div>
	</template>
	</div>
	</template>

	<script src="./status.js" ></script>
	<style lang="scss">
	@import '../../_variables.scss';

	.status-body {
	flex: 1;
	min-width: 0;
	}

	.status-preview.status-el {
	border-style: solid;
	border-width: 1px;
	border-color: $fallback--border;
	border-color: var(--border, $fallback--border);
	}

	.status-preview-container {
	position: relative;
	max-width: 100%;
	}

	.status-preview {
	position: absolute;
	max-width: 95%;
	display: flex;
	background-color: $fallback--bg;
	background-color: var(--bg, $fallback--bg);
	border-color: $fallback--border;
	border-color: var(--border, $fallback--border);
	border-style: solid;
	border-width: 1px;
	border-radius: $fallback--tooltipRadius;
	border-radius: var(--tooltipRadius, $fallback--tooltipRadius);
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
	box-shadow: var(--popupShadow);
	margin-top: 0.25em;
	margin-left: 0.5em;
	z-index: 50;

	.status {
	flex: 1;
	border: 0;
	min-width: 15em;
	}
	}

	.status-preview-loading {
	display: block;
	min-width: 15em;
	padding: 1em;
	text-align: center;
	border-width: 1px;
	border-style: solid;

	i {
	font-size: 2em;
	}
	}

	.status-el {
	hyphens: auto;
	overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: break-word;
	border-left-width: 0px;
	line-height: 18px;
	min-width: 0;
	border-color: $fallback--border;
	border-color: var(--border, $fallback--border);

	border-left: 4px $fallback--cRed;
	border-left: 4px var(--cRed, $fallback--cRed);

	&_focused {
	background-color: $fallback--lightBg;
	background-color: var(--lightBg, $fallback--lightBg);
	}

	.timeline & {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	}

	.media-body {
	flex: 1;
	padding: 0;
	margin: 0 0 0.25em 0.8em;
	}

	.usercard {
	margin-bottom: .7em
	}

	.media-heading {
	flex-wrap: nowrap;
	line-height: 18px;
	}

	.media-heading-left {
	padding: 0;
	vertical-align: bottom;
	flex-basis: 100%;

	small {
	font-weight: lighter;
	}
	h4 {
	white-space: nowrap;
	font-size: 14px;
	margin-right: 0.25em;
	overflow: hidden;
	text-overflow: ellipsis;
	}
	.name-and-links {
	padding: 0;
	flex: 1 0;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;

	.user-name {
	margin-right: .45em;

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

	.links {
	display: flex;
	font-size: 12px;
	color: $fallback--link;
	color: var(--link, $fallback--link);
	max-width: 100%;
	a {
	max-width: 100%;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	}
	}
	.reply-info {
	display: flex;
	}
	.replies {
	line-height: 16px;
	}
	.reply-link {
	margin-right: 0.2em;
	}
	}

	.media-heading-right {
	display: inline-flex;
	flex-shrink: 0;
	flex-wrap: nowrap;
	margin-left: .25em;
	align-self: baseline;

	.timeago {
	margin-right: 0.2em;
	font-size: 12px;
	align-self: last baseline;
	}

	> * {
	margin-left: 0.2em;
	}
	a:hover i {
	color: $fallback--text;
	color: var(--text, $fallback--text);
	}
	}

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

	.tall-status {
	position: relative;
	height: 220px;
	overflow-x: hidden;
	overflow-y: hidden;
	}

	.tall-status-hider {
	position: absolute;
	height: 70px;
	margin-top: 150px;
	width: 100%;
	text-align: center;
	line-height: 110px;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0), $fallback--bg 80%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0), var(--bg, $fallback--bg) 80%);
	&_focused {
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0), $fallback--lightBg 80%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0), var(--lightBg, $fallback--lightBg) 80%);
	}
	}

	.status-unhider, .cw-status-hider {
	width: 100%;
	text-align: center;
	}

	.status-content {
	margin-right: 0.5em;
	font-family: var(--postFont, sans-serif);

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

	blockquote {
	margin: 0.2em 0 0.2em 2em;
	font-style: italic;
	}

	pre {
	overflow: auto;
	}

	code, samp, kbd, var, pre {
	font-family: var(--postCodeFont, monospace);
	}

	p {
	margin: 0;
	margin-top: 0.2em;
	margin-bottom: 0.5em;
	}

	h1 {
	font-size: 1.1em;
	line-height: 1.2em;
	margin: 1.4em 0;
	}

	h2 {
	font-size: 1.1em;
	margin: 1.0em 0;
	}

	h3 {
	font-size: 1em;
	margin: 1.2em 0;
	}

	h4 {
	margin: 1.1em 0;
	}
	}

	.retweet-info {
	padding: 0.4em 0.6em 0 0.6em;
	margin: 0;

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

	.media-body {
	font-size: 1em;
	line-height: 22px;

	display: flex;
	align-content: center;
	flex-wrap: wrap;

	.user-name {
	font-weight: bold;

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

	i {
	padding: 0 0.2em;
	}

	a {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	}
	}
	}
	}

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

	@keyframes fadein {
	from {
	opacity: 0;
	}
	to {
	opacity: 1;
	}
	}

	.greentext {
	color: green;
	}

	.status-conversation {
	border-left-style: solid;
	}

	.status-actions {
	width: 100%;
	display: flex;

	div, favorite-button {
	padding-top: 0.25em;
	max-width: 6em;
	flex: 1;
	}
	}

	.icon-reply:hover {
	color: $fallback--cBlue;
	color: var(--cBlue, $fallback--cBlue);
	}

	.icon-reply.icon-reply-active {
	color: $fallback--cBlue;
	color: var(--cBlue, $fallback--cBlue);
	}

	.status .avatar-compact {
	width: 32px;
	height: 32px;
	box-shadow: var(--avatarStatusShadow);
	border-radius: $fallback--avatarAltRadius;
	border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);

	&.better-shadow {
	box-shadow: var(--avatarStatusShadowInset);
	filter: var(--avatarStatusShadowFilter)
	}
	}

	.avatar.still-image {
	width: 48px;
	height: 48px;
	box-shadow: var(--avatarStatusShadow);
	border-radius: $fallback--avatarRadius;
	border-radius: var(--avatarRadius, $fallback--avatarRadius);
	overflow: hidden;
	position: relative;

	&.better-shadow {
	box-shadow: var(--avatarStatusShadowInset);
	filter: var(--avatarStatusShadowFilter)
	}

	img {
	width: 100%;
	height: 100%;
	}

	&.animated::before {
	display: none;
	}

	&.retweeted {
	}
	}

	.status:hover .animated.avatar {
	canvas {
	display: none;
	}
	img {
	visibility: visible;
	}
	}

	.status {
	display: flex;
	padding: 0.6em;
	&.is-retweet {
	padding-top: 0.1em;
	}
	}

	.status-conversation:last-child {
	border-bottom: none;
	}

	.muted {
	padding: 0.25em 0.5em;
	button {
	margin-left: auto;
	}

	.muteWords {
	margin-left: 10px;
	}
	}

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

	.reply-left {
	flex: 0;
	min-width: 48px;
	}

	.reply-body {
	flex: 1;
	}

	.timeline > {
	.status-el:last-child {
	border-bottom-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;;
	border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
	border-bottom: none;
	}
	}

	@media all and (max-width: 960px) {
	.status-el {
	.retweet-info {
	.avatar {
	margin-left: 20px;
	}
	}
	}
	.status {
	max-width: 100%;
	}

	.status .avatar {
	width: 40px;
	height: 40px;
	}

	.status .avatar-compact {
	width: 32px;
	height: 32px;
	}
	}

	</style>
	diff --git a/src/services/entity_normalizer/entity_normalizer.service.js b/src/services/entity_normalizer/entity_normalizer.service.js
	index abbc8ddf6f..6fc6d15242 100644
	--- a/src/services/entity_normalizer/entity_normalizer.service.js
	+++ b/src/services/entity_normalizer/entity_normalizer.service.js
	@@ -1,271 +1,263 @@
	const qvitterStatusType = (status) => {
	if (status.is_post_verb) {
	return 'status'
	}

	if (status.retweeted_status) {
	return 'retweet'
	}

	if ((typeof status.uri === 'string' && status.uri.match(/(fave\|objectType=Favourite)/)) \|\|
	(typeof status.text === 'string' && status.text.match(/favorited/))) {
	return 'favorite'
	}

	if (status.text.match(/deleted notice {{tag/) \|\| status.qvitter_delete_notice) {
	return 'deletion'
	}

	if (status.text.match(/started following/) \|\| status.activity_type === 'follow') {
	return 'follow'
	}

	return 'unknown'
	}

	export const parseUser = (data) => {
	const output = {}
	const masto = data.hasOwnProperty('acct')
	// case for users in "mentions" property for statuses in MastoAPI
	const mastoShort = masto && !data.hasOwnProperty('avatar')

	output.id = String(data.id)

	if (masto) {
	output.screen_name = data.acct

	// There's nothing else to get
	if (mastoShort) {
	return output
	}

	output.name = null // missing
	output.name_html = data.display_name

	output.description = null // missing
	output.description_html = data.note

	// Utilize avatar_static for gif avatars?
	output.profile_image_url = data.avatar
	output.profile_image_url_original = data.avatar

	// Same, utilize header_static?
	output.cover_photo = data.header

	output.friends_count = data.following_count

	output.bot = data.bot

	output.statusnet_profile_url = data.url

	if (data.pleroma) {
	const pleroma = data.pleroma
	output.follows_you = pleroma.follows_you
	output.statusnet_blocking = pleroma.statusnet_blocking
	output.muted = pleroma.muted
	}

	// Missing, trying to recover
	output.is_local = !output.screen_name.includes('@')
	} else {
	output.screen_name = data.screen_name

	output.name = data.name
	output.name_html = data.name_html

	output.description = data.description
	output.description_html = data.description_html

	output.profile_image_url = data.profile_image_url
	output.profile_image_url_original = data.profile_image_url_original

	output.cover_photo = data.cover_photo

	output.friends_count = data.friends_count

	output.bot = null // missing

	output.statusnet_profile_url = data.statusnet_profile_url

	output.statusnet_blocking = data.statusnet_blocking

	output.is_local = data.is_local

	output.follows_you = data.follows_you

	output.muted = data.muted

	// QVITTER ONLY FOR NOW
	// Really only applies to logged in user, really.. I THINK
	output.rights = data.rights
	output.no_rich_text = data.no_rich_text
	output.default_scope = data.default_scope
	output.hide_network = data.hide_network
	output.background_image = data.background_image
	}

	output.created_at = new Date(data.created_at)
	output.locked = data.locked
	output.followers_count = data.followers_count
	output.statuses_count = data.statuses_count

	return output
	}

	const parseAttachment = (data) => {
	const output = {}
	const masto = !data.hasOwnProperty('oembed')

	if (masto) {
	// Not exactly same...
	output.mimetype = data.type
	output.meta = data.meta // not present in BE yet
	} else {
	output.mimetype = data.mimetype
	output.meta = null // missing
	}

	output.url = data.url
	output.description = data.description

	return output
	}

	export const parseStatus = (data) => {
	const output = {}
	const masto = data.hasOwnProperty('account')

	if (masto) {
	output.favorited = data.favourited
	output.fave_num = data.favourites_count

	output.repeated = data.reblogged
	output.repeat_num = data.reblogs_count

	output.type = data.reblog ? 'retweet' : 'status'
	output.nsfw = data.sensitive

	output.statusnet_html = data.content

	// Not exactly the same but works?
	output.text = data.content

	output.in_reply_to_status_id = data.in_reply_to_id
	output.in_reply_to_user_id = data.in_reply_to_account_id

	// Missing!! fix in UI?
	output.in_reply_to_screen_name = null

	// Not exactly the same but works
	output.statusnet_conversation_id = data.id

	if (output.type === 'retweet') {
	output.retweeted_status = parseStatus(data.reblog)
	}

	output.summary = data.spoiler_text
	output.external_url = data.url

	// FIXME missing!!
	output.is_local = false
	} else {
	output.favorited = data.favorited
	output.fave_num = data.fave_num

	output.repeated = data.repeated
	output.repeat_num = data.repeat_num

	// catchall, temporary
	// Object.assign(output, data)

	output.type = qvitterStatusType(data)

	if (data.nsfw === undefined) {
	output.nsfw = isNsfw(data)
	if (data.retweeted_status) {
	output.nsfw = data.retweeted_status.nsfw
	}
	} else {
	output.nsfw = data.nsfw
	}

	output.statusnet_html = data.statusnet_html
	output.text = data.text

	output.in_reply_to_status_id = data.in_reply_to_status_id
	output.in_reply_to_user_id = data.in_reply_to_user_id
	output.in_reply_to_screen_name = data.in_reply_to_screen_name

	output.statusnet_conversation_id = data.statusnet_conversation_id

	if (output.type === 'retweet') {
	output.retweeted_status = parseStatus(data.retweeted_status)
	}

	output.summary = data.summary
	output.external_url = data.external_url
	output.is_local = data.is_local
	}

	output.id = String(data.id)
	output.visibility = data.visibility
	output.created_at = new Date(data.created_at)

	- // Converting to string, the right way.
	- output.in_reply_to_status_id = output.in_reply_to_status_id
	- ? String(output.in_reply_to_status_id)
	- : null
	- output.in_reply_to_user_id = output.in_reply_to_user_id
	- ? String(output.in_reply_to_user_id)
	- : null
	-
	output.user = parseUser(masto ? data.account : data.user)

	output.attentions = ((masto ? data.mentions : data.attentions) \|\| []).map(parseUser)

	output.attachments = ((masto ? data.media_attachments : data.attachments) \|\| [])
	.map(parseAttachment)

	const retweetedStatus = masto ? data.reblog : data.retweeted_status
	if (retweetedStatus) {
	output.retweeted_status = parseStatus(retweetedStatus)
	}

	return output
	}

	export const parseNotification = (data) => {
	const mastoDict = {
	'favourite': 'like',
	'reblog': 'repeat'
	}
	const masto = !data.hasOwnProperty('ntype')
	const output = {}

	if (masto) {
	output.type = mastoDict[data.type] \|\| data.type
	output.seen = null // missing
	output.status = parseStatus(data.status)
	output.action = output.status // not sure
	output.from_profile = parseUser(data.account)
	} else {
	const parsedNotice = parseStatus(data.notice)
	output.type = data.ntype
	output.seen = Boolean(data.is_seen)
	output.status = output.type === 'like'
	? parseStatus(data.notice.favorited_status)
	: parsedNotice
	output.action = parsedNotice
	output.from_profile = parseUser(data.from_profile)
	}

	output.created_at = new Date(data.created_at)
	output.id = String(data.id)

	return output
	}

	const isNsfw = (status) => {
	const nsfwRegex = /#nsfw/i
	return (status.tags \|\| []).includes('nsfw') \|\| !!status.text.match(nsfwRegex)
	}

File Metadata

Mime Type: text/x-diff
Expires: Sat, Oct 31, 5:20 PM (19 h, 57 m)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 1801615
Default Alt Text: (34 KB)

No OneTemporaryActions

View Options

File Metadata

Event Timeline

No OneTemporary
Actions