Enlarge window when interacting with remote post.

Signed-off-by: Cyrille Bollu <cyrpub@bollu.be>

appinfo/routes.php

@@ -56,12 +56,16 @@ return [
 		['name' => 'ActivityPub#followers', 'url' => '/@{username}/followers', 'verb' => 'GET'],
 		['name' => 'ActivityPub#following', 'url' => '/@{username}/following', 'verb' => 'GET'],
 
-		['name' => 'OStatus#subscribe', 'url' => '/ostatus/follow/{uri}', 'verb' => 'GET'],
+		['name' => 'OStatus#subscribeOld', 'url' => '/ostatus/follow/{uri}', 'verb' => 'GET'],
+		['name' => 'OStatus#subscribe', 'url' => '/ostatus/interaction', 'verb' => 'GET'],
+
 		['name' => 'OStatus#followRemote', 'url' => '/api/v1/ostatus/followRemote/{local}', 'verb' => 'GET'],
 		['name' => 'OStatus#getLink', 'url' => '/api/v1/ostatus/link/{local}/{account}', 'verb' => 'GET'],
 
 		['name' => 'ActivityPub#displayPost', 'url' => '/@{username}/{token}', 'verb' => 'GET'],
 
+		['name' => 'SocialPub#displayRemotePost', 'url' => '/post', 'verb' => 'GET'],
+
 		['name' => 'Local#streamHome', 'url' => '/api/v1/stream/home', 'verb' => 'GET'],
 		['name' => 'Local#streamNotifications', 'url' => '/api/v1/stream/notifications', 'verb' => 'GET'],
 		['name' => 'Local#streamTimeline', 'url' => '/api/v1/stream/timeline', 'verb' => 'GET'],

lib/Controller/OStatusController.php

@@ -36,14 +36,18 @@ use daita\MySmallPhpTools\Traits\TArrayTools;
 use Exception;
 use OCA\Social\AppInfo\Application;
 use OCA\Social\Exceptions\RetrieveAccountFormatException;
+use OCA\Social\Model\ActivityPub\Actor\Person;
 use OCA\Social\Service\AccountService;
 use OCA\Social\Service\CacheActorService;
 use OCA\Social\Service\CurlService;
 use OCA\Social\Service\MiscService;
+use OCA\Social\Service\StreamService;
 use OCP\AppFramework\Controller;
+use OCP\AppFramework\Http\RedirectResponse;
 use OCP\AppFramework\Http\Response;
 use OCP\AppFramework\Http\TemplateResponse;
 use OCP\IRequest;
+use OCP\IURLGenerator;
 use OCP\IUserManager;
 use OCP\IUserSession;
 
@@ -55,9 +59,18 @@ class OStatusController extends Controller {
 	use TArrayTools;
 
 
+	/** @var IUserManager */
+	private $userSession;
+
+	/** @var IURLGenerator */
+	private $urlGenerator;
+
 	/** @var CacheActorService */
 	private $cacheActorService;
 
+	/** @var StreamService */
+	private $streamService;
+
 	/** @var AccountService */
 	private $accountService;
 
@@ -67,31 +80,33 @@ class OStatusController extends Controller {
 	/** @var MiscService */
 	private $miscService;
 
-	/** @var IUserManager */
-	private $userSession;
-
 
 	/**
 	 * OStatusController constructor.
 	 *
+	 * @param IUserSession $userSession
 	 * @param IRequest $request
+	 * @param IURLGenerator $urlGenerator
+	 * @param StreamService $streamService
 	 * @param CacheActorService $cacheActorService
 	 * @param AccountService $accountService
 	 * @param CurlService $curlService
 	 * @param MiscService $miscService
-	 * @param IUserSession $userSession
 	 */
 	public function __construct(
-		IRequest $request, CacheActorService $cacheActorService, AccountService $accountService,
-		CurlService $curlService, MiscService $miscService, IUserSession $userSession
+		IUserSession $userSession, IRequest $request, IURLGenerator $urlGenerator,
+		StreamService $streamService, CacheActorService $cacheActorService, AccountService $accountService,
+		CurlService $curlService, MiscService $miscService
 	) {
 		parent::__construct(Application::APP_NAME, $request);
 
+		$this->userSession = $userSession;
+		$this->urlGenerator = $urlGenerator;
 		$this->cacheActorService = $cacheActorService;
+		$this->streamService = $streamService;
 		$this->accountService = $accountService;
 		$this->curlService = $curlService;
 		$this->miscService = $miscService;
-		$this->userSession = $userSession;
 	}
 
 
@@ -103,25 +118,65 @@ class OStatusController extends Controller {
 	 *
 	 * @return Response
 	 */
-	public function subscribe(string $uri): Response {
+	public function subscribeOld(string $uri): Response {
+		return $this->subscribe($uri);
+	}
 
+
+	/**
+	 * @NoCSRFRequired
+	 * @NoAdminRequired
+	 *
+	 * @param string $uri
+	 *
+	 * @return Response
+	 * @throws Exception
+	 */
+	public function subscribe(string $uri): Response {
 		try {
 			$actor = $this->cacheActorService->getFromAccount($uri);
 
+			return $this->subscribeLocalAccount($actor);
+		} catch (Exception $e) {
+		}
+
+		try {
+			$this->streamService->getStreamById($uri, true, true);
+
+			$link = $this->urlGenerator->linkToRouteAbsolute('social.SocialPub.displayRemotePost')
+					. '?id=' . $uri . '&type=' . $this->parseRefererType();
+
+			return new RedirectResponse($link);
+		} catch (Exception $e) {
+		}
+
+		return $this->fail(new Exception('unknown protocol'));
+	}
+
+
+	/**
+	 * @param Person $actor
+	 *
+	 * @return Response
+	 */
+	private function subscribeLocalAccount(Person $actor): Response {
+		try {
 			$user = $this->userSession->getUser();
 			if ($user === null) {
 				throw new Exception('Failed to retrieve current user');
 			}
 
-			return new TemplateResponse('social', 'ostatus', [
+			return new TemplateResponse(
+				'social', 'ostatus', [
 				'serverData' => [
-					'account' => $actor->getAccount(),
+					'account'     => $actor->getAccount(),
 					'currentUser' => [
-						'uid' => $user->getUID(),
+						'uid'         => $user->getUID(),
 						'displayName' => $user->getDisplayName(),
 					]
 				]
-			], 'guest');
+			], 'guest'
+			);
 		} catch (Exception $e) {
 			return $this->fail($e);
 		}
@@ -134,18 +189,21 @@ class OStatusController extends Controller {
 	 * @PublicPage
 	 *
 	 * @param string $local
+	 *
 	 * @return Response
 	 */
 	public function followRemote(string $local): Response {
 		try {
 			$following = $this->accountService->getActor($local);
 
-			return new TemplateResponse('social', 'ostatus', [
+			return new TemplateResponse(
+				'social', 'ostatus', [
 				'serverData' => [
-					'local' => $local,
+					'local'   => $local,
 					'account' => $following->getAccount()
 				]
-			], 'guest');
+			], 'guest'
+			);
 		} catch (Exception $e) {
 			return $this->fail($e);
 		}
@@ -185,5 +243,40 @@ class OStatusController extends Controller {
 		}
 	}
 
+
+	/**
+	 * @return string
+	 */
+	private function parseRefererType(): string {
+		$type = '';
+
+		$referer = $this->request->getHeader('Referer');
+		$query = parse_url($referer, PHP_URL_QUERY);
+		if ($query === null) {
+			return $type;
+		}
+		
+		$params = explode('&', parse_url($referer, PHP_URL_QUERY));
+		foreach ($params as $param) {
+			list($key, $value) = explode('=', $param);
+			if ($key === 'type') {
+				$type = $value;
+			}
+		}
+
+		switch ($type) {
+			case 'reblog':
+				return 'boost';
+
+			case 'favourite':
+				return 'like';
+
+			case 'reply':
+				return 'reply';
+		}
+
+		return '';
+	}
+
 }
 

lib/Controller/SocialPubController.php

@@ -40,6 +40,7 @@ use OCA\Social\Exceptions\UrlCloudException;
 use OCA\Social\Service\AccountService;
 use OCA\Social\Service\CacheActorService;
 use OCA\Social\Service\ConfigService;
+use OCA\Social\Service\MiscService;
 use OCA\Social\Service\StreamService;
 use OCP\AppFramework\Controller;
 use OCP\AppFramework\Http;
@@ -82,6 +83,9 @@ class SocialPubController extends Controller {
 	/** @var ConfigService */
 	private $configService;
 
+	/** @var MiscService */
+	private $miscService;
+
 
 	/**
 	 * SocialPubController constructor.
@@ -94,11 +98,12 @@ class SocialPubController extends Controller {
 	 * @param AccountService $accountService
 	 * @param StreamService $streamService
 	 * @param ConfigService $configService
+	 * @param MiscService $miscService
 	 */
 	public function __construct(
 		$userId, IRequest $request, IL10N $l10n, NavigationController $navigationController,
 		CacheActorService $cacheActorService, AccountService $accountService, StreamService $streamService,
-		ConfigService $configService
+		ConfigService $configService, MiscService $miscService
 	) {
 		parent::__construct(Application::APP_NAME, $request);
 
@@ -109,6 +114,7 @@ class SocialPubController extends Controller {
 		$this->cacheActorService = $cacheActorService;
 		$this->streamService = $streamService;
 		$this->configService = $configService;
+		$this->miscService = $miscService;
 	}
 
 
@@ -240,5 +246,43 @@ class SocialPubController extends Controller {
 	}
 
 
+	/**
+	 * Display the navigation page of the Social app.
+	 *
+	 * @NoCSRFRequired
+	 * @PublicPage
+	 *
+	 * @param string $id
+	 *
+	 * @return TemplateResponse
+	 * @throws StreamNotFoundException
+	 */
+	public function displayRemotePost(string $id): TemplateResponse {
+		if ($id === '') {
+			throw new StreamNotFoundException('Stream not found');
+		}
+
+		if (isset($this->userId)) {
+			try {
+				$viewer = $this->accountService->getActorFromUserId($this->userId, true);
+				$this->streamService->setViewer($viewer);
+			} catch (Exception $e) {
+			}
+		}
+
+		$stream = $this->streamService->getStreamById($id, true);
+		$data = [
+			'id'          => $id,
+			'item'        => $stream,
+			'serverData'  => [
+				'public' => ($this->userId === null),
+			],
+			'application' => 'Social'
+		];
+		
+		return new TemplateResponse(Application::APP_NAME, 'stream', $data);
+	}
+
+
 }
 

lib/Db/StreamRequest.php

@@ -241,8 +241,6 @@ class StreamRequest extends StreamRequestBuilder {
 		};
 
 		$qb = $this->getStreamSelectSql();
-		$expr = $qb->expr();
-
 		$qb->limitToIdPrim($qb->prim($id));
 		$qb->linkToCacheActors('ca', 's.attributed_to_prim');
 

lib/Service/StreamService.php

@@ -32,9 +32,11 @@ namespace OCA\Social\Service;
 
 use daita\MySmallPhpTools\Exceptions\MalformedArrayException;
 use Exception;
+use OCA\Social\AP;
 use OCA\Social\Db\StreamRequest;
 use OCA\Social\Exceptions\InvalidOriginException;
 use OCA\Social\Exceptions\InvalidResourceException;
+use OCA\Social\Exceptions\ItemAlreadyExistsException;
 use OCA\Social\Exceptions\ItemUnknownException;
 use OCA\Social\Exceptions\RedundancyLimitException;
 use OCA\Social\Exceptions\RequestContentException;
@@ -74,6 +76,9 @@ class StreamService {
 	/** @var CacheActorService */
 	private $cacheActorService;
 
+	/** @var CurlService */
+	private $curlService;
+
 	/** @var ConfigService */
 	private $configService;
 
@@ -94,6 +99,7 @@ class StreamService {
 	 * @param SignatureService $signatureService
 	 * @param StreamQueueService $streamQueueService
 	 * @param CacheActorService $cacheActorService
+	 * @param CurlService $curlService
 	 * @param ConfigService $configService
 	 * @param MiscService $miscService
 	 */
@@ -101,7 +107,7 @@ class StreamService {
 		StreamRequest $streamRequest, ActivityService $activityService,
 		AccountService $accountService, SignatureService $signatureService,
 		StreamQueueService $streamQueueService, CacheActorService $cacheActorService,
-		ConfigService $configService, MiscService $miscService
+		CurlService $curlService, ConfigService $configService, MiscService $miscService
 	) {
 		$this->streamRequest = $streamRequest;
 		$this->activityService = $activityService;
@@ -109,6 +115,7 @@ class StreamService {
 		$this->signatureService = $signatureService;
 		$this->streamQueueService = $streamQueueService;
 		$this->cacheActorService = $cacheActorService;
+		$this->curlService = $curlService;
 		$this->configService = $configService;
 		$this->miscService = $miscService;
 	}
@@ -381,13 +388,83 @@ class StreamService {
 	/**
 	 * @param string $id
 	 * @param bool $asViewer
+	 * @param bool $retrieve
 	 *
 	 * @return Stream
 	 * @throws StreamNotFoundException
-	 * @throws SocialAppConfigException
+	 * @throws Exception
 	 */
-	public function getStreamById(string $id, bool $asViewer = false): Stream {
-		return $this->streamRequest->getStreamById($id, $asViewer);
+	public function getStreamById(string $id, bool $asViewer = false, bool $retrieve = false): Stream {
+		try {
+			return $this->streamRequest->getStreamById($id, $asViewer);
+		} catch (StreamNotFoundException $e) {
+			if (!$retrieve) {
+				throw $e;
+			}
+
+			if ($asViewer) {
+				try {
+					$this->streamRequest->getStreamById($id, false);
+					throw $e;
+				} catch (StreamNotFoundException $e) {
+				}
+			}
+		}
+
+		return $this->retrieveStream($id);
+	}
+
+
+	/**
+	 * @param string $id
+	 *
+	 * @return Stream
+	 * @throws InvalidOriginException
+	 * @throws InvalidResourceException
+	 * @throws ItemUnknownException
+	 * @throws MalformedArrayException
+	 * @throws RedundancyLimitException
+	 * @throws RequestContentException
+	 * @throws RequestNetworkException
+	 * @throws RequestResultNotJsonException
+	 * @throws RequestResultSizeException
+	 * @throws RequestServerException
+	 * @throws SocialAppConfigException
+	 * @throws UnauthorizedFediverseException
+	 * @throws StreamNotFoundException
+	 */
+	public function retrieveStream(string $id) {
+		$data = $this->curlService->retrieveObject($id);
+		$object = AP::$activityPub->getItemFromData($data);
+
+		$origin = parse_url($id, PHP_URL_HOST);
+		$object->setOrigin($origin, SignatureService::ORIGIN_REQUEST, time());
+
+		if ($object->getId() !== $id) {
+			throw new InvalidOriginException(
+				'StreamServiceStreamQueueService::getStreamById - objectId: ' . $object->getId() . ' - id: '
+				. $id
+			);
+		}
+
+		if ($object->getType() !== Note::TYPE
+			// do we also retrieve Announce ?
+			//|| $object->getType() !== Announce:TYPE
+		) {
+			throw new InvalidResourceException();
+		}
+
+		/** @var Stream $object */
+		$this->cacheActorService->getFromId($object->getAttributedTo());
+
+		$interface = AP::$activityPub->getInterfaceForItem($object);
+		try {
+			$interface->save($object);
+		} catch (ItemAlreadyExistsException $e) {
+		}
+
+
+		return $this->streamRequest->getStreamById($id);
 	}
 
 
@@ -400,7 +477,8 @@ class StreamService {
 	 * @return Stream[]
 	 * @throws StreamNotFoundException
 	 */
-	public function getRepliesByParentId(string $id, int $since = 0, int $limit = 5, bool $asViewer = false): array {
+	public function getRepliesByParentId(string $id, int $since = 0, int $limit = 5, bool $asViewer = false
+	): array {
 		return $this->streamRequest->getRepliesByParentId($id, $since, $limit, $asViewer);
 	}
 

lib/webfinger.php

@@ -128,11 +128,8 @@ $finger = [
 		],
 		[
 			'rel'      => 'http://ostatus.org/schema/1.0/subscribe',
-			'template' => urldecode(
-				$href = $urlGenerator->linkToRouteAbsolute(
-					'social.OStatus.subscribe', ['uri' => '{uri}']
-				)
-			)
+			'template' => urldecode($urlGenerator->linkToRouteAbsolute('social.OStatus.subscribe'))
+						  . '?uri={uri}'
 		]
 	]
 ];

src/components/ActorAvatar.vue

@@ -46,7 +46,7 @@ export default {
 	},
 	computed: {
 		avatarUrl() {
-			return OC.generateUrl('/apps/social/api/v1/global/actor/avatar?id=' + this.item.attributedTo)
+			return OC.generateUrl('/apps/social/api/v1/global/actor/avatar?id=' + this.actor.id)
 		}
 	}
 }

src/components/TimelinePost.vue

@@ -110,6 +110,11 @@ export default {
 				return ''
 			}
 			message = message.linkify({
+				validate: {
+					url: function(value) {
+						return /^(http|ftp)s?:\/\//.test(value)
+					}
+				},
 				formatHref: {
 					mention: function(href) {
 						return OC.generateUrl('/apps/social/@' + href.substring(1))

src/mixins/currentUserMixin.js

@@ -20,18 +20,45 @@
  *
  */
 
+/**
+ * This file provides various computed properties related to the currently
+ * logged-in user.
+ *
+ * @mixin
+ */
+
 import serverData from './serverData'
+
 export default {
 	mixins: [
 		serverData
 	],
 	computed: {
+		/**
+		 * Returns an object describing the currently logged-in user
+		 *
+		 * @returns {Object}
+		 *
+		 */
 		currentUser() {
 			return OC.getCurrentUser()
 		},
+		/**
+		 * Returns the ActivityPub ID of the currently logged-in user
+		 *
+		 * @returns {String}
+		 *
+		 */
 		socialId() {
 			return '@' + this.cloudId
 		},
+		/**
+		 * Returns the ActivityPub ID of the currently logged-in user,
+		 * minus the leading '@'
+		 *
+		 * @returns {String}
+		 *
+		 */
 		cloudId() {
 			return this.currentUser.uid + '@' + this.hostname
 		}

src/router.js

@@ -66,6 +66,14 @@ export default new Router({
 			props: true,
 			name: 'single-post'
 		},
+		{
+			path: '/:index(index.php/)?apps/social/post',
+			components: {
+				default: TimelineSinglePost
+			},
+			props: true,
+			name: 'interact-remote'
+		},
 		{
 			path: '/:index(index.php/)?apps/social/@:account',
 			components: {

src/store/timeline.js

@@ -119,12 +119,11 @@ const actions = {
 	post(context, post) {
 		return new Promise((resolve, reject) => {
 			axios.post(OC.generateUrl('apps/social/api/v1/post'), { data: post }).then((response) => {
-				// eslint-disable-next-line no-console
-				console.log('Post created with token ' + response.data.result.token)
+				Logger.info('Post created with token ' + response.data.result.token)
 				resolve(response)
 			}).catch((error) => {
 				OC.Notification.showTemporary('Failed to create a post')
-				console.error('Failed to create a post', error.response)
+				Logger.error('Failed to create a post', { 'error': error.response })
 				reject(error)
 			})
 		})
@@ -132,21 +131,21 @@ const actions = {
 	postDelete(context, post) {
 		return axios.delete(OC.generateUrl(`apps/social/api/v1/post?id=${post.id}`)).then((response) => {
 			context.commit('removePost', post)
-			// eslint-disable-next-line no-console
-			console.log('Post deleted with token ' + response.data.result.token)
+			Logger.info('Post deleted with token ' + response.data.result.token)
 		}).catch((error) => {
 			OC.Notification.showTemporary('Failed to delete the post')
-			console.error('Failed to delete the post', error)
+			Logger.error('Failed to delete the post', { 'error': error })
 		})
 	},
 	postLike(context, { post, parentAnnounce }) {
 		return new Promise((resolve, reject) => {
 			axios.post(OC.generateUrl(`apps/social/api/v1/post/like?postId=${post.id}`)).then((response) => {
 				context.commit('likePost', { post, parentAnnounce })
+				Logger.info('Post liked with token ' + response.data.result.token)
 				resolve(response)
 			}).catch((error) => {
 				OC.Notification.showTemporary('Failed to like post')
-				console.error('Failed to like post', error.response)
+				Logger.error('Failed to like post', { 'error': error.response })
 				reject(error)
 			})
 		})
@@ -154,25 +153,25 @@ const actions = {
 	postUnlike(context, { post, parentAnnounce }) {
 		return axios.delete(OC.generateUrl(`apps/social/api/v1/post/like?postId=${post.id}`)).then((response) => {
 			context.commit('unlikePost', { post, parentAnnounce })
+			Logger.info('Like deleted with token ' + response.data.result.token)
 			// Remove post from list if we are in the 'liked' timeline
 			if (state.type === 'liked') {
 				context.commit('removePost', post)
 			}
 		}).catch((error) => {
 			OC.Notification.showTemporary('Failed to unlike post')
-			console.error('Failed to unlike post', error)
+			Logger.error('Failed to unlike post', { 'error': error })
 		})
 	},
 	postBoost(context, { post, parentAnnounce }) {
 		return new Promise((resolve, reject) => {
 			axios.post(OC.generateUrl(`apps/social/api/v1/post/boost?postId=${post.id}`)).then((response) => {
 				context.commit('boostPost', { post, parentAnnounce })
-				// eslint-disable-next-line no-console
-				console.log('Post boosted with token ' + response.data.result.token)
+				Logger.info('Post boosted with token ' + response.data.result.token)
 				resolve(response)
 			}).catch((error) => {
 				OC.Notification.showTemporary('Failed to create a boost post')
-				console.error('Failed to create a boost post', error.response)
+				Logger.error('Failed to create a boost post', { 'error': error.response })
 				reject(error)
 			})
 		})
@@ -180,11 +179,10 @@ const actions = {
 	postUnBoost(context, { post, parentAnnounce }) {
 		return axios.delete(OC.generateUrl(`apps/social/api/v1/post/boost?postId=${post.id}`)).then((response) => {
 			context.commit('unboostPost', { post, parentAnnounce })
-			// eslint-disable-next-line no-console
-			console.log('Boost deleted with token ' + response.data.result.token)
+			Logger.info('Boost deleted with token ' + response.data.result.token)
 		}).catch((error) => {
 			OC.Notification.showTemporary('Failed to delete the boost')
-			console.error('Failed to delete the boost', error)
+			Logger.error('Failed to delete the boost', { 'error': error })
 		})
 	},
 	refreshTimeline(context) {

src/views/TimelineSinglePost.vue

@@ -1,7 +1,9 @@
 <template>
 	<div class="social__wrapper">
+		<composer v-if="currentUser.uid!==''" />
 		<timeline-entry :item="mainPost" />
-		<timeline-list :type="$route.params.type" />
+		<!-- Do not show replies when composing a reply to a remote post -->
+		<timeline-list v-if="$route.name==='single-post'" />
 	</div>
 </template>
 
@@ -19,17 +21,20 @@
 </style>
 
 <script>
-import Logger from '../logger'
-import TimelineEntry from './../components/TimelineEntry.vue'
-import TimelineList from './../components/TimelineList.vue'
+import Composer from '../components/Composer.vue'
+import TimelineEntry from '../components/TimelineEntry.vue'
+import TimelineList from '../components/TimelineList.vue'
+import CurrentUserMixin from '../mixins/currentUserMixin'
 
 export default {
 	name: 'TimelineSinglePost',
 	components: {
+		Composer,
 		TimelineEntry,
 		TimelineList
 	},
 	mixins: [
+		CurrentUserMixin
 	],
 	data() {
 		return {
@@ -38,22 +43,56 @@ export default {
 	},
 	computed: {
 	},
+	mounted: function() {
+		// Interacting with a post from a remote instance
+		this.$nextTick(function() {
+			window.resizeTo(650,800)
+			if (this.$route.name === 'interact-remote') {
+				// Automaticaly like, boost, or prepare reply
+				switch (this.$route.query.type) {
+				case ('boost'):
+					setTimeout(this.$store.dispatch('postBoost', {
+						post: this.mainPost,
+						parentAnnounce: { }
+					}), 2000)
+					break
+				case ('like'):
+					setTimeout(this.$store.dispatch('postLike', {
+						post: this.mainPost,
+						parentAnnounce: { }
+					}), 2000)
+					break
+				case ('reply'):
+					setTimeout(this.$root.$emit('composer-reply', this.mainPost), 2000)
+					break
+				}
+			}
+		})
+	},
 	beforeMount: function() {
-
 		// Get data of post clicked on
 		if (typeof this.$route.params.id === 'undefined') {
-			Logger.debug('displaying the single post timeline for a non logged-in user')
+			// Displaying the single post timeline for a non logged-in user
+			// or in case of a redirection from a remote instance (eg: a reply to remote post)
 			this.mainPost = JSON.parse(document.getElementById('postData').dataset.server)
+			this.$store.dispatch('addToTimeline', {
+				data: this.mainPost
+			})
 		} else {
 			this.mainPost = this.$store.getters.getPostFromTimeline(this.$route.params.id)
 		}
 
+		// We don't show the TimelineList component when interacting with a remote post
+		if (this.$route.name === 'interact-remote') {
+			return
+		}
+
 		// Set params for the TimelineList component
 		let params = {
 			account: window.location.href.split('/')[window.location.href.split('/').length - 2].substr(1),
 			id: window.location.href,
 			localId: window.location.href.split('/')[window.location.href.split('/').length - 1],
-			type: 'single-post'
+			type: this.$route.name
 		}
 
 		this.$store.dispatch('changeTimelineType', {